/* === My Account refresh — 2026-08-04 ===================================
   File: /includes/my-account.css — loaded by functions.php
   (chm_myaccount_stylesheet @ wp_head 10000), directly AFTER theme.css
   (9999), so it wins cascade ties.
   Scope: .chm-mepr-myaccount (account pages) and .jm-dashboard / .jm-ui
   (standalone /job-dashboard/). Nothing here targets bare global classes.
   Overlay note: four groups of old rules still live in theme.css — the
   five sidebar nav look rules, the payments-table cell-border rule, the
   broad `.chm-mepr-myaccount button` margin, and the old mobile media
   query. They are safely overridden here by later source order / higher
   specificity; if theme.css is ever cleaned up, delete them there.
   ===================================================================== */

/* ---- 1. Tokens ---- */
.chm-mepr-myaccount,
.jm-dashboard {
  --ma-orange: var(--e-global-color-78b0c63, #F7941D);
  --ma-ink: var(--e-global-color-e1496c0, #0A0A0A);
  --ma-link: #C25E00;            /* darkened brand orange — AA-safe for small text */
  --ma-hover: #C25E00;           /* button hover fill */
  --ma-text: #3f3f41;
  --ma-text-strong: #1f1f22;
  --ma-muted: #77777c;
  --ma-faint: #9a9a9e;
  --ma-border: #e5e7eb;          /* containers */
  --ma-border-input: #d5d7db;    /* controls */
  --ma-hairline: #f0f0f1;        /* row separators */
  --ma-soft: #ececee;            /* soft dividers */
  --ma-tint: rgba(247, 148, 29, 0.08);
  --ma-tint-strong: rgba(247, 148, 29, 0.12);
  --ma-ring: rgba(247, 148, 29, 0.18);
  --ma-r-lg: 10px;               /* containers */
  --ma-r: 8px;                   /* controls */
}

/* ---- 2. Shell ---- */
.chm-mepr-myaccount > div:first-of-type {
  width: 216px;
  background-color: #fafafa;
  border-right-color: var(--ma-soft);
}
.chm-mepr-myaccount > div:last-of-type {
  padding: 1.75rem 2.25rem 2.75rem;
  min-width: 0;
}

/* ---- 3. Sidebar nav ---- */
.chm-mepr-myaccount #mepr-account-nav {
  position: sticky;
  top: 16px;
  padding: 10px 0 14px;
}
body.admin-bar .chm-mepr-myaccount #mepr-account-nav { top: 48px; }

.chm-mepr-myaccount #mepr-account-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.chm-mepr-myaccount #mepr-account-nav .mepr-nav-item {
  display: block;
  padding: 0;
  margin: 2px 8px;
}
.chm-mepr-myaccount #mepr-account-nav .mepr-nav-item a {
  display: block;
  padding: 9px 12px;
  border-radius: var(--ma-r);
  font-size: 14.5px;
  line-height: 20px;
  font-weight: 500;
  color: #4b4b4e;
  background: transparent;
  text-decoration: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.chm-mepr-myaccount #mepr-account-nav .mepr-nav-item a:hover {
  background: var(--ma-tint);
  color: var(--ma-ink);
}
.chm-mepr-myaccount #mepr-account-nav .mepr-active-nav-tab a {
  background: var(--ma-tint-strong);
  box-shadow: inset 3px 0 0 var(--ma-orange);
  color: #141416;
  font-weight: 700;
}

/* "Member tools" group label before the first .mepr-nav-item-2 */
.chm-mepr-myaccount #mepr-account-nav .mepr-nav-item:not(.mepr-nav-item-2) + .mepr-nav-item-2::before {
  content: "Member tools";
  display: block;
  padding: 16px 12px 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ma-faint);
}

/* Logout: quiet row, divider above */
.chm-mepr-myaccount #mepr-account-nav .mepr-nav-item:has(> a#mepr-account-logout) {
  border-top: 1px solid var(--ma-soft);
  margin-top: 12px;
  padding-top: 10px;
}
.chm-mepr-myaccount #mepr-account-nav a#mepr-account-logout {
  background: transparent;
  color: var(--ma-muted);
}
.chm-mepr-myaccount #mepr-account-nav a#mepr-account-logout:hover {
  background: rgba(10, 10, 10, 0.05);
  color: #9a3520;
}

