/* Onten Desk — ინტერფეისის სტილები */
:root{
  --paper:#EFF2F6; --surface:#FFFFFF; --surface-2:#E7ECF3; --surface-3:#F4F7FA;
  --line:#D2DAE5; --line-soft:#E3E9F1;
  --ink:#0F1723; --ink-2:#3E4A5C; --ink-3:#6C788A;
  --accent:#1B50A2; --accent-2:#16428A; --accent-soft:#DEE8F7; --on-accent:#FFFFFF;
  --ok:#2B7A55; --ok-soft:#DDEEE5;
  --warn:#A76F13; --warn-soft:#F6EAD4;
  --crit:#AF3A32; --crit-soft:#F7E1DF;
  --shadow:0 1px 2px rgba(15,23,35,.06),0 8px 24px rgba(15,23,35,.07);
  /*  ქვედა ზოლი — ონტენის ფერი.  ჩანართი თეთრია, წარწერა ლურჯი. */
  --bar:#1B50A2; --bar-line:#16428A; --bar-ink:#CFE0F7;
  --task-bg:rgba(255,255,255,.88); --task-ink:#16428A;
  --task-on-bg:#FFFFFF; --task-on-ink:#123B7D;
  --r:10px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    /*  ფონი განზრახ არ არის შავი — ღია ნაცრისფერ-ლურჯზე თვალი
        ნაკლებად იღლება და ტექსტის კიდეები არ ბუნდოვანდება.
        ლინკები აშკარად ღია ლურჯია, რომ მუქ ფონზე კარგად იკითხებოდეს. */
    --paper:#202A38; --surface:#2A3543; --surface-2:#354150; --surface-3:#26313F;
    --line:#414E5E; --line-soft:#36424F;
    --ink:#F2F6FB; --ink-2:#C9D4E2; --ink-3:#A3B0C1;
    --accent:#9CC6FB; --accent-2:#B8D7FD; --accent-soft:#2C4059; --on-accent:#0A182B;
    --ok:#6ED2A2; --ok-soft:#1E3B32;
    --warn:#F3C66F; --warn-soft:#3B311C;
    --crit:#F59289; --crit-soft:#402724;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.45);
    --bar:#1D3A68; --bar-line:#2A4E86; --bar-ink:#CFE0F7;
    --task-bg:rgba(255,255,255,.90); --task-ink:#16428A;
    --task-on-bg:#FFFFFF; --task-on-ink:#123B7D;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#202A38; --surface:#2A3543; --surface-2:#354150; --surface-3:#26313F;
  --line:#414E5E; --line-soft:#36424F;
  --ink:#F2F6FB; --ink-2:#C9D4E2; --ink-3:#A3B0C1;
  --accent:#9CC6FB; --accent-2:#B8D7FD; --accent-soft:#2C4059; --on-accent:#0A182B;
  --ok:#6ED2A2; --ok-soft:#1E3B32;
  --warn:#F3C66F; --warn-soft:#3B311C;
  --crit:#F59289; --crit-soft:#402724;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.45);
  --bar:#1D3A68; --bar-line:#2A4E86; --bar-ink:#CFE0F7;
  --task-bg:rgba(255,255,255,.90); --task-ink:#16428A;
  --task-on-bg:#FFFFFF; --task-on-ink:#123B7D;
  color-scheme:dark;
}

.wordmark{height:22px;width:auto;display:block;flex:none}
.wordmark.sm{height:16px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .wordmark{filter:brightness(1.95) saturate(1.05)}}
:root[data-theme="dark"] .wordmark{filter:brightness(1.95) saturate(1.05)}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--paper);color:var(--ink);
  font-family:"Noto Sans Georgian","Noto Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
img{max-width:100%}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
button{font-family:inherit;font-size:inherit;cursor:pointer}
h1,h2,h3{margin:0;text-wrap:balance}
a{color:var(--accent)}
[hidden]{display:none!important}

/* ── ლოგინი ── */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--paper)}
.login{
  width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);padding:28px;display:flex;flex-direction:column;gap:16px;
}
.login .brand{display:flex;align-items:center;gap:11px;margin-bottom:2px}
.login h1{font-size:19px;font-weight:600}
.login .sub{font-size:13px;color:var(--ink-3)}

/* ── shell ── */
.app{display:grid;grid-template-columns:208px minmax(0,1fr);min-height:100vh}

/* ── მენიუ არ იკეცება ──

   დაკეცვა მთლიანად მოიხსნა: ღილაკი, უჯრა და ჩანაწერიც.  გვერდითი
   ზოლი ყოველთვის ადგილზეა — ყველა ეკრანზე, სალაროს ჩათვლით.
   სალაროზე ის მხოლოდ ვიწროვდება, რომ 1024×768-ზე ჩეკს ადგილი
   დარჩეს. */
.app:has(.view.posview){grid-template-columns:176px minmax(0,1fr)}
@media (max-width:1200px){
  .app:has(.view.posview){grid-template-columns:156px minmax(0,1fr)}
}

/* ჰორიზონტალური ზოლი მხოლოდ ცხრილს უნდა ჰქონდეს, გვერდს — არასდროს */
html,body{max-width:100%;overflow-x:clip}
aside{
  background:var(--surface);border-right:1px solid var(--line);
  display:flex;flex-direction:column;gap:2px;padding:16px 12px 14px;position:sticky;top:0;height:100vh;
  /*  მენიუ გაიზარდა — ახლა ის გადაადგილდება, გვერდი კი არა.
      ბოლო ღილაკი ყოველთვის მისაწვდომი უნდა იყოს, თუნდაც
      პატარა ეკრანზე. */
  overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;
}
aside>.brand,aside>.nav,aside>.grp,aside>.navfoot,aside>.grps{flex:none}
aside::-webkit-scrollbar{width:6px}
aside::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.brand{display:flex;align-items:center;gap:10px;padding:2px 10px 12px}
/*  რომელ განყოფილებაში ვართ — გვერდითა სია ახლა მხოლოდ ერთს აჩვენებს,
    ამიტომ სათაური საჭიროა, თორემ ორიენტაცია იკარგება. */
/*  მოდულის სათაური გვერდით სვეტში — ბალანსივით: პატარა წარწერა
    „მოდული" და ქვემოთ სახელი.  ასე ორიენტაცია ერთი გადახედვით
    მოდის და არა ზედა ზოლის კითხვით. */
.navsec{
  font-size:15px;font-weight:600;color:var(--ink);
  padding:0 10px 10px;margin-bottom:6px;border-bottom:1px solid var(--line-soft);
}
.navsec::before{
  content:"მოდული";display:block;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;font-weight:400;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
  margin-bottom:3px;
}
.logo{
  width:30px;height:30px;border-radius:8px;background:var(--accent);color:var(--on-accent);
  display:grid;place-items:center;font-weight:700;font-size:14px;flex:none;
}
.brand b{font-size:15px;font-weight:600;display:block;line-height:1.2}
.brand span{font-size:11px;color:var(--ink-3);font-family:"JetBrains Mono",monospace}
.navlabel{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:12px 10px 4px;font-family:"JetBrains Mono",monospace}
/*  მენიუს პუნქტი ღილაკს არ ჰგავს: ჩარჩო და ფონი მას ცალკე
    ობიექტად აქცევდა და სია ოცდაათ ყუთად იშლებოდა.  მიმდინარე
    პუნქტს ვიწრო ზოლი აქვს მარცხნივ — თვალი მას უფრო სწრაფად
    პოულობს, ვიდრე ლურჯ ლაქას. */
.nav{
  display:flex;align-items:center;gap:7px;padding:0 9px 0 0;min-height:32px;
  border-radius:8px;border:0;background:none;color:var(--ink-2);width:100%;
  text-align:left;font-weight:500;font-size:12px;line-height:1.3;position:relative;
}
.nav::before{
  content:"";flex:none;width:3px;align-self:stretch;margin:6px 7px 6px 7px;
  border-radius:2px;background:transparent;
}
/*  სახელი ერთ ზოლზე: გრძელი წერტილებით იჭრება, სრული კი
    მინიშნებაში ჩანს.  ორ სტრიქონად გადატანილი სია უწესრიგოდ
    გამოიყურებოდა. */
.nav .lb,.modhead .lb,.secbar.subbar .grp .lb,.accrail-s .lb{
  flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nav:hover{background:var(--surface-2);color:var(--ink)}
.nav[aria-current="true"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nav[aria-current="true"]::before{background:var(--accent)}
.nav .ct{margin-left:auto;font-size:11.5px;font-family:"JetBrains Mono",monospace;color:var(--ink-3)}
/*  გარე სისტემები — სხვა სერვერებზე მდგარი პროგრამები.
    მენიუს დანარჩენი ნაწილისგან თხელი ხაზით გამოიყოფა: ეს ღილაკები
    პორტალიდან გაგვიყვანს და ეს წინასწარ უნდა ჩანდეს. */
#extWrap{margin-top:10px;padding-top:10px;border-top:1px solid var(--line-soft)}
#extList{display:flex;flex-direction:column;gap:6px}
/*  ეს ბმულები პორტალიდან გაგვიყვანს — გამორჩევა მათ სჭირდებათ,
    ჩარჩო კი არა: ჩარჩოიანი ღილაკები ხის გვერდით ცალკე ყუთებად
    იშლებოდა.  ახლა იმავე ხის პუნქტებია, ოღონდ ოდნავ მკვეთრი. */
#extList .nav{
  border:0;background:none;font-weight:500;
}
#extList .nav:hover{
  background:var(--surface-2);color:var(--ink);
}
#extList .nav:active{transform:translateY(1px)}
#extList .nav span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:820px){
  /*  ვიწრო ეკრანზე მენიუ ჰორიზონტალური ზოლია — ჩარჩო და გამყოფი
      ხაზი აქ ზედმეტია, ღილაკები უბრალოდ ზოლში ჩადგება. */
  #extWrap{margin-top:0;padding-top:0;border-top:0;display:flex;align-items:center;gap:6px;flex:none}
  #extList{flex-direction:row;gap:6px}
}
/*  თემის გადამრთველი — ავტომატური / ღია / მუქი.
    ლეპტოპზე სისტემა ხშირად მუქზეა, გვერდი კი დღისით ღია უნდა
    იყოს — ეს ღილაკი სწორედ ამას აგვარებს, სისტემის შეცვლის გარეშე. */
.themebtn{
  display:inline-flex;align-items:center;gap:6px;flex:none;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);
  border-radius:9px;padding:6px 10px;font:inherit;font-size:13px;font-weight:500;
  cursor:pointer;white-space:nowrap;
}
.themebtn:hover{background:var(--surface-2);color:var(--ink)}
.themebtn:focus-visible{outline:2px solid var(--accent,var(--brand));outline-offset:2px}
@media (max-width:560px){.themebtn .thlbl{display:none}.themebtn{padding:6px 8px}}
.navfoot{margin-top:auto;border-top:1px solid var(--line-soft);padding-top:12px;display:flex;flex-direction:column;gap:8px}
.who{font-size:12px;color:var(--ink-3);padding:0 10px;line-height:1.4}

main{min-width:0;display:flex;flex-direction:column}
/*  სათაური და განყოფილებების ზოლი ერთად ეკვრის ზემოთ —
    ცალ-ცალკე რომ ყოფილიყო, ერთმანეთს გადააფარებდნენ. */
.stickyhead{position:sticky;top:0;z-index:5;background:var(--surface)}
.topbar{
  display:flex;align-items:center;gap:14px;padding:14px 24px;border-bottom:1px solid var(--line);
  background:var(--surface);flex-wrap:wrap;
}
.topbar h1{font-size:18px;font-weight:600}
.topbar .sub{font-size:12.5px;color:var(--ink-3)}
.spacer{margin-left:auto}
.view{padding:22px 24px 80px;display:flex;flex-direction:column;gap:18px}

/* ── primitives ── */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.card-h{padding:14px 18px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.card-h h2{font-size:14.5px;font-weight:600}
.card-h .hint{font-size:12px;color:var(--ink-3);margin-left:auto}
.btn{
  border:1px solid var(--line);background:var(--surface);color:var(--ink);
  padding:7px 13px;border-radius:8px;font-weight:500;display:inline-flex;align-items:center;gap:7px;
}
.btn:hover{background:var(--surface-2)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.pri:hover{background:var(--accent-2);border-color:var(--accent-2)}
.btn.sm{padding:5px 10px;font-size:13px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn:focus-visible,.nav:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input,textarea,select{
  font-family:inherit;font-size:14px;background:var(--surface);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:8px 11px;width:100%;
}
/*  მონიშვნის უჯრა ტექსტური ველი არ არის — მას სიგანე არ ეკუთვნის.
    ზემოთ `input`-ს width:100% უწერია და უჯრა მთელ სტრიქონს იკავებდა,
    წარწერა კი გვერდით იჭყლიტებოდა. */
input[type="checkbox"],input[type="radio"]{
  width:15px;height:15px;min-width:15px;flex:0 0 auto;padding:0;
  accent-color:var(--accent);cursor:pointer;
}
label.f{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-3);font-weight:500}
.formgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}

.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:500;padding:3px 9px;border-radius:999px;border:1px solid;white-space:nowrap}
.pill .d{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.p-ok{color:var(--ok);background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 35%,transparent)}
.p-warn{color:var(--warn);background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 35%,transparent)}
.p-crit,.p-bad{color:var(--crit);background:var(--crit-soft);border-color:color-mix(in srgb,var(--crit) 40%,transparent)}

