/* Aurora skin for the Customers module storefront pages (auth, account area, B2B landing).
   Direction: the big home and building stores (IKEA "Contul meu", eMAG): white page, soft surfaces, 12px radius,
   warm orange for the main action of a page, friendly blue for links, selected navigation and secondary emphasis.
   Loaded after modules/Customers/assets/css/customers.css; every colour, radius and font comes from tokens.css
   (admin-editable), so no hex values here. Breakpoints: 640 (phones), 900 (account sidebar), 1100 (dashboard columns). */

/* ---------- Module variables mapped to theme tokens ---------- */
:root {
  --cu-brand: var(--c-brand);
  --cu-brand-2: var(--c-brand-hover);
  --cu-accent: var(--c-action);
  --cu-bg: var(--c-bg);
  --cu-text: var(--c-text);
  --cu-text-2: var(--c-text);
  --cu-muted: var(--c-muted);
  --cu-border: var(--c-border);
  --cu-surface: var(--c-bg);
  --cu-surface-2: var(--c-surface);
  --cu-success: var(--c-success);
  --cu-success-soft: var(--c-success-soft);
  --cu-warning: var(--c-warning);
  --cu-warning-soft: var(--c-warning-soft);
  --cu-danger: var(--c-danger);
  --cu-danger-soft: var(--c-danger-soft);
  --cu-info: var(--c-info);
  --cu-info-soft: var(--c-info-soft);
  --cu-radius: var(--radius);
  --cu-radius-sm: var(--radius-sm);
  --cu-shadow: none;
  --cu-focus: var(--focus);
  --cu-pad: 20px;
  --cu-nav-w: 264px;
}

/* The layout prints flash + errors above every page; Customers pages show the same messages in context
   (partials/messages.php, with inline field errors), so the global copy is hidden here to avoid a double summary. */
.cu-page:not(.cu-page-b2b-landing):not(.cu-page-verify) .site-main > .flash-wrap { display: none; }

/* ---------- Container and typography ---------- */
.cu-container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.cu-container [hidden] { display: none !important; }
.cu-container h1, .cu-container h2, .cu-container h3 { font-family: var(--font-heading); font-weight: var(--heading-weight); color: var(--c-text); line-height: 1.2; letter-spacing: -.015em; }
.cu-container h1 { font-size: clamp(1.4rem, 1.15rem + .9vw, 1.9rem); margin: 0; }
.cu-container h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
.cu-container h3 { font-size: 1.02rem; margin: 0 0 .4rem; }
.cu-container p { margin: 0 0 .85rem; }
.cu-container p:last-child { margin-bottom: 0; }
.cu-container a { color: var(--c-link); }
.cu-container a:hover { text-decoration: underline; text-underline-offset: .18em; }
.cu-container .icon { width: 1.15em; height: 1.15em; }
.cu-muted { color: var(--c-muted); }
.cu-small { font-size: .9rem; }
.cu-strong-link, .cu-container a.cu-strong-link { font-weight: 800; }
.cu-code { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 6px; padding: .1rem .4rem; font-size: .88em; font-variant-numeric: tabular-nums; }
.cu-mt { margin-top: var(--space-5); }
.cu-mb { margin-bottom: var(--space-4); }
.cu-mb-0 { margin-bottom: 0; }

/* ---------- Buttons (same family as the theme .btn) ---------- */
.cu-btn, .cu-container a.cu-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 46px; padding: .65rem 1.2rem; max-width: 100%;
  border: 1px solid var(--c-border-strong); border-radius: var(--radius-sm);
  background: var(--c-bg); color: var(--c-text);
  font: inherit; font-size: 1rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
  cursor: pointer; transition: background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease), box-shadow .15s var(--ease), transform .1s;
}
.cu-btn:hover, .cu-container a.cu-btn:hover { background: var(--c-bg); border-color: var(--c-text); color: var(--c-text); text-decoration: none; }
.cu-btn:active { transform: translateY(1px); }
.cu-btn:focus-visible { outline: none; box-shadow: var(--focus); }
.cu-btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.cu-btn .icon { width: 1.1em; height: 1.1em; }
.cu-btn-primary, .cu-container a.cu-btn-primary { background: var(--c-action); border-color: var(--c-action); color: var(--c-action-ink); }
.cu-btn-primary:hover, .cu-container a.cu-btn-primary:hover { background: var(--c-action-hover); border-color: var(--c-action-hover); color: var(--c-action-ink); }
/* Actions inside a card header are secondary (blue, soft) so each page keeps one orange main action */
.cu-card-head .cu-btn-primary, .cu-container .cu-card-head a.cu-btn-primary { background: var(--c-brand-soft); border-color: transparent; color: var(--c-brand); }
.cu-card-head .cu-btn-primary:hover, .cu-container .cu-card-head a.cu-btn-primary:hover { background: color-mix(in srgb, var(--c-brand) 16%, var(--c-bg)); border-color: transparent; color: var(--c-brand); }
.cu-btn-danger, .cu-container a.cu-btn-danger { background: var(--c-bg); color: var(--c-danger); border-color: color-mix(in srgb, var(--c-danger) 45%, var(--c-border)); }
.cu-btn-danger:hover, .cu-container a.cu-btn-danger:hover { background: var(--c-danger-soft); border-color: var(--c-danger); color: var(--c-danger); }
.cu-btn-ghost, .cu-container a.cu-btn-ghost { background: transparent; border-color: transparent; color: var(--c-text); }
.cu-btn-ghost:hover, .cu-container a.cu-btn-ghost:hover { background: var(--c-surface); border-color: transparent; color: var(--c-text); }
.cu-btn-ghost.cu-btn-danger { background: transparent; border-color: transparent; color: var(--c-danger); }
.cu-btn-ghost.cu-btn-danger:hover { background: var(--c-danger-soft); color: var(--c-danger); }
.cu-btn-sm, .cu-container a.cu-btn-sm { min-height: 44px; padding: .45rem .9rem; font-size: .93rem; gap: .4rem; }
.cu-btn-lg, .cu-container a.cu-btn-lg { min-height: 52px; padding: .8rem 1.5rem; font-size: 1.05rem; }
.cu-btn-block { width: 100%; }
.cu-btn-link { color: var(--c-link); }

