/* ===== Jenell CRM — Sistema temi unificato =====
   Le pagine admin mantengono i loro `:root` inline come fallback;
   le regole sotto, basate su [data-theme], li sovrascrivono. */

html[data-theme="graphite"]{
  --bg:#121212;
  --panel:#1d1d1d;
  --panel-2:#101010;
  --text:#f2f2f2;
  --muted:#b3b3b3;
  --accent:#dfdfdf;
  --accent-contrast:#111;
  --line:#3a3a3a;
  --line-soft:#2a2a2a;
  --hover:#181818;
  --ok:#7ed957;
  --warn:#f5a623;
  --err:#e74c3c;
}

html[data-theme="light"]{
  --bg:#f6f7f9;
  --panel:#ffffff;
  --panel-2:#f0f2f5;
  --text:#1a1f2c;
  --muted:#5a6477;
  --accent:#1a2b4c;            /* Solax navy */
  --accent-contrast:#ffffff;
  --line:#dee2eb;
  --line-soft:#eaeef4;
  --hover:#eef2f8;
  --ok:#2a7d3a;
  --warn:#c97a00;
  --err:#c0392b;
}

html[data-theme="solax"]{
  --bg:#0e1726;                /* Solax deep navy */
  --panel:#162238;
  --panel-2:#0b1320;
  --text:#eef3fb;
  --muted:#8fa0bd;
  --accent:#00a0e9;            /* Solax electric blue */
  --accent-contrast:#0b1320;
  --line:#27375a;
  --line-soft:#1a2540;
  --hover:#1a2742;
  --ok:#5dd39e;
  --warn:#f4b942;
  --err:#ef5d60;
}

html[data-theme="jenell"]{
  --bg:#1a1612;                /* Charcoal caldo */
  --panel:#241e18;
  --panel-2:#15110d;
  --text:#f5ecdb;
  --muted:#a89986;
  --accent:#c9a961;            /* Oro champagne Jenell */
  --accent-contrast:#1a1612;
  --line:#3a3127;
  --line-soft:#2a221a;
  --hover:#2e261d;
  --ok:#a8c068;
  --warn:#e8a64a;
  --err:#d96a5a;
}

