/* Clousit v64 — dual workspace theme inspired by professional quote tools. */
:root,
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#09090b;
  --card:#111114;
  --ink:#f7f5f7;
  --muted:#a49ca4;
  --line:#29282e;
  --accent:#ff1f8f;
  --accent-strong:#ff1f8f;
  --accent-soft:rgba(255,31,143,.11);
  --accent-line:rgba(255,31,143,.52);
  --dark:#ff1f8f;
  --violet:#9c73ff;
  --green:#20d38a;
  --warn:#f0c040;
  --surface-1:#0e0e11;
  --surface-2:#17171b;
  --surface-3:#202027;
  --field:#18181d;
  --field-line:#303038;
  --button-text:#19000d;
  --shadow:0 18px 55px rgba(0,0,0,.28);
  --topbar:rgba(14,14,17,.94);
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f4f6;
  --card:#ffffff;
  --ink:#1c191d;
  --muted:#756e76;
  --line:#e3dfe4;
  --accent:#d60070;
  --accent-strong:#ff1f8f;
  --accent-soft:rgba(214,0,112,.075);
  --accent-line:rgba(214,0,112,.35);
  --dark:#1b181c;
  --violet:#7655dd;
  --green:#147a55;
  --warn:#946a16;
  --surface-1:#ffffff;
  --surface-2:#faf8fa;
  --surface-3:#f1edf1;
  --field:#ffffff;
  --field-line:#dcd6dd;
  --button-text:#ffffff;
  --shadow:0 18px 55px rgba(32,23,30,.09);
  --topbar:rgba(255,255,255,.92);
}