/* ---------- Alerts ---------- */
.cu-alert { gap: .75rem; padding: .9rem 1rem; border: 0; border-radius: var(--radius-sm); margin-bottom: var(--space-4); font-size: .97rem; line-height: 1.5; }
.cu-alert .icon { width: 1.25rem; height: 1.25rem; margin-top: .1rem; }
.cu-alert-success { background: var(--c-success-soft); color: var(--c-success); border-color: transparent; }
.cu-alert-danger { background: var(--c-danger-soft); color: var(--c-danger); border-color: transparent; }
.cu-alert-warning { background: var(--c-warning-soft); color: var(--c-warning); border-color: transparent; }
.cu-alert-info { background: var(--c-info-soft); color: var(--c-info); border-color: transparent; }
.cu-alert > div, .cu-alert > ul { min-width: 0; flex: 1; }
.cu-alert .cu-muted { color: inherit; opacity: .85; }
.cu-alert a { color: inherit; font-weight: 700; text-decoration: underline; }
.cu-error-title { display: block; margin-bottom: .2rem; }
.cu-error-list { margin: 0; padding-left: 1.1rem; }
.cu-impersonation .cu-btn { color: inherit; border-color: color-mix(in srgb, currentColor 35%, transparent); }

/* ---------- Cards ---------- */
.cu-card { background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: none; overflow: hidden; min-width: 0; }
.cu-card-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2) var(--space-3); min-height: 0; padding: var(--space-4) var(--cu-pad) 0; border-bottom: 0; }
.cu-card-head h2, .cu-card-head h3 { font-size: 1.15rem; margin: 0; }
.cu-card-head + .cu-card-body { padding-top: var(--space-3); }
.cu-card-head + .cu-table-wrap { margin-top: var(--space-3); }
.cu-card-body { padding: var(--cu-pad); }
.cu-card-body > :last-child { margin-bottom: 0; }
.cu-card + .cu-card { margin-top: var(--space-5); }
.cu-head-link, .cu-container a.cu-head-link { display: inline-flex; align-items: center; gap: .2rem; min-height: 44px; font-size: .95rem; font-weight: 700; color: var(--c-link); }
.cu-head-link .icon { width: 1em; height: 1em; }
.cu-stack, .cu-grid, .cu-grid-2 { gap: var(--space-5); }
.cu-grid-2 > .cu-card + .cu-card { margin-top: 0; }
.cu-dl { grid-template-columns: minmax(130px, max-content) 1fr; gap: .55rem 1.25rem; }
.cu-dl dt { color: var(--c-muted); font-size: .93rem; }
.cu-dl dd { font-weight: 600; }

/* ---------- Status tags ---------- */
.cu-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .6rem; border-radius: 6px; font-size: .82rem; font-weight: 700; letter-spacing: 0; line-height: 1.25; white-space: nowrap; background: var(--c-surface-2); color: var(--c-text); vertical-align: middle; }
.cu-badge .icon { width: 1em; height: 1em; }
.cu-badge-success { background: var(--c-success-soft); color: var(--c-success); }
.cu-badge-warning { background: var(--c-warning-soft); color: var(--c-warning); }
.cu-badge-danger { background: var(--c-danger-soft); color: var(--c-danger); }
.cu-badge-info, .cu-badge-brand { background: var(--c-brand-soft); color: var(--c-brand); }
.cu-badge-dot::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: currentColor; flex: none; }