/* ---- 4. Headings & rhythm ---- */
.chm-mepr-myaccount h3.my-account-headings {
  font-size: 26px;
  font-weight: 700;
  color: var(--ma-text-strong);
  margin: 0 0 20px;
}
.chm-mepr-myaccount h4.mapip-h4 {
  font-size: 17px;
  font-weight: 700;
  color: var(--ma-text-strong);
  margin: 0 0 12px;
}
.chm-mepr-myaccount .mapip-section { margin: 0 0 34px; }
.chm-mepr-myaccount .mepr-jobs-create-wrapper form h2 {
  font-size: 16px;
  font-weight: 700;
  color: var(--ma-text-strong);
  border-top: 1px solid var(--ma-soft);
  padding-top: 20px;
  margin: 26px 0 12px;
}

/* ---- 5. Links (content column only; nav & buttons excluded) ---- */
.chm-mepr-myaccount :is(.mp_wrapper, .mapip-wrapper, .acf-form, .mepr-jobs-create-wrapper, .mepr-home-wrapper) a:not(:is(.elementor-button, .button, .mapip-btn, .jm-ui-button)) {
  color: var(--ma-link);
  font-weight: 600;
  text-decoration: none;
}
.chm-mepr-myaccount :is(.mp_wrapper, .mapip-wrapper, .acf-form, .mepr-jobs-create-wrapper, .mepr-home-wrapper) a:not(:is(.elementor-button, .button, .mapip-btn, .jm-ui-button)):hover {
  color: var(--ma-ink);
  text-decoration: underline;
}
.chm-mepr-myaccount .mapip-link { color: var(--ma-link); font-weight: 600; }
.chm-mepr-myaccount .mapip-link:hover { color: var(--ma-ink); }
.chm-mepr-myaccount .mapip-rowactions .mepr-account-row-actions a { color: var(--ma-link); }

/* ---- 6. Buttons — one system across the account ---- */
.chm-mepr-myaccount a.elementor-button,
.chm-mepr-myaccount .mepr-submit,
.chm-mepr-myaccount input[type="submit"],
.chm-mepr-myaccount button[type="submit"]:not(.mp-hide-pw),
.chm-mepr-myaccount .acf-form-submit .button,
.chm-mepr-myaccount .job-manager-form .button,
.chm-mepr-myaccount .mapip-btn,
.jm-dashboard .jm-ui-button {
  display: inline-block;
  background: var(--ma-orange);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.2;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: var(--ma-r);
  cursor: pointer;
  text-decoration: none;
  box-shadow: none;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.chm-mepr-myaccount a.elementor-button:hover,
.chm-mepr-myaccount .mepr-submit:hover,
.chm-mepr-myaccount input[type="submit"]:hover,
.chm-mepr-myaccount button[type="submit"]:not(.mp-hide-pw):hover,
.chm-mepr-myaccount .acf-form-submit .button:hover,
.chm-mepr-myaccount .job-manager-form .button:hover,
.chm-mepr-myaccount .mapip-btn:hover,
.jm-dashboard .jm-ui-button:hover {
  background: var(--ma-hover);
  color: #fff;
}

/* MAPIP variants: blue → brand; mirror MAPIP's own !important only where it uses one */
.chm-mepr-myaccount .mapip-btn--primary { background: var(--ma-orange); }
.chm-mepr-myaccount .mapip-btn--primary:hover { background: var(--ma-hover); }
.chm-mepr-myaccount .mapip-btn--orange {
  background: var(--ma-orange) !important;
  color: #fff !important;
}
.chm-mepr-myaccount .mapip-btn--orange:hover { background: var(--ma-hover) !important; }
.chm-mepr-myaccount .mapip-btn--sm { padding: 9px 14px; font-size: 12px; }

/* Secondary / ghost variant */
.chm-mepr-myaccount .mapip-btn--ghost,
.chm-mepr-myaccount .job-manager-form .button.save_draft,
.chm-mepr-myaccount .job-manager-form input[name="save_draft"],
.jm-dashboard .jm-ui-button--outline {
  background: #fff;
  color: var(--ma-text);
  border-color: var(--ma-border-input);
}
.chm-mepr-myaccount .mapip-btn--ghost:hover,
.chm-mepr-myaccount .job-manager-form .button.save_draft:hover,
.chm-mepr-myaccount .job-manager-form input[name="save_draft"]:hover,
.jm-dashboard .jm-ui-button--outline:hover {
  background: #FFF8F0;
  color: var(--ma-link);
  border-color: var(--ma-orange);
}

/* Submit spacing (replaces the old broad `.chm-mepr-myaccount button` margin) */
.chm-mepr-myaccount :is(input[type="submit"], .mepr-submit, .acf-form-submit .button) { margin: 1rem 0 0; }
.chm-mepr-myaccount .job-manager-form .button { margin: 1rem 12px 0 0; }

/* ---- 7. Forms — one input system (MemberPress / ACF / WPJM / MPCA) ---- */
.chm-mepr-myaccount .mepr-account-form { max-width: 640px; }
.chm-mepr-myaccount .mepr-newpassword-form { max-width: 480px; }
.chm-mepr-myaccount .acf-form,
.chm-mepr-myaccount .job-manager-form { max-width: 660px; }

.chm-mepr-myaccount .mp-form-row { margin: 0 0 18px; }
.chm-mepr-myaccount .mp-form-row label,
.chm-mepr-myaccount .acf-form .acf-label label,
.chm-mepr-myaccount .job-manager-form fieldset > label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ma-text);
  margin: 0 0 6px;
}

