/* ═══════════════════════════════════════════════════════════════════════
   Stomatologiya CRM — brand-ui.css ustiga qo'shimcha qatlam.
   brand-ui.css ga TEGILMAYDI (skilldan yangilanishi mumkin).
   Hamma rang token orqali: tish holatlari ma'noli status ranglari hisoblanadi.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --t-soglom:var(--line-2);
  --t-kariyes:#dc2626;  --t-plomba:#2563eb;   --t-kanal:#7c3aed;
  --t-korona:#d97706;   --t-implant:#0e7c7b;  --t-protez:#15803d;
  --t-ortodont:#db2777; --t-periodont:#92400e;--t-yoq:#9ca3af;
}
:root[data-theme=dark]{
  --t-soglom:var(--line-2);
  --t-kariyes:#f87171;  --t-plomba:#7aa2ff;   --t-kanal:#a78bfa;
  --t-korona:#fbbf24;   --t-implant:#2dd4bf;  --t-protez:#4ade80;
  --t-ortodont:#f472b6; --t-periodont:#d6a06a;--t-yoq:#6b7280;
}
/* brand-ui da yo'q ustun ranglari */
.k-brand{--k:var(--accent)}.k-pink{--k:var(--pink)}

/* ── Kirish sahifasi (alohida sahifa, modal emas) ── */
body.login-page{background:var(--side-bg);min-height:100dvh;overflow:hidden}
body.login-page .ov{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
body.login-page .modal{max-width:430px}
.demo-box{margin-top:4px;border-top:1px dashed var(--line-2);padding-top:13px}
.demo-box>.hint{display:block;margin-bottom:9px;text-align:center}
.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.demo-grid .btn{justify-content:flex-start;font-size:12.5px;padding:8px 10px}
.demo-grid .btn .em{width:20px;height:20px;flex:0 0 auto}

/* ── Tish formulasi ── */
.tchart{background:var(--sunken);border:1px solid var(--line);border-radius:16px;padding:14px 10px 10px;overflow-x:auto}
.tjaw{display:flex;justify-content:center;gap:16px;min-width:max-content}
.tjaw+.tjaw{margin-top:6px;padding-top:12px;border-top:1px dashed var(--line-2)}
.tquad{display:flex;gap:3px}
.tooth{--c:var(--t-soglom);position:relative;width:38px;padding:3px 0 2px;border:none;background:none;cursor:pointer;
  border-radius:9px;transition:transform .18s var(--spring),background .18s}
.tooth:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.tooth.sel{background:color-mix(in srgb,var(--accent) 16%,transparent);box-shadow:0 0 0 2px var(--accent) inset}
.tooth svg{display:block;width:30px;height:34px;margin:0 auto}
.tooth svg path{fill:color-mix(in srgb,var(--c) 40%,var(--surface));stroke:var(--c);stroke-width:1.7}
.tooth[data-state=soglom] svg path{fill:var(--surface);stroke:var(--ink-3);stroke-width:1.5}
.tooth[data-state=yoq] svg path{fill:transparent;stroke:var(--t-yoq);stroke-dasharray:3 2.5}
.tooth .xx{stroke:var(--t-yoq);stroke-width:2;stroke-linecap:round}
.tooth b{display:block;font-size:10.5px;font-weight:800;color:var(--ink-3);font-variant-numeric:tabular-nums;line-height:1.5}
.tooth[data-state]:not([data-state=soglom]) b{color:var(--c)}
.tooth .nt{position:absolute;top:1px;right:3px;width:6px;height:6px;border-radius:50%;background:var(--warn)}
.tlegend{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tlegend .pill{cursor:default}
.tsum{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 0;font-size:12.5px;font-weight:700;color:var(--ink-2)}
.tsum span b{color:var(--ink);font-variant-numeric:tabular-nums}

/* ── Kunlik jadval (registratura) ── */
.sched{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}
.sched table{border-collapse:separate;border-spacing:0;width:100%;min-width:640px}
.sched th,.sched td{border-bottom:1px solid var(--line);padding:0}
.sched thead th{position:sticky;top:0;z-index:3;background:var(--surface-2);padding:11px 10px;font-size:12px;
  font-weight:800;color:var(--ink-2);text-align:left;border-bottom:1px solid var(--line-2)}
.sched thead th small{display:block;font-weight:700;color:var(--ink-3);font-size:11px}
.sched .th-time{width:62px;min-width:62px;text-align:center}
.sched td.tm{text-align:center;font-size:12px;font-weight:800;color:var(--ink-3);background:var(--surface-2);
  font-variant-numeric:tabular-nums;vertical-align:top;padding-top:9px;position:sticky;left:0;z-index:2}
.sched td.sl{vertical-align:top;padding:3px;min-width:140px;cursor:pointer;transition:background .15s}
.sched td.sl:hover{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.sched td.sl.past{background:var(--sunken)}
.appt{display:block;width:100%;text-align:left;border:1px solid color-mix(in srgb,var(--k,var(--info)) 34%,transparent);
  background:color-mix(in srgb,var(--k,var(--info)) 12%,var(--surface));border-left:3px solid var(--k,var(--info));border-radius:9px;
  padding:6px 8px;cursor:pointer;transition:transform .16s var(--spring),box-shadow .16s;animation:fadeUp .4s var(--ease) backwards}
.appt:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.appt .nm{display:block;font-size:12.5px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appt .rs{display:block;font-size:11px;font-weight:700;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appt .al{color:var(--bad)}
.slot-add{display:none;width:100%;border:1px dashed var(--line-2);background:none;border-radius:9px;padding:5px;
  color:var(--ink-3);font-weight:800;font-size:12px;cursor:pointer}
.sched td.sl:hover .slot-add{display:block}
.sched td.sl.past:hover .slot-add{display:none}

/* ── Navbat kartalari (doktor / mobil) ── */
.qlist{display:grid;gap:9px}
.qcard{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--k,var(--info));border-radius:14px;
  padding:11px 13px;box-shadow:var(--shadow);animation:fadeUp .45s var(--ease) backwards;animation-delay:calc(var(--i)*45ms)}
.qcard .qt{font-size:15px;font-weight:900;color:var(--k,var(--info));font-variant-numeric:tabular-nums;text-align:center}
.qcard .qt small{display:block;font-size:10.5px;font-weight:800;color:var(--ink-3)}
.qcard .qn{font-size:14.5px;font-weight:800}
.qcard .qs{font-size:12px;font-weight:700;color:var(--ink-3);margin-top:1px}
.qcard .qa{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:640px){.qcard{grid-template-columns:52px 1fr;gap:9px}.qcard .qa{grid-column:1/-1;justify-content:flex-start}}

/* ── Bemor kartasi ── */
.pcard-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 14px}
.pcard-tabs button{border:1px solid var(--line);background:var(--surface);border-radius:11px;padding:8px 13px;
  font:inherit;font-size:13px;font-weight:800;color:var(--ink-2);cursor:pointer;display:flex;align-items:center;gap:7px;
  transition:all .18s var(--ease)}
.pcard-tabs button .em{width:19px;height:19px}
.pcard-tabs button:hover{border-color:var(--line-2);transform:translateY(-1px)}
.pcard-tabs button.on{background:var(--accent);border-color:var(--accent);color:var(--on-brand)}
.warnbox{display:flex;gap:10px;align-items:center;background:color-mix(in srgb,var(--bad) 10%,var(--surface));
  border:1px solid color-mix(in srgb,var(--bad) 30%,transparent);border-radius:13px;padding:10px 14px;
  font-size:13px;font-weight:800;color:var(--bad)}
.warnbox .em{width:24px;height:24px;flex:0 0 auto}
.tline{position:relative;padding-left:26px}
.tline::before{content:'';position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tline-i{position:relative;padding:0 0 16px}
.tline-i::before{content:'';position:absolute;left:-23px;top:5px;width:11px;height:11px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 3px var(--surface)}
.tline-i .d{font-size:12px;font-weight:800;color:var(--ink-3)}
.tline-i .dg{font-size:13.5px;font-weight:800;margin:1px 0 2px}
.tline-i .tr{font-size:13px;color:var(--ink-2);line-height:1.5}

/* ── Chek (bosib chiqarish) ── */
.rcpt{font-family:var(--font);color:#000;background:#fff;padding:18px 16px;max-width:320px;margin:0 auto;font-size:13px}
.rcpt h3{margin:0 0 2px;font-size:16px;text-align:center}
.rcpt .c{text-align:center;font-size:11px;color:#444}
.rcpt hr{border:none;border-top:1px dashed #999;margin:10px 0}
.rcpt table{width:100%;border-collapse:collapse;font-size:12px}
.rcpt td{padding:3px 0;vertical-align:top}
.rcpt .r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.rcpt .tot{font-weight:900;font-size:14px}
@media print{
  body>*:not(#print-area){display:none!important}
  #print-area{display:block!important;position:static}
  .rcpt{max-width:none}
}
#print-area{display:none}

/* Panel tanasi ichida oddiy matn bo'lsa (.lead emas) — ichki bo'shliq kerak */
.panel .p-b.pad{padding:14px 18px 16px;display:flex;flex-direction:column;gap:11px}
.panel .p-b.pad .row2{margin:0}

/* Asboblar panelidagi ro'yxat telefonda qisilib qolmasin */
.toolbar select{flex:0 1 auto;min-width:160px}
@media (max-width:640px){.toolbar select{flex:1 1 140px;min-width:120px}}

/* ── Kichik yordamchilar ── */
.mini{font-size:12px;font-weight:700;color:var(--ink-3)}
.money-b{font-variant-numeric:tabular-nums;font-weight:900}
.pos{color:var(--ok)}.neg{color:var(--bad)}
.rowend{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.svc-pick{max-height:min(46vh,340px);overflow:auto;border:1px solid var(--line);border-radius:12px}
.svc-pick .sv{display:flex;align-items:center;gap:10px;padding:8px 11px;border-bottom:1px solid var(--line);cursor:pointer}
.svc-pick .sv:last-child{border-bottom:none}
.svc-pick .sv:hover{background:var(--surface-2)}
.svc-pick .sv .n{flex:1;font-size:13px;font-weight:700}
.svc-pick .sv .p{font-size:12.5px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--accent)}
.svc-pick .cat{padding:6px 11px;background:var(--sunken);font-size:11px;font-weight:900;text-transform:uppercase;
  letter-spacing:.04em;color:var(--ink-3);position:sticky;top:0}
.cart{display:grid;gap:7px}
.cart-i{display:grid;grid-template-columns:1fr 54px 52px 104px 30px;gap:6px;align-items:center}
@media (max-width:520px){.cart-i{grid-template-columns:1fr 46px 44px 88px 28px;gap:4px}}
.cart-i .n{font-size:12.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.cart-i input{padding:7px 9px;font-size:12.5px}
.cart-sum{display:flex;justify-content:space-between;border-top:1px dashed var(--line-2);padding-top:9px;
  font-size:14px;font-weight:900}
.x[hidden]{display:none}

/* ── Xabar (toast) ── */
.toasts{position:fixed;right:16px;bottom:16px;z-index:90;display:grid;gap:8px;max-width:min(360px,90vw)}
.toasts .msg{box-shadow:var(--shadow-lg)}
@media (max-width:640px){.toasts{left:16px;right:16px;max-width:none}}

/* .lead k-* klassi berilmasa nuqta ko'rinmay qolmasin (k-* ni bosib qolmasligi uchun :not) */
.lead:not([class*="k-"]){--k:var(--accent)}

/* Uzun modalda sarlavha va tugmalar doim ko'rinib tursin */
.modal-h{position:sticky;top:0;z-index:3;background:var(--surface)}
.modal-f{position:sticky;bottom:0;z-index:3;background:var(--surface)}
