/* 15-r208.css — v1.19.208: denser glass for lists and menus, a floating close button on every window, shortcut popup, settings groups, product number. */

/* ── lists and menus: frosted, with a rim, never see-through ── */
.csel-dd,.prod-pick-dd,.ldg-list,.addr-suggest-box,.ax-fly,.ax-qc-menu,.r8-shp{
  background:color-mix(in srgb,var(--card,#10231d) 86%,transparent)!important;
  -webkit-backdrop-filter:blur(30px) saturate(1.5)!important;backdrop-filter:blur(30px) saturate(1.5)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
html.silk .csel-dd,html.silk .prod-pick-dd,html.silk .ldg-list,html.silk .addr-suggest-box,html.silk .ax-fly,html.silk .ax-qc-menu,html.silk .r8-shp{
  background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015)),rgba(20,21,25,.82)!important;
  border-color:rgba(255,255,255,.16)!important;
}
html.light .csel-dd,html.light .prod-pick-dd,html.light .ldg-list,html.light .addr-suggest-box,html.light .ax-fly,html.light .ax-qc-menu,html.light .r8-shp,
html.silk.light .csel-dd,html.silk.light .prod-pick-dd,html.silk.light .ldg-list,html.silk.light .addr-suggest-box,html.silk.light .ax-fly,html.silk.light .ax-qc-menu,html.silk.light .r8-shp{
  background:rgba(255,255,255,.86)!important;border-color:rgba(16,17,20,.12)!important;box-shadow:0 18px 40px rgba(16,17,20,.16)!important;
}
.ldg-list{z-index:60;}

/* ── floating close button: stays in the corner while the window scrolls ── */
.r8-x{position:fixed;z-index:30;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;padding:0;margin:0;cursor:pointer;color:var(--cream);
  background:color-mix(in srgb,var(--card,#10231d) 82%,transparent);border:1px solid var(--border);box-shadow:0 6px 18px rgba(0,0,0,.35);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:background .2s,transform .2s;}
.r8-x:hover{background:var(--bg3);transform:scale(1.08);}
html.silk .r8-x{background:rgba(30,31,36,.85);border-color:rgba(255,255,255,.18);color:var(--text,#f4f5f6);}
html.silk.light .r8-x{background:rgba(255,255,255,.92);border-color:rgba(16,17,20,.12);color:#101114;}
.ax-panel{position:relative;}

/* ── shortcut popup (right-click) ── */
.r8-shp{position:fixed;z-index:200001;width:290px;max-width:calc(100vw - 16px);border-radius:16px;padding:14px;color:var(--cream);font-size:13px;}
.r8-shp-h{display:flex;flex-direction:column;gap:2px;margin-bottom:10px;}
.r8-shp-h b{font-size:14px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.r8-shp-h small{color:var(--muted);font-size:11.5px;}
.r8-shp-key{direction:ltr;text-align:center;font-family:monospace;font-size:16px;font-weight:700;padding:10px;border-radius:11px;border:1px dashed var(--border);outline:0;background:rgba(255,255,255,.04);}
.r8-shp-key:focus{border-color:var(--gold2);}
.r8-shp-key.empty{font-family:inherit;font-size:13px;font-weight:600;color:var(--muted);}
.r8-shp-msg{min-height:0;margin-top:8px;font-size:12px;line-height:1.6;}
.r8-shp-msg.bad{color:#ff7b7b;} .r8-shp-msg.warn{color:#f0c060;} .r8-shp-msg.ok{color:#7fd8a8;}
.r8-shp-sug{margin-top:8px;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.r8-shp-act{display:flex;gap:6px;margin-top:12px;}
.r8-shp-act .btn{flex:1;justify-content:center;}
.r8-shp-act .btn[disabled]{opacity:.45;pointer-events:none;}
.r8-chip{direction:ltr;padding:4px 10px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--cream);font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;}
.r8-chip:hover{background:var(--bg3);}

/* ── settings in groups ── */
#pg-settings .r8-set-nav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 16px;position:sticky;top:0;z-index:5;padding:6px 0;}
#pg-settings .r8-set-grp{margin-bottom:22px;scroll-margin-top:60px;}
#pg-settings .r8-set-h{font-size:15px;font-weight:800;margin:0 4px 10px;color:var(--cream);}
/* v1.19.209: packed like bricks (columns), no holes; the number of columns follows the number of cards (set by r8SettingsCols) */
#pg-settings .r8-set-cards{display:block;column-gap:14px;columns:var(--r8-cols,2);}
#pg-settings .r8-set-cards>.card{margin:0 0 14px;min-width:0;break-inside:avoid;page-break-inside:avoid;display:block;width:100%;box-sizing:border-box;}
#pg-settings .r8-set-cards>.card .cbtn{min-width:0;white-space:nowrap;}
#pg-settings .r8-set-cards>.card [style*="flex-wrap"]{row-gap:8px;}

/* ── product number on the sales screen ── */
.pos-sn{font-size:10.5px;font-weight:700;color:var(--muted);direction:ltr;text-align:start;line-height:1.2;}
.inv-sn{font-size:11px;font-weight:700;color:var(--muted);direction:ltr;unicode-bidi:isolate;}

/* ── add-ingredient button under the list ── */
.mx-add-ing{margin:6px 0 2px;}

/* ── v1.19.209 ── */
/* the light on glass sits under the pointer (a fixed background is wrong inside moved/scaled windows) */
html.silk .sidebar,html.silk .modal,html.silk .float-win,html.silk .sb-handle{--s-gx:-999px;--s-gy:-999px;}
html.silk .sidebar::after,html.silk .modal::after,html.silk .float-win::after,html.silk .sb-handle::before{background-attachment:scroll!important;}
/* a floating calculator window has no drawn pointer, so it keeps the system one */
html.silk.silk-ptr body.float-ext-body,html.silk.silk-ptr body.float-ext-body *{cursor:default!important;}
html.silk.silk-ptr body.float-ext-body input{cursor:text!important;}
/* the sidebar can be made wider or narrower by dragging its inner edge */
.sb-resize{display:none;}
@media (min-width:769px){
  .sidebar{width:var(--sbw)!important;position:relative;}
  .app.sb-collapsed .sidebar{width:0!important;}
  .sb-resize{display:block;position:fixed;top:0;bottom:0;inset-inline-start:calc(var(--sbw) - 5px);width:10px;cursor:col-resize;z-index:59;}
  html.silk .sb-resize{inset-inline-start:calc(var(--sbw) + 5px);}
  .app.sb-collapsed ~ .sb-resize,.sb-collapsed .sb-resize{display:none;}
  .sb-resize::after{content:"";position:absolute;top:50%;inset-inline-start:3px;width:3px;height:44px;margin-top:-22px;border-radius:3px;background:var(--border);opacity:0;transition:opacity .2s;}
  .sb-resize:hover::after,.sb-resizing .sb-resize::after{opacity:1;}
  .sb-resizing,.sb-resizing *{cursor:col-resize!important;user-select:none!important;}
  .sb-resizing .sidebar,.sb-resizing .sb-handle{transition:none!important;}
  html.silk.silk-ptr .sb-resize{cursor:none!important;}
}
/* product info on the sales screen */
.pos-card{position:relative;}
.pos-info-btn{position:absolute;top:8px;inset-inline-start:8px;z-index:3;width:24px;height:24px;border-radius:50%;padding:0;display:grid;place-items:center;
  font:italic 800 13px/1 Georgia,serif;color:var(--cream);background:color-mix(in srgb,var(--card,#10231d) 70%,transparent);border:1px solid var(--border);cursor:pointer;opacity:.75;transition:opacity .2s,transform .2s;}
.pos-info-btn:hover{opacity:1;transform:scale(1.08);}
.r9-info-ov{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;}
.r9-info{width:min(440px,100%);max-height:86vh;overflow:auto;padding:22px!important;}
.r9-info h3{margin:0 0 12px;font-size:17px;font-weight:800;}
.r9-img{width:100%;max-height:180px;object-fit:cover;border-radius:12px;margin-bottom:12px;}
.r9-kv{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--border);font-size:13px;}
.r9-kv span{color:var(--muted);} .r9-kv b{font-weight:700;text-align:end;}
.r9-sub{margin:14px 0 4px;font-weight:800;font-size:13px;}
/* returns: the list fills the page */
#pg-returns .tw-scroll{max-height:calc(100vh - 250px);min-height:300px;}
.r9-forced{opacity:.6;pointer-events:none;}
.r8-own-x{display:none!important;}
/* reports (v1.19.209) */
#pg-reports .stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;}
.r9-rep-ex{display:inline-flex;gap:6px;}
.r9-split{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.r9-split>div{flex:1;min-width:140px;display:flex;justify-content:space-between;gap:8px;padding:9px 12px;border:1px solid var(--border);border-radius:11px;font-size:13px;}
.r9-split span{color:var(--muted);}
.r9-hours{display:flex;align-items:flex-end;gap:4px;height:150px;padding:8px 2px 0;border-bottom:1px solid var(--border);overflow-x:auto;direction:ltr;}
.r9-hbar{flex:1;min-width:22px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;}
.r9-hfill{width:100%;max-width:34px;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--gold2),color-mix(in srgb,var(--gold2) 35%,transparent));}
.r9-hbar span{font-size:10.5px;color:var(--muted);margin-top:4px;}
.r9-hbar em{position:absolute;top:0;font-style:normal;font-size:10px;font-weight:700;color:var(--cream2);}
.r9-time{direction:ltr;font-weight:700;white-space:nowrap;}
/* invoice issuing */
.iss-b-ok{background:rgba(127,216,168,.16)!important;color:#7fd8a8!important;}
.iss-b-pend{background:rgba(240,192,96,.16)!important;color:#f0c060!important;}
.iss-ov{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;}
.iss-panel{width:min(640px,100%);max-height:88vh;display:flex;flex-direction:column;padding:22px!important;}
.iss-panel h3{margin:0 0 8px;font-size:17px;font-weight:800;}
.iss-list{overflow:auto;flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;}
.iss-inv{border:1px solid var(--border);border-radius:12px;padding:10px 12px;}
.iss-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px;font-size:13px;} .iss-h span{color:var(--muted);}
.iss-t{width:100%;font-size:12.5px;border-collapse:collapse;} .iss-t td{padding:4px 0;border-bottom:1px dashed var(--border);} .iss-v{text-align:end;font-weight:700;}
.iss-l{display:flex;justify-content:space-between;font-size:12.5px;padding-top:5px;} .iss-tot{font-weight:800;font-size:14px;}
.iss-ed{margin-top:6px;font-size:11.5px;color:#f0c060;}
.iss-act{display:flex;gap:8px;margin-top:14px;} .iss-act .btn{flex:1;justify-content:center;}
.iss-detail{margin-bottom:10px;font-size:12.5px;} .iss-detail:empty{display:none;}
.iss-ok{padding:9px 12px;border-radius:10px;background:rgba(127,216,168,.1);color:#7fd8a8;}
.iss-pend{padding:9px 12px;border-radius:10px;background:rgba(240,192,96,.1);color:#f0c060;}
.iss-hash{font-family:monospace;font-size:10px;opacity:.7;word-break:break-all;margin-top:4px;direction:ltr;}
.iss-hist{padding:9px 12px;border-radius:10px;border:1px solid var(--border);}
.iss-hrow{display:flex;flex-direction:column;gap:2px;padding:5px 0;border-top:1px dashed var(--border);font-size:12px;} .iss-hrow span:first-child{color:var(--muted);}
/* v1.19.209: on a phone the Max look turned the side menu into a full-screen block that pushed the page below the screen,
   so nothing could be tapped. The menu is a drawer again. */
@media (max-width:768px){
  html.silk .sidebar{position:fixed!important;top:0;height:100vh!important;margin:0!important;border-radius:0!important;z-index:1000;}
}
/* v1.19.213 */
.r8-x{width:32px!important;height:32px!important;}
.r8-xpad{padding-top:52px!important;}
.ax-panel.r8-xpad{padding-top:52px!important;}
/* wider lists, and the list can be widened by its corner */
.csel-dd{min-width:220px;max-width:92vw;resize:horizontal;}
#pg-reports .csel-wrap:has(#rep-period){min-width:200px;}
/* accounts: no emoji, a dot in the account colour */
.acct-ic:empty{display:inline-grid;place-items:center;}
.acct-ic:empty::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;opacity:.75;}
.fg:has(#acct-f-icon){display:none!important;}
/* total debts (currencies page) */
.r13-debts{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.r13-db{display:flex;flex-direction:column;gap:3px;padding:14px;border:1px solid var(--border);border-radius:14px;}
.r13-db>span{color:var(--muted);font-size:12.5px;} .r13-db>b{font-size:22px;font-weight:800;} .r13-db>small{color:var(--muted);margin-bottom:6px;}
.r13-owe>b{color:#ff7b7b;} .r13-owed>b{color:#7fd8a8;}
.r13-dl{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;padding:5px 0;border-top:1px dashed var(--border);}