/*  დაგვიანებული ხაზი — შეკვეთების გრაფიკში.  ფერი ლაქად არ
    დევს: მხოლოდ ოდნავ შეფერილი ფონი და მარცხნივ ზოლი, რომ
    ცხრილის კითხვა არ გაუჭირდეს. */
tr.warnrow>td{background:color-mix(in srgb,var(--crit) 7%,transparent)}
tr.warnrow>td:first-child{box-shadow:inset 3px 0 0 var(--crit)}
.p-neu{color:var(--ink-3);background:var(--surface-2);border-color:var(--line)}
.p-acc{color:var(--accent);background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 32%,transparent)}

.tiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.tile .lab{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-family:"JetBrains Mono",monospace}
.tile .val{font-size:29px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.tile .note{font-size:12.5px;color:var(--ink-3)}
/*  ჟურნალის თავის ფილა — ფულის ციფრი ერთ ხაზზე უნდა იდგეს.
    ჩვეულებრივი 29px-ი „₾" და თანხას გადაწევდა ორ სტრიქონად. */
.tile.stat .val{font-size:22px;white-space:nowrap}
.tile.alert{border-color:color-mix(in srgb,var(--crit) 45%,transparent)}
.tile.alert .val{color:var(--crit)}

/* ── chart ── */
.chartbox{display:grid;grid-template-columns:34px 1fr;gap:8px;padding:18px}
.yax{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;font-size:11px;color:var(--ink-3);font-family:"JetBrains Mono",monospace;height:150px;padding-bottom:22px}
.plot{position:relative}
.gridlines{position:absolute;inset:0 0 22px 0;display:flex;flex-direction:column;justify-content:space-between}
.gridlines i{display:block;height:1px;background:var(--line-soft)}
.bars{position:relative;display:flex;align-items:flex-end;gap:2px;height:150px;padding-bottom:22px}
.barcol{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;position:relative}
.bar{width:100%;max-width:44px;background:var(--accent);border-radius:4px 4px 0 0;min-height:2px}
.barcol:hover .bar{background:var(--accent-2)}
.barcol .xl{position:absolute;bottom:0;font-size:11px;color:var(--ink-3);font-family:"JetBrains Mono",monospace}
.barcol .vl{font-size:11.5px;color:var(--ink-2);font-family:"JetBrains Mono",monospace;margin-bottom:3px;font-variant-numeric:tabular-nums}
.tip{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);font-size:12px;padding:4px 9px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:3}
.barcol:hover .tip{opacity:1}

/* ── tables ── */
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:620px}
th,td{text-align:left;padding:11px 18px;border-bottom:1px solid var(--line-soft);vertical-align:middle;
  overflow-wrap:break-word}
/* ვიწრო ეკრანზე ცხრილი ბუნებრივ სიგანეს ინარჩუნებს და თავად ცოცავს —
   სვეტების ჩაჭყლეტა სიტყვებს ასახიჩრებს, ჰორიზონტალური ცოცვა კი ჩვეულებრივია */
@media (max-width:900px){
  th,td{padding:9px 12px;font-size:13px}
  .tw{
    margin:0;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    /* კიდეზე ჩრდილი — ეტყობა, რომ გვერდით კიდევ არის */
    background:
      linear-gradient(90deg,var(--surface) 30%,transparent) left/24px 100% no-repeat,
      linear-gradient(-90deg,var(--surface) 30%,transparent) right/24px 100% no-repeat;
    background-attachment:local,local;
  }
  .tw::-webkit-scrollbar{height:5px}
  .tw::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
}
thead th{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-family:"JetBrains Mono",monospace;font-weight:500;background:var(--surface-3)}
tbody tr:last-child td{border-bottom:0}
tbody tr.click{cursor:pointer}
tbody tr.click:hover{background:var(--surface-3)}
td.num,th.num{font-variant-numeric:tabular-nums;font-family:"JetBrains Mono",monospace;font-size:13px}
.tid{font-family:"JetBrains Mono",monospace;font-size:12.5px;color:var(--ink-3)}
.subj{font-weight:500}
.meta{font-size:12px;color:var(--ink-3)}

.meter{width:96px;height:6px;background:var(--surface-2);border-radius:3px;overflow:hidden;display:inline-block;vertical-align:middle}
.meter i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.meter i.w{background:var(--warn)} .meter i.c{background:var(--crit)}

/* ── ticket detail ── */
.split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media (max-width:1000px){.split{grid-template-columns:1fr}}
.thread{display:flex;flex-direction:column}
.ev{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line-soft)}
.ev:last-child{border-bottom:0}
.av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:600;background:var(--surface-2);color:var(--ink-2)}
.av.tech{background:var(--accent-soft);color:var(--accent)}
.ev .eh{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:3px}
.ev .eh b{font-size:13.5px;font-weight:600}
.ev .eh time{font-size:11.5px;color:var(--ink-3);font-family:"JetBrains Mono",monospace}
.ev p{margin:0;font-size:14px;color:var(--ink-2);white-space:pre-wrap;word-break:break-word}
.ev.system p{font-size:13px;color:var(--ink-3);font-style:italic}
.side{display:flex;flex-direction:column;gap:12px}
.kv{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line-soft);font-size:13px}
.kv:last-child{border-bottom:0}
.kv span{color:var(--ink-3)}
.kv b{font-weight:500;text-align:right;word-break:break-word}
.replybox{padding:14px 18px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;background:var(--surface-3);border-radius:0 0 var(--r) var(--r)}
.replyrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

.invtot{display:flex;flex-direction:column;gap:6px;min-width:230px;margin-left:auto}
.invtot div{display:flex;justify-content:space-between;gap:20px;font-size:13.5px;color:var(--ink-2)}
.invtot div.sum{border-top:1px solid var(--line);padding-top:8px;margin-top:2px;font-size:17px;font-weight:600;color:var(--ink)}
.invhead{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px}