.chm-mepr-myaccount :is(.mepr-form, .acf-form, .job-manager-form, #mpca-add-sub-user-form) :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], input[type="number"], input[type="search"], select, textarea),
.jm-dashboard .jm-form :is(input[type="text"], input[type="search"]) {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid var(--ma-border-input);
  border-radius: var(--ma-r);
  padding: 10px 12px;
  font-size: 15px;
  font-family: inherit;
  color: #2b2b2e;
  background: #fff;
}
.chm-mepr-myaccount :is(.mepr-form, .acf-form, .job-manager-form, #mpca-add-sub-user-form) :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], input[type="number"], input[type="search"], select, textarea):focus,
.jm-dashboard .jm-form :is(input[type="text"], input[type="search"]):focus {
  border-color: var(--ma-orange);
  box-shadow: 0 0 0 3px var(--ma-ring);
  outline: none;
}
.jm-dashboard .jm-form :is(input[type="text"], input[type="search"]) { width: auto; }

/* intl-tel-input: don't fight the widget's own left padding for the flag */
.chm-mepr-myaccount .iti input.mepr-form-input { padding-left: 52px; }

/* Multi-selects: groomed, with a ::after hint on their row */
.chm-mepr-myaccount .mepr-form select[multiple] {
  height: 132px;
  padding: 6px;
  font-size: 14px;
  scrollbar-width: thin;
}
.chm-mepr-myaccount .mepr-form select[multiple] option { padding: 6px 8px; border-radius: 4px; }
.chm-mepr-myaccount .mp-form-row:has(select[multiple])::after {
  content: "Ctrl / Cmd-click to select multiple";
  display: block;
  font-size: 12px;
  color: var(--ma-faint);
  margin-top: 5px;
}

/* Native checkboxes / radios pick up the brand */
.chm-mepr-myaccount input[type="checkbox"],
.chm-mepr-myaccount input[type="radio"],
.jm-dashboard input[type="checkbox"] { accent-color: var(--ma-orange); }

/* Password page: eye toggle centered in the field */
.chm-mepr-myaccount .mp-hide-pw { position: relative; }
.chm-mepr-myaccount button.mp-hide-pw {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  padding: 4px 8px;
  background: transparent;
  border: none;
}

/* ACF specifics */
.chm-mepr-myaccount .acf-form .acf-fields > .acf-field {
  border: none;
  padding: 0 0 18px;
}
.chm-mepr-myaccount .acf-form .acf-field-message {
  border-top: 1px solid var(--ma-soft);
  padding-top: 18px;
  margin-top: 6px;
}
.chm-mepr-myaccount .acf-form .acf-fields > .acf-field-message:first-child {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}
.chm-mepr-myaccount .acf-form .acf-field-message .acf-label label {
  font-size: 17px;
  font-weight: 700;
  color: var(--ma-text-strong);
}
.chm-mepr-myaccount .acf-form .acf-field-message .acf-input {
  font-size: 14px;
  line-height: 21px;
  color: var(--ma-muted);
}
.chm-mepr-myaccount .acf-form .acf-image-uploader img {
  border: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg);
  background: #fff;
}
.chm-mepr-myaccount .acf-form .acf-switch.-on {
  background: var(--ma-orange);
  border-color: var(--ma-orange);
}
.chm-mepr-myaccount .acf-form .acf-checkbox-list li { margin: 0 0 8px; }

/* WPJM job-submit form */
.chm-mepr-myaccount .job-manager-form fieldset { margin-bottom: 18px; }
.chm-mepr-myaccount .job-manager-form .field small,
.chm-mepr-myaccount .job-manager-form .field .description {
  font-size: 12px;
  color: var(--ma-faint);
}
.chm-mepr-myaccount .job-manager-form input[type="file"]::file-selector-button {
  background: #fff;
  color: var(--ma-text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 8px 14px;
  border: 1px solid var(--ma-border-input);
  border-radius: var(--ma-r);
  cursor: pointer;
  margin-right: 12px;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.chm-mepr-myaccount .job-manager-form input[type="file"]::file-selector-button:hover {
  border-color: var(--ma-orange);
  color: var(--ma-link);
}
.chm-mepr-myaccount .job-manager-form .wp-editor-container {
  border: 1px solid var(--ma-border-input);
  border-radius: var(--ma-r);
  overflow: hidden;
}
.chm-mepr-myaccount .job-manager-form .quicktags-toolbar {
  background: #fafafa;
  border-bottom: 1px solid var(--ma-soft);
  padding: 6px;
}
.chm-mepr-myaccount .job-manager-form .quicktags-toolbar .ed_button {
  background: #fff;
  border: 1px solid var(--ma-border-input);
  border-radius: 6px;
  color: #4b4b4e;
  padding: 2px 8px;
  margin: 2px;
}
.chm-mepr-myaccount .mepr-jobs-create-wrapper .job_listing_preview.single_job_listing {
  border-radius: var(--ma-r-lg);
}

/* ---- 8. Tables ---- */
/* Payments (default MemberPress table — overrides the old cell-border rule) */
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg);
  overflow: hidden;
  background: #fff;
}
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table th {
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #8a8a8f;
  background: #fafafa;
  padding: 12px 16px;
  border: none;
  border-bottom: 1px solid var(--ma-border);
}
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table td {
  padding: 14px 16px;
  font-size: 14px;
  color: var(--ma-text);
  border: none;
  border-bottom: 1px solid var(--ma-hairline);
}
/* kill MemberPress zebra striping */
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tr,
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tr:nth-child(odd),
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tr:nth-child(even),
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tr.alternate { background: transparent; }
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tbody tr:hover { background: #fcfcfd; }
.chm-mepr-myaccount .mp_wrapper table.mepr-account-table tbody tr:last-child td { border-bottom: none; }

#mepr-payments-paging {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 12px 0 0;
}
#mepr-payments-paging a,
.chm-mepr-myaccount .mapip-pager a,
.chm-mepr-myaccount .mapip-pager button {
  display: inline-block;
  background: #fff;
  color: var(--ma-text);
  font-size: 12px;
  font-weight: 700;
  padding: 7px 12px;
  border: 1px solid var(--ma-border-input);
  border-radius: var(--ma-r);
  text-decoration: none;
  cursor: pointer;
}
#mepr-payments-paging a:hover,
.chm-mepr-myaccount .mapip-pager a:hover,
.chm-mepr-myaccount .mapip-pager button:hover {
  border-color: var(--ma-orange);
  color: var(--ma-link);
}
.chm-mepr-myaccount .mapip-pager { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; }

/* MAPIP table (higher specificity beats the plugin's in-body <style>) */
.chm-mepr-myaccount .mapip-table-scroll {
  border: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg);
  overflow: auto;
  background: #fff;
}
.chm-mepr-myaccount .mapip-table {
  width: 100%;
  min-width: 640px;
  margin: 0;
  border: none;
  border-collapse: separate;
  border-spacing: 0;
}
.chm-mepr-myaccount .mapip-table th {
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #8a8a8f;
  background: #fafafa;
  padding: 12px 16px;
  border: none;
  border-bottom: 1px solid var(--ma-border);
}
.chm-mepr-myaccount .mapip-table td {
  padding: 14px 16px;
  font-size: 14px;
  color: var(--ma-text);
  border: none;
  border-bottom: 1px solid var(--ma-hairline);
  background: transparent;
}
.chm-mepr-myaccount .mapip-table tbody tr:hover td { background: #fcfcfd; }
.chm-mepr-myaccount .mapip-table tbody tr:last-child td { border-bottom: none; }

/* Defensive: MAPIP's injected manage-cell carries inline styles */
.chm-mepr-myaccount .mapip-manage-cell {
  vertical-align: top !important;
  padding: 14px 16px !important;
  border: none !important;
  border-bottom: 1px solid var(--ma-hairline) !important;
}

/* ---- 9. MAPIP components (active-sub card, badges, panel) ---- */
.chm-mepr-myaccount .mapip-card {
  border: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg);
  background: #fff;
  padding: 20px;
  gap: 20px;
}
.chm-mepr-myaccount .mapip-thumb-img {
  border: 1px solid var(--ma-soft);
  border-radius: var(--ma-r);
  object-fit: contain;
  background: #fff;
}
.chm-mepr-myaccount .mapip-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--ma-text-strong);
}
.chm-mepr-myaccount .mapip-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.chm-mepr-myaccount .mapip-badge,
.chm-mepr-myaccount .mapip-lozenge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: #f0f0f1;
  color: #5b5b60;
}
.chm-mepr-myaccount .mapip-badge--active { background: #EAF3ED; color: #2F6B4F; }
.chm-mepr-myaccount .mapip-badge--corp,
.chm-mepr-myaccount .mapip-badge--sub { background: #f0f0f1; color: #5b5b60; }
.chm-mepr-myaccount .mapip-card-actions { display: flex; flex-direction: column; gap: 8px; }
.chm-mepr-myaccount .mapip-panel {
  border: 1px solid #F2D8B8;
  background: #FFF8F0;
  border-radius: var(--ma-r-lg);
  padding: 18px 20px;
  margin-top: 12px;
}
.chm-mepr-myaccount .mapip-grid { gap: 12px; }

/* ---- 10. Jobs Dashboard (both contexts: in-account + /job-dashboard/) ---- */
.jm-dashboard .jm-dashboard-table {
  border: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg);
  background: #fff;
  overflow: visible; /* keep the kebab dropdown unclipped */
}
.jm-dashboard .jm-dashboard-header {
  background: #fafafa;
  border-bottom: 1px solid var(--ma-border);
  border-radius: var(--ma-r-lg) var(--ma-r-lg) 0 0;
}
.jm-dashboard .jm-dashboard-job-column-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #8a8a8f;
}
.jm-dashboard .jm-dashboard-job { border-bottom: 1px solid var(--ma-hairline); }
.jm-dashboard .jm-dashboard-rows > .jm-dashboard-job:last-child {
  border-bottom: none;
  border-radius: 0 0 var(--ma-r-lg) var(--ma-r-lg);
}
.jm-dashboard .jm-dashboard-job:hover { background: #fcfcfd; }
.jm-dashboard .jm-dashboard-job a {
  color: var(--ma-text-strong);
  font-weight: 700;
  text-decoration: none;
}
.jm-dashboard .jm-dashboard-job a:hover { color: var(--ma-link); }
.jm-dashboard .jm-ui-button { padding: 9px 14px; font-size: 12px; }

/* ---- 11. Home card ---- */
.chm-mepr-myaccount section.account_information .card-box {
  border-radius: var(--ma-r-lg);
  padding: 20px;
  gap: 20px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.chm-mepr-myaccount .card-photo img {
  width: 110px;
  height: 110px;
  object-fit: contain;
  border: 1px solid var(--ma-soft);
  border-radius: var(--ma-r);
  background: #fff;
  padding: 6px;
  box-sizing: border-box;
}
.chm-mepr-myaccount .card-info { font-size: 14px; line-height: 22px; color: var(--ma-muted); }
.chm-mepr-myaccount .card-info strong { font-size: 16px; color: var(--ma-text-strong); }

/* ---- 12. MPCA add-sub-user form: align with the system ---- */
#mpca-add-sub-user-form {
  background: #fafafa;
  border-color: var(--ma-border);
  border-radius: var(--ma-r-lg);
  padding: 1em 1.25em;
}

/* ---- 13. Accessibility ---- */
.chm-mepr-myaccount a:focus-visible,
.chm-mepr-myaccount button:focus-visible,
.chm-mepr-myaccount input:focus-visible,
.chm-mepr-myaccount select:focus-visible,
.chm-mepr-myaccount textarea:focus-visible,
.jm-dashboard a:focus-visible,
.jm-dashboard button:focus-visible,
.jm-dashboard input:focus-visible {
  outline: 2px solid var(--ma-orange);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .chm-mepr-myaccount *,
  .jm-dashboard * { transition: none !important; }
}

/* ---- 14. Mobile (overrides the old media query in theme.css; its
        `.mp_wrapper.menu` selector matched nothing) ---- */
@media (max-width: 768px) {
  .chm-mepr-myaccount { flex-direction: column; }
  .chm-mepr-myaccount > div:first-of-type {
    width: 100%;
    background: #fff;
    border-right: none;
    border-bottom: 1px solid var(--ma-soft);
  }
  .chm-mepr-myaccount #mepr-account-nav {
    position: static;
    padding: 0;
  }
  .chm-mepr-myaccount #mepr-account-nav ul {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 12px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .chm-mepr-myaccount #mepr-account-nav .mepr-nav-item { margin: 0; flex: none; }
  .chm-mepr-myaccount #mepr-account-nav .mepr-nav-item a {
    padding: 10px 16px;
    border-radius: 999px;
    border: 1px solid var(--ma-border);
    background: #fff;
    font-size: 13px;
    white-space: nowrap;
    box-shadow: none;
  }
  .chm-mepr-myaccount #mepr-account-nav .mepr-active-nav-tab a {
    background: var(--ma-orange);
    border-color: transparent;
    color: #fff;
    box-shadow: none;
  }
  .chm-mepr-myaccount #mepr-account-nav .mepr-nav-item:not(.mepr-nav-item-2) + .mepr-nav-item-2::before { display: none; }
  .chm-mepr-myaccount #mepr-account-nav .mepr-nav-item:has(> a#mepr-account-logout) {
    border-top: none;
    margin: 0;
    padding: 0;
  }
  .chm-mepr-myaccount > div:last-of-type { padding: 1.25rem 1rem 2.5rem; }

  /* tables scroll sideways instead of breaking the page */
  .chm-mepr-myaccount .mp_wrapper table.mepr-account-table {
    display: block;
    overflow-x: auto;
  }
  .chm-mepr-myaccount .mp_wrapper table.mepr-account-table :is(th, td) { white-space: nowrap; }

  /* cards stack: photo → info → actions */
  .chm-mepr-myaccount .mapip-card { grid-template-columns: 1fr; }
  .chm-mepr-myaccount section.account_information .card-box {
    flex-direction: column;
    align-items: flex-start;
  }
  .chm-mepr-myaccount section.account_information .card-actions { margin-left: 0; width: 100%; }
  .chm-mepr-myaccount section.account_information .card-actions .elementor-button {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }

  /* comfortable tap targets */
  .chm-mepr-myaccount :is(input[type="submit"], .mepr-submit) {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
}