:root{--bg:#f5f6f8;--card:#fff;--text:#1d2330;--muted:#6b7280;--line:#e3e6eb;--accent:#0d5eaf;--accent2:#e30613;--ok:#16794a;--warn:#a15c00}
*{box-sizing:border-box}
body{margin:0;font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--accent)}
.topbar{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--accent);color:#fff;position:sticky;top:0;z-index:5}
.topbar a,.topbar .link{color:#fff;text-decoration:none;margin-right:1rem;font:inherit}
.brand{font-weight:700;font-size:1.2rem}
.badge{background:var(--accent2);border-radius:10px;padding:0 .45rem;font-size:.8rem}
main{max-width:1200px;margin:0 auto;padding:1rem}
.foot{max-width:1200px;margin:2rem auto;padding:1rem;color:var(--muted);font-size:.85rem}
h1{font-size:1.4rem;margin:.5rem 0 1rem}
.flash{padding:.6rem .8rem;border-radius:6px;margin-bottom:.75rem;background:#e7f5ee;color:var(--ok)}
.flash-warn,.flash-err{background:#fff4e5;color:var(--warn)}
.flash-err{background:#fde8e8;color:#9b1c1c}
form.inline{display:inline}
button,.btn{background:var(--accent);color:#fff;border:0;border-radius:6px;padding:.5rem .9rem;font:inherit;cursor:pointer;text-decoration:none;display:inline-block}
button.secondary,.btn.secondary{background:#fff;color:var(--accent);border:1px solid var(--accent)}
button.danger{background:var(--accent2)}
button.link{background:none;padding:0;color:inherit;cursor:pointer}
input,select,textarea{font:inherit;padding:.45rem .55rem;border:1px solid var(--line);border-radius:6px;background:#fff;max-width:100%}
label{display:block;margin:.5rem 0 .2rem;font-weight:600}
.form{max-width:480px;background:var(--card);padding:1rem 1.25rem;border-radius:10px}
.form input,.form textarea,.form select{width:100%}
.layout{display:grid;grid-template-columns:240px 1fr;gap:1rem}
@media(max-width:800px){.layout{grid-template-columns:1fr}.cats{max-height:220px;overflow:auto}}
.cats{background:var(--card);border-radius:10px;padding:.5rem;font-size:.9rem}
.cats a{display:flex;justify-content:space-between;padding:.3rem .5rem;border-radius:6px;text-decoration:none;color:var(--text)}
.cats a.on,.cats a:hover{background:#e8f0fb}
.cats small{color:var(--muted)}
.search{display:flex;gap:.5rem;margin-bottom:1rem}.search input{flex:1}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.75rem}
.card{background:var(--card);border-radius:10px;padding:.75rem;display:flex;flex-direction:column;gap:.35rem;position:relative}
.card img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff}
.card .name{font-weight:600;font-size:.92rem}
.card .el{color:var(--muted);font-size:.78rem}
.card .price{font-size:1.25rem;font-weight:700;color:var(--accent2)}
.card .tag{position:absolute;top:.5rem;left:.5rem;background:var(--accent2);color:#fff;font-size:.72rem;padding:.1rem .4rem;border-radius:4px;max-width:85%}
.card form{display:flex;gap:.4rem;margin-top:auto}
.card form input{width:5rem}
.pager{display:flex;gap:.4rem;margin:1rem 0;flex-wrap:wrap}
.pager a,.pager span{padding:.3rem .6rem;background:var(--card);border-radius:6px;text-decoration:none}
.pager span{background:var(--accent);color:#fff}
table{width:100%;border-collapse:collapse;background:var(--card);border-radius:10px;overflow:hidden}
th,td{padding:.5rem .6rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{background:#eef1f5;font-size:.85rem}
td.num,th.num{text-align:right;white-space:nowrap}
.thumb{width:48px;height:48px;object-fit:contain}
.totals{margin-top:1rem;background:var(--card);padding:1rem;border-radius:10px;max-width:420px;margin-left:auto}
.totals div{display:flex;justify-content:space-between}
.totals .grand{font-weight:700;font-size:1.15rem;border-top:1px solid var(--line);padding-top:.4rem;margin-top:.4rem}
.muted{color:var(--muted)}
.filters{display:flex;flex-wrap:wrap;gap:.75rem;align-items:end;background:var(--card);padding:.75rem;border-radius:10px;margin-bottom:1rem}
.filters label{margin:0 0 .2rem;font-size:.85rem}
.st{padding:.1rem .45rem;border-radius:4px;font-size:.8rem;background:#eef1f5;white-space:nowrap}
.st-new{background:#e8f0fb;color:var(--accent)}.st-cancelled{background:#fde8e8;color:#9b1c1c}.st-delivered{background:#e7f5ee;color:var(--ok)}
.pick-cat{margin:1.25rem 0 .4rem;font-size:1.05rem}
.pick td.who{font-size:.85rem}
.chk{width:1.4rem;height:1.4rem}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:800px){.cols{grid-template-columns:1fr}}
.box{background:var(--card);padding:1rem;border-radius:10px}
@media print{.topbar,.filters,.noprint,.foot{display:none!important}body{background:#fff}main{max-width:none;padding:0}table{font-size:11px}th,td{padding:.25rem .35rem}}
.card a.name{color:var(--text);text-decoration:none}
.card.expired img{filter:grayscale(.7);opacity:.75}
.card.expired .price{color:var(--muted)}
.tag-old{background:#6b7280}
.price-big{font-size:1.8rem;font-weight:700;color:var(--accent2);margin:.5rem 0}
.card.in-run{outline:2px solid var(--ok)}
tr.pi-taken td{background:#f0faf4}tr.pi-out td{background:#fdf0f0}tr.pi-partial td{background:#fff8ec}
/* Изглед за магазина (мобилен) */
body.shop{background:#eef1f5}
.shop-head{position:sticky;top:0;z-index:5;display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:calc(.6rem + env(safe-area-inset-top,0px)) .8rem .6rem;background:var(--accent);color:#fff}
.shop-head a{color:#fff;font-size:1.5rem;text-decoration:none}
.shop-head .toggle{font-size:.85rem;display:flex;gap:.3rem;align-items:center;margin:0;font-weight:400}
.shop-list{padding:.5rem;max-width:700px}
.shop-cat{margin:1rem .25rem .4rem;font-size:.95rem;color:var(--muted);text-transform:uppercase;letter-spacing:.02em}
.si{display:flex;gap:.6rem;background:#fff;border-radius:12px;padding:.6rem;margin-bottom:.5rem;border-left:6px solid #cbd2db}
.si img{width:72px;height:72px;object-fit:contain;flex:none}
.si-body{flex:1;min-width:0}
.si-el{font-weight:700;font-size:1.02rem}
.si-bg{color:var(--muted);font-size:.85rem}
.si-meta{margin:.25rem 0;font-size:.95rem}
.si-plan{font-size:1.1rem}
.si-state{font-weight:700;margin-left:.3rem}
.si-actions{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.si-actions button{padding:.6rem .8rem;font-size:1rem;border-radius:8px}
.si-actions input{width:5rem;padding:.55rem;font-size:1rem}
.b-ok{background:var(--ok)}.b-out{background:var(--accent2)}.b-qty{background:var(--accent)}.b-reset{background:#9aa3ae}
.si-taken{border-left-color:var(--ok);opacity:.6}.si-taken .si-state{color:var(--ok)}
.si-partial{border-left-color:#e3a008}.si-partial .si-state{color:var(--warn)}
.si-out{border-left-color:var(--accent2);opacity:.6}.si-out .si-state{color:var(--accent2)}
.si.busy{opacity:.4}
body.hide-done .si:not(.si-pending){display:none}
.card .tag-week{left:auto;right:.5rem;background:var(--accent)}