/* Админка Иннорто Опт — фирменный стиль (navy + оранжевый #ff8210) */
:root{
  --navy:#000f22; --navy-2:#0a2036; --ink:#12233b; --muted:#5b6b7f;
  --line:#e8ebf0; --bg:#f7f8fa; --card:#ffffff; --accent:#ff8210; --accent-d:#e8720a;
  --ok:#1a8a54; --warn:#c47f12; --danger:#c8402f; --danger-bg:#fdeeeb;
  --r:14px; --r-sm:9px; --shadow:0 1px 2px rgba(16,32,58,.05),0 8px 24px rgba(16,32,58,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Manrope",Arial,sans-serif;
  color:var(--ink);background:var(--bg);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
.num,.mono{font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums}
a{color:var(--accent-d);text-decoration:none}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.01em}

/* ---- Кнопки ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:600;
  padding:9px 16px;border-radius:var(--r-sm);transition:.15s;white-space:nowrap}
.btn:hover{border-color:#cfd6df}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn--primary:hover{background:var(--accent-d);border-color:var(--accent-d)}
.btn--dark{background:var(--navy);border-color:var(--navy);color:#fff}
.btn--ghost{background:transparent}
.btn--danger{color:var(--danger);border-color:#f0ccc6}
.btn--danger:hover{background:var(--danger-bg)}
.btn--sm{padding:6px 11px;font-size:13px}
.btn--block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ---- Формы ---- */
.fld{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.fld>span{font-size:12.5px;font-weight:600;color:var(--muted)}
.fld input,.fld select,.fld textarea{font:inherit;padding:9px 11px;border:1px solid var(--line);
  border-radius:var(--r-sm);background:#fff;color:var(--ink);width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,130,16,.12)}
.fld textarea{min-height:70px;resize:vertical}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row>.fld{flex:1;min-width:150px}
.hint{font-size:12px;color:var(--muted)}

/* ---- Логин ---- */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#0a1a2e,#000f22);padding:20px}
.login-card{width:100%;max-width:360px;background:#fff;border-radius:var(--r);padding:28px;box-shadow:var(--shadow)}
.login-brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px;color:var(--muted);margin-bottom:18px}
.login-mark{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:var(--navy);color:#fff;font-weight:800}
.login-title{font-size:22px;margin-bottom:20px}
.login-err{margin-top:12px;padding:9px 12px;border-radius:var(--r-sm);background:var(--danger-bg);color:var(--danger);font-size:13.5px}

/* ---- Каркас админки ---- */
.app{display:grid;grid-template-columns:230px 1fr;min-height:100vh}
.side{background:var(--navy);color:#c6d2e0;padding:18px 0;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.side-brand{display:flex;align-items:center;gap:9px;font-weight:800;color:#fff;padding:0 20px 18px;font-size:15px}
.side-brand .login-mark{width:28px;height:28px}
.nav{display:flex;flex-direction:column;gap:2px;padding:0 10px}
.nav a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:9px;color:#c6d2e0;font-weight:600;font-size:14px;cursor:pointer}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav a.active{background:var(--accent);color:#fff}
.nav .badge{background:var(--accent);color:#fff;border-radius:20px;padding:1px 8px;font-size:12px;font-weight:700}
.nav a.active .badge{background:rgba(255,255,255,.25)}
.side-foot{margin-top:auto;padding:14px 20px 0;font-size:12.5px;color:#8ea3ba}
.side-foot b{color:#fff;display:block}

.main{padding:26px 30px;overflow:auto;max-height:100vh}
.head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.head h1{font-size:24px}
.tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search{position:relative}
.search input{padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);min-width:230px;background:#fff}

/* ---- Карточки/таблицы ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:12px;text-transform:none;color:var(--muted);text-align:left;font-weight:600;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:#fafbfc}
.thumb{width:44px;height:44px;border-radius:8px;object-fit:cover;background:#eef1f5;border:1px solid var(--line)}
.thumb--empty{display:grid;place-items:center;color:#b7c0cc;font-size:18px}
.pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:600;background:#eef1f5;color:var(--muted)}
.pill--promo{background:#fff1e3;color:var(--accent-d)}
.pill--med{background:#e7f3ee;color:var(--ok)}
.pill--new{background:#fff1e3;color:var(--accent-d)}
.pill--in_progress{background:#eaf1fb;color:#2b62c4}
.pill--done{background:#e7f3ee;color:var(--ok)}
.pill--spam{background:#f2f0f0;color:#8a8a8a}
.cell-title{font-weight:600;max-width:340px}
.cell-sub{color:var(--muted);font-size:12.5px}
.right{text-align:right}
.acts{display:flex;gap:6px;justify-content:flex-end}

.empty{padding:50px 20px;text-align:center;color:var(--muted)}
.section{margin-bottom:22px}
.section-h{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:22px 0 10px}

/* ---- Форма товара ---- */
.form-grid{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
@media(max-width:900px){.form-grid{grid-template-columns:1fr}.app{grid-template-columns:1fr}.side{position:static;height:auto;flex-direction:row;overflow:auto}.nav{flex-direction:row}}
.panel{padding:18px 20px}
.panel h3{font-size:15px;margin-bottom:14px}
.list-edit{display:flex;flex-direction:column;gap:8px}
.list-edit .li{display:flex;gap:8px;align-items:center}
.list-edit .li input{flex:1}
.chip-x{cursor:pointer;color:var(--danger);border:1px solid #f0ccc6;border-radius:7px;padding:6px 9px;background:#fff}
.variants .vr{display:grid;grid-template-columns:1.3fr 1fr 1fr auto;gap:8px;align-items:center;margin-bottom:8px}
.gridtbl{border-collapse:collapse;width:100%}
.gridtbl td{border:1px solid var(--line);padding:2px}
.gridtbl input{border:none;padding:7px;width:100%;background:transparent}
.gridtbl input:focus{outline:2px solid var(--accent);border-radius:4px}

/* ---- Фото ---- */
.photos{display:flex;gap:10px;flex-wrap:wrap}
.photo{position:relative;width:92px;height:92px;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#f0f2f5}
.photo img{width:100%;height:100%;object-fit:cover}
.photo .del{position:absolute;top:4px;right:4px;background:rgba(0,0,0,.6);color:#fff;border:none;border-radius:6px;width:22px;height:22px;cursor:pointer;font-size:13px}
.photo .ord{position:absolute;bottom:4px;left:4px;background:rgba(0,0,0,.55);color:#fff;border-radius:5px;font-size:11px;padding:1px 5px}
.drop{border:2px dashed #cfd6df;border-radius:10px;padding:18px;text-align:center;color:var(--muted);cursor:pointer;background:#fafbfc}
.drop.over{border-color:var(--accent);background:#fff6ee;color:var(--accent-d)}

/* ---- Тосты ---- */
.toasts{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:100}
.toast{background:var(--navy);color:#fff;padding:11px 15px;border-radius:10px;box-shadow:var(--shadow);font-size:14px;max-width:320px}
.toast--err{background:var(--danger)}
.toast--ok{background:var(--ok)}

/* ---- Модалка ---- */
.modal-bg{position:fixed;inset:0;background:rgba(6,15,28,.5);display:flex;align-items:flex-start;justify-content:center;padding:34px 16px;overflow:auto;z-index:80}
.modal{background:#fff;border-radius:var(--r);width:100%;max-width:900px;box-shadow:var(--shadow)}
.modal-h{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--line)}
.modal-h h2{font-size:19px}
.modal-b{padding:22px}
.modal-f{display:flex;justify-content:space-between;gap:10px;padding:15px 22px;border-top:1px solid var(--line);background:#fafbfc;border-radius:0 0 var(--r) var(--r);position:sticky;bottom:0}
.x{cursor:pointer;border:none;background:none;font-size:22px;color:var(--muted);line-height:1}
.hidden{display:none!important}