/* Shared controls and colour tokens. Keep navigation and semantic actions consistent. */
:root {
  color-scheme: light;
  --action-fill:#c2410c; --action-hover:#9a3412; --on-action:#fff;
  --link:#b43c0b; --danger-ink:#b91c1c; --danger-fill:#b91c1c;
  --success-fill:#15803d; --focus-ring:#c2410c;
}
html.dark-mode {
  color-scheme:dark;
  --bg:#0f172a; --card:#1e293b; --text:#f8fafc; --text-strong:#f8fafc;
  --muted:#b3bfd0; --border:#334155; --border-strong:#64748b;
  --surface-0:#0f172a; --surface-1:#162033; --surface-2:#1e293b;
  --surface-3:#273449; --surface-card:#1e293b;
  --primary:#ff966c; --primary-dark:#ffb493; --primary-soft:#35251f;
  --primary-tint:rgba(255,150,108,.14); --link:#ffac87;
  --danger-ink:#fda4af; --focus-ring:#ffac87;
}
body { background:var(--bg); color:var(--text); }
a { color:var(--link); }
label, legend { color:var(--text); }
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=hidden]), select, textarea {
  color:var(--text); background-color:var(--surface-card); border-color:var(--border-strong);
  font:inherit; border-radius:var(--radius-md,12px); padding:12px 14px;
}
input::placeholder, textarea::placeholder { color:var(--muted); opacity:1; }
input[type=checkbox], input[type=radio] { accent-color:var(--action-fill); }
input[type=date], input[type=time], input[type=url], input[type=search] { box-sizing:border-box; width:100%; margin-top:6px; border:1.5px solid var(--border-strong); }
button,.btn,input[type=submit] { color:var(--on-action); }
button:not(.theme-toggle):not(.password-eye-btn):not(.close-x):not(.social-button):not(.ke-notice__dismiss):not(.qty-stepper button):not(.menu-row-add),
.btn:not(.social-button),input[type=submit] { min-height:44px; line-height:1.4; }
button:hover,.btn:hover { background:var(--action-hover); }
button.secondary,.btn.secondary,.btn-secondary {
  background:var(--surface-2); color:var(--text); border:1px solid var(--border-strong);
}
button.secondary:hover,.btn.secondary:hover,.btn-secondary:hover { background:var(--surface-3); color:var(--text); }
button.danger,.btn.danger { background:var(--danger-fill); color:var(--on-action); }
button.danger:hover,.btn.danger:hover { background:#991b1b; color:var(--on-action); }
button.success,.btn.success { background:var(--success-fill); color:var(--on-action); }
button.success:hover,.btn.success:hover { background:#166534; }
button:disabled,input:disabled,.btn[aria-disabled=true] { cursor:not-allowed; opacity:.6; }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--focus-ring); outline-offset:3px; }
/* Every More action, including logout, uses identical row geometry. */
#more-sheet-links { display:grid; gap:4px; }
.more-sheet #more-sheet-links > .ke-menu-action {
  display:flex; align-items:center; gap:12px; width:100%; min-height:48px;
  padding:12px 14px; margin:0; border:0; border-radius:var(--radius-md,12px);
  background:transparent; color:var(--text); font:600 15px/1.4 var(--font-sans);
  text-align:left; text-decoration:none; box-sizing:border-box;
}
.more-sheet #more-sheet-links > .ke-menu-action:hover { background:var(--surface-3); }
.ke-menu-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 20px; }
.more-sheet .ke-menu-icon i { position:static; transform:none; width:20px; margin:0; font-size:17px; color:var(--primary); }
.ke-menu-label { flex:1; min-width:0; overflow-wrap:anywhere; }
.ke-menu-chevron { color:var(--muted); font-size:22px; line-height:1; }
.more-sheet #more-sheet-links > .ke-menu-action--danger { color:var(--danger-ink); }
.more-sheet .ke-menu-action--danger .ke-menu-icon i { color:var(--danger-ink); }
.more-sheet .close-x { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; color:var(--text); background:transparent; }
.more-sheet .close-x:hover { background:var(--surface-3); }
/* The theme lives on <html>; feature styles must use the same selector. */
html.dark-mode :is(.card,.menu-card,.goal-card,.review,.eft-details,.chat-window,.settings-loc,.sub-card,.acct-group,.acct-stat,.pay-pill,.more-sheet,.more-menu,.item-sheet,.cart-summary-card,.cart-section) {
  background-color:var(--card); color:var(--text); border-color:var(--border);
}
html.dark-mode :is(label,legend,.section-title,.acct-row-label,.acct-name,.settings-block label) { color:var(--text); }
html.dark-mode :is(.muted,.acct-row-sub,.acct-email,small) { color:var(--muted); }
html.dark-mode :is(td,th) { border-color:var(--border); }
html.dark-mode tr { background:var(--card); color:var(--text); }
html.dark-mode th { background:var(--surface-1); color:var(--muted); }
html.dark-mode :is(.tabbar,header.topbar) { background:var(--card); border-color:var(--border); }
html.dark-mode :is(.tabbar a,header.topbar nav a,.more-menu a,.acct-row) { color:var(--text); }
html.dark-mode :is(.tabbar a.active,.acct-row-icon) { color:var(--primary); }
html.dark-mode .shop-card { background:var(--card); color:var(--text); border-color:var(--border); }
html.dark-mode .category-pill { background:var(--surface-2); color:var(--text); border-color:var(--border-strong); }
html.dark-mode .category-pill.active { background:var(--action-fill); color:var(--on-action); }
html.dark-mode .category-pill.active * { color:inherit; }
html.dark-mode .pay-pill:has(input:checked) { background:var(--primary-soft); }
html.dark-mode .theme-toggle { background:var(--surface-3)!important; color:var(--text)!important; }
/* White inline panels from older forms must follow the selected theme. */
html.dark-mode main :is([style*="background:white;" i],[style*="background: white;" i],[style*="background:#fff;" i],[style*="background: #fff;" i],[style*="background:#ffffff;" i],[style*="background: #ffffff;" i]) {
  background:var(--card)!important; color:var(--text)!important; border-color:var(--border)!important;
}
html.dark-mode main :is(label,legend)[style] { color:var(--text)!important; }
html.dark-mode main :is([style*="color:#1e293b" i],[style*="color: #1e293b" i],[style*="color:#111827" i],[style*="color: #111827" i],[style*="color:#333;" i],[style*="color: #333;" i]) { color:var(--text)!important; }
html.dark-mode main :is([style*="color:#6b7280" i],[style*="color: #6b7280" i],[style*="color:#64748b" i],[style*="color: #64748b" i]) { color:var(--muted)!important; }
html.dark-mode footer, html.dark-mode footer a { color:var(--muted)!important; }
/* Contract previews previously combined a light panel with white inherited labels. */
html.dark-mode .signup-agreement { background:var(--surface-1); color:var(--text); border-color:var(--border-strong); }
html.dark-mode .agreement-terms { background:var(--card); color:var(--text); border-color:var(--border); }
html.dark-mode .agreement-company { background:var(--primary-soft); color:var(--text); }
html.dark-mode :is(.agreement-heading p,.agreement-company p,.agreement-digest) { color:var(--muted); }
html.dark-mode .agreement-heading > span { color:var(--primary); }
html.dark-mode :is(.studio-notice,.studio-secondary,.studio-state) { background:var(--surface-3)!important; color:var(--text)!important; border-color:var(--border-strong)!important; }
html.dark-mode .studio-preview-title { color:#a5c9ff; }
html.dark-mode .studio-connections > div { background:var(--card); border-color:var(--border); }
html.dark-mode .safety-hero, html.dark-mode .safety-hero h1, html.dark-mode .safety-hero p { color:#fff; }
html.dark-mode .safety-secondary { background:var(--surface-3)!important; color:var(--text)!important; border-color:var(--border-strong); }
html.dark-mode .safety-recording { color:#fda4af; }
@media (prefers-reduced-motion:reduce) { .more-sheet { transition:none; } }
/* Keep foreground and surface changes atomic when switching themes. */
button.secondary,.btn.secondary,.btn-secondary { transition:box-shadow .15s,transform .12s; }
button[name="action"][value="apply_promo"],
button[name="action"][value="apply_promo"]:focus,
button[name="action"][value="apply_promo"]:active,
.btn-primary,.cart-place-btn {
  background:var(--action-fill)!important; color:var(--on-action)!important; border-color:var(--action-fill)!important;
}
button[name="action"][value="apply_promo"]:hover,
.btn-primary:hover,.cart-place-btn:hover { background:var(--action-hover)!important; color:var(--on-action)!important; border-color:var(--action-hover)!important; }
/* Shared action spacing, including wrapped rows and legacy inline controls. */
:root { --action-gap:12px; }
.ke-actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--action-gap); }
:where(.row,.mm-actions,.so-actions,.admw-actions,.admo-filter-actions,.adms-actions,.dv-online-actions,.dv-active-actions,.order-card-actions,.confirm-actions,.ke-error-actions,.conversation-tools,.agreement-actions) {
  gap:var(--action-gap)!important; row-gap:var(--action-gap)!important;
}
:where(.card,form,section,p) > :where(button,.btn,input[type=submit]) + :where(button,.btn,input[type=submit]) {
  margin-inline-start:var(--action-gap); margin-block-start:var(--action-gap);
}
:where(.ke-actions,.row,.mm-actions,.so-actions,.admw-actions,.admo-filter-actions,.adms-actions,.dv-online-actions,.dv-active-actions,.order-card-actions,.confirm-actions,.ke-error-actions,.conversation-tools,.agreement-actions) > :is(button,.btn,input[type=submit],form) {
  margin:0;
}
.ke-actions :is(button,.btn),.row :is(button,.btn) { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
/* Legacy account panels and monospace codes also follow the selected theme. */
.acct-header { background:linear-gradient(135deg,#9a3412,#c2410c)!important; color:#fff; }
.acct-header .acct-name,html.dark-mode .acct-header .acct-name { color:#fff; }
.acct-header .acct-email,html.dark-mode .acct-header .acct-email { color:#fff0e8; opacity:1; }
.account-delete-panel { margin:24px 0 16px; background:var(--card); border:1px solid var(--border-strong); border-radius:var(--radius-lg); padding:16px; }
.account-delete-panel summary { cursor:pointer; font-weight:700; color:var(--danger-ink); }
.account-delete-description { margin:12px 0; font-size:14px; color:var(--muted); }
.account-delete-panel form { margin-top:16px; }
.account-delete-panel input { margin-bottom:16px; }
html.dark-mode .ref { background:var(--surface-3); color:var(--text); }
html.dark-mode .acct-row-danger,html.dark-mode .acct-row-danger .acct-row-label { color:var(--danger-ink); }

/* Map older inline brand-orange actions to the same readable primary treatment. */
button:is([style*="background:#ff6b35" i],[style*="background: #ff6b35" i],[style*="background:#ff5b1f" i],[style*="background: #ff5b1f" i]) {
  background:var(--action-fill)!important; color:var(--on-action)!important;
}
button:is([style*="background:#ff6b35" i],[style*="background: #ff6b35" i],[style*="background:#ff5b1f" i],[style*="background: #ff5b1f" i]):hover {
  background:var(--action-hover)!important;
}
.ke-actions + label { margin-top:16px; }