.empty{padding:34px 18px;text-align:center;color:var(--ink-3);font-size:13.5px}
.banner{background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:var(--r);padding:11px 16px;font-size:13px;display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.banner b{color:var(--accent);font-weight:600}
.err{background:var(--crit-soft);border:1px solid color-mix(in srgb,var(--crit) 40%,transparent);color:var(--crit);border-radius:8px;padding:9px 13px;font-size:13px}
.code{
  font-family:"JetBrains Mono",monospace;font-size:12.5px;background:var(--surface-3);
  border:1px solid var(--line);border-radius:8px;padding:11px 13px;overflow-x:auto;white-space:pre;color:var(--ink-2);
}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:9px;font-size:13.5px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:40}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* 1200-მდე გვერდითი სვეტი ვიწროვდება — ცხრილს მეტი ადგილი რჩება */
@media (max-width:1200px){
  .app{grid-template-columns:176px minmax(0,1fr)}
  aside{padding:14px 8px}
  .nav{padding:7px 9px;font-size:13.5px}
  .view{padding:18px 18px 72px}
  .topbar{padding:12px 18px}
}
@media (max-width:820px){
  .app{grid-template-columns:minmax(0,1fr)}
  /*  ვიწრო ეკრანზე გვერდითი ზოლი ჰორიზონტალურ ზოლად იქცევა და
      გვერდთან ერთად ცოცავს.  მიკრული რომ ყოფილიყო, ქვემოთ ჩამოსვლისას
      ზედა სათაურის ზოლს გადააფარებდა და განყოფილების ღილაკებს
      დააფარებდა — თითი ვერ მისწვდებოდა. */
  aside{
    position:static;height:auto;flex-direction:row;flex-wrap:nowrap;
    align-items:center;gap:6px;padding:10px 12px;overflow-x:auto;
    border-right:0;border-bottom:1px solid var(--line);scrollbar-width:thin;
  }
  aside::-webkit-scrollbar{height:4px}
  .brand{padding:0 6px 0 2px;flex:none}
  .brand span{display:none}
  .brand .wordmark{height:20px}
  .navlabel,.nav .ct{display:none}
  .navfoot{
    margin-top:0;margin-left:auto;border-top:0;padding-top:0;
    flex-direction:row;align-items:center;gap:6px;flex:none;
  }
  .navfoot .who{display:none}
  .nav{width:auto;flex:none;white-space:nowrap}
  /*  ვიწრო ეკრანზე ხე ერთ ჰორიზონტალურ ზოლად იშლება — იგივე,
      რაც დანარჩენ მენიუს ემართება.  ვერტიკალური ხე ტელეფონზე
      ეკრანის ნახევარს შეჭამდა. */
  .secbar.subbar{flex-direction:row;align-items:center;gap:6px;flex:none}
  .modhead,.secbar.subbar .grp{
    width:auto;flex:none;white-space:nowrap;margin-top:0;min-height:30px;
  }
  .secbar.subbar .grp{padding:0 9px}
  .modhead .n,.secbar.subbar .grp .n{display:none}
  #subsel .nav::before{margin-left:0}
  .subnav{
    flex-direction:row;align-items:center;gap:6px;flex:none;
    margin-top:0;padding-top:0;border-top:0;
  }
  .subnav .snsec{width:auto;flex:none;white-space:nowrap}
  .subnav .snitem{width:auto;flex:none;white-space:nowrap;padding:0 9px}
  .subnav .snitem .bar{display:none}
  .view{padding:14px 14px 64px;gap:14px}
  .topbar{padding:11px 14px;gap:10px}
  .topbar h1{font-size:16px}
  .card-h{padding:12px 14px}
  .formgrid,.frm{grid-template-columns:1fr}
  .stats,.grid4,.grid2{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
}
@media (max-width:560px){
  .view{padding:12px 10px 60px}
  .card-h{padding:11px 12px}
  aside{padding:8px 10px;gap:4px}
  .brand{display:none}          /* ვიწრო ეკრანზე მენიუს ადგილი მნიშვნელოვანია */
  .topbar .sub{display:none}
  .card-h h2{font-size:13.5px}
  .btn{padding:7px 11px}
  .stats,.grid4,.grid2{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ── ოპერატორის ჩატი ── */
.chatwrap{display:grid;grid-template-columns:290px minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:900px){.chatwrap{grid-template-columns:1fr}}
.chatlist{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;max-height:70vh;overflow-y:auto}
.chatitem{padding:12px 15px;border-bottom:1px solid var(--line-soft);cursor:pointer;display:flex;flex-direction:column;gap:3px}
.chatitem:last-child{border-bottom:0}
.chatitem:hover{background:var(--surface-3)}
.chatitem[aria-current="true"]{background:var(--accent-soft)}
.chatitem .top{display:flex;align-items:center;gap:8px}
.chatitem b{font-size:14px;font-weight:600}
.chatitem .un{width:8px;height:8px;border-radius:50%;background:var(--crit);flex:none;margin-left:auto}
.chatitem .prev{font-size:12.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chatitem time{font-size:11px;color:var(--ink-3);font-family:"JetBrains Mono",monospace}
.convo{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;min-height:420px}
.convo .ch{padding:13px 17px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.convo .stream{flex:1;padding:16px;display:flex;flex-direction:column;gap:10px;overflow-y:auto;max-height:52vh;background:var(--surface-3)}
.cmsg{display:flex;flex-direction:column;gap:3px;max-width:78%}
.cmsg.agent{align-self:flex-end;align-items:flex-end}
.cmsg.system{align-self:center;max-width:100%}
.cmsg .b{padding:9px 13px;border-radius:12px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word;
  background:var(--surface);border:1px solid var(--line)}
.cmsg.agent .b{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.cmsg.system .b{background:transparent;border:0;color:var(--ink-3);font-size:12px;text-align:center;padding:2px}
.cmsg .m{font-size:11px;color:var(--ink-3);padding:0 4px}
.convo .cf{border-top:1px solid var(--line);padding:12px 14px;display:flex;gap:9px;align-items:flex-end}
.convo .cf textarea{resize:none;min-height:40px;max-height:110px}

/* ── ანგარიშების ბლოკები ── */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r,12px);
  padding:16px 17px;display:flex;flex-direction:column;gap:3px}
.stat .l{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);
  font-family:"JetBrains Mono",monospace;font-weight:600}
.stat b{font-size:23px;font-weight:600;line-height:1.2;letter-spacing:-.01em}
.stat .meta{font-size:12px;color:var(--ink-3)}
@media (max-width:640px){.stat b{font-size:20px}}

/* ── პორტალის ენების გადამრთველი ── */
.plangsel{position:relative}
.plangsel .plbtn{display:flex;align-items:center;gap:7px;width:100%;justify-content:center}
.plangsel .plbtn svg{width:15px;height:15px;flex:none}
.plangsel .plbl{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.02em}
.plangsel .plmenu{
  display:none;position:absolute;bottom:calc(100% + 6px);left:0;min-width:150px;z-index:60;
  background:var(--surface);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 12px 30px rgba(9,20,40,.16);padding:5px;
}
.plangsel.open .plmenu{display:block}
.plangsel .plmenu button{
  display:block;width:100%;text-align:left;padding:8px 11px;border:0;background:none;
  border-radius:7px;font:inherit;font-size:13.5px;color:var(--ink);cursor:pointer;
}
.plangsel .plmenu button:hover{background:var(--accent-soft)}
.plangsel .plmenu button[aria-current="true"]{color:var(--accent);font-weight:600}
.plangsel.onlogin{position:absolute;top:18px;right:18px;width:auto}
.plangsel.onlogin .plbtn{width:auto;padding:6px 12px}
.plangsel.onlogin .plmenu{bottom:auto;top:calc(100% + 6px);left:auto;right:0}
.login-wrap{position:relative}

/* ── გვერდითი მენიუს ჯგუფები ── */
.nav.offgroup{display:none}
/* ── დამატებითი როლების არჩევანი ── */
.rolepick{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:4px 0 12px;
  background:var(--surface-3)}
.rolepick-h{font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:9px}
.rolepick-list{display:grid;gap:6px 14px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.rolepick .rolebox{font-size:13px;color:var(--ink-2);display:flex;align-items:center;gap:7px;
  cursor:pointer;padding:2px 0}
.rolepick .rolebox input{width:auto;margin:0}

/* ══════════ მოდულის ამორჩევა — გვერდით სვეტში ══════════
   ადრე ორი ჰორიზონტალური ზოლი იყო სამუშაო არეს ზევით და ეკრანის
   სიმაღლის მეოთხედს ჭამდა.  ახლა ორივე მარცხნივ დგას, კომპაქტურად:
   ვერტიკალური ადგილი უფრო იაფია, ვიდრე ჰორიზონტალური.

   კლასები განზრახ იგივეა — `.secbar`, `.dom[data-d]`, `.grp[data-g]` —
   რომ ლოგიკა და ტესტები იმავე სელექტორებს იპოვონ. */
/*  ერთი ვიწრო რიგი სამუშაო არეს თავზე: მარცხნივ განყოფილება,
    მარჯვნივ მისი მოდულები, შუაში თხელი ხაზი.  ადრე ეს ორი
    ცალკე ზოლი იყო და ეკრანის სიმაღლის მეოთხედს ჭამდა. */
.modbar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:6px 24px 7px;background:var(--surface);border-bottom:1px solid var(--line-soft);
}
.modbar #grpsel{flex:none}
.modbar #subsel{flex-grow:1;min-width:0}
/*  განყოფილებები ერთი დონით ჩუმია: ისინი დღეში ერთხელ თუ
    იცვლება, მოდულები კი ასჯერ. */
.modbar .dom{font-size:11px;padding:4px 8px;color:var(--ink-3);background:none;
  border-color:transparent}
.modbar .dom:hover{background:var(--surface-2);color:var(--ink-2)}
.modbar .dom[aria-current="true"]{
  background:none;color:var(--ink);font-weight:600;border-color:var(--line);
}
.modbar .dom[aria-current="true"]:hover{background:var(--surface-2);color:var(--ink)}
.secbar{
  /*  ყველა ღილაკი ერთდროულად ჩანს — გადახვევა არა, გადატანა.
      დამალული ბმული იმას ნიშნავს, რომ მომხმარებელმა არ იცის,
      რომ ის არსებობს. */
  display:flex;gap:4px;align-items:stretch;flex-wrap:wrap;
  padding:0;background:none;border-bottom:0;
}
.secbar .grp,.secbar .dom{
  font:inherit;font-size:11.5px;font-weight:500;line-height:1.2;
  color:var(--ink-2);background:var(--surface-3);
  border:1px solid var(--line-soft);border-radius:6px;
  padding:5px 8px;cursor:pointer;white-space:nowrap;flex:none;
  transition:background .12s ease,color .12s ease;
}
.secbar .grp:hover,.secbar .dom:hover{
  background:color-mix(in srgb,var(--accent) 18%,var(--surface));
  color:var(--accent-2);
}
.secbar .grp:focus-visible,.secbar .dom:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.secbar .grp[aria-current="true"],.secbar .dom[aria-current="true"]{
  background:var(--ink);color:var(--surface);font-weight:600;border-color:var(--ink);
}
.secbar .grp[aria-current="true"]:hover,
.secbar .dom[aria-current="true"]:hover{background:var(--accent-2);color:var(--on-accent)}

/* ══════════ მარცხენა ხე: მოდული → ჯგუფი → ეკრანი ══════════
   ბალანსივით ერთი ვერტიკალური ხე.  ზედა დონეზე მხოლოდ რამდენიმე
   მოდულია, დანარჩენი ყველაფერი მათ შიგნით ჯგუფებია.

   არც ერთ დონეს ჩარჩო და ფონი არ აქვს: ისინი პუნქტებს ცალკე
   ყუთებად აქცევდა და სია ოცდაათ კუბიკად იშლებოდა. */
.secbar.subbar{
  display:flex;flex-direction:column;gap:0;padding:0;background:none;border-bottom:0;
  flex:none;
}
.secbar.subbar .grp,.modhead{
  display:flex;align-items:center;gap:7px;width:100%;box-sizing:border-box;
  font:inherit;background:none;border:0;border-radius:8px;cursor:pointer;text-align:left;
  white-space:normal;
}
/*  მოდული — ხის ერთადერთი მსხვილი დონე. */
/*  ხის სამივე საფეხური ერთი ზომისაა — სხვაობას ფონი, სისქე და
    შეწევა ქმნის და არა შრიფტის ზომა.  ადრე მოდული 13.5px იყო,
    ჯგუფი 9.5px მონოსიგანის დიდი ასოებით, ეკრანი 13.5px — სამი
    სხვადასხვა ენა ერთ სვეტში.

    მოდულის თავსართი ნაცრისფერ ზოლზე ზის, ჯგუფი და ეკრანი კი
    თეთრზე: ასე ჩაკეცილშიც ჩანს, სად რა იწყება. */
.modhead{
  min-height:32px;padding:0 8px;margin-top:9px;border-radius:8px;
  font-size:12px;font-weight:700;color:var(--ink);
  background:var(--surface-2);
}
.modhead:first-of-type{margin-top:2px}
.modhead:hover{background:var(--accent-soft);color:var(--accent-2)}
/*  მიმდინარე მოდულს მარცხნივ ლურჯი კიდე აქვს — ეკრანის ლურჯი
    აბზაცისგან რომ განსხვავდებოდეს. */
.modhead[aria-current="true"]{
  color:var(--accent-2);box-shadow:inset 3px 0 0 var(--accent);
}
/*  ჯგუფი — შუა საფეხური: იმავე ზომის, ოდნავ სქელი, შეწეული. */
.secbar.subbar .grp{
  min-height:28px;padding:0 9px 0 18px;
  font-family:inherit;font-size:12px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--ink-2);
}
.secbar.subbar .grp:hover{background:var(--surface-2);color:var(--ink)}
.secbar.subbar .grp[aria-current="true"]{color:var(--ink)}
.modhead .lb,.secbar.subbar .grp .lb{flex-grow:1;min-width:0}
.modhead .n,.secbar.subbar .grp .n{
  flex:none;font-family:"JetBrains Mono",monospace;font-size:10.5px;color:var(--ink-3);
}
.modhead .cv,.secbar.subbar .grp .cv{
  flex:none;display:inline-flex;padding:3px;margin:-3px;border-radius:4px;
  transition:transform .12s ease;transform:rotate(90deg);
}
.modhead.closed .cv,.secbar.subbar .grp.closed .cv{transform:rotate(0deg)}
.modhead .cv:hover,.secbar.subbar .grp .cv:hover{background:var(--surface-2)}
/*  ხეში მდგარ ეკრანს ერთი საფეხურით შიგნით ვწევთ. */
#subsel .nav{padding-left:0}
#subsel .nav::before{margin-left:18px}

/* ══════════ ეკრანის საკუთარი ხე ══════════
   ბუღალტერიის ოცდახუთი ჩანართი ერთ რიგში აღარ ეწერება: აქ
   სექციებად დგას და თითო იკეცება.  სექციის გვერდით რიცხვი წერია —
   რამდენი პუნქტია შიგნით, რომ ჩაკეცილშიც ჩანდეს, რა იმალება. */
.subnav{display:flex;flex-direction:column;gap:1px;flex:none;
  margin-top:8px;padding-top:8px;border-top:1px solid var(--line-soft)}
/*  ხის პუნქტი ღილაკს არ უნდა ჰგავდეს: ჩარჩო და ფონი მას
    ცალკე ობიექტად აქცევდა და სია ოცდაათ ყუთად იშლებოდა. */
.subnav button{border:0;background:none;box-shadow:none;width:100%}
.subnav .snsec{
  display:flex;align-items:center;gap:6px;width:100%;
  font:inherit;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  font-family:"JetBrains Mono",monospace;
  color:var(--ink-3);background:none;border:0;border-radius:7px;
  padding:7px 8px;cursor:pointer;text-align:left;
}
.subnav .snsec:hover{background:var(--surface-2);color:var(--ink-2)}
.subnav .snsec .cv{
  flex:none;display:inline-flex;transition:transform .12s ease;
}
.subnav .snsec[aria-expanded="true"] .cv{transform:rotate(90deg)}
.subnav .snsec .n{margin-left:auto;font-size:10px;color:var(--ink-3)}
/*  მიმდინარე პუნქტი ვიწრო ზოლითაა გამოკვეთილი და არა მთელი
    ლურჯი ფონით: ოცდაათპუნქტიან სიაში ლურჯი ლაქები ერთმანეთში
    ერევა, ვიწრო ზოლს კი თვალი მაშინვე პოულობს. */
.subnav .snitem{
  display:flex;align-items:center;gap:8px;width:100%;min-height:30px;
  font:inherit;font-size:13px;line-height:1.3;
  color:var(--ink-2);background:none;border:0;border-radius:7px;
  padding:3px 8px 3px 0;cursor:pointer;text-align:left;
}
.subnav .snitem:hover{background:var(--surface-2);color:var(--ink)}
.subnav .snitem .bar{flex:none;width:3px;height:16px;border-radius:2px;
  background:transparent;margin-left:9px}
.subnav .snitem .lb{flex-grow:1;min-width:0}
.subnav .snitem .ct{flex:none;font-size:10.5px;font-family:"JetBrains Mono",monospace;
  color:var(--warn);padding-right:6px}
.subnav .snitem[aria-current="true"]{
  background:var(--accent-soft);color:var(--accent);font-weight:600;
}
.subnav .snitem[aria-current="true"] .bar{background:var(--accent)}
.subnav .snitem:focus-visible,.subnav .snsec:focus-visible{
  outline:2px solid var(--accent);outline-offset:1px}

/* ══════════ ეკრანის შიდა ჩანართები ══════════
   ერთი ეკრანის შიგნით რამდენიმე ანგარიში ან განყოფილებაა.  ესენი
   ღილაკებად იყო გამოტანილი და მთელი რიგი ყუთებად იშლებოდა —
   თვალი ვერ არჩევდა, სად მთავრდებოდა მენიუ და სად იწყებოდა
   სამუშაო არე.  ახლა ეს ჩვეულებრივი ჩანართების რიგია: ჩარჩო არ
   აქვს, აქტიური კი ქვედა ხაზითაა გამოკვეთილი. */
.grpsel{
  display:flex;align-items:stretch;flex-wrap:wrap;gap:2px;
  border-bottom:1px solid var(--line);
}
.grpsel .grp{
  font:inherit;font-size:13px;font-weight:500;line-height:1.2;
  color:var(--ink-3);background:none;border:0;border-radius:7px 7px 0 0;
  padding:8px 12px;margin-bottom:-1px;cursor:pointer;white-space:nowrap;flex:none;
  border-bottom:2px solid transparent;
}
.grpsel .grp:hover{color:var(--ink);background:var(--surface-2)}
.grpsel .grp:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.grpsel .grp[aria-current="true"]{
  color:var(--accent);font-weight:600;border-bottom-color:var(--accent);background:none;
}

/* ══════════ სალარო — ეკრანზე ზუსტად ჯდება ══════════

   მოლარე დღეში ასჯერ ხსნის ამ ეკრანს და გადახვევა აქ ზედმეტი
   ნაბიჯია: ჩეკი, კალათა და ციფრები ერთდროულად უნდა ჩანდეს.
   ფართო მონიტორზე კი შუაში დიდი ცარიელი ადგილი რჩებოდა და
   გადახდის პანელი ქვემოთ ცვიოდა.

   ამიტომ სალაროს ეკრანი მთელ სიმაღლეს იკავებს, გვერდი კი
   საერთოდ არ ცოცავს: ცოცავს მხოლოდ ის, რაც მართლა გრძელია —
   კალათა და საქონლის ფილები, თითოეული თავის ჩარჩოში. */
/*  სიმაღლის ჯაჭვი: ბადე → main → ეკრანი.  `min-height:100vh`
    მხოლოდ მინიმუმია და შვილს არაფერს ეუბნება — ზუსტი სიმაღლე
    მაშინ სჭირდება, როცა შიგთავსმა თავად უნდა იცოცოს. */
/* ── სალაროს რეჟიმში ზედმეტი ზოლები ქრება ──

   მაღაზიის მონიტორი ხშირად 1366×768-ია ან 1280×720.  ასეთ
   ეკრანზე ზედა ზოლი, ქვესათაური, ძებნა და ფუტერი ერთად
   სამუშაო არის მესამედს იღებდნენ — ჩეკის სვეტს კი სწორედ ის
   სიმაღლე აკლდა, რის გამოც სლაიდერი ჩნდებოდა.

   მოლარეს ეს ღილაკები არ სჭირდება: ძებნა სალაროს თავის ველში
   აქვს, ტიკეტი და საცავი კი მისი საქმე არ არის. */
.app:has(.view.posview) .appfoot{display:none}
.app:has(.view.posview) .topbar{padding-top:8px;padding-bottom:8px}
.app:has(.view.posview) .topbar .sub{display:none}
.app:has(.view.posview) .topbar h1{font-size:16px}
.app:has(.view.posview) .topbar #omniBtn,
.app:has(.view.posview) .topbar #vaultBtn,
.app:has(.view.posview) .topbar #newTicket,
.app:has(.view.posview) .topbar .themebtn{display:none}
/*  ცვლის ზოლი ერთ რიგში — ვიწრო ეკრანზე ის ორად იშლებოდა. */
.app:has(.view.posview) .view.posview>.card>.card-h{
  padding-top:8px;padding-bottom:8px;row-gap:4px;
}
/*  სიმაღლის ჩაკეტვა მხოლოდ იქ, სადაც სალარო ორ სვეტადაა.
    ვიწრო ან დაბალ ეკრანზე (ტაბლეტი, ტელეფონი) ეკრანი ერთ
    სვეტად ჩამოდის და გვერდი ჩვეულებრივ უნდა ცოცავდეს —
    თორემ გვერდითი მენიუ ჩაკეტილ ჩარჩოში ექცევა და ქვედა
    პუნქტებამდე ჩამოსვლა ჭირს. */
@media (min-width:901px) and (min-height:620px){
  .app:has(.view.posview){height:100dvh;min-height:0;overflow:hidden}
  .app:has(.view.posview)>main{min-height:0;overflow:hidden}
  /*  გვერდითი ზოლი ბადის სიმაღლეს უნდა უდრიდეს და არა `100vh`-ს:
      ბრაუზერის ზოლების გამო `100vh` ხშირად `100dvh`-ზე მეტია და
      სხვაობა მოჭრილი რჩებოდა — ქვედა ღილაკებამდე (გასვლა,
      მხარდაჭერა) ჩამოსვლა შეუძლებელი იყო. */
  .app:has(.view.posview)>aside{height:100%;min-height:0}
}
.view.posview{
  padding:0;gap:0;flex:1;min-height:0;overflow:hidden;
  display:flex;flex-direction:column;
}
/*  ვიწრო ეკრანზე ბარათი აღარ იჭიმება — შიგთავსს მიჰყვება. */
@media (max-width:900px), (max-height:619px){
  .view.posview{overflow:visible}
  .view.posview>.card{flex:none}
}
/*  სალაროს მთელი ეკრანი ერთ ბარათშია: ზემოთ ცვლის ზოლი
    (`.card-h`), ქვემოთ სამუშაო არე (`.posfit`).  ამიტომ თვითონ
    ბარათი უნდა გაიწელოს მთელ სიმაღლეზე და შიგნით გაიყოს —
    თორემ `.posfit` მშობელზე მაღალი გამოდიოდა და ქვედა ნაწილი
    იჭრებოდა: „ცვლის დახურვა" მიუწვდომელი ხდებოდა. */
.view.posview>.card{
  flex:1;min-height:0;margin:0;display:flex;flex-direction:column;
  border-radius:0;border-left:0;border-right:0;border-bottom:0;
}
.view.posview>.card>.card-h{flex:none}
/*  `flex:1` და არა `height:100%`.  სალაროს ეკრანს ზემოთ ცვლის
    ზოლი უდგას და „მშობლის სრული სიმაღლე" იმაზე მეტია, რაც
    რჩება — ქვედა ნაწილი მოიჭრებოდა და „ცვლის დახურვა"
    მიუწვდომელი ხდებოდა.  დარჩენილი ადგილი უნდა აიღოს და არა
    მთელი. */
/*  ჩეკის სვეტი ეკრანს მიჰყვება: 1024-ზე 300px, დიდ მონიტორზე
    340px.  ფიქსირებული 340 პატარა ეკრანზე ფილებს ახრჩობდა. */
.posfit{
  display:grid;grid-template-columns:minmax(0,1fr) clamp(290px, 30vw, 340px);gap:12px;
  flex:1;min-height:0;padding:12px 14px;box-sizing:border-box;
}
.posfit>*{min-height:0;min-width:0;display:flex;flex-direction:column}
/*  მარცხენა სვეტი: ძებნა მიკრული, დანარჩენი ცოცავს. */
.poshead{flex:none;padding-bottom:10px}
.posscroll{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-gutter:stable;
}
.posscroll::-webkit-scrollbar{width:8px}
.posscroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
/*  მარჯვენა სვეტი — ჩეკი.  ის თავად ცოცავს, თუ ლოიალობა და
    გადახდის ღილაკები ერთად არ ეტევა. */
/*  ჩეკის სვეტი თავად ცოცავს.  სქროლბარი ყოველთვის ჩანს —
    თორემ მოლარემ არ იცის, რომ ქვემოთ კიდევ არის „ცვლის
    დახურვა", და ღილაკი დაკარგულად ეჩვენება. */
.pospay{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-gutter:stable;
}
.pospay::-webkit-scrollbar{width:8px}
.pospay::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.pospay::-webkit-scrollbar-thumb:hover{background:var(--ink-3)}
/* ── ჩეკის სვეტი ეკრანს ეწყობა ──

   მოლარეს სქროლი არ უნდა სჭირდებოდეს.  ღილაკებისა და ციფრების
   ზომა ეკრანის სიმაღლეს მიჰყვება: მაღალ მონიტორზე მსხვილია,
   დაბალზე კი იკუმშება — ისე, რომ თითისთვის მაინც კომფორტული
   დარჩეს (მინიმუმი 40px, რეკომენდებული სამიზნე).

   `clamp()` ამას თავად აკეთებს — მედია-კითხვების კიბე არ
   სჭირდება და ყველა ზომაზე გლუვად იცვლება. */
.pospay{
  --np-h:clamp(30px, 3.9vh, 46px);      /* ციფრის ღილაკი */
  --np-f:clamp(13px, 1.8vh, 18px);      /* ციფრის ზომა */
  --pay-h:clamp(32px, 4.5vh, 54px);     /* ნაღდი / ბარათი */
  --pad:clamp(5px, .8vh, 11px);
}
.pospay .card-h{padding:calc(var(--pad) * .8) 14px}
.pospay .card-h h2{font-size:13.5px}
.pospay>.card>div{padding:var(--pad) 14px}
.pospay .kv{padding:calc(var(--pad) * .28) 0}
.pospay .kv b{font-size:clamp(13.5px, 1.9vh, 17px)}
/*  „სულ" ერთადერთი ციფრია, რომელსაც მოლარე შორიდან უყურებს. */
.pospay .paytotal b{font-size:clamp(19px, 3.1vh, 30px);line-height:1.1}
/*  ცვლის ჯამები ორ სვეტად — ოთხი რიგი ზედმეტი სიმაღლეა. */
.shiftgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.shiftgrid .kv{font-size:12.5px;padding:calc(var(--pad) * .2) 0}
.shiftgrid .kv b{font-size:clamp(12.5px, 1.7vh, 15px)}
/*  ცვლის დახურვა — ჩვეულებრივი სიმაღლის ღილაკი ორმაგ ჰაერს
    იკავებდა ბარათის ბოლოში. */
.pospay #posClose{margin-top:calc(var(--pad) * .6) !important;padding:5px 10px}
.pospay .payrow{margin-top:calc(var(--pad) * .6);gap:6px}
/*  „მიღებული ნაღდი" თაჩში მსხვილია — მოლარე მას შორიდან
    კითხულობს, ისევე როგორც ჯამს. */
/*  „მიღებული" ველის გვერდით დგას და არა თავზე — ერთი რიგით
    ნაკლები. */
.pospay .givenrow{margin-top:calc(var(--pad) * .7);
  display:flex;align-items:center;gap:8px}
.pospay .givenrow label{flex:none;margin:0}
.pospay .givenrow input{flex:1;min-width:0}
.pospay .loyrow{margin-top:calc(var(--pad) * .7)}
.pospay .giveninp{font-size:clamp(16px, 2.4vh, 24px);text-align:right;
  padding:calc(var(--pad) * .6) 10px;cursor:pointer}
/*  ციფრების გადამრთველი — ჩუმი ზოლი და არა ღილაკი: ის
    მდგომარეობას აჩვენებს და არა მოქმედებას. */
/*  ცვლის სათაური ღილაკია — კეცავს და ხსნის. */
.shifthead{width:100%;font:inherit;color:inherit;background:none;border:0;
  cursor:pointer;text-align:left}
.shifthead:hover{background:var(--surface-2)}
.shifthead .hint{margin-left:auto;color:var(--ink-3)}
.pospay .payrow .btn{flex:1;justify-content:center}
.pospay label.meta{margin-bottom:2px;display:block}
.pospay input{padding:calc(var(--pad) * .55) 10px}
/* ── ციფრები ──
   სამი სვეტი, ხუთი რიგი — კალკულატორის ჩვეული განლაგება.
   ციფრი მსხვილია და ოდნავ ლურჯი, რომ ფონს არ შეერიოს; ბოლო
   რიგი ფერითაა გამოყოფილი: გასუფთავება წითელი, „ზუსტად"
   ლურჯი, წაშლა ნეიტრალური.  მოლარე ღილაკს ფერით პოულობს. */
.pospay .numpad{grid-template-columns:repeat(3,1fr);gap:6px;
  margin-top:calc(var(--pad) * .5)}
.pospay .numpad .btn{
  padding:0;height:var(--np-h);font-size:var(--np-f);font-weight:600;
  justify-content:center;border-radius:10px;
  background:var(--surface-3);border-color:var(--line-soft);color:var(--ink);
  transition:background .12s, transform .06s;
}
.pospay .numpad .btn:hover{background:var(--accent-soft);border-color:var(--accent)}
.pospay .numpad .btn:active{transform:translateY(1px)}
.pospay .numpad .np-c{background:var(--crit-soft);border-color:var(--crit-soft);
  color:var(--crit)}
.pospay .numpad .np-c:hover{background:var(--crit);border-color:var(--crit);color:#fff}
.pospay .numpad .np-eq{background:var(--accent);border-color:var(--accent);
  color:var(--on-accent)}
.pospay .numpad .np-eq:hover{background:var(--accent-2);border-color:var(--accent-2)}
.pospay .numpad .np-bs{background:var(--surface-2);border-color:var(--line);
  color:var(--ink-2)}
.pospay .numpad .np-bs:hover{background:var(--line);color:var(--ink)}
/*  გადახდის ღილაკები — ეკრანის სიმაღლეს მიჰყვება. */
.pospay .paygrid{gap:6px;margin-top:var(--pad)}
.pospay .pay{min-height:var(--pay-h);padding:4px 10px}
.pospay .paygrid.big .pay{min-height:var(--pay-h)}
.pospay .pay b{font-size:clamp(13.5px, 1.95vh, 19px)}
.pospay .paygrid.big .pay b{font-size:clamp(14px, 2.1vh, 19px)}
.pospay .pay span{font-size:clamp(10px, 1.25vh, 11.5px)}
.pospay .pay.bonus{min-height:clamp(34px, 4.6vh, 48px);margin-top:6px}
.pospay .loybox{padding:calc(var(--pad) * .7) 10px;margin-top:6px}

/* ── ფილების ზოლი: „← კატეგორიები" და სათაური ── */
.tilebar{display:flex;align-items:center;gap:10px;padding:2px 0 10px;
  font-size:13.5px;position:sticky;top:0;background:var(--paper);z-index:1}
.tilebar b{font-weight:600}
/*  კატეგორიის ფილა საქონლისგან განსხვავდება: ფასი არ აქვს და
    ამიტომ დაბალია — ეკრანზე მეტი ეტევა. */
.tilecat{min-height:74px;justify-content:center;background:var(--surface-2)}
.tilecat:hover{background:var(--accent-soft);border-color:var(--accent)}
.tilecat .tile-n{font-size:15px;font-weight:600}
.pospay>.card{margin-bottom:12px}
/*  ვინ გახსნა ცვლა — სახელი მუქად, თანამდებობა და როლი ჩუმად. */
.shiftwho{display:inline-flex;align-items:baseline;gap:2px;font-size:13px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(46vw,420px)}
.shiftwho b{font-weight:600}
/*  სალაროში ბარათებს გარე ზღვარი აღარ სჭირდება — ჩარჩო
    თავად ჰყოფს სვეტებს. */
.posfit .tw{margin:0}
.posfit .empty{padding:24px 0}
.pospay>.card:last-child{margin-bottom:0}

/*  ვიწრო ან დაბალ ეკრანზე ერთ სვეტად — და მაშინ გვერდიც
    ჩვეულებრივ ცოცავს, თორემ ჩეკი მიუწვდომელი გახდებოდა. */
@media (max-width:900px), (max-height:619px){
  .view.posview{overflow:auto}
  .posfit{grid-template-columns:1fr;height:auto;min-height:100%}
  .posscroll,.pospay{overflow:visible}
}

/* ══════════ ძებნა ზედა ზოლში ══════════
   ღილაკი „ძებნა" საძიებო ველს არ ჰგავდა და ამიტომ არც ეძებდნენ.
   ახლა ველივითაა — დაჭერა იმავე გლობალურ ძებნას ხსნის. */
.omnifield{
  display:flex;align-items:center;gap:8px;flex-grow:1;max-width:460px;min-width:0;
  height:34px;padding:0 9px 0 11px;
  font:inherit;font-size:13px;color:var(--ink-3);
  background:var(--surface-3);border:1px solid var(--line);border-radius:9px;
  cursor:pointer;text-align:left;
}
.omnifield:hover{background:var(--surface);border-color:var(--accent)}
.omnifield .omnifield-t{flex-grow:1;min-width:0;overflow:hidden;white-space:nowrap;
  text-overflow:ellipsis}
.omnifield .kbd{flex:none}
.omnifield:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width:900px){
  .secbar{gap:4px}
  .secbar .grp,.secbar .dom{font-size:11.5px;padding:5px 8px}
  .omnifield{max-width:none}
  .omnifield .omnifield-t{display:none}
  .omnifield{flex-grow:0;width:40px;justify-content:center;padding:0}
}

/* ══════════ სალაროს გადახდის ღილაკები ══════════
   ხუთი ხერხი, ერთი ბადე. ნაღდი და ბარათი დიდია — ისინი დღეში
   ასჯერ ეხება ხელი; გადარიცხვა და ვალი ჩუმია — ისინი იშვიათია
   და შეცდომით დაჭერა ძვირი დაჯდებოდა.

   ფერები ონტენისაა: --ok ნაღდზე, --accent ბარათზე, ზედაპირი
   დანარჩენზე. სემანტიკური ფერი აქ მდგომარეობას ამბობს და არა
   გაფორმებას. */
.paygrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.pay{
  font:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  min-height:58px;padding:10px 14px;border-radius:12px;border:1px solid transparent;
  cursor:pointer;text-align:center;transition:background .12s ease,transform .06s ease;
}
.pay b{font-size:16px;font-weight:600;line-height:1.2}
.pay span{font-size:11.5px;opacity:.75;font-family:"JetBrains Mono",monospace}
.pay:active:not(:disabled){transform:translateY(1px)}
.pay:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pay:disabled{opacity:.45;cursor:not-allowed}
.pay.cash{background:var(--ok);color:#fff}
.pay.cash:hover:not(:disabled){background:color-mix(in srgb,var(--ok) 85%,#000)}
.pay.card{background:var(--accent);color:var(--on-accent)}
.pay.card:hover:not(:disabled){background:var(--accent-2)}
.pay.alt{background:var(--surface-3);color:var(--ink-2);border-color:var(--line)}
.pay.alt:hover:not(:disabled){background:var(--surface-2);color:var(--ink)}
.pay.bonus{
  width:100%;margin-top:10px;min-height:48px;
  background:transparent;color:var(--accent);border:1px dashed var(--line);
}
.pay.bonus:hover:not(:disabled){background:var(--accent-soft)}
/*  ბარათის გარეშე ღილაკი კი არა, წარწერაა: დასაჭერი რომ არაფერია,
    ღილაკის სახე მხოლოდ შეცდომაში შეიყვანდა. */
.pay.bonus.off{
  color:var(--ink-3);cursor:default;font-size:13.5px;
  display:flex;align-items:center;justify-content:center;
}
.paygrid.big .pay{min-height:74px}
.paygrid.big .pay b{font-size:19px}
@media (max-width:520px){
  .paygrid{grid-template-columns:1fr}
}

/* ══════════ მონიტორინგი და განმეორებადი ინვოისები ══════════ */
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:14px;margin-bottom:16px}
.card.stat{padding:16px 18px}
.card.stat .big{font-size:26px;font-weight:600;letter-spacing:-.01em;line-height:1.15;color:var(--ink)}
.card.stat .lbl{font-size:12.5px;color:var(--ink-3);margin-top:4px}
.card.mon{display:flex;flex-direction:column}
.card.mon .kv{padding:6px 0}
.card-f{margin-top:auto;padding:12px 18px;border-top:1px solid var(--line-soft);
  display:flex;align-items:center;gap:10px}
.card-f .hint{font-size:12px;color:var(--ink-3);margin-left:auto}
.alerts{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.al{background:var(--warn-soft);border:1px solid var(--warn);border-radius:8px;
  padding:9px 11px;font-size:12.5px;color:var(--ink-2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.al b{color:var(--warn);font-weight:600}
.al.crit{background:var(--crit-soft);border-color:var(--crit)}
.al.crit b{color:var(--crit)}
.al .btn{margin-left:auto}
.frm{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.frm label.f,label.f{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-3)}
label.f input,label.f select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;
  background:var(--surface);color:var(--ink);font:inherit;font-size:13.5px}
.chk{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:14px}
label.cb{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-2);cursor:pointer}
/* მონიშვნების ბადე — როლების კონსტრუქტორი და მსგავსი სიები */
.chks{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px 18px}
label.cb input{width:15px;height:15px;accent-color:var(--accent)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn.ghost{background:var(--surface);color:var(--ink-2)}
.btn.ghost:hover{background:var(--surface-2);color:var(--ink)}
h3.sub{font-size:13px;font-weight:600;color:var(--ink-2);margin:18px 0 8px}

/* ══════════ ორფაქტორიანი შესვლა ══════════ */
.tfa-set{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start}
.tfa-qr{background:#fff;padding:10px;border:1px solid var(--line);border-radius:10px;line-height:0;flex:0 0 auto}
.tfa-steps{flex:1 1 260px;min-width:240px}
.tfa-steps ol{margin:0;padding-left:20px;font-size:13.5px;color:var(--ink-2);line-height:1.75}
.tfa-secret{display:inline-block;font-family:"JetBrains Mono",monospace;font-size:13px;
  background:var(--surface-3);border:1px solid var(--line);border-radius:7px;padding:7px 11px;
  letter-spacing:.08em;word-break:break-all;color:var(--ink)}
.codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.codes code{font-family:"JetBrains Mono",monospace;font-size:14px;text-align:center;
  background:var(--surface-3);border:1px solid var(--line);border-radius:7px;padding:9px 6px;
  letter-spacing:.06em;color:var(--ink)}
.tfa-code{max-width:220px}

/* ══════════ გლობალური ძებნა, შეტყობინებები, შენიშვნები ══════════ */
.kbd{
  font-family:'JetBrains Mono',monospace;font-size:10.5px;line-height:1;
  border:1px solid var(--line);border-radius:4px;padding:2px 5px;
  background:var(--surface-3);color:var(--ink-3);margin-left:6px
}
.omni{position:fixed;inset:0;z-index:80;background:rgba(15,23,35,.42);backdrop-filter:blur(2px);
  display:flex;align-items:flex-start;justify-content:center;padding:11vh 16px 16px}
.omni-box{width:min(680px,100%);background:var(--surface);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;max-height:74vh}
.omni-box>input{border:0;border-bottom:1px solid var(--line-soft);background:transparent;color:var(--ink);
  font:inherit;font-size:16px;padding:16px 18px;outline:none;width:100%}
.omni-res{overflow:auto;flex:1;padding:6px}
.omni-g{padding:8px 12px 3px;font-size:11px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink-3)}
.omni-i{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;cursor:pointer}
.omni-i:hover{background:var(--surface-2)}
.omni-i[aria-selected="true"]{background:var(--accent-soft);color:var(--accent)}
.omni-i b{font-weight:500;font-size:13.5px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.omni-i span{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.omni-i[aria-selected="true"] span{color:var(--accent)}
.omni-foot{display:flex;gap:14px;padding:8px 16px;border-top:1px solid var(--line-soft);
  font-size:11.5px;color:var(--ink-3);background:var(--surface-3)}
.omni-empty{padding:26px 16px;text-align:center;color:var(--ink-3);font-size:13px}

.bellwrap{position:relative;display:inline-flex}
.bell{position:relative;padding:6px 9px}
.bell .badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:var(--crit);color:#fff;font-size:10.5px;font-weight:600;
  display:flex;align-items:center;justify-content:center;line-height:1}
.pop{position:absolute;top:calc(100% + 8px);right:0;width:min(360px,92vw);z-index:70;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);overflow:hidden;max-height:70vh;display:flex;flex-direction:column}
.pop-h{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line-soft)}
.pop-h b{font-size:13px}
.pop-h .btn{margin-left:auto}
.pop-l{overflow:auto}
.nti{display:flex;gap:9px;padding:10px 14px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.nti:hover{background:var(--surface-2)}
.nti.un{background:var(--accent-soft)}
.nti.un:hover{background:color-mix(in srgb,var(--accent) 16%,transparent)}
.nti .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none;margin-top:6px}
.nti.rd .dot{background:var(--line)}
.nti div{min-width:0;flex:1}
.nti b{display:block;font-size:12.8px;font-weight:600}
.nti p{font-size:12px;color:var(--ink-2);margin:2px 0 0;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nti time{font-size:11px;color:var(--ink-3)}

.notes{display:flex;flex-direction:column;gap:8px;margin:8px 0 4px}
.note{border:1px solid var(--line-soft);border-radius:9px;padding:9px 11px;background:var(--surface-3)}
.note.pin{border-color:color-mix(in srgb,var(--warn) 45%,transparent);background:var(--warn-soft)}
.note p{font-size:13px;white-space:pre-wrap;margin:0 0 5px}
.note .nh{display:flex;gap:8px;align-items:center;font-size:11.5px;color:var(--ink-3)}
.note .nh .btn:nth-of-type(1){margin-left:auto}
.note .nh span:first-child{flex:1 1 auto;min-width:0}
.ev.internal{background:var(--warn-soft);border-left:3px solid var(--warn)}
.ev .eh .tag{font-size:10.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;
  color:var(--warn);border:1px solid color-mix(in srgb,var(--warn) 45%,transparent);
  border-radius:5px;padding:1px 6px}
.tplbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:2px}
.tplbar select{width:auto;flex:0 1 205px;min-width:130px}
.tplbar .cb{flex:1 1 240px;min-width:0;line-height:1.35}
.tplbar .btn{font-size:12px}

/* ══════════ IT ინფრასტრუქტურა და აუდიტი ══════════ */
.card.stat .cb{font-size:12.5px;color:var(--ink-3);margin-top:4px;display:block}
.arow{display:flex;align-items:center;gap:12px;padding:11px 18px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.arow:last-child{border-bottom:0}
.arow b{font-size:13.5px;font-weight:500}
.arow select{width:auto;min-width:140px}
.ring{--p:0;width:104px;height:104px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:conic-gradient(var(--rc) calc(var(--p)*1%),var(--surface-2) 0)}
.ring::after{content:"";position:absolute}
.ring b{width:78px;height:78px;border-radius:50%;background:var(--surface);display:grid;place-items:center;
  font-size:21px;font-weight:600;color:var(--rc)}
.ring.ok{--rc:var(--ok)}
.ring.warn{--rc:var(--warn)}
.ring.crit{--rc:var(--crit)}
.secrow td{background:var(--surface-3)}
.selrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.selrow select,select.narrow{width:auto;min-width:150px;max-width:280px}
.card-h select{width:auto;min-width:130px;max-width:240px}

/* ══════════ სალარო: თაჩსკრინის რეჟიმი ══════════
   დიდი სამიზნეები თითისთვის — ღილაკი მინიმუმ 48px, ტექსტი მსხვილი.
   კომპიუტერის რეჟიმი ჩვეულებრივ ცხრილს იყენებს და ამ კლასებს არ ეხება. */
/*  ფილების სვეტების რაოდენობა ეკრანს მიჰყვება — ვიწროზე
    ორი, ფართოზე რვა.  `auto-fill` ამას თავად ითვლის. */
.tiles{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(clamp(132px,13vw,180px),1fr))}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:3px;
  padding:14px;min-height:92px;text-align:left;border:1px solid var(--line);
  background:var(--surface);border-radius:12px;cursor:pointer;font:inherit;color:inherit}
.tile:hover{border-color:var(--accent)}
.tile-n{font-weight:500;font-size:14px;line-height:1.25}
.tile-p{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}
.tile-q{font-size:12px;color:var(--ink-3)}
.tile-out{opacity:.45;cursor:not-allowed}

.tlines{display:flex;flex-direction:column;gap:8px;padding:0 18px}
.tline{display:flex;align-items:center;gap:12px;padding:12px 14px;
  border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.tline-bad{border-color:var(--bad)}
.tline-name{flex:1;min-width:0;font-size:15px;font-weight:500}
.tline-qty{display:flex;align-items:center;gap:10px}
.tline-qty .btn{width:44px;height:44px;justify-content:center;font-size:20px;padding:0}
.tline-qty b{min-width:44px;text-align:center;font-size:18px;font-variant-numeric:tabular-nums}
.tline-sum{min-width:92px;text-align:right;font-size:16px}

.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.numpad .btn{padding:16px 0;font-size:20px;justify-content:center}

.modal-wrap{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;
  display:flex;align-items:center;justify-content:center;padding:20px}
.modal-box{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:20px;max-width:640px;width:100%;max-height:86vh;overflow:auto}

/* ── ქვედა წარწერა ──
   საავტორო უფლება, საიტის მისამართი და ვერსიის შექმნის დრო.
   მთავარ შიგთავსს ბოლოში მიჰყვება, ეკრანზე არ ეკიდება. */
.appfoot{
  margin-top:auto;border-top:1px solid var(--line-soft);
  background:var(--surface);color:var(--ink-3);font-size:12px;
}
.appfoot-in{
  max-width:1400px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;text-align:center;
}
.appfoot a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--line)}
.appfoot a:hover{color:var(--accent);border-color:var(--accent)}
.appfoot .dot{opacity:.5}
.appfoot .mono{font-family:"JetBrains Mono",monospace;font-size:11.5px}
@media (max-width:900px){
  /* ჩატის ღილაკს ადგილი დავუთმოთ, რომ წარწერას არ გადაეფაროს */
  .appfoot-in{padding-right:78px}
}
@media (max-width:560px){
  .appfoot-in{padding:12px 78px 14px 14px;gap:5px;font-size:11.5px;flex-direction:column;
    align-items:flex-start;text-align:left}
  .appfoot .dot{display:none}
}
/* შესვლის ეკრანზეც იგივე წარწერა */
.loginfoot{
  margin-top:22px;text-align:center;font-size:11.5px;color:var(--ink-3);line-height:1.7;
}
.loginfoot a{color:var(--ink-3)}

/* ═══════════ რესტორანი ═══════════
   მაგიდები თაჩსკრინისთვისაა: დიდი ღილაკები, ერთი შეხედვით ჩანს
   რომელი მაგიდაა დაკავებული, რამდენი ხანია და რამდენი დაუგროვდა. */
.rtiles{
  display:grid;gap:12px;padding:14px 18px 18px;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
}
.rt{
  display:flex;flex-direction:column;gap:4px;align-items:flex-start;
  min-height:96px;padding:12px 14px;cursor:pointer;text-align:left;
  background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r);
  color:var(--ink);font:inherit;transition:border-color .15s,transform .1s;
}
.rt:hover{border-color:var(--accent)}
.rt:active{transform:scale(.985)}
.rt b{font-size:20px;line-height:1.1}
.rt .rt-i{font-size:11.5px;color:var(--ink-3)}
.rt .rt-t{margin-top:auto;font-size:15px;font-weight:600}
.rt.busy{background:var(--warn-soft);border-color:var(--warn)}
.rt.busy b{color:var(--warn)}
.rt.busy.bill{background:var(--ok-soft);border-color:var(--ok)}
.rt.busy.bill b{color:var(--ok)}

/* შეკვეთის ეკრანი: მარცხნივ მენიუ, მარჯვნივ ანგარიში */
.rsplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px)}
.rsplit>div:first-child{border-right:1px solid var(--line-soft);min-width:0}
.rbill{display:flex;flex-direction:column;min-width:0}
.rgrp{
  padding:12px 2px 6px;font-size:11.5px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink-3);
}
.rmenu{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.rmi{
  display:flex;flex-direction:column;gap:4px;align-items:flex-start;
  min-height:64px;padding:9px 11px;cursor:pointer;text-align:left;
  background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r);
  color:var(--ink);font:inherit;
}
.rmi:hover{border-color:var(--accent)}
.rmi:active{transform:scale(.985)}
.rmi-n{font-size:13px;line-height:1.25;overflow-wrap:break-word}
.rmi-p{margin-top:auto;font-size:13px;font-weight:600;color:var(--accent)}

