/* ==========================================================================
   Solvmodus themes (added 2026-10-20)
   <html data-theme="light|dark"> is set in base.html from the user's setting
   ("system" is resolved to light/dark in the browser before first paint).
   ========================================================================== */

/* ---------- settings + help pages (both themes) ---------- */
.theme-form .theme-label{font-size:12px;color:var(--muted);font-weight:500;margin-bottom:8px;display:block}
.theme-options{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.theme-option,.auth .theme-option{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:0;border:1px solid var(--line-2);border-radius:10px;cursor:pointer;font-size:14px;font-weight:400;letter-spacing:0;color:var(--ink)}
.theme-option small{color:var(--muted)}
.theme-option input{width:auto;margin:0}
.theme-option:has(input:checked){border-color:#2f338a;box-shadow:0 0 0 2px rgba(47,51,138,.15)}
.theme-swatch{width:34px;height:24px;border-radius:6px;border:1px solid var(--line-2);flex-shrink:0}
.theme-swatch-light{background:#f5f1ea}
.theme-swatch-dark{background:#16171a}
.theme-swatch-system{background:linear-gradient(135deg,#f5f1ea 50%,#16171a 50%)}

.help-wrap{max-width:760px;margin:0 auto;padding:40px 24px 20px}
.help-wrap h1{font:400 34px/1.15 var(--serif);margin:0 0 8px;color:var(--ink)}
.help-sub{color:var(--muted);margin:0 0 28px}
.help-item{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 26px;margin-bottom:16px;scroll-margin-top:20px}
.help-item:target{border-color:#2f338a;box-shadow:0 0 0 3px rgba(47,51,138,.12)}
.help-item h2{font:600 18px/1.3 var(--sans);margin:0 0 10px;color:var(--ink);display:flex;gap:10px;align-items:baseline}
.help-item p,.help-item li{font-size:15px;line-height:1.65;color:var(--ink-2)}
.help-item p{margin:0 0 10px}
.help-item p:last-child{margin-bottom:0}
.help-item ul{margin:0;padding-left:20px}
.help-item a{color:#2f338a;text-decoration:underline}
.help-cta{text-align:center;margin-top:26px}

/* ---------- dark theme ---------- */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#16171a; --card:#1f2126; --ink:#ececec; --ink-2:#d4d4d4;
  --muted:#a0a0a0; --line:#2e3138; --line-2:#3b3f47;
  --accent:#ececec; --accent-2:#d4d4d4;
  --mark:#6b5a00; --err:#ffb4a8; --ok:#8fd9a8;
}
html[data-theme="dark"] body{background:var(--bg);color:var(--ink)}

/* surfaces that were hard-coded white */
html[data-theme="dark"] .user-menu>summary,
html[data-theme="dark"] .user-menu-list,
html[data-theme="dark"] .searchbar,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .auth,
html[data-theme="dark"] .auth input,
html[data-theme="dark"] .auth select,
html[data-theme="dark"] .results-search,
html[data-theme="dark"] .result,
html[data-theme="dark"] .ai-answer,
html[data-theme="dark"] .ai-sources li a,
html[data-theme="dark"] .ai-sources li span,
html[data-theme="dark"] .article .actions a,
html[data-theme="dark"] .article .field,
html[data-theme="dark"] .contact-card,
html[data-theme="dark"] .team-photo,
html[data-theme="dark"] .msg,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .site-footer .ft-contact,
html[data-theme="dark"] .admin-inline-form,
html[data-theme="dark"] .admin-inline-form input,
html[data-theme="dark"] .admin-inline-form select,
html[data-theme="dark"] .queue-table,
html[data-theme="dark"] .queue-summary,
html[data-theme="dark"] .oaw-card{background:var(--card);border-color:var(--line-2);color:var(--ink)}

/* subtle hover / secondary surfaces */
html[data-theme="dark"] .chip:hover,
html[data-theme="dark"] .ai-sources li a:hover,
html[data-theme="dark"] .site-footer .ft-contact:hover,
html[data-theme="dark"] .searchbar button.go:hover,
html[data-theme="dark"] .article .actions a:hover,
html[data-theme="dark"] .btn-small,
html[data-theme="dark"] .queue-table th,
html[data-theme="dark"] .queue-ticket,
html[data-theme="dark"] .oaw-booth{background:#2a2d33;border-color:var(--line-2);color:var(--ink)}
html[data-theme="dark"] .btn-small:hover{background:#33373e}
html[data-theme="dark"] .queue-table th,
html[data-theme="dark"] .queue-table td{border-bottom-color:var(--line)}

/* inputs */
html[data-theme="dark"] .searchbar input,
html[data-theme="dark"] .results-search input{color:var(--ink)}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:#7d7d7d}
html[data-theme="dark"] .auth input:focus{border-color:#8f94ff}

/* primary buttons used var(--accent) background with white text */
html[data-theme="dark"] .btn-dark,
html[data-theme="dark"] .auth .btn-primary,
html[data-theme="dark"] .results-search button{background:#ececec;color:#16171a}
html[data-theme="dark"] .btn-dark:hover,
html[data-theme="dark"] .auth .btn-primary:hover{background:#ffffff}
html[data-theme="dark"] .btn-cta-outline:hover{color:#16171a}

/* "why this exists" band */
html[data-theme="dark"] .why{background:#1a1d23;border-color:#2a2f37}
html[data-theme="dark"] .why-card{background:#20242b;border-color:#2e343d}
html[data-theme="dark"] .why-title,
html[data-theme="dark"] .why-card h3{color:#e6eefb}
html[data-theme="dark"] .why-sub,
html[data-theme="dark"] .why-card p{color:#aab6c6}
html[data-theme="dark"] .why-eyebrow,
html[data-theme="dark"] .why-card .why-n{color:#7fb2ea}

/* brand colours that are too dark on a dark background */
html[data-theme="dark"] .help-item a,
html[data-theme="dark"] .oaw-eyebrow,
html[data-theme="dark"] .ai-answer-eyebrow{color:#9ea3ff}
html[data-theme="dark"] .theme-option:has(input:checked),
html[data-theme="dark"] .help-item:target{border-color:#8f94ff;box-shadow:0 0 0 2px rgba(143,148,255,.2)}

/* status colours */
html[data-theme="dark"] .flash.success{background:#17311f;border-color:#24502f;color:var(--ok)}
html[data-theme="dark"] .flash.error,
html[data-theme="dark"] .error-box{background:#3a1d1a;border-color:#5c2c27;color:var(--err)}
html[data-theme="dark"] .admin-link{background:#3a1d1f;border-color:#5a2a2d;color:#ff8a8f}
html[data-theme="dark"] .admin-link:hover{background:#4a2427}

/* logos have dark lettering - give them a soft light backing */
html[data-theme="dark"] .brand-logo-main,
html[data-theme="dark"] .site-footer .ft-logo{background:#f5f1ea;border-radius:8px;padding:4px 8px}

/* page loader overlay */
html[data-theme="dark"] .page-loader{background:rgba(22,23,26,.85)}
html[data-theme="dark"] .team-placeholder{background:linear-gradient(135deg,#2a2d33,#23262c)}

/* help page: industries columns (2026-10-22) */
.help-h3{font:600 15px/1.3 var(--sans);color:var(--ink);margin:18px 0 10px}
.help-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px 32px;margin-bottom:14px}
.help-cols h4{font:600 12px/1 var(--sans);letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.help-cols ul{margin:0;padding-left:18px}
.help-cols li{font-size:14.5px;line-height:1.7;color:var(--ink-2)}
@media (max-width:640px){.help-cols{grid-template-columns:1fr}}

/* admin users: search, filter, sortable headers (2026-10-22) */
.admin-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 12px}
.admin-tools input[type=search]{flex:1;min-width:240px;padding:9px 14px;border:1px solid var(--line-2);border-radius:999px;background:var(--card,#fff);color:var(--ink);font:400 14px var(--sans)}
.admin-tools select{padding:9px 12px;border:1px solid var(--line-2);border-radius:8px;background:var(--card,#fff);color:var(--ink);font:400 14px var(--sans)}
.admin-tools input[type=search]:focus,.admin-tools select:focus{outline:none;border-color:#2f338a;box-shadow:0 0 0 3px rgba(47,51,138,.12)}
.admin-count{font-size:13px;color:var(--muted)}
.admin-table th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
.admin-table th.sortable:hover,.admin-table th.sortable:focus{color:var(--ink);outline:none}
.admin-table th .sort-ind{font-size:9px;margin-left:3px}
html[data-theme="dark"] .admin-tools input[type=search],
html[data-theme="dark"] .admin-tools select{background:var(--card);border-color:var(--line-2);color:var(--ink)}