/* Componenti che usavano colori hardcoded (#101010, #0e0e0e, #181818) → mappati su variabili */
html[data-theme] input,
html[data-theme] select,
html[data-theme] textarea{
  background:var(--panel-2) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
html[data-theme] button{
  background:var(--panel-2) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
html[data-theme] button.ghost{
  background:transparent !important;
  color:var(--text) !important;
}
html[data-theme] button.primary{
  background:var(--accent) !important;
  color:var(--accent-contrast) !important;
  border-color:var(--accent) !important;
}
html[data-theme] button.danger{
  background:var(--panel-2) !important;
  color:var(--err) !important;
  border-color:var(--err) !important;
}
html[data-theme] button:hover{ border-color:var(--accent) !important; }
html[data-theme] .stat-box{ background:var(--panel-2) !important; border-color:var(--line) !important; }
html[data-theme] .list-card{ background:var(--panel-2) !important; border-color:var(--line) !important; }
html[data-theme] .list-card.active{ background:var(--hover) !important; }
html[data-theme] tr:hover td{ background:var(--hover) !important; }
html[data-theme] th{ background:var(--panel) !important; }
html[data-theme] .badge{ background:var(--line-soft); color:var(--text); }
html[data-theme] .badge.std{ background:var(--line-soft); color:var(--accent); }
html[data-theme] .badge.custom{ background:var(--line-soft); color:var(--accent); }

/* Theme switcher widget */
.theme-switcher{
  position:fixed; bottom:14px; right:14px; z-index:9999;
  display:flex; gap:6px; padding:6px;
  background:var(--panel); border:1px solid var(--line); border-radius:999px;
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}
.theme-switcher button{
  width:26px; height:26px; padding:0; border-radius:50%;
  border:2px solid transparent; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:0; transition:transform .15s;
}
.theme-switcher button:hover{ transform:scale(1.1); }
.theme-switcher button.active{ border-color:var(--accent); box-shadow:0 0 0 2px var(--bg) inset; }
.theme-switcher button[data-set="graphite"]{ background:#1d1d1d; }
.theme-switcher button[data-set="light"]{    background:#ffffff; border-color:#cfd5e0; }
.theme-switcher button[data-set="solax"]{    background:linear-gradient(135deg,#0e1726 50%,#00a0e9 50%); }
.theme-switcher button[data-set="jenell"]{   background:linear-gradient(135deg,#1a1612 50%,#c9a961 50%); }

/* Note textarea: cresce con il contenuto, niente scroll fastidioso */
textarea.autosize{ resize:vertical; overflow:hidden; min-height:140px; }

/* ===================================================================
   Override aggressivi per i temi non-graphite: tutti i background
   hardcoded scuri (#0a/#0c/#0e/#10/#11/#18/#1a/#1f...) vengono
   neutralizzati e mappati sulle variabili del tema corrente.
   =================================================================== */

/* Sidebar enterprise */
html[data-theme] #sidebar{ background:var(--panel) !important; border-right-color:var(--line) !important; }
html[data-theme] #sidebar .sb-footer{ background:var(--panel-2) !important; border-top-color:var(--line) !important; }
html[data-theme] #sidebar .sb-brand{ border-bottom-color:var(--line) !important; }
html[data-theme] #sidebar .sb-group-label{ color:var(--muted) !important; }
html[data-theme] #sidebar a.sb-item,
html[data-theme] #sidebar button.sb-item{ color:var(--text) !important; background:transparent !important; }
html[data-theme] #sidebar a.sb-item:hover,
html[data-theme] #sidebar button.sb-item:hover{ background:var(--hover) !important; color:var(--accent) !important; }
html[data-theme] #sidebar .sb-item.active{ background:var(--hover) !important; color:var(--accent) !important; }
html[data-theme] #sidebar .sb-item .sb-ext{ color:var(--muted) !important; }
html[data-theme] #sidebar .sb-divider{ background:var(--line) !important; }
html[data-theme] #sidebar .sb-logout{ background:var(--panel-2) !important; border-color:var(--line) !important; color:var(--text) !important; }
html[data-theme] #sidebar .sb-logout:hover{ background:rgba(231,76,60,.12) !important; border-color:var(--err) !important; color:var(--err) !important; }
html[data-theme] #sidebar .sb-user .avatar{ background:linear-gradient(135deg, var(--accent), var(--panel)) !important; color:var(--accent-contrast) !important; }
html[data-theme] #sidebar-toggle{ background:var(--panel) !important; border-color:var(--line) !important; color:var(--text) !important; }
html[data-theme] #sidebar .sb-brand .logo-dot{ background:linear-gradient(135deg, var(--accent), var(--panel)) !important; color:var(--accent-contrast) !important; }

/* Componenti generici scuri */
html[data-theme] .kanban-col{ background:var(--panel-2) !important; border-color:var(--line) !important; }
html[data-theme] .kanban-card{ background:var(--panel) !important; border-color:var(--line) !important; }
html[data-theme] .modal-panel{ background:var(--panel) !important; border-color:var(--line) !important; }
html[data-theme] .card{ background:var(--panel) !important; border-color:var(--line) !important; }

/* Inline styles hardcoded (catalogo, offerta, ecc.) — match per substring */
html[data-theme] [style*="background:#0a0a0a"],
html[data-theme] [style*="background:#0c0c0c"],
html[data-theme] [style*="background:#0e0e0e"],
html[data-theme] [style*="background:#101010"],
html[data-theme] [style*="background:#111111"],
html[data-theme] [style*="background:#181818"],
html[data-theme] [style*="background:#1a1a1a"],
html[data-theme] [style*="background:#1f1f1f"],
html[data-theme] [style*="background:#222"]{
  background:var(--panel-2) !important;
  color:var(--text) !important;
}
/* Bordi hardcoded scuri o accent → usa variabili (mantiene accent specifici tipo Magic AI) */
html[data-theme] [style*="border:1px solid #0"],
html[data-theme] [style*="border:1px solid #1"]{
  border-color:var(--line) !important;
}

/* In light/solax/jenell forza il colore testo dentro container scuri inline */
html[data-theme="light"] [style*="background:#0"],
html[data-theme="light"] [style*="background:#1"]{ color:var(--text) !important; }

/* Tabelle e header */
html[data-theme] table thead th{ background:var(--panel-2) !important; color:var(--text) !important; border-color:var(--line) !important; }
html[data-theme] table td{ border-color:var(--line-soft) !important; }

/* Magic AI badge / modal: tenue su light */
html[data-theme="light"] [style*="#a855f7"]{ /* lascia accent viola visibile */ }
html[data-theme="light"] [style*="color:#c084fc"]{ color:#7c3aed !important; }

/* Scrollbar coerente */
html[data-theme="light"] *::-webkit-scrollbar-thumb{ background:#c8cfdb; }
html[data-theme="light"] *::-webkit-scrollbar-track{ background:#eef2f8; }

/* Body padding-left fix sidebar (assicura sfondo coerente sotto la sidebar) */
html[data-theme] body{ background:var(--bg) !important; color:var(--text) !important; }
html[data-theme] body.has-sidebar .shell{ background:transparent !important; }

/* Theme switcher: in light/jenell/solax ridipingi anche il wrapper */
html[data-theme] .theme-switcher{ background:var(--panel) !important; border-color:var(--line) !important; }

/* ===================================================================
   FIX modalità chiara (e altri temi non-graphite): rimappa tutti i
   colori scuri hard-coded all'interno dei <style> embedded nelle pagine
   admin (catalogo.html, offerta.html, business-card.html, index.html,
   pdf-watermark.html). Tutti targettati con selettori specifici e
   !important per sovrascrivere le regole "<style>" inline alle pagine.
   =================================================================== */

/* ---- Autocomplete / suggest popups (offerta.html + catalogo.html) ---- */
html[data-theme] #off-suggest-pop,
html[data-theme] #off-suggest-pop *:not(input):not(button):not(textarea):not(select){
  /* niente: lo stile dei figli viene gestito sotto */
}
html[data-theme] #off-suggest-pop{
  background:var(--panel) !important;
  border-color:var(--accent) !important;
  color:var(--text) !important;
  box-shadow:0 14px 40px rgba(0,0,0,.18) !important;
}
html[data-theme] #off-suggest-pop .item{
  background:var(--panel) !important;
  color:var(--text) !important;
  border-bottom-color:var(--line-soft) !important;
}
html[data-theme] #off-suggest-pop .item:hover,
html[data-theme] #off-suggest-pop .item.active{
  background:var(--hover) !important;
  color:var(--text) !important;
}
html[data-theme] #off-suggest-pop .item .main strong{ color:var(--text) !important; }
html[data-theme] #off-suggest-pop .item .main .mfg{ color:var(--muted) !important; }
html[data-theme] #off-suggest-pop .item .meta{ color:var(--ok) !important; }
html[data-theme] #off-suggest-pop .empty,
html[data-theme] #off-suggest-pop .loading{ color:var(--muted) !important; }

/* ---- Totals grid celle (offerta.html) ---- */
html[data-theme] .totals-grid .cell{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme] .totals-grid .cell label{ color:var(--muted) !important; }

/* ---- Stat box (catalogo.html, index.html, offerta.html) ---- */
html[data-theme] .stat-box{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme] .stat-box .label{ color:var(--muted) !important; }
html[data-theme] .stat-box .value{ color:var(--text) !important; }

/* ---- Listini card (catalogo.html) ---- */
html[data-theme] .list-card{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme] .list-card.active{
  background:var(--hover) !important;
  border-color:var(--accent) !important;
}

/* ---- Badges (catalogo.html, index.html) ---- */
html[data-theme] .badge{
  background:var(--line-soft) !important;
  color:var(--text) !important;
}
html[data-theme="light"] .badge.std{ background:#e3edff !important; color:#1a2b4c !important; }
html[data-theme="light"] .badge.custom{ background:#fff3d6 !important; color:#7a4a00 !important; }

/* ---- Kanban (index.html) ---- */
html[data-theme] .kanban-col{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme] .kanban-card{
  background:var(--panel) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}

/* ---- Hover righe tabella (catalogo.html) ---- */
html[data-theme] tr:hover td{ background:var(--hover) !important; color:var(--text) !important; }

/* ---- Mobile card rows tbody (index.html responsive) ---- */
@media (max-width: 700px){
  html[data-theme] tbody tr{
    background:var(--panel-2) !important;
    border-color:var(--line) !important;
    color:var(--text) !important;
  }
}

/* ---- Input / select / textarea con background hardcoded #101010 nelle
        regole CSS (catalogo, offerta, index, business-card, pdf-watermark). 
        Le regole html[data-theme] input{...} esistenti dovrebbero già
        applicarsi; aggiungo selettore più specifico per sicurezza. ---- */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:#ffffff !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
html[data-theme="light"] select option{
  background:#ffffff !important;
  color:var(--text) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{ color:#9aa3b3 !important; }

/* ---- Business card: scanner / preview restano scuri (è una camera) ---- */
html[data-theme] .preview{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
}
/* .scanner-wrap, .scanner-video restano #000 (video) — non li tocchiamo */

/* ---- Pannelli storico, import-result, magic textarea, magic-result ---- */
html[data-theme] #storico-panel,
html[data-theme] #off-storico-panel,
html[data-theme] #import-result,
html[data-theme] #off-magic-prompt,
html[data-theme] #off-magic-result{
  background:var(--panel-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}

/* ---- Sezione separatore righe offerta (catalogo.html L864) ---- */
html[data-theme] td[colspan][style*="background:#1a1a1a"]{
  background:var(--panel-2) !important;
  color:var(--text) !important;
}

/* ---- Suggest popup creato dinamicamente in catalogo.html (L966) ---- */
html[data-theme] div[style*="position:fixed"][style*="background:#0e0e0e"]{
  background:var(--panel) !important;
  border-color:var(--accent) !important;
  color:var(--text) !important;
}

/* ---- Magic AI / ARYA modal: viola accent OK ma in light il testo
        sopra background panel deve restare leggibile ---- */
html[data-theme="light"] #off-magic-modal{
  color:var(--text) !important;
}
html[data-theme="light"] #off-magic-modal .muted{ color:var(--muted) !important; }

/* ---- Storico/offerte tabelle dinamiche (innerHTML generato): forza
        sfondo cella e testo per evitare nero su nero ---- */
html[data-theme="light"] #storico-list table,
html[data-theme="light"] #off-storico-list table{
  background:var(--panel) !important; color:var(--text) !important;
}
html[data-theme="light"] #storico-list table th,
html[data-theme="light"] #off-storico-list table th{
  background:var(--panel-2) !important; color:var(--text) !important;
}

/* ---- Toolbar sticky: in light usa panel ---- */
html[data-theme="light"] .toolbar-sticky{
  background:var(--bg) !important;
  border-bottom-color:var(--line) !important;
}

/* ---- Color override generico: qualunque elemento con color hard-coded
        "white/#fff" su background trasparente in light theme deve diventare
        leggibile. Lasciamo solo i .primary buttons (hanno background accent). ---- */
html[data-theme="light"] *[style*="color:white"]:not(.primary):not([style*="background:"]){
  color:var(--text) !important;
}
html[data-theme="light"] *[style*="color:#fff"]:not(.primary):not([style*="background:"]){
  color:var(--text) !important;
}