/* ---------- Forms ---------- */
.cu-field { margin-bottom: var(--space-4); min-width: 0; }
.cu-field label, .cu-label { display: block; font-size: .95rem; font-weight: 700; margin-bottom: .4rem; color: var(--c-text); }
.cu-field input[type=text], .cu-field input[type=email], .cu-field input[type=password], .cu-field input[type=tel], .cu-field input[type=number], .cu-field input[type=date], .cu-field select, .cu-field textarea, .cu-input {
  min-height: 48px; padding: .65rem .9rem; border: 1px solid var(--c-border-strong); border-radius: var(--radius-sm);
  background: var(--c-bg); color: var(--c-text); font: inherit; font-size: 16px; line-height: 1.4;
}
.cu-field input:focus, .cu-field select:focus, .cu-field textarea:focus, .cu-input:focus { outline: none; border-color: var(--c-brand); box-shadow: var(--focus); }
.cu-field input[readonly] { background: var(--c-surface); color: var(--c-muted); }
.cu-field textarea { min-height: 128px; line-height: 1.5; }
.cu-field textarea.cu-mono { font-family: inherit; font-variant-numeric: tabular-nums; font-size: .95rem; line-height: 1.6; }
.cu-field .help { display: block; color: var(--c-muted); font-size: .88rem; margin-top: .35rem; line-height: 1.45; }
.cu-field .error { display: flex; align-items: flex-start; gap: .35rem; color: var(--c-danger); font-size: .9rem; font-weight: 700; margin-top: .4rem; line-height: 1.4; }
.cu-field .error::before { content: "!"; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.1rem; height: 1.1rem; margin-top: .05rem; border-radius: 50%; background: var(--c-danger); color: var(--c-bg); font-size: .75rem; font-weight: 800; }
.cu-field.has-error input:not([type=checkbox]):not([type=radio]), .cu-field.has-error select, .cu-field.has-error textarea { border-color: var(--c-danger); box-shadow: inset 0 0 0 1px var(--c-danger); }
.cu-field.has-error input:focus, .cu-field.has-error select:focus, .cu-field.has-error textarea:focus { box-shadow: inset 0 0 0 1px var(--c-danger), var(--focus); }
.cu-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-4); }
.cu-span-2 { grid-column: 1 / -1; }
.cu-required { color: var(--c-danger); }
.cu-check { display: flex; align-items: flex-start; gap: .65rem; font-size: .97rem; font-weight: 400; line-height: 1.45; color: var(--c-text); cursor: pointer; }
.cu-field label.cu-check { display: flex; font-weight: 400; margin-bottom: 0; }
.cu-check input { width: 1.25rem; height: 1.25rem; margin: .1rem 0 0; flex: none; accent-color: var(--c-brand); }
.cu-check span { min-width: 0; }
.cu-form-grid .cu-check[style] { margin-top: 2.7rem !important; }
.cu-field-check { display: flex; align-items: flex-end; min-height: 48px; padding-bottom: .8rem; }
.cu-field-check .cu-check { margin-top: 0 !important; }
.cu-fieldset { border: 0; padding: 0; margin: 0 0 var(--space-4); min-width: 0; }
.cu-radio-group { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.cu-radio { display: flex; align-items: center; gap: .6rem; flex: 1 1 200px; min-height: 52px; padding: .7rem 1rem; border: 1px solid var(--c-border-strong); border-radius: var(--radius-sm); background: var(--c-bg); font-weight: 600; font-size: .98rem; cursor: pointer; transition: border-color .15s var(--ease), background-color .15s var(--ease); }
.cu-field label.cu-radio { display: flex; margin-bottom: 0; font-weight: 600; }
.cu-radio:hover { border-color: var(--c-brand); }
.cu-radio input { width: 1.2rem; height: 1.2rem; margin: 0; accent-color: var(--c-brand); }
.cu-radio .icon { color: var(--c-muted); }
.cu-radio:has(input:checked) { border-color: var(--c-brand); background: var(--c-brand-soft); color: var(--c-brand); font-weight: 800; box-shadow: inset 0 0 0 1px var(--c-brand); }
.cu-radio:has(input:checked) .icon { color: var(--c-brand); }
.cu-radio:has(input:focus-visible) { box-shadow: inset 0 0 0 1px var(--c-brand), var(--focus); }
.cu-input-group { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: stretch; }
.cu-input-group > input { flex: 1 1 9rem; min-width: 0; }
.cu-input-group > .cu-btn { flex: 1 0 auto; max-width: 100%; min-height: 48px; white-space: normal; }
.cu-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-2); }
.cu-form-actions > form { margin: 0; }
.cu-file input[type=file] { width: 100%; min-height: 48px; padding: .5rem; border: 1px dashed var(--c-border-strong); border-radius: var(--radius-sm); background: var(--c-surface); font-size: .95rem; color: var(--c-muted); cursor: pointer; }
.cu-file input[type=file]::file-selector-button { margin-right: .75rem; min-height: 36px; padding: .4rem .9rem; border: 1px solid var(--c-border-strong); border-radius: var(--radius-sm); background: var(--c-bg); color: var(--c-text); font: inherit; font-weight: 700; cursor: pointer; }
.cu-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin-bottom: .4rem; }
.cu-label-row label { margin-bottom: 0; }
.cu-label-row a { font-weight: 700; padding-block: .6rem; margin-block: -.6rem; }
.cu-password-wrap { position: relative; }
.cu-password-wrap input { padding-right: 3.25rem !important; }
.cu-password-toggle { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: var(--radius-sm); background: none; color: var(--c-muted); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.cu-password-toggle:hover, .cu-password-toggle[aria-pressed="true"] { color: var(--c-brand); }
.cu-password-toggle .icon { width: 1.25rem; height: 1.25rem; }
/* Grouped fields (register: personal data, company, password) */
.cu-group { margin: 0 0 var(--space-3); }
.cu-group-title { float: left; width: 100%; padding: 0; margin: 0 0 var(--space-3); font-size: 1.05rem; font-weight: 800; color: var(--c-text); }
.cu-group-title + * { clear: both; }
.cu-subsection { padding: var(--space-4) var(--space-4) var(--space-1); border-radius: var(--radius); background: var(--c-surface); }
.cu-subsection .cu-field input:not([type=checkbox]):not([type=radio]) { background: var(--c-bg); }
.cu-consents { margin-top: var(--space-1); }
.cu-consents .cu-field { margin-bottom: var(--space-3); }
/* Section headings inside account form cards */
.cu-card-body > h3 { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--c-border); }
.cu-card-body > h3:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

