/* =====================================================================
   DamriNet License Platform - theme layer (loaded AFTER style.css)
   light / dark palettes + command palette + toasts.
   Additive on purpose: style.css stays untouched.
   ===================================================================== */
:root{color-scheme:dark}

:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f5fa;        --bg2:#ffffff;
  --panel:#ffffff;     --panel2:#f6f8fc;
  --raise:#eef1f7;
  --line:#e2e7f0;      --line2:#cbd3e1;
  --txt:#121826;       --txt2:#4a5670;     --txt3:#7f8ba3;
  --accent:#0a9d6c;    --accent-dim:#087a55;  --accent-deep:#d6f5e9;
  --blue:#2563d9;      --amber:#b8770a;    --red:#d43a55;
  --violet:#6d4fe0;
  --shadow-sm:0 1px 2px rgba(18,24,38,.06);
  --shadow:0 6px 20px -6px rgba(18,24,38,.16), 0 2px 6px -2px rgba(18,24,38,.08);
  --shadow-lg:0 22px 50px -14px rgba(18,24,38,.24), 0 6px 14px -6px rgba(18,24,38,.1);
  --ring:0 0 0 3px rgba(10,157,108,.18);
}
:root[data-theme="light"] body{
  background-image:
    radial-gradient(900px 500px at 100% -5%, rgba(10,157,108,.07), transparent 60%),
    radial-gradient(700px 600px at -5% 100%, rgba(37,99,217,.05), transparent 55%);
}
:root[data-theme="light"] .topbar{background:rgba(255,255,255,.82)}
:root[data-theme="light"] .brand-mark,
:root[data-theme="light"] .btn-primary,
:root[data-theme="light"] .side nav a.on .ico,
:root[data-theme="light"] .dz-ico{
  background:linear-gradient(140deg,#17c98c,#0a9d6c);color:#fff}
:root[data-theme="light"] .btn-primary{box-shadow:0 5px 14px -5px rgba(10,157,108,.55)}
:root[data-theme="light"] .side nav a.on{
  background:linear-gradient(100deg,rgba(10,157,108,.13),rgba(10,157,108,.03))}
:root[data-theme="light"] .side nav a.on .nav-badge{background:#fff;color:var(--accent)}
:root[data-theme="light"] .stat,
:root[data-theme="light"] .prod-card,
:root[data-theme="light"] .health-card{
  background:linear-gradient(155deg,#fff,var(--panel2));box-shadow:var(--shadow-sm)}
:root[data-theme="light"] .keybox,
:root[data-theme="light"] .keybox-pro{background:linear-gradient(140deg,var(--panel2),#fff)}
:root[data-theme="light"] .auth-body{
  background-image:
    radial-gradient(800px 500px at 50% -10%,rgba(10,157,108,.12),transparent 60%),
    radial-gradient(600px 500px at 100% 110%,rgba(37,99,217,.07),transparent 55%)}
:root[data-theme="light"] ::selection{background:rgba(10,157,108,.22);color:var(--txt)}
:root[data-theme="light"] .tier-enterprise{color:#9a6200}
:root[data-theme="light"] thead th{background:var(--panel2)}

/* smooth switch, only while toggling */
html.theme-anim,html.theme-anim *{transition:background-color .25s ease,border-color .25s ease,color .2s ease !important}

/* topbar tools ------------------------------------------------------- */
.tb-btn{
  display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;
  background:var(--panel);border:1px solid var(--line2);border-radius:20px;
  color:var(--txt2);font:600 12.5px var(--font);cursor:pointer;transition:all .15s;
}
.tb-btn:hover{color:var(--txt);border-color:var(--txt3)}
.tb-btn:focus-visible{outline:none;box-shadow:var(--ring);border-color:var(--accent)}
.tb-btn kbd,.cp-foot kbd{
  font:600 10.5px var(--mono);background:var(--bg);border:1px solid var(--line2);
  border-radius:5px;padding:1px 6px;color:var(--txt3);direction:ltr}
.tb-icon{width:34px;padding:0;justify-content:center}
.tb-icon svg{width:16px;height:16px}
.ico-sun{display:none}
:root[data-theme="light"] .ico-sun{display:block}
:root[data-theme="light"] .ico-moon{display:none}
.auth-theme{position:fixed;top:16px;inset-inline-start:16px;z-index:5}
@media(max-width:880px){.tb-search span,.tb-search kbd{display:none}.tb-search{width:34px;padding:0;justify-content:center}}

/* command palette ---------------------------------------------------- */
.cp-back{
  position:fixed;inset:0;z-index:100;background:rgba(6,9,16,.55);
  backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:flex-start;
  padding:12vh 16px 0;animation:cpIn .14s ease both}
:root[data-theme="light"] .cp-back{background:rgba(18,24,38,.28)}
@keyframes cpIn{from{opacity:0}to{opacity:1}}
.cp{
  width:100%;max-width:600px;background:var(--panel);border:1px solid var(--line2);
  border-radius:16px;box-shadow:var(--shadow-lg);overflow:hidden}
.cp input{
  border:none;border-bottom:1px solid var(--line);border-radius:0;background:transparent;
  padding:17px 20px;font-size:15.5px}
.cp input:focus{box-shadow:none;background:transparent;border-color:var(--line)}
.cp-list{max-height:52vh;overflow-y:auto;padding:8px}
.cp-group{font-size:10.5px;font-weight:700;color:var(--txt3);letter-spacing:.5px;padding:10px 12px 5px}
.cp-item{
  display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:9px;
  cursor:pointer;color:var(--txt)}
.cp-item.on{background:var(--panel2);box-shadow:inset 0 0 0 1px var(--line2)}
.cp-item .ci{
  width:28px;height:28px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;background:var(--raise);color:var(--txt2);font-size:13px}
.cp-item.on .ci{background:var(--accent);color:#fff}
.cp-item b{font-weight:700;font-size:13.5px;display:block}
.cp-item small{font-size:11.5px;color:var(--txt3);display:block}
.cp-item .ltr{direction:ltr;unicode-bidi:embed;font-family:var(--mono)}
.cp-empty{padding:26px;text-align:center;color:var(--txt3);font-size:13px}
.cp-foot{
  display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--line);
  font-size:11px;color:var(--txt3);background:var(--panel2)}

/* toast + small affordances ------------------------------------------ */
.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:120;
  background:var(--txt);color:var(--bg);padding:9px 18px;border-radius:22px;
  font-size:12.5px;font-weight:700;box-shadow:var(--shadow-lg);animation:cpIn .15s ease both}
.copyable{cursor:copy;border-radius:5px;transition:background .15s}
.copyable:hover{background:rgba(31,213,151,.14)}
time.lt{white-space:nowrap}
.flash{transition:opacity .4s ease,transform .4s ease}
.flash.gone{opacity:0;transform:translateY(-6px)}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

/* dialogs (dnConfirm / dnAlert) — replace the browser's confirm()/alert() --- */
html.dlg-lock{overflow:hidden}
.dlg-back{
  position:fixed;inset:0;z-index:150;background:rgba(6,9,16,.6);backdrop-filter:blur(5px);
  display:flex;align-items:center;justify-content:center;padding:16px;animation:cpIn .14s ease both}
:root[data-theme="light"] .dlg-back{background:rgba(18,24,38,.32)}
.dlg-back.out{opacity:0;transition:opacity .12s ease}
.dlg{
  width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line2);
  border-radius:16px;box-shadow:var(--shadow-lg);overflow:hidden;animation:dlgIn .18s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes dlgIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.dlg-top{display:flex;gap:14px;align-items:flex-start;padding:22px 22px 18px}
.dlg-ico{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font:800 18px var(--font);color:var(--accent);background:rgba(31,213,151,.12);
  box-shadow:inset 0 0 0 1px rgba(31,213,151,.28)}
.dlg-danger .dlg-ico{color:var(--red);background:rgba(242,93,116,.12);box-shadow:inset 0 0 0 1px rgba(242,93,116,.3)}
.dlg-body{flex:1;min-width:0}
.dlg-t{margin:0;font-size:16px;font-weight:800;color:var(--txt);line-height:1.4}
.dlg-m{margin:6px 0 0;font-size:13.5px;line-height:1.75;color:var(--txt2);white-space:pre-line;overflow-wrap:anywhere}
.dlg-foot{
  display:flex;gap:10px;justify-content:flex-start;padding:13px 22px;
  background:var(--panel2);border-top:1px solid var(--line)}
.dlg-foot .btn{min-width:96px;justify-content:center}
.dlg-foot .btn:focus-visible{outline:none;box-shadow:var(--ring)}
@media(max-width:480px){.dlg-foot{flex-direction:column}.dlg-foot .btn{width:100%}}