/* Оформление 1:1 с «Отделом Закупа»: сайдбар, тёмная тема, таблицы. */
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }

/* ── сайдбар ── */
:root { --sidebar-w: 14rem; }
body.sidebar-collapsed, html.pre-sidebar-collapsed body { --sidebar-w: 3.5rem; }
aside.app-sidebar { width: var(--sidebar-w); transition: width .2s ease; }
.app-main { margin-left: var(--sidebar-w); transition: margin-left .2s ease; }
.si { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.sidebar-link { display: flex; align-items: center; gap: .5rem; padding: .5rem 1rem; border-radius: .375rem; font-size: .875rem; color: #6b7280; transition: all .15s; cursor: pointer; }
.sidebar-link:hover { background: #f3f4f6; color: #1f2937; }
.sidebar-link.active { background: #eef2ff; color: #4338ca; font-weight: 600; }
.sidebar-section { font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: #9ca3af; padding: 1rem 1rem .25rem; font-weight: 600; }
.sidebar-toggle { width: 1.75rem; height: 1.75rem; display: flex; align-items: center; justify-content: center; border-radius: .375rem; color: #6b7280; cursor: pointer; transition: background .15s; }
.sidebar-toggle:hover { background: #f3f4f6; color: #1f2937; }
body.sidebar-collapsed .sidebar-link { padding: .5rem; justify-content: center; position: relative; }
body.sidebar-collapsed .sidebar-link .link-text, body.sidebar-collapsed .sidebar-section,
body.sidebar-collapsed .sidebar-brand, body.sidebar-collapsed .sidebar-user-text, body.sidebar-collapsed .sidebar-logout { display: none; }
body.sidebar-collapsed .sidebar-user-block { padding: .5rem; text-align: center; }
body.sidebar-collapsed .sidebar-link[data-title]:hover::after {
  content: attr(data-title); position: absolute; left: 100%; top: 50%; transform: translateY(-50%);
  margin-left: .5rem; background: #1f2937; color: #fff; padding: .25rem .5rem; border-radius: .25rem;
  font-size: .75rem; white-space: nowrap; z-index: 50; pointer-events: none; }
.theme-toggle-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 6px; color: #6b7280; cursor: pointer; background: transparent; border: none; transition: all .15s; }
.theme-toggle-btn:hover { background: #f3f4f6; color: #1f2937; }

/* ── элементы ── */
.badge { display: inline-flex; align-items: center; padding: .05rem .45rem; border-radius: 9999px; font-size: .7rem; font-weight: 600; white-space: nowrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
table.t { width: 100%; font-size: .82rem; }
table.t th { text-align: left; font-size: .68rem; text-transform: uppercase; letter-spacing: .03em; color: #6b7280; font-weight: 600; padding: .5rem .6rem; background: #f9fafb; border-bottom: 1px solid #e5e7eb; }
table.t td { padding: .45rem .6rem; border-bottom: 1px solid #f3f4f6; vertical-align: top; }
table.t tr:hover td { background: #fafafa; }
.cell-box { border-radius: .4rem; border: 1px solid #e5e7eb; padding: .35rem; font-size: .7rem; cursor: pointer; min-height: 58px; }
.cell-box:hover { border-color: #818cf8; }

/* ── ТСД (телефон) ── */
.tsd-body { background: #f8fafc; min-height: 100vh; padding-bottom: 96px; }
.tsd-header { position: sticky; top: 0; z-index: 20; background: #4f46e5; color: #fff; padding: .6rem .9rem; display: flex; align-items: center; gap: .5rem; }
.tsd-btn { display: block; width: 100%; text-align: left; padding: .9rem 1rem; border-radius: .75rem; font-weight: 600; font-size: 1rem; background: #fff; border: 1px solid #e5e7eb; margin-bottom: .55rem; }
.tsd-btn:active { background: #eef2ff; }
.tsd-big { font-size: 1.5rem; font-weight: 800; line-height: 1.15; }
.tsd-huge { font-size: 2.6rem; font-weight: 800; line-height: 1; }
.tsd-scan { position: fixed; left: 0; right: 0; bottom: 0; background: #fff; border-top: 1px solid #e5e7eb; padding: .5rem .6rem; z-index: 30; }
.tsd-scan input { font-family: ui-monospace, monospace; }
.flash-ok { animation: fok .7s; } .flash-err { animation: ferr .7s; }
@keyframes fok { 0% { background: #bbf7d0; } 100% { background: transparent; } }
@keyframes ferr { 0% { background: #fecaca; } 100% { background: transparent; } }

/* ── тёмная тема ── */
html.dark { background: #0f172a; }
html.dark body { background: #0f172a; color: #e5e7eb; }
html.dark aside.app-sidebar { background: #1e293b !important; border-color: #334155 !important; }
html.dark .bg-white { background-color: #1e293b !important; }
html.dark .bg-gray-50 { background-color: #263140 !important; }
html.dark .bg-gray-100 { background-color: #334155 !important; }
html.dark .text-gray-800, html.dark .text-gray-900 { color: #f1f5f9 !important; }
html.dark .text-gray-700 { color: #e2e8f0 !important; }
html.dark .text-gray-600 { color: #cbd5e1 !important; }
html.dark .text-gray-500 { color: #94a3b8 !important; }
html.dark .text-gray-400 { color: #64748b !important; }
html.dark .border-gray-100, html.dark .border-gray-200 { border-color: #334155 !important; }
html.dark .border-gray-300 { border-color: #475569 !important; }
html.dark .bg-emerald-50 { background-color: rgba(6,78,59,.35) !important; }
html.dark .bg-emerald-100 { background-color: rgba(6,95,70,.45) !important; }
html.dark .bg-amber-50 { background-color: rgba(120,53,15,.35) !important; }
html.dark .bg-amber-100 { background-color: rgba(146,64,14,.45) !important; }
html.dark .bg-rose-50 { background-color: rgba(136,19,55,.35) !important; }
html.dark .bg-rose-100 { background-color: rgba(159,18,57,.45) !important; }
html.dark .bg-indigo-50 { background-color: rgba(49,46,129,.35) !important; }
html.dark .bg-indigo-100 { background-color: rgba(55,48,163,.45) !important; }
html.dark .bg-sky-100 { background-color: rgba(12,74,110,.45) !important; }
html.dark .bg-violet-100 { background-color: rgba(76,29,149,.45) !important; }
html.dark .text-emerald-700, html.dark .text-emerald-800 { color: #6ee7b7 !important; }
html.dark .text-emerald-600 { color: #34d399 !important; }
html.dark .text-amber-700, html.dark .text-amber-800 { color: #fcd34d !important; }
html.dark .text-amber-600 { color: #fbbf24 !important; }
html.dark .text-rose-700, html.dark .text-rose-800 { color: #fda4af !important; }
html.dark .text-rose-600, html.dark .text-rose-500 { color: #fb7185 !important; }
html.dark .text-indigo-700, html.dark .text-indigo-800 { color: #a5b4fc !important; }
html.dark .text-indigo-600, html.dark .text-indigo-500 { color: #818cf8 !important; }
html.dark .text-sky-700 { color: #7dd3fc !important; }
html.dark .text-violet-700, html.dark .text-violet-600 { color: #c4b5fd !important; }
html.dark .border-emerald-100, html.dark .border-emerald-200, html.dark .border-emerald-300 { border-color: rgba(52,211,153,.4) !important; }
html.dark .border-amber-100, html.dark .border-amber-200, html.dark .border-amber-300 { border-color: rgba(251,191,36,.4) !important; }
html.dark .border-rose-100, html.dark .border-rose-200, html.dark .border-rose-300 { border-color: rgba(251,113,133,.4) !important; }
html.dark .border-indigo-100, html.dark .border-indigo-200, html.dark .border-indigo-300 { border-color: rgba(129,140,248,.4) !important; }
html.dark .sidebar-link { color: #94a3b8; }
html.dark .sidebar-link:hover { background: #334155; color: #f1f5f9; }
html.dark .sidebar-link.active { background: #3730a3; color: #c7d2fe; }
html.dark .sidebar-section { color: #64748b; }
html.dark .sidebar-toggle:hover, html.dark .theme-toggle-btn:hover { background: #334155; color: #f1f5f9; }
html.dark .theme-toggle-btn { color: #cbd5e1; }
html.dark input, html.dark select, html.dark textarea { background: #1e293b !important; color: #f1f5f9 !important; border-color: #475569 !important; }
html.dark table.t th { background: #263140; color: #94a3b8; border-color: #334155; }
html.dark table.t td { border-color: #334155; }
html.dark table.t tr:hover td { background: #263140; }
html.dark .tsd-body { background: #0f172a; }
html.dark .tsd-btn { background: #1e293b; border-color: #334155; }
html.dark .tsd-scan { background: #1e293b; border-color: #334155; }