/* ---------- Tables ---------- */
.cu-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cu-table { width: 100%; border-collapse: collapse; font-size: .97rem; }
.cu-table th, .cu-table td { padding: .85rem 1rem; border-bottom: 1px solid var(--c-border); text-align: left; vertical-align: middle; }
.cu-table th { background: var(--c-surface); color: var(--c-muted); font-size: .88rem; font-weight: 700; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.cu-table tbody tr:hover { background: color-mix(in srgb, var(--c-surface) 60%, transparent); }
.cu-table tbody tr:last-child td { border-bottom: 0; }
.cu-table .cu-strong-link, .cu-table .cu-code { white-space: nowrap; }
.cu-table td.num, .cu-table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cu-table tfoot td { background: var(--c-surface); font-weight: 600; border-bottom: 0; border-top: 1px solid var(--c-border); padding-block: .55rem; }
.cu-table tfoot tr:last-child td { font-size: 1.08rem; font-weight: 800; padding-block: .85rem; }
.cu-table td.cu-actions-cell { text-align: right; white-space: nowrap; }
.cu-table td.cu-actions-cell form { display: inline-flex; }
.cu-table td select.cu-input { min-height: 44px !important; width: auto; }
.cu-table th:first-child, .cu-table td:first-child { padding-left: var(--cu-pad); }
.cu-table th:last-child, .cu-table td:last-child { padding-right: var(--cu-pad); }
/* Tables run edge to edge inside card bodies and the quick order results */
.cu-card-body > .cu-table-wrap, .cu-card[data-qo-results] > .cu-table-wrap { margin-inline: calc(-1 * var(--cu-pad)); }
.cu-card-body > .cu-table-wrap:first-child { margin-top: calc(-1 * var(--cu-pad)); }
.cu-card-head + .cu-card-body > .cu-table-wrap:first-child { margin-top: 0; }
.cu-card-body > .cu-table-wrap:last-child, .cu-card[data-qo-results] > .cu-table-wrap:last-child { margin-bottom: calc(-1 * var(--cu-pad)); }
.cu-card-body > p + .cu-table-wrap { margin-top: var(--space-3); }
.cu-card[data-qo-results] { padding: var(--cu-pad); }
.cu-card[data-qo-results] > .cu-alert:first-child { margin-top: 0; }
.cu-pay { display: inline-flex; flex-wrap: wrap; gap: .1rem .4rem; align-items: baseline; }
.cu-line-ok { color: var(--c-success); }
.cu-line-missing { color: var(--c-danger); }

/* ---------- Empty states: one short sentence and one clear action ---------- */
.cu-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-3); padding: var(--space-6) var(--space-4); text-align: center; color: var(--c-muted); font-size: 1rem; line-height: 1.5; }
.cu-empty p { margin: 0; color: var(--c-text); font-size: 1.02rem; }
.cu-container .cu-empty > .icon { display: block; width: 2rem; height: 2rem; margin: 0; color: var(--c-border-strong); opacity: 1; }
.cu-empty > br { display: none; }
.cu-empty .cu-small { max-width: 46ch; }

/* ---------- Account shell ---------- */
.cu-account { display: grid; grid-template-columns: var(--cu-nav-w) minmax(0, 1fr); gap: var(--space-6); align-items: start; margin: var(--space-5) 0 var(--space-8); }
.cu-account-content { min-width: 0; }
.cu-account-head { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3) var(--space-4); margin-bottom: var(--space-5); }
.cu-account-head h1 { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .75rem; }
.cu-account-head h1 .cu-badge { font-size: .85rem; }
.cu-account-head > a.cu-small { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-weight: 700; }
.cu-account-head > .cu-row { align-items: center; gap: var(--space-3); }
.cu-account-head > .cu-row > a.cu-small { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-weight: 700; }
.cu-account-head > .cu-badge { margin-top: .5rem; }
.cu-account-title { min-width: 0; }
.cu-account-sub { margin: .35rem 0 0; color: var(--c-muted); font-size: 1.02rem; }
.cu-account-content > p.cu-small.cu-muted:first-of-type { margin-top: calc(-1 * var(--space-3)); }