.rline{
  display:grid;gap:8px;align-items:center;
  grid-template-columns:minmax(0,1fr) auto 70px 32px;
  padding:9px 16px;border-bottom:1px solid var(--line-soft);
}
.rline-n{font-size:13px;min-width:0;overflow-wrap:break-word}
.rline-q{display:flex;align-items:center;gap:6px}
.rline-t{text-align:right;font-weight:600;font-size:13px}
.rline.void{opacity:.5;text-decoration:line-through}
.rtot{margin-top:auto;padding:12px 16px;border-top:1px solid var(--line);background:var(--surface-3)}
.rtot .kv{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0}

/* სამზარეულოს ეკრანი — შორიდან უნდა იკითხებოდეს */
.kwrap{
  display:grid;gap:12px;padding:14px 18px 18px;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
}
.kcard{
  display:flex;flex-direction:column;gap:7px;padding:12px 14px;
  background:var(--surface-3);border:1px solid var(--line);
  border-left:4px solid var(--accent);border-radius:var(--r);
}
.kcard.late{border-left-color:var(--crit);background:var(--crit-soft)}
.kcard.done{border-left-color:var(--ok);opacity:.7}
.kh{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.kh b{font-size:19px}
.kn{font-size:16px;font-weight:600;line-height:1.3;overflow-wrap:break-word}
.knote{
  font-size:13px;padding:5px 8px;border-radius:6px;
  background:var(--warn-soft);color:var(--warn);
}
@media (max-width:1000px){
  .rsplit{grid-template-columns:1fr}
  .rsplit>div:first-child{border-right:0;border-bottom:1px solid var(--line-soft)}
}
@media (max-width:560px){
  .rtiles{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));padding:12px 14px}
  .rline{grid-template-columns:minmax(0,1fr) auto 64px 30px;padding:8px 12px}
}

