:root { --bg:#f5f6f8; --card:#fff; --ink:#1d2330; --muted:#6b7280; --line:#e3e6eb; --pri:#2563eb; --pri-ink:#fff;
  --red:#dc2626; --amber:#b45309; --amber-bg:#fef3c7; --green:#15803d; --green-bg:#dcfce7; --sel:#eff6ff; }
@media (prefers-color-scheme: dark) { :root { --bg:#111418; --card:#1a1f26; --ink:#e5e7eb; --muted:#9ca3af; --line:#2c333d;
  --pri:#3b82f6; --amber:#fbbf24; --amber-bg:#3a2f12; --green:#4ade80; --green-bg:#12301d; --sel:#16243a; } }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--ink); }
.hidden { display:none !important; }
.muted { color:var(--muted); } .small { font-size:12px; } .grow { flex:1; } .err { color:var(--red); min-height:1em; }
input, select { font:inherit; color:inherit; background:var(--card); border:1px solid var(--line); border-radius:6px; padding:6px 8px; }
input:focus, select:focus { outline:2px solid var(--pri); outline-offset:-1px; }
.btn { font:inherit; border:1px solid var(--line); background:var(--card); color:var(--ink); border-radius:6px; padding:6px 12px; cursor:pointer; }
.btn.primary { background:var(--pri); border-color:var(--pri); color:var(--pri-ink); }
.btn.danger { color:var(--red); }
.btn.ghost { background:transparent; }
.btn.small { padding:3px 8px; font-size:12px; }
.btn:disabled { opacity:.5; cursor:default; }
.login { min-height:100vh; display:grid; place-items:center; padding:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:24px; width:min(340px,100%); display:grid; gap:12px; }
.card h1 { margin:0; font-size:20px; } .card p { margin:0; }
label { display:grid; gap:4px; font-size:12px; color:var(--muted); }
label input { font-size:14px; }
.top { display:flex; align-items:center; gap:16px; padding:10px 16px; background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; flex-wrap:wrap; }
.tab { font:inherit; background:none; border:0; padding:6px 10px; border-radius:6px; cursor:pointer; color:var(--muted); }
.tab.active { background:var(--sel); color:var(--pri); font-weight:600; }
.notice { margin:12px 16px 0; padding:8px 12px; background:var(--amber-bg); color:var(--amber); border-radius:8px; font-size:12px; }
section { padding:12px 16px 40px; }
.filters, .bulk { display:flex; gap:8px; align-items:end; flex-wrap:wrap; margin-bottom:10px; }
.filters input[type=search] { min-width:240px; flex:1; }
.chk { display:flex; flex-direction:row; align-items:center; gap:6px; color:var(--ink); font-size:13px; }
.bulk { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:8px 10px; position:sticky; top:52px; z-index:4; }
.bulk input[type=number] { width:80px; } .bulk .date { width:110px; }
#selInfo { font-weight:600; margin-right:8px; align-self:center; }
.tablewrap { overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:8px; }
table { border-collapse:collapse; width:100%; }
th, td { padding:6px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { font-size:12px; color:var(--muted); font-weight:600; background:var(--card); white-space:nowrap; }
td.r, th.r { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; } .c { text-align:center; width:32px; }
tr.sel td { background:var(--sel); }
td img { width:40px; height:40px; object-fit:contain; display:block; }
.noimg { width:40px; height:40px; border:1px dashed var(--line); border-radius:4px; }
.name a { color:inherit; text-decoration:none; } .name a:hover { text-decoration:underline; }
.sku { color:var(--muted); font-size:12px; }
.pill { display:inline-block; padding:1px 6px; border-radius:10px; font-size:11px; margin-left:4px; white-space:nowrap; }
.pill.warn { background:var(--amber-bg); color:var(--amber); } .pill.ok { background:var(--green-bg); color:var(--green); }
.old { text-decoration:line-through; color:var(--muted); font-size:12px; margin-right:4px; }
.pager { text-align:center; margin-top:12px; }
#hist { background:var(--card); border:1px solid var(--line); border-radius:8px; }
dialog { border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--ink); width:min(440px, calc(100% - 32px)); padding:20px; }
dialog::backdrop { background:rgba(0,0,0,.35); }
dialog h3 { margin:0 0 4px; font-size:16px; }
dialog form { display:grid; gap:10px; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.row { display:flex; gap:8px; align-items:center; }
.toast { position:fixed; bottom:16px; left:50%; transform:translateX(-50%); background:var(--ink); color:var(--bg); padding:8px 14px; border-radius:8px; z-index:50; max-width:calc(100% - 32px); }
@media (max-width:700px) { .bulk { position:static; } .filters input[type=search] { min-width:0; width:100%; } }
.filters select { max-width:100%; min-width:0; }
@media (max-width:700px) { .filters select { flex:1 1 100%; } }
.pub { display:flex; gap:6px; align-items:center; }
.dot { width:8px; height:8px; border-radius:50%; display:inline-block; background:var(--muted); }
.dot.ok { background:var(--green); } .dot.busy { background:var(--pri); } .dot.bad { background:var(--red); }
.alert { margin:12px 16px 0; padding:10px 12px; border-radius:8px; border:1px solid var(--red); color:var(--red); background:var(--card); font-size:13px; display:flex; gap:12px; align-items:center; flex-wrap:wrap; }

.imgbtn { position:relative; border:0; padding:0; background:none; cursor:pointer; display:block; }
.imgbtn .noimg { display:grid; place-items:center; color:var(--muted); font-size:18px; }
.imgbtn .cnt { position:absolute; right:-4px; bottom:-4px; background:var(--ink); color:var(--bg); font-size:10px; border-radius:8px; padding:0 4px; }
dialog.wide { width:min(860px, calc(100% - 32px)); }
.dlgbody { display:grid; gap:10px; } .dlgbody h4 { margin:8px 0 0; font-size:14px; }
.imgs { display:flex; flex-wrap:wrap; gap:10px; }
.imgs figure { margin:0; position:relative; border:1px solid var(--line); border-radius:8px; padding:6px; width:150px; display:grid; gap:6px; }
.imgs img { width:100%; height:130px; object-fit:contain; background:#fff; border-radius:4px; }
.imgs .main { position:absolute; top:8px; left:8px; margin:0; }
.imgs figcaption { display:flex; gap:4px; flex-wrap:wrap; }
.row.wrap { flex-wrap:wrap; } .upl { display:inline-block; }
.sug { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; max-height:340px; overflow:auto; }
.sugi { font:inherit; color:inherit; text-align:left; border:1px solid var(--line); background:var(--card); border-radius:8px; padding:6px; cursor:pointer; display:grid; gap:4px; }
.sugi:hover { border-color:var(--pri); }
.sugi img { width:100%; height:90px; object-fit:contain; background:#fff; border-radius:4px; }
.sugi span { font-size:12px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.sugi small { color:var(--pri); font-size:11px; }
.sug > p { grid-column:1 / -1; }

/* bioproduct: qiymət şəbəkəsi */
td.pc { cursor:pointer; min-width:92px; }
td.pc:hover { background:var(--sel); }
td.pc .v { font-weight:600; }
td.pc.rate .v { font-weight:400; color:var(--muted); }
td.pc.none .v { color:var(--red); font-weight:400; }
td.pc .d { display:block; font-size:11px; color:var(--muted); }
td.pc .d.stale { color:var(--amber); }
td.pc.focus { box-shadow:inset 0 0 0 2px var(--pri); }
tr.hid td { opacity:.55; }
.legend { display:flex; gap:12px; flex-wrap:wrap; font-size:12px; color:var(--muted); margin:0 0 8px; }
.legend b { color:var(--ink); }