/* Sidebar card: greeting, e-mail, links. Active link = brand-soft background + bold. */
.cu-account-nav { position: sticky; top: var(--space-5); background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: none; overflow: hidden; }
.sticky-header .cu-account-nav { top: calc(var(--header-h) + var(--space-4)); }
.cu-account-user { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-5) var(--space-4) var(--space-4); border-bottom: 1px solid var(--c-border); background: var(--c-surface); }
.cu-account-user > div { display: flex; flex-direction: column; min-width: 0; }
.cu-account-user strong { font-size: 1.08rem; font-weight: 800; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cu-account-user small { font-size: .88rem; color: var(--c-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cu-account-user .cu-badge { align-self: flex-start; margin-top: .35rem; }
.cu-avatar { width: 44px; height: 44px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--c-brand); color: var(--c-brand-ink); font-weight: 800; font-size: 1.15rem; box-shadow: none; }
.cu-account-links { display: flex; flex-direction: column; gap: 2px; padding: var(--space-2); }
.cu-account-links a, .cu-account-links button, .cu-container .cu-account-links a { display: flex; align-items: center; gap: .75rem; width: 100%; min-height: 46px; padding: .55rem .8rem; border: 0; border-radius: var(--radius-sm); background: none; color: var(--c-text); font: inherit; font-size: 1rem; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; transition: background-color .12s var(--ease), color .12s var(--ease); }
.cu-account-links a:hover, .cu-account-links button:hover, .cu-container .cu-account-links a:hover { background: var(--c-surface); color: var(--c-text); text-decoration: none; }
.cu-account-links .icon { width: 1.2rem; height: 1.2rem; color: var(--c-muted); opacity: 1; }
.cu-account-links a.active, .cu-container .cu-account-links a.active { background: var(--c-brand-soft); color: var(--c-brand); font-weight: 800; }
.cu-account-links a.active .icon { color: var(--c-brand); }
.cu-account-links a.active::before { content: none; }
.cu-logout-form { margin-top: var(--space-1); padding-top: var(--space-1); border-top: 1px solid var(--c-border); }
.cu-account-links .cu-logout-form button { color: var(--c-muted); }
.cu-account-links .cu-logout-form button:hover { background: var(--c-danger-soft); color: var(--c-danger); }
.cu-account-links .cu-logout-form button:hover .icon { color: var(--c-danger); }

/* ---------- Dashboard ---------- */
.cu-figures { list-style: none; margin: 0 0 var(--space-5); padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--c-surface); border-radius: var(--radius); overflow: hidden; }
.cu-figure { min-width: 0; }
.cu-figure + .cu-figure { border-left: 1px solid var(--c-border); }
.cu-figure > a, .cu-figure:not(:has(> a)) { display: flex; flex-direction: column; gap: .15rem; height: 100%; padding: var(--space-4) var(--space-5); color: var(--c-text); text-decoration: none; }
.cu-container .cu-figure > a { color: var(--c-text); }
.cu-container .cu-figure > a:hover { background: var(--c-surface-2); text-decoration: none; }
.cu-figure-label { font-size: .95rem; font-weight: 600; color: var(--c-muted); }
.cu-figure-value { font-size: clamp(1.45rem, 1.2rem + .7vw, 1.85rem); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.cu-figure-more { display: inline-flex; align-items: center; gap: .15rem; margin-top: .2rem; font-size: .9rem; font-weight: 700; color: var(--c-link); }
.cu-figure-more .icon { width: 1em; height: 1em; }
.cu-dash-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--space-5); align-items: start; }
.cu-dash-main, .cu-dash-side { display: flex; flex-direction: column; gap: var(--space-5); min-width: 0; }
.cu-dash-main > .cu-card + .cu-card, .cu-dash-side > .cu-card + .cu-card { margin-top: 0; }
.cu-dash-addresses { display: grid; gap: var(--space-4); }
.cu-dash-address + .cu-dash-address { padding-top: var(--space-4); border-top: 1px solid var(--c-border); }
.cu-container .cu-dash-address h3 { margin: 0 0 .35rem; font-size: .95rem; font-weight: 800; color: var(--c-text); letter-spacing: 0; text-transform: none; }
.cu-dash-address p { margin: 0 0 .6rem; font-size: .97rem; line-height: 1.55; }
.cu-dash-address p:last-child { margin-bottom: 0; }
.cu-linklist { list-style: none; margin: var(--space-2) 0 0; padding: 0 0 var(--space-2); }
.cu-linklist li + li { border-top: 1px solid var(--c-border); }
.cu-linklist a, .cu-container .cu-linklist a { display: grid; grid-template-columns: 1.3rem minmax(0, 1fr) 1rem; align-items: center; gap: var(--space-3); min-height: 60px; padding: .6rem var(--cu-pad); color: var(--c-text); text-decoration: none; }
.cu-container .cu-linklist a:hover { background: var(--c-surface); text-decoration: none; }
.cu-linklist a > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.cu-linklist strong { font-weight: 800; }
.cu-linklist small { color: var(--c-muted); font-size: .88rem; }
.cu-container .cu-linklist .icon:first-child { width: 1.3rem; height: 1.3rem; color: var(--c-brand); }
.cu-container .cu-linklist .icon:last-child { width: 1rem; height: 1rem; color: var(--c-muted); }

/* ---------- Addresses ---------- */
.cu-address-list { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.cu-address { display: flex; flex-direction: column; gap: .6rem; padding: var(--space-4); border: 1px solid var(--c-border); border-radius: var(--radius); background: var(--c-bg); }
.cu-address.is-default { border-color: var(--c-brand); box-shadow: inset 0 0 0 1px var(--c-brand); }
.cu-address-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; }
.cu-address-head strong { font-size: 1.02rem; font-weight: 800; }
.cu-address-body { color: var(--c-text); font-size: .97rem; line-height: 1.55; }
.cu-address-foot { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: auto; padding-top: .6rem; border-top: 1px solid var(--c-border); }
.cu-address-foot form { display: inline-flex; }