/* ═══════════ სასტუმრო ═══════════
   ნომრები იმავე ფილებით, რაც მაგიდები — ერთი ენა მთელ პროგრამაში. */
.rt.dirty{background:var(--surface-2);border-color:var(--line)}
.rt.dirty b{color:var(--ink-2)}
.rt.ooo{opacity:.55;background:var(--surface-2);border-style:dashed;cursor:default}
.hmi{
  display:flex;flex-direction:column;gap:4px;align-items:flex-start;
  min-height:64px;padding:9px 11px;cursor:pointer;text-align:left;
  background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r);
  color:var(--ink);font:inherit;
}
.hmi:hover{border-color:var(--accent)}
.hmi:active{transform:scale(.985)}

/* დაფა („შახმატი") — რომელი ნომერი რომელ დღეს ვის უჭირავს */
table.hboard{min-width:720px;font-size:12px}
table.hboard th{padding:5px 6px;text-align:center;white-space:nowrap}
table.hboard thead th{font-size:11px;line-height:1.2}
table.hboard tbody th{
  text-align:left;background:var(--surface-3);color:var(--ink);
  position:sticky;left:0;z-index:1;border-bottom:1px solid var(--line-soft);
}
td.hb{
  padding:0;height:34px;min-width:34px;text-align:center;font-size:11px;
  border-bottom:1px solid var(--line-soft);border-right:1px solid var(--line-soft);
  white-space:nowrap;overflow:hidden;
}
td.hb.free{background:var(--surface)}
td.hb.bk{background:var(--warn-soft);color:var(--warn);cursor:pointer}
td.hb.in{background:var(--ok-soft);color:var(--ok);cursor:pointer;font-weight:600}
td.hb.s{border-left:3px solid currentColor;padding-left:5px}
td.hb.e{border-right:3px solid currentColor}