body{background:var(--bg);color:var(--ink);transition:background-color .18s ease,color .18s ease}
.topbar{background:var(--topbar);border-color:var(--line);box-shadow:0 8px 28px rgba(0,0,0,.08)}
.brand{color:var(--ink)}.brand i{color:var(--accent-strong)}
.sidebar{background:var(--surface-1);border-color:var(--line)}
.sidebar-toggle,.theme-toggle{border:1px solid var(--line);background:var(--surface-2);color:var(--ink);box-shadow:none}
.sidebar-toggle:hover,.theme-toggle:hover{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent)}
.theme-toggle{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;padding:0;font-size:18px;font-weight:900;line-height:1}
.theme-toggle-icon{display:block;transform:translateY(-1px)}
.production-plan-pill,.mode-switch{background:var(--surface-2);border-color:var(--line);color:var(--muted)}
.mode-switch button{color:var(--muted)}
.mode-switch button.active{background:var(--accent-strong);color:#18000c;box-shadow:0 5px 16px rgba(255,31,143,.2)}

.nav button{color:var(--muted);border:1px solid transparent}
.nav button:hover{background:var(--surface-2);color:var(--ink)}
.nav button.active{background:var(--accent-soft);color:var(--accent);border-color:rgba(255,31,143,.16);box-shadow:inset 3px 0 0 var(--accent-strong)}
.sidebar .foot{color:var(--muted)}
.page-head h1{color:var(--ink)}.page-head h1::after{content:'';display:block;width:42px;height:3px;border-radius:999px;background:var(--accent-strong);margin-top:8px}.page-head p{color:var(--muted)}

.card,.row-card,.crm-client,.crm-detail,.modal-card{background:var(--card);border-color:var(--line);box-shadow:0 8px 28px rgba(0,0,0,.035)}
.card{box-shadow:var(--shadow)}
.field label,.service .mini-field label{color:var(--muted)}
input,textarea,select{background:var(--field);border-color:var(--field-line);color:var(--ink)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:.72}
input:focus,textarea:focus,select:focus{border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
select option{background:var(--card);color:var(--ink)}
.btn,.remove,.modal-close{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
.btn:hover,.remove:hover{border-color:var(--accent-line);color:var(--accent)}
.btn.dark,.btn.accent,.review-btn{background:var(--accent-strong);border-color:var(--accent-strong);color:#19000d;box-shadow:0 8px 22px rgba(255,31,143,.18)}
.btn.dark:hover,.btn.accent:hover,.review-btn:hover{filter:brightness(1.06);color:#19000d;transform:translateY(-1px)}

.quote-step{background:var(--surface-2);border-color:var(--line);color:var(--muted)}
.quote-step i{background:var(--surface-3);color:var(--ink)}
.quote-step:first-child{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent)}
.quote-step:first-child i{background:var(--accent-strong);color:#19000d}
.quote-more{background:var(--surface-2);border-color:var(--line)}
.quote-more summary{color:var(--ink)}.quote-more summary::after{color:var(--accent)}.quote-more-body{border-color:var(--line)}
.totalbar,.stat{background:var(--surface-2);border-color:var(--line)}
.totalbar b{color:var(--accent)}
.preset-limit{background:var(--accent-soft);border-color:rgba(255,31,143,.2);color:var(--accent)}
.pill{background:var(--surface-3);color:var(--muted)}
.pill.paid{background:rgba(32,211,138,.12);color:var(--green)}
.crm-client.active{border-color:var(--accent-line);box-shadow:0 0 0 1px var(--accent-line) inset;background:var(--accent-soft)}
.crm-head,.crm-stats,.modal-head{border-color:var(--line)}
.demo-info{background:var(--accent-soft);border-color:rgba(255,31,143,.2);color:var(--ink)}

.preview-card{scrollbar-color:var(--surface-3) transparent}
.document{box-shadow:0 20px 60px rgba(0,0,0,.2)}
:root[data-theme="dark"] .preview-card.card{background:#0d0d10}
:root[data-theme="dark"] .document:not(.midnight){background:#fdfcfd;color:#201c20;border-color:#dcd6dc}
:root[data-theme="dark"] .document:not(.midnight) .doc-muted{color:#7d747b}
:root[data-theme="dark"] .document:not(.midnight) .doc-row{border-bottom-color:#ece7eb}
.document.clean{border-top-color:var(--accent-strong)}
.document.midnight{background:#151318;border-color:#332b34}
.ai-box{background:linear-gradient(145deg,#111014,#21151d);border-color:#3b2633;box-shadow:0 20px 50px rgba(0,0,0,.2)}
.ai-badge,.ai-row .primary{background:var(--accent-strong);border-color:var(--accent-strong);color:#19000d}

.mobile-bottom-nav{background:var(--topbar)!important;border-color:var(--line)!important}
.mobile-bottom-nav button{color:var(--muted)!important}
.mobile-bottom-nav button.active,.mobile-bottom-nav button[data-mobile-page="quote"].active{background:var(--accent-soft)!important;color:var(--accent)!important;box-shadow:inset 0 0 0 1px rgba(255,31,143,.15)}
.doti-support-trigger{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
.doti-support-trigger:hover{background:var(--accent-soft);border-color:var(--accent-line)}
.doti-support-trigger .dot,.doti-support-fab i{background:var(--accent-strong);box-shadow:0 0 0 4px rgba(255,31,143,.1)}
.doti-support-fab{background:var(--accent-strong);color:#19000d}
.doti-support-overlay{background:rgba(4,3,5,.72)}
.doti-support-panel,.doti-support-body,.doti-suggestions{background:var(--bg);border-color:var(--line)}
.doti-support-head,.doti-support-compose{background:var(--surface-1);border-color:var(--line)}
.doti-support-close,.doti-action,.doti-suggestions button{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
.doti-msg.bot .doti-bubble{background:var(--surface-1);border-color:var(--line);color:var(--ink)}
.doti-msg.user .doti-bubble,.doti-action.primary,.doti-send{background:var(--accent-strong);border-color:var(--accent-strong);color:#19000d}
.doti-compose-row textarea{background:var(--field);border-color:var(--field-line);color:var(--ink)}
.doti-status{background:var(--surface-3);color:var(--muted)}

@media(max-width:620px){
  .theme-toggle{width:36px;height:36px;border-radius:11px;font-size:16px}
  .service{background:var(--surface-2);border-color:var(--line)}
  .top-actions{gap:5px!important}
}
@media(prefers-reduced-motion:reduce){body,.btn{transition:none!important}.btn:hover{transform:none!important}}
@media print{.theme-toggle{display:none!important}}