/* ---------- Progress, devices, quote status steps ---------- */
.cu-progress { height: .6rem; border-radius: 999px; background: var(--c-surface-2); overflow: hidden; }
.cu-progress > span { display: block; height: 100%; border-radius: 999px; background: var(--c-brand); }
.cu-progress.warn > span { background: var(--c-warning); }
.cu-progress.danger > span { background: var(--c-danger); }
.cu-device { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--c-border); }
.cu-device:last-of-type { border-bottom: 0; }
.cu-container .cu-device > .icon { width: 40px; height: 40px; padding: 10px; border-radius: 50%; background: var(--c-surface); color: var(--c-muted); }
.cu-device > div { flex: 1; min-width: 140px; }
.cu-device small { display: block; font-size: .88rem; color: var(--c-muted); margin-top: .1rem; }
.cu-steps { display: flex; flex-wrap: nowrap; gap: 0; margin: 0 0 var(--space-5); padding: var(--space-4) var(--space-5); list-style: none; border-radius: var(--radius); background: var(--c-surface); overflow-x: auto; }
.cu-steps li { flex: 1 1 0; min-width: max-content; display: flex; align-items: center; gap: .55rem; font-size: .95rem; font-weight: 600; color: var(--c-muted); }
.cu-steps li::before { content: ""; flex: none; width: .8rem; height: .8rem; border-radius: 50%; background: var(--c-bg); border: 2px solid var(--c-border-strong); opacity: 1; }
.cu-steps li::after { content: ""; flex: 1; min-width: 1.5rem; height: 2px; margin: 0 .75rem; border-radius: 2px; background: var(--c-border-strong); }
.cu-steps li:last-child { flex: 0 0 auto; }
.cu-steps li:last-child::after { display: none; }
.cu-steps li.done { color: var(--c-success); }
.cu-steps li.done::before { background: var(--c-success); border-color: var(--c-success); }
.cu-steps li.done::after { background: var(--c-success); }
.cu-steps li.now { color: var(--c-brand); font-weight: 800; }
.cu-steps li.now::before { background: var(--c-brand); border-color: var(--c-brand); box-shadow: 0 0 0 4px var(--c-brand-soft); }

/* ---------- Pagination ---------- */
.cu-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .35rem; margin-top: var(--space-5); }
.cu-pagination a, .cu-pagination span { min-width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 .6rem; border: 0; border-radius: var(--radius-sm); background: none; color: var(--c-text); font-weight: 700; font-variant-numeric: tabular-nums; text-decoration: none; }
.cu-container .cu-pagination a { color: var(--c-text); }
.cu-container .cu-pagination a:hover { background: var(--c-surface-2); text-decoration: none; }
.cu-pagination .current { background: var(--c-brand); color: var(--c-brand-ink); }
.cu-card-body > .cu-table-wrap + .cu-pagination { margin-top: calc(var(--cu-pad) + var(--space-3)); }

/* ---------- Auth pages: a friendly white panel on a soft surface ---------- */
.cu-page-auth .site-main { background: var(--c-surface); }
.cu-auth { width: 100%; max-width: 480px; margin: var(--space-7) auto var(--space-8); }
.cu-auth-wide { max-width: 800px; }
.cu-auth .cu-card { border-color: transparent; box-shadow: var(--shadow-sm); }
.cu-auth .cu-card-body { padding: clamp(1.25rem, 3vw, 2.25rem); }
.cu-auth h1 { margin-bottom: .4rem; font-size: clamp(1.6rem, 1.35rem + .8vw, 2rem); }
.cu-auth .cu-intro { color: var(--c-muted); margin-bottom: var(--space-5); font-size: 1.02rem; line-height: 1.55; }
.cu-auth .cu-form > .cu-btn-block { margin-top: var(--space-2); }
.cu-field-remember { margin-bottom: var(--space-4); }
.cu-auth-foot { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--c-border); color: var(--c-muted); font-size: .98rem; text-align: center; }
.cu-auth-foot p { margin: 0 0 .5rem; }
.cu-auth-foot p:last-child { margin-bottom: 0; }
.cu-auth-foot a { font-weight: 700; }
.cu-auth-foot .icon { width: 1em; height: 1em; }
.cu-auth-foot-title { color: var(--c-text); font-weight: 700; }
.cu-auth-foot .cu-btn + p, .cu-auth-foot-b2b { margin-top: var(--space-4) !important; }
.cu-auth-foot-b2b a { display: inline-block; padding-block: .6rem; }
.cu-auth-center { text-align: center; }
.cu-auth-center .cu-alert { text-align: left; }
.cu-auth-icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-bottom: var(--space-4); border-radius: 50%; background: var(--c-brand-soft); color: var(--c-brand); }
.cu-container .cu-auth-icon .icon { width: 1.6rem; height: 1.6rem; }
.cu-auth-icon-success { background: var(--c-success-soft); color: var(--c-success); }
.cu-auth-icon-danger { background: var(--c-danger-soft); color: var(--c-danger); }
.cu-auth-shell { display: grid; grid-template-columns: minmax(0, 480px); justify-content: center; gap: var(--space-7); margin: var(--space-7) 0 var(--space-8); align-items: center; }
.cu-auth-shell .cu-auth { margin: 0; max-width: none; }
.cu-auth-why { display: none; }
@media (min-width: 900px) {
  .cu-auth-shell:not(.is-single) { grid-template-columns: minmax(0, 460px) minmax(0, 380px); }
  .cu-auth-why { display: block; }
}
.cu-container .cu-auth-why h2 { font-size: clamp(1.35rem, 1.15rem + .6vw, 1.7rem); margin: 0 0 var(--space-4); }
.cu-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }
.cu-checklist li { display: flex; align-items: flex-start; gap: var(--space-3); font-size: 1.05rem; line-height: 1.5; }
.cu-container .cu-checklist .icon { width: 1.4rem; height: 1.4rem; margin-top: .05rem; color: var(--c-success); stroke-width: 2.5; }
.cu-register-submit { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); margin-top: var(--space-2); }
.cu-register-submit .cu-btn { min-width: 240px; }
.cu-register-submit p { margin: 0; }