/* ═══════════ ტურისტული ═══════════
   ადგილების ზოლი — ერთი შეხედვით ჩანს, რამდენი გაიყიდა. */
.seatbar{
  height:5px;margin-top:4px;border-radius:3px;overflow:hidden;
  background:var(--surface-2);min-width:64px;max-width:120px;
}
.seatbar i{display:block;height:100%;background:var(--accent);border-radius:3px}

/* ═══════════ ბუღალტერია ═══════════
   ბრუნვითი უწყისი — ორსართულიანი თავსართი და მკვრივი ციფრები. */
table.acc{font-size:12px}
table.acc thead th{text-align:center;font-weight:600;padding:5px 7px}
table.acc thead tr:first-child th{border-bottom:1px solid rgba(255,255,255,.25)}
table.acc td{padding:5px 7px}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.tot td{background:var(--surface-2);border-top:2px solid var(--line)}
tr.grp td{background:var(--surface-3)}
/* ბალანსი და მოგება-ზარალი — ორი თანაბარი სვეტი */
.split2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:900px){.split2{grid-template-columns:1fr}}

/* ─── გრაფიკები ───
   სუფთა SVG: ბიბლიოთეკა არ გვჭირდება, viewBox თავად ერგება ეკრანს */
.chart{width:100%}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chg{stroke:var(--line);stroke-width:1;opacity:.55}
.cht{fill:var(--muted);font-size:11px;font-family:inherit}
.chl{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.chf{opacity:.12;stroke:none}
.chp{stroke:var(--surface);stroke-width:1.5}
.chb{opacity:.9}
.chb:hover{opacity:1}
.chleg{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px;font-size:12.5px;color:var(--muted)}
.chleg span{display:inline-flex;align-items:center;gap:6px}
.chleg i{width:10px;height:10px;border-radius:2px;display:inline-block}
.hbars{display:flex;flex-direction:column;gap:8px}
.hbar{display:grid;grid-template-columns:minmax(90px,1.4fr) 3fr minmax(80px,auto);
  gap:10px;align-items:center;font-size:13px}
.hbn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbb{display:block;height:10px;background:var(--surface-2);border-radius:5px;overflow:hidden}
.hbb i{display:block;height:100%;border-radius:5px}
.hbv{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:560px){
  .hbar{grid-template-columns:minmax(70px,1.2fr) 2fr minmax(70px,auto);gap:7px;font-size:12px}
}

/* ══════════ გრაფიკის ბადე ══════════
   ოცდაათი სვეტი ეკრანზე უნდა ჩაეტიოს — ამიტომ უჯრა ვიწროა და
   შრიფტი პატარა. ფერი მდგომარეობას ამბობს და არა დეკორაციას. */
.rgrid{font-size:12px}
.rgrid th,.rgrid td{padding:5px 4px}
.rgrid th:first-child,.rgrid td:first-child{min-width:150px;text-align:left}
.rgrid .rcell{width:30px;text-align:center;white-space:nowrap}
.rgrid th.rcell{font-weight:600}
.rgrid th.rcell .meta{font-size:9.5px;font-weight:400;line-height:1.1}
.rgrid td.rpick{cursor:pointer;border-radius:4px}
.rgrid td.rpick:hover{outline:2px solid var(--accent);outline-offset:-2px}
.rgrid .rwe{background:var(--surface-3)}
.rgrid .rwork{background:var(--accent-soft);color:var(--accent-2);font-weight:600}
.rgrid .rnight{background:color-mix(in srgb,var(--accent) 26%,var(--surface));
  color:var(--accent-2);font-weight:600}
.rgrid .roff{color:var(--ink-3)}
.rgrid .rabs{background:var(--warn-soft);color:var(--warn);font-weight:600}

/* ლოიალობის ბარათი სალაროში — ერთი ბლოკი, არა ცალკე ბარათი:
   ჩეკის ნაწილია და არა ცალკე საქმე. */
.loybox{margin-top:10px;padding:10px 12px;border-radius:8px;
  background:var(--accent-soft);color:var(--accent-2);font-size:13px}
.loybox .meta{color:var(--accent-2);opacity:.8;margin-top:2px}

/* ── პარტნიორი ბრენდის ლოგოს გადახედვა რედაქტორში ──
   თეთრი ფონი განზრახაა: ბრენდების ლოგოები მუქ ფონზე იშვიათად
   იკითხება და აქ მთავარია, ადმინმა დაინახოს, სწორი ფაილი აირჩია. */
.blogo{
  display:flex;align-items:center;justify-content:center;
  width:64px;height:38px;border:1px solid var(--line);border-radius:8px;
  background:#fff;overflow:hidden;
}
.blogo img{max-width:56px;max-height:30px;width:auto;height:auto;display:block}

/*  წაშლის ღილაკი — განზრახ სხვა ფერისაა და დანარჩენისგან
    მოშორებით დგას: შეუქცევად მოქმედებას თვალით უნდა გამოარჩევდე. */
.btn.danger{color:var(--crit);border-color:var(--crit)}
.btn.danger:hover{background:var(--crit);color:#fff;border-color:var(--crit)}

/* ── გასუფთავების ეკრანი ──
   განზრახ სხვანაირია: ციფრები მარჯვნივ, უბნები სიაში, წითელი
   ღილაკი.  შეუქცევადი მოქმედება ჩვეულებრივ შენახვას არ უნდა ჰგავდეს. */
.rslist{display:flex;flex-direction:column}
.rsrow{display:flex;align-items:flex-start;gap:12px;padding:12px 18px;
  border-bottom:1px solid var(--line-soft);cursor:pointer}
.rsrow:last-child{border-bottom:0}
.rsrow:hover{background:var(--bg-2)}
.rsrow input{margin-top:3px;flex:0 0 auto;width:15px;height:15px;
  accent-color:var(--accent);cursor:pointer}
.rsn{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rsn b{font-size:14px}
.rsrow .num{flex:0 0 auto;color:var(--ink-3);font-size:13px;padding-top:2px}
ul.keeps{margin:0 0 10px;padding-left:20px;display:flex;flex-direction:column;gap:4px}
ul.keeps li{font-size:13.5px}
.banner.warn{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}
.banner.ok{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.banner.ok b,.banner.warn b{color:inherit}

/* ── ცხრილის სტრიქონის მდგომარეობა ──
   გამორთული ჩანაწერი ნაცრისფერია და არა დამალული: ბუღალტერმა
   უნდა დაინახოს, რომ წესი არსებობს და უბრალოდ არ მუშაობს.
   არჩეული სტრიქონი მსუბუქად შეფერადებულია — ონტენის ლურჯით. */
tbody tr.off > td { color: var(--ink-3); }
tbody tr.on > td { background: color-mix(in srgb, var(--accent) 7%, transparent); }

/* ══════════ ვის რა დაენახება — თანამშრომლის ბარათზე ══════════
   ადმინს არ უნდა უწევდეს როლების ცხრილის თავში ტარება: როლის
   მონიშვნისთანავე ჩანს, რომელი განყოფილება გაეხსნა ამ ადამიანს
   და რომელი დარჩა დახურული. */
.areaview{margin-top:12px;padding-top:10px;border-top:1px solid var(--line-soft)}
.areaview-h{font-size:12px;color:var(--ink-3);margin-bottom:6px}
.arearow{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.arearow .areaoff{opacity:.55;text-decoration:line-through}

/* ══════════════════ ბუღალტერიის სამუშაო არე ══════════════════

   ბუღალტერმა თქვა: „ძალიან ძნელი სამუშაოა". მართალი იყო — ეკრანი
   ჰაერიანი იყო, ცხრილები თხელი, ნავიგაცია გვერდით სვეტში.
   ორისსა და ბალანსში სხვაგვარადაა: მენიუ ზემოთ, ჩამოსაშლელი
   ქვეფუნქციებით; ეკრანი მთლიანად ცხრილისაა; სტრიქონები მკვრივი;
   ციფრები მონოსიგანის შრიფტით და მარჯვნივ გასწორებული.

   ფერი, ლოგო და შრიფტი ონტენისა რჩება. */

/*  ბუღალტერიაში გვერდითი ზოლი ადგილს ათავისუფლებს: ბრუნვით
    უწყისს თოთხმეტი სვეტი აქვს. */
/*  მოდულების მენიუ ბუღალტერიაშიც ადგილზე რჩება — ის მხოლოდ
    ადამიანმა უნდა დაკეცოს, თავისით არსად იმალება. */

.view.accview{padding:0;gap:0;display:flex;flex-direction:column;min-height:0}
/*  ბუღალტერიაშიც ზედა ზოლი წვრილდება: ეკრანი ცხრილისაა და
    ქვესათაური მას ადგილს ართმევს. */
.app:has(.view.accview) .appfoot{display:none}
.app:has(.view.accview) .topbar{padding-top:7px;padding-bottom:7px}
.app:has(.view.accview) .topbar .sub{display:none}
.app:has(.view.accview) .topbar h1{font-size:16px}
.app:has(.view.accview) .topbar #newTicket{display:none}
@media (min-width:901px) and (min-height:620px){
  .app:has(.view.accview){height:100dvh;min-height:0;overflow:hidden}
  .app:has(.view.accview)>main{min-height:0;overflow:hidden}
  .view.accview{flex:1;overflow:hidden}
}
@media (max-width:900px), (max-height:619px){
  .accwrap{flex-direction:column;height:auto}
  .accrail{width:auto;flex-direction:row;flex-wrap:wrap;border-right:0;
    border-bottom:1px solid var(--line)}
  .accbody{overflow:visible}
}

/* ═══════════ ქვედა ზოლი — გახსნილი ეკრანები ═══════════

   Windows-ის დავალებათა ზოლის პრინციპი: გახსნილი ფუნქცია არ
   იხურება, ქვემოთ ჩავარდება და იქ გელოდება.  დაჭერით უბრუნდები,
   ✕-ით ხურავ.  ● ნიშნავს, რომ იქ შეუნახავი ცვლილებაა.
   სალაროზე ზოლი არ ჩანს — ის მთელ ეკრანზეა. */
.taskbar{
  position:fixed;left:0;right:0;bottom:0;z-index:26;
  display:flex;align-items:center;gap:5px;min-height:38px;padding:4px 7px;
  background:var(--bar);border-top:1px solid var(--bar-line);overflow-x:auto;
}
.taskcap{
  flex:none;color:var(--bar-ink);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  padding:0 8px 0 4px;border-right:1px solid rgba(255,255,255,.22);align-self:stretch;
  display:flex;align-items:center;
}
/*  ჩანართი თეთრია და წარწერა ლურჯი — ეკრანის დანარჩენ
    ნაწილთან ერთ ენაზე.  აქტიური ლურჯ აბზაცზე ზის და ქვემოთ
    ლურჯი ზოლი უდევს, რომ ერთი შეხედვით ჩანდეს, რომელშიც ხარ. */
.task{
  display:flex;align-items:center;gap:6px;flex:none;max-width:240px;
  border:1px solid transparent;background:var(--task-bg);
  color:var(--task-ink);border-radius:7px;padding-left:9px;overflow:hidden;
}
.task:hover{background:var(--task-on-bg)}
.task.on{
  background:var(--task-on-bg);color:var(--task-on-ink);font-weight:600;
  box-shadow:inset 0 -3px 0 var(--bar-line),0 1px 6px rgba(0,0,0,.18);
}
.task-t{
  font:inherit;font-size:12.5px;background:none;border:0;color:inherit;cursor:pointer;
  padding:6px 0;max-width:168px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-align:left;
}
.taskempty{color:var(--bar-ink);opacity:.85;font-size:12px;padding:0 6px}
.task-m{color:#B8701A;font-size:14px;line-height:1;flex:none}
.task-x{
  font:inherit;font-size:12px;line-height:1;background:none;border:0;
  color:var(--task-ink);opacity:.6;cursor:pointer;padding:7px 8px;flex:none;
}
.task-x:hover{opacity:1;color:#AF3A32;background:#F7E1DF}
/*  სალაროზე ზოლი არ ჩანს — ეკრანი მთლიანად მისია. */
.app:has(.view.posview) .taskbar{display:none}
/*  ზოლი ეკრანს ქვემოთ აფარია — სამუშაო არეს იმდენივე ადგილს
    ვუტოვებთ, რამდენსაც ის იკავებს. */
.app:has(#taskbar:not([hidden]))>main{padding-bottom:42px}
/*  მენიუს ბოლო ღილაკსაც ზოლი არ უნდა აფარებდეს. */
.app:has(#taskbar:not([hidden]))>aside{height:calc(100vh - 42px)}
/*  ასისტენტის ღილაკი ზოლს ზემოთ ადის — თორემ ის ბოლო
    ჩანართს აფარებს. */
.app:has(#taskbar:not([hidden])) ~ .oai-fab,
body:has(#taskbar:not([hidden])) .oai-fab{bottom:52px}

/* ── სამუშაო ჩარჩო: მარცხნივ ფუნქციები, ზემოთ ქვეფუნქციები ── */
.accwrap{display:flex;min-height:0;height:100%;align-items:stretch}
.accrail{
  flex:none;width:156px;box-sizing:border-box;background:var(--surface);
  border-right:1px solid var(--line);padding:8px 7px;display:flex;
  flex-direction:column;gap:2px;overflow:auto;
}
.accrail-c{
  font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);
  padding:4px 9px 5px;
}
.accrail-s{
  position:relative;display:flex;align-items:center;font:inherit;font-size:12.5px;
  color:var(--ink-2);background:none;border:0;
  text-align:left;padding:8px 16px 8px 9px;border-radius:7px;cursor:pointer;line-height:1.25;
}
.accrail-d{
  position:absolute;right:6px;top:50%;margin-top:-3px;width:5px;height:5px;
  border-radius:50%;background:var(--ok);
}
.accrail-s:hover{background:var(--surface-3);color:var(--ink)}
.accrail-s.on{background:var(--accent-soft);color:var(--accent-2);font-weight:600}
.accmain{flex-grow:1;min-width:0;display:flex;flex-direction:column}

/* ── ქვეფუნქციები ზემოთ ── */
.acctabs{
  flex:none;display:flex;align-items:center;gap:2px;flex-wrap:wrap;
  background:var(--surface);border-bottom:1px solid var(--line);padding:5px 12px;
}
.acctab{
  position:relative;font:inherit;font-size:13px;color:var(--ink-2);background:none;
  border:0;border-radius:7px;padding:6px 11px;cursor:pointer;white-space:nowrap;
}
.acctab:hover{background:var(--surface-3);color:var(--ink)}
.acctab.on{background:var(--accent);color:var(--on-accent);font-weight:600}
.acctab-d{
  position:absolute;right:4px;top:4px;width:5px;height:5px;border-radius:50%;
  background:var(--ok);
}
.acctab.on .acctab-d{background:var(--on-accent)}

/* ── სამუშაო არე: ერთი ფუნქცია მთელ არეში ── */
.accbody{flex-grow:1;min-height:0;overflow:auto;background:var(--surface)}

/* ── ზედა მენიუ: ფუნქციები და ჩამოსაშლელი ქვეფუნქციები ── */
.accmenu{
  display:flex;align-items:stretch;gap:2px;flex-wrap:wrap;
  background:var(--surface);border-bottom:1px solid var(--line);padding:0 14px;
}
.accmenu-i{position:relative}
.accmenu-b{
  font:inherit;font-size:13px;font-weight:500;color:var(--ink-2);
  background:none;border:0;border-bottom:2px solid transparent;
  padding:9px 12px;cursor:pointer;display:flex;align-items:center;gap:5px;
}
.accmenu-b:hover{color:var(--ink);background:var(--surface-3)}
.accmenu-i.on>.accmenu-b{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.accmenu-i.open>.accmenu-b{background:var(--surface-3);color:var(--ink)}
.accmenu-c{font-size:9px;color:var(--ink-3)}
.accmenu-p{
  display:none;position:absolute;top:100%;left:0;z-index:20;min-width:220px;
  background:var(--surface);border:1px solid var(--line);border-radius:0 0 10px 10px;
  border-top:0;box-shadow:0 14px 34px rgba(15,23,35,.16);padding:5px;
}
.accmenu-i.open>.accmenu-p{display:block}
.accmenu-t{
  display:block;width:100%;text-align:left;font:inherit;font-size:13px;
  color:var(--ink-2);background:none;border:0;border-radius:7px;
  padding:7px 10px;cursor:pointer;white-space:nowrap;
}
.accmenu-t:hover{background:var(--surface-3);color:var(--ink)}
.accmenu-t.on{background:var(--accent-soft);color:var(--accent-2);font-weight:600}

/* ── პერიოდის ზოლი — ყოველთვის თვალწინ ── */
.accbar{
  position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--surface);border-bottom:1px solid var(--line);padding:8px 14px;
}
.accbar-t{font-size:15px;font-weight:700}
.accbar-sep{width:1px;height:20px;background:var(--line)}
.accbar-l{font-size:12px;color:var(--ink-3)}
.accbar-d{color:var(--ink-3)}
.accbar input[type=date]{
  font:inherit;font-size:12.5px;padding:4px 7px;border:1px solid var(--line);
  border-radius:6px;background:var(--surface);color:var(--ink);
  width:auto;max-width:150px;flex:none;display:inline-block;
}
.accbar>label,.accbar>span{flex:none}
.accbar-grow{flex-grow:1}
.accbar-org{font-size:12px;color:var(--ink-3)}

/* ── მკვრივი ცხრილი ── */
.accview .card{margin:0;border-radius:0;border-left:0;border-right:0;border-top:0}
.accview .card+.card{margin-top:10px;border-top:1px solid var(--line)}
.accview .card-h{padding:9px 14px}
.accview .card-h h2{font-size:13.5px}
.accview .tw{margin:0}
.accview table{font-size:12.5px}
.accview thead th{
  position:sticky;top:0;z-index:2;background:var(--surface-3);
  padding:7px 9px;font-weight:600;color:var(--ink-2);white-space:nowrap;
  border-bottom:1px solid var(--line);
}
.accview tbody td{padding:5px 9px;border-bottom:1px solid var(--line-soft);vertical-align:top}
.accview tbody tr:nth-child(even):not(.grp){background:var(--row-alt)}
.accview tbody tr.click:hover{background:var(--accent-soft)}
.accview tbody tr.grp{background:var(--surface-3)}
/*  საწყის ნაშთში შეცდომიანი ხაზი მაშინვე უნდა ჩანდეს. */
.accview tbody tr.bad,tbody tr.bad{background:var(--crit-soft)}
.accview tbody tr.grp td{font-weight:600}
.accview .num,.accview .mono{font-variant-numeric:tabular-nums}
.accview td.num{text-align:right;white-space:nowrap}
.accview .meta{font-size:11.5px}
.accview .empty{padding:28px 14px}
.accview .pill{font-size:11px;padding:1px 7px}

/*  ზოლიანი ფონი — ორივე თემაზე. */
:root{--row-alt:#FAFBFD}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--row-alt:#2E3948}
}
:root[data-theme="dark"]{--row-alt:#2E3948}

/* ══════════ ბუღალტრის დაფა ══════════
   ორი ფერი ატარებს მთელ ეკრანს: ლურჯი — მისაღები, ნარინჯისფერი —
   გადასახდელი.  ორივე შემოწმებულია ფერთა სიბრმავეზეც და ორივე
   ფონზეც; მუქ რეჟიმში საკუთარი საფეხური აქვთ და არა შებრუნებული
   იგივე ციფრი. */
:root{ --acd-in:#2A78D6; --acd-out:#EB6834; --acd-in-2:#86B6EF;
       --acd-in-soft:#E8F0FB; --acd-out-soft:#FDEEE8 }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --acd-in:#3987E5; --acd-out:#D95926; --acd-in-2:#184F95;
    --acd-in-soft:#20334A; --acd-out-soft:#3A2719 }
}
:root[data-theme="dark"]{ --acd-in:#3987E5; --acd-out:#D95926; --acd-in-2:#184F95;
  --acd-in-soft:#20334A; --acd-out-soft:#3A2719 }

.acdash{display:flex;flex-direction:column;gap:14px}
.acdash .card-h h2{font-size:14px}
.acdash .hint{font-size:11.5px}
/*  საერთო წესი ცხრილს 620 პიქსელის მინიმუმს აძლევს — დაფაზე ეს
    ვიწრო ბარათს ჰორიზონტალურ ცოცვას აიძულებდა და სვეტი იკარგებოდა. */
.acdash table{min-width:0;font-size:12.5px}
.acdash th,.acdash td{padding:7px 10px}
.acdash th:first-child,.acdash td:first-child{padding-left:16px}
.acdash th:last-child,.acdash td:last-child{padding-right:16px}
.acdash .tw{overflow-x:auto}

/* ── რვა ციფრი ── */
.ackpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ackpi{padding:12px 15px;border-left:1px solid var(--line-soft);border-top:1px solid var(--line-soft);min-width:0}
.ackpi:nth-child(4n+1){border-left:0}
.ackpi:nth-child(-n+4){border-top:0}
.acl{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-3);display:flex;align-items:baseline;gap:6px}
.accd{font-family:var(--mono,ui-monospace,monospace);letter-spacing:0;font-size:10.5px;color:var(--ink-3)}
.acsw{width:8px;height:8px;border-radius:2px;flex:none;align-self:center}
.ackpi.in .acsw,.acside.in .acsw{background:var(--acd-in)}
.ackpi.out .acsw,.acside.out .acsw{background:var(--acd-out)}
.acv{font-size:21px;font-weight:600;letter-spacing:-.015em;margin-top:4px;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.acv.sm{font-size:18px}
.acv.pos{color:var(--ok)} .acv.neg{color:var(--crit)}
.acr{margin-top:6px;display:flex;flex-direction:column;gap:2px}
.acr>div{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--ink-2);min-width:0}
.acr>div>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acr .mono{color:var(--ink);white-space:nowrap}
.acr .bad{color:var(--crit);font-weight:600}
.acr.big>div{font-size:13px;padding:3px 0;border-bottom:1px solid var(--line-soft)}
.acr.big>div:last-child{border-bottom:0}

/* ── თვის შედეგი ── */
.acstrip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.acstrip>div{padding:10px 15px;border-left:1px solid var(--line-soft);min-width:0}
.acstrip>div:first-child{border-left:0}

/* ── განლაგება ── */
.accols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px;align-items:start}
.acstack{display:flex;flex-direction:column;gap:14px;min-width:0}
/*  ორი ცხრილი გვერდიგვერდ მხოლოდ მართლა ფართო ეკრანზე:
    ვიწროში ფულის სვეტი იჭრებოდა და თანხას ვერ კითხულობდი —
    ერთმანეთის ქვეშ სრული სიგანით ჯობია. */
.actwo{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
@media (min-width:1340px){ .actwo{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
.acthree{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}

/* ── მისაღები / გადასახდელი ── */
.acduo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.acside{border-radius:8px;padding:10px 12px;border:1px solid var(--line-soft)}
.acside.in{background:var(--acd-in-soft);border-color:color-mix(in srgb,var(--acd-in) 24%,transparent)}
.acside.out{background:var(--acd-out-soft);border-color:color-mix(in srgb,var(--acd-out) 24%,transparent)}
.acover{font-size:12px;margin-top:4px;color:var(--ink-2)}
.acover b{font-weight:600}
.acover.bad b{color:var(--crit)}
.aclg{display:flex;gap:14px;font-size:12px;color:var(--ink-2);margin-left:auto}
.aclg span{display:inline-flex;align-items:center;gap:5px}
.aclg i{width:8px;height:8px;border-radius:2px}
.aclg i.in{background:var(--acd-in)} .aclg i.out{background:var(--acd-out)}

/* ── გრაფიკი ── */
.acdwrap{margin-top:12px}
.acdchart{display:block;width:100%;height:auto}
.acdg{stroke:var(--line)}
.acdt{fill:var(--ink-3);font-size:10.5px;font-family:var(--mono,ui-monospace,monospace)}
.acdm{fill:var(--ink-3);font-size:11px}
.acdm.on{fill:var(--ink-2);font-weight:600}
.acdb.in{fill:var(--acd-in)} .acdb.out{fill:var(--acd-out)}

/* ── ზოლი ცხრილის უჯრაში ── */
.actrack{display:block;height:4px;border-radius:2px;margin-top:4px;background:var(--surface-2)}
.acbar{display:block;height:4px;border-radius:2px;margin-left:auto}
.acbar.in{background:var(--acd-in)} .acbar.out{background:var(--acd-out)}
.acdash td.bad,.acdash .mono.bad{color:var(--crit)}
.acdash .mono.good{color:var(--ok)}

/* ── გადახრა ორივე მხარეს ── */
.acdv{position:relative;display:block;height:12px}
.acdv::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line)}
.acdvb{position:absolute;top:3px;height:6px}
.acdvb.over{left:50%;background:var(--crit);border-radius:0 3px 3px 0}
.acdvb.under{right:50%;background:var(--ok);border-radius:3px 0 0 3px}

/* ── დავალებები ── */
.acfeed{list-style:none;margin:0;padding:0}
.acfeed li{display:grid;grid-template-columns:20px 1fr;gap:9px;padding:10px 16px;
  border-bottom:1px solid var(--line-soft)}
.acfeed li:last-child{border-bottom:0}
.acav{width:20px;height:20px;border-radius:5px;display:grid;place-items:center;font-size:10px;
  font-weight:700;background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line)}
.acwho{font-size:11px;font-weight:600;color:var(--ink-3);letter-spacing:.03em}
.acwhat{font-size:13px;margin-top:1px}
.acwhen{font-size:11.5px;color:var(--ink-2);margin-top:2px}
.acwhen.crit{color:var(--crit);font-weight:600}
.acwhen.warn{color:var(--warn);font-weight:600}

/* ── სიები ── */
.aclines{display:flex;flex-direction:column}
.aclines>div{display:flex;align-items:center;gap:9px;padding:8px 16px;
  border-bottom:1px solid var(--line-soft);font-size:13px}
.aclines>div:last-child{border-bottom:0}
.aclines>div.click{cursor:pointer}
.aclines>div.click:hover{background:var(--surface-3)}
.acd{width:7px;height:7px;border-radius:50%;flex:none;background:var(--ink-3)}
.acd.in{background:var(--acd-in)} .acd.ok{background:var(--ok)}
.acd.warn{background:var(--warn)} .acd.crit{background:var(--crit)}
.aclines .r{margin-left:auto;font-size:12px;color:var(--ink-2);
  font-family:var(--mono,ui-monospace,monospace);white-space:nowrap}
.aclines .r b{color:var(--ink);font-weight:600}

.ackv>div{display:flex;justify-content:space-between;gap:10px;padding:7px 16px;
  border-bottom:1px solid var(--line-soft);font-size:13px}
.ackv>div:last-child{border-bottom:0}
.ackv>div.tot{background:var(--surface-3);font-weight:600}

/* ── ცვეთის წილი ── */
.acmeter{display:flex;height:12px;border-radius:6px;overflow:hidden;margin-top:12px;gap:2px}
.acmeter i{display:block}
.acmeter i.worn{background:var(--acd-in-2)} .acmeter i.rest{background:var(--acd-in)}
.acmkey{display:flex;justify-content:space-between;margin-top:7px;font-size:11.5px;color:var(--ink-2)}
.acmkey span{display:inline-flex;align-items:center;gap:5px}
.acmkey i{width:8px;height:8px;border-radius:2px}
.acmkey i.worn{background:var(--acd-in-2)} .acmkey i.rest{background:var(--acd-in)}

/* ── სად გადავიდეთ ── */
.acpick{display:flex;flex-wrap:wrap;gap:7px;padding:12px 16px 14px}
.acpick button{font:inherit;font-size:12.5px;font-weight:500;padding:7px 12px;border-radius:8px;
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink);cursor:pointer}
.acpick button:hover{border-color:color-mix(in srgb,var(--acd-in) 45%,var(--line));background:var(--surface)}
.acpick button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width:1180px){ .accols{grid-template-columns:1fr} .acthree{grid-template-columns:1fr 1fr} }
@media (max-width:900px){
  .ackpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ackpi:nth-child(4n+1){border-left:1px solid var(--line-soft)}
  .ackpi:nth-child(2n+1){border-left:0}
  .ackpi:nth-child(-n+4){border-top:1px solid var(--line-soft)}
  .ackpi:nth-child(-n+2){border-top:0}
  .acstrip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .acstrip>div{border-left:0;border-top:1px solid var(--line-soft)}
  .acstrip>div:nth-child(-n+2){border-top:0}
  .actwo,.acthree{grid-template-columns:1fr}
}
@media (max-width:560px){
  .ackpis{grid-template-columns:1fr}
  .ackpi{border-left:0!important;border-top:1px solid var(--line-soft)!important}
  .ackpi:first-child{border-top:0!important}
  .acduo{grid-template-columns:1fr}
}