/* ---------- B2B landing (/b2b) ---------- */
.cu-landing { padding: var(--space-5) 0 var(--space-8); }
.cu-b2b-hero { display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden; border-radius: var(--radius-lg); background: var(--c-surface); }
.cu-b2b-hero-body { display: flex; flex-direction: column; justify-content: center; gap: var(--space-4); padding: clamp(1.5rem, 4vw, 3rem); }
.cu-container .cu-b2b-hero h1 { font-size: clamp(1.9rem, 1.3rem + 2.1vw, 2.9rem); line-height: 1.1; letter-spacing: -.025em; max-width: 18ch; }
.cu-b2b-lead { margin: 0; max-width: 54ch; color: var(--c-muted); font-size: clamp(1.02rem, .97rem + .25vw, 1.15rem); line-height: 1.6; }
.cu-b2b-hero-media { position: relative; aspect-ratio: 3 / 2; background: var(--c-surface-2); }
.cu-b2b-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cu-landing-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-2); }
.cu-b2b-section { margin-top: clamp(2.5rem, 6vw, 4rem); }
.cu-container .cu-b2b-section h2 { font-size: clamp(1.45rem, 1.2rem + .9vw, 1.95rem); margin: 0 0 var(--space-3); }
.cu-b2b-section-head p { color: var(--c-muted); font-size: 1.05rem; max-width: 46ch; }
.cu-terms-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--space-6); }
.cu-terms-list li { display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-4) 0; border-top: 1px solid var(--c-border); }
.cu-container .cu-terms-list .icon { width: 1.4rem; height: 1.4rem; margin-top: .1rem; color: var(--c-success); stroke-width: 2.5; }
.cu-container .cu-terms-list h3 { font-size: 1.08rem; margin: 0 0 .25rem; }
.cu-terms-list p { margin: 0; color: var(--c-muted); line-height: 1.55; }
.cu-steps-seq { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
.cu-steps-seq li { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.cu-steps-seq li:not(:last-child)::before { content: ""; position: absolute; left: 23px; top: 56px; bottom: calc(-1 * var(--space-5) + 8px); width: 2px; background: var(--c-border-strong); }
.cu-step-no { width: 48px; height: 48px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--c-brand); color: var(--c-brand-ink); font-weight: 800; font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.cu-container .cu-steps-seq h3 { font-size: 1.12rem; margin: .65rem 0 .3rem; }
.cu-steps-seq p { margin: 0; color: var(--c-muted); line-height: 1.55; max-width: 40ch; }
.cu-b2b-faq .faq-q span { flex: 1; min-width: 0; }
.cu-b2b-faq .faq-a p { margin: 0; }
.cu-b2b-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); margin-top: clamp(2.5rem, 6vw, 4rem); padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: var(--radius-lg); background: var(--c-accent-soft); }
.cu-b2b-cta > div:first-child { flex: 1 1 420px; min-width: 0; }
.cu-container .cu-b2b-cta h2 { margin: 0 0 .4rem; font-size: clamp(1.35rem, 1.15rem + .8vw, 1.8rem); }
.cu-b2b-cta p { margin: 0; max-width: 62ch; color: var(--c-text); }
.cu-b2b-cta .cu-landing-actions { margin-top: 0; }
@media (min-width: 640px) { .cu-terms-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cu-b2b-hero-media { aspect-ratio: 16 / 9; } }
@media (min-width: 768px) {
  .cu-steps-seq { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
  .cu-steps-seq li { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .cu-steps-seq li:not(:last-child)::before { left: 64px; right: calc(-1 * var(--space-6) + 16px); top: 23px; bottom: auto; width: auto; height: 2px; }
  .cu-container .cu-steps-seq h3 { margin-top: var(--space-2); }
}
@media (min-width: 900px) {
  .cu-b2b-hero { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); min-height: 440px; }
  .cu-b2b-hero-media { aspect-ratio: auto; }
  .cu-b2b-terms, .cu-b2b-faq { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--space-6); align-items: start; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1099.98px) {
  .cu-dash-grid { grid-template-columns: minmax(0, 1fr); }
  .cu-dash-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); align-items: start; }
}
@media (max-width: 899.98px) {
  .cu-account { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-3); }
  /* The sidebar becomes a horizontally scrollable tab row above the content */
  .cu-account-nav { position: static; margin-inline: calc(-1 * var(--gutter)); border: 0; border-radius: 0; background: transparent; overflow: visible; border-bottom: 1px solid var(--c-border); }
  .cu-account-user { display: none; }
  .cu-account-links { flex-direction: row; flex-wrap: nowrap; gap: var(--space-2); padding: var(--space-1) var(--gutter) var(--space-3); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .cu-account-links::-webkit-scrollbar { display: none; }
  .cu-account-links a, .cu-account-links button, .cu-container .cu-account-links a { flex: none; width: auto; justify-content: center; gap: .45rem; min-height: 44px; padding: .5rem 1rem; border-radius: var(--radius-pill); background: var(--c-surface); font-size: .95rem; white-space: nowrap; scroll-snap-align: start; }
  .cu-account-links a .icon, .cu-account-links button .icon { width: 1.05rem; height: 1.05rem; }
  .cu-account-links a span, .cu-account-links button span { font-size: inherit; }
  .cu-account-links .cu-logout-form { display: contents; }
  .cu-grid-2 { grid-template-columns: minmax(0, 1fr); }
  .cu-auth-shell, .cu-auth { margin-top: var(--space-5); margin-bottom: var(--space-7); }
}
@media (max-width: 639.98px) {
  :root { --cu-pad: 16px; }
  .cu-account-head { margin-bottom: var(--space-4); }
  .cu-account-head > .cu-btn, .cu-container .cu-account-head > a.cu-btn { width: 100%; }
  .cu-figures { grid-template-columns: minmax(0, 1fr); }
  .cu-figure + .cu-figure { border-left: 0; border-top: 1px solid var(--c-border); }
  .cu-figure > a, .cu-figure:not(:has(> a)) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--space-3); padding: var(--space-3) var(--space-4); }
  .cu-figure-value { grid-column: 2; grid-row: 1 / span 2; font-size: 1.35rem; text-align: right; }
  .cu-figure-label { grid-column: 1; }
  .cu-figure-more { grid-column: 1; margin-top: 0; }
  .cu-dash-side { grid-template-columns: minmax(0, 1fr); }
  .cu-form-grid { grid-template-columns: minmax(0, 1fr); }
  .cu-span-2 { grid-column: auto; }
  .cu-form-grid .cu-check[style] { margin-top: 0 !important; }
  .cu-field-check { min-height: 0; padding-bottom: 0; }
  .cu-radio { flex-basis: 100%; }
  .cu-input-group { flex-wrap: wrap; }
  .cu-input-group > .cu-btn { flex: 1 1 100%; }
  .cu-form-actions .cu-btn, .cu-form-actions > form, .cu-form-actions > form .cu-btn { flex: 1 1 100%; width: 100%; }
  .cu-form-actions form.cu-row { flex-wrap: wrap; }
  .cu-form-actions form.cu-row .cu-input { flex: 1 1 100% !important; width: 100% !important; }
  .cu-card-head > .cu-btn, .cu-container .cu-card-head > a.cu-btn { width: 100%; }
  .cu-register-submit .cu-btn { width: 100%; min-width: 0; }
  /* Stacked tables: every row becomes a small block, labels come from data-label */
  .cu-table.cu-stack-mobile thead { display: none; }
  .cu-table.cu-stack-mobile tbody tr { display: block; padding: var(--space-3) var(--cu-pad); border-bottom: 1px solid var(--c-border); }
  .cu-table.cu-stack-mobile tbody tr:last-child { border-bottom: 0; }
  .cu-table.cu-stack-mobile tbody tr:hover { background: transparent; }
  .cu-table.cu-stack-mobile td, .cu-table.cu-stack-mobile td:first-child, .cu-table.cu-stack-mobile td:last-child { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: .3rem 0; border: 0; text-align: right; min-width: 0; overflow-wrap: anywhere; }
  .cu-table.cu-stack-mobile td::before { content: attr(data-label); flex: none; max-width: 45%; text-align: left; color: var(--c-muted); font-size: .9rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
  .cu-table.cu-stack-mobile td:not([data-label])::before { content: none; }
  .cu-table.cu-stack-mobile td:first-child { font-size: 1.05rem; }
  .cu-table.cu-stack-mobile td.cu-actions-cell { justify-content: flex-end; padding-top: var(--space-2); }
  .cu-table.cu-stack-mobile td.cu-actions-cell:empty { display: none; }
  .cu-table.cu-stack-mobile td.cu-actions-cell .cu-btn, .cu-table.cu-stack-mobile td.cu-actions-cell form { width: 100%; }
  .cu-table.cu-stack-mobile td form.cu-row { flex-wrap: nowrap; }
  .cu-table.cu-stack-mobile tfoot tr { display: flex; justify-content: space-between; gap: var(--space-4); padding: 0 var(--cu-pad); background: var(--c-surface); }
  .cu-table.cu-stack-mobile tfoot td, .cu-table.cu-stack-mobile tfoot td:first-child, .cu-table.cu-stack-mobile tfoot td:last-child { display: block; padding: .55rem 0; border: 0; background: transparent; }
  .cu-table.cu-stack-mobile tfoot tr + tr { border-top: 1px solid var(--c-border); }
  .cu-steps { flex-direction: column; gap: .55rem; padding: var(--space-3) var(--space-4); overflow: visible; }
  .cu-steps li, .cu-steps li:last-child { flex: none; min-width: 0; }
  .cu-steps li::after { display: none; }
  .cu-address-list { grid-template-columns: minmax(0, 1fr); }
  .cu-dl { grid-template-columns: minmax(0, 1fr); gap: .1rem; }
  .cu-dl dt { margin-top: .5rem; }
  .cu-device > form { margin-left: calc(40px + var(--space-3)); }
  .cu-impersonation form { margin-left: 0; width: 100%; }
  .cu-landing-actions .cu-btn, .cu-container .cu-landing-actions a.cu-btn { width: 100%; }
  .cu-b2b-cta > div:first-child { flex-basis: 100%; }
  .cu-b2b-cta .cu-landing-actions { width: 100%; }
}
@media (max-width: 359.98px) {
  .cu-container { padding-inline: var(--gutter); }
  .cu-account-links a, .cu-account-links button, .cu-container .cu-account-links a { padding-inline: .85rem; }
  .cu-btn { padding-inline: .9rem; }
  .cu-figure-value { font-size: 1.2rem; }
  .cu-password-wrap input { padding-right: 3rem !important; }
}
@media print {
  .cu-account { display: block; margin: 0; }
  .cu-account-nav, .cu-linklist, .cu-shortcuts, .cu-no-print { display: none !important; }
  .cu-card { border-color: var(--c-border-strong); box-shadow: none; }
}

/* B2B hero: actions start on the same edge as the heading and the lead. */
.cu-b2b-hero .cu-landing-actions { align-self: stretch; justify-content: flex-start; }