/* CardSync Core dark theme. GENERATED by scripts/build_dark_theme.py; edit
   that script, not this file. Active when <html class="dark">. */
@media screen {
html.dark{color-scheme:dark}
html.dark body,html.dark body.bg-gray-50,html.dark body.bg-slate-50{background-color:#0b1120;color:#cbd5e1}
html.dark input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
html.dark select,html.dark textarea{background-color:#0d1526;color:#f1f5f9;border-color:#2b3858}
html.dark input::placeholder,html.dark textarea::placeholder{color:#64748b}
html.dark input:disabled,html.dark select:disabled,html.dark textarea:disabled{background-color:#16213a;color:#7d8ba3}
html.dark hr{border-color:#1f2a44}
html.dark kbd{background-color:#1b2742;color:#e2e8f0;border-color:#2b3858}
html.dark ::-webkit-scrollbar-thumb{background-color:#3a4a6b}
html.dark .shadow-sm,html.dark .shadow,html.dark .shadow-md,html.dark .shadow-lg,html.dark .shadow-xl{--tw-shadow-color:rgba(0,0,0,.45)}
html.dark [type=checkbox]:not(:checked),html.dark [type=radio]:not(:checked){background-color:#0d1526;border-color:#4b5c7d}

/* Pages' own styles (their <style> blocks), not Tailwind classes. */
html.dark .panel,html.dark .catalog-panel,html.dark .shop-panel,html.dark .dashboard-panel,html.dark .admin-panel,html.dark .cmp-card{background:rgba(17,26,46,.92);border-color:#2b3858;box-shadow:0 20px 50px rgba(0,0,0,.35)}
html.dark [style*="background:rgba(255,255,255,.9"]{background:rgba(17,26,46,.92)!important;box-shadow:0 20px 50px rgba(0,0,0,.35)!important}
html.dark .dashboard-shell{--vault-ink:#f1f5f9;--vault-muted:#94a3b8;--vault-line:rgba(148,163,184,.14);--vault-surface:rgba(17,26,46,.92)}
html.dark .qty-btn{background:#16213a;border-color:#2b3858;color:#cbd5e1}
html.dark .qty-btn:hover{background:#24324f;border-color:#3a4a6b}
/* Order Manager darkens grey text for contrast on white; undo that here. */
html.dark .orders-shell .text-slate-600,html.dark #order-detail-modal .text-slate-600,
html.dark .orders-shell .text-slate-500,html.dark #order-detail-modal .text-slate-500{color:#aab6c8}
html.dark .orders-shell .text-slate-400,html.dark #order-detail-modal .text-slate-400{color:#8a98b0}
html.dark .orders-shell .text-slate-300,html.dark #order-detail-modal .text-slate-300{color:#7d8ba3}
html.dark #order-items-table tbody tr.item-row:hover>td{background:#16213a}
html.dark #order-items-table tbody tr.item-missing>td,html.dark #orders-table tbody tr.no-stock>td{background:rgba(239,68,68,.10)}
html.dark #order-items-table tbody tr.item-short>td,html.dark #orders-table tbody tr.no-stock:hover>td{background:rgba(239,68,68,.18)}
html.dark .dataTables_wrapper .dataTables_length select{border-color:#2b3858}
html.dark .dataTables_wrapper .dataTables_paginate .paginate_button{background:#111a2e;border-color:#2b3858;color:#cbd5e1}
html.dark .dataTables_wrapper .dataTables_paginate .paginate_button:hover,html.dark .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover{background:#1b2742}
/* Reconciliation */
html.dark .recon-input.changed{background:rgba(99,102,241,.18);border-color:#818cf8}
/* Its light look is pale yellow bins with amber labels; on dark that reads as
   brown, so in dark mode bins are raised rows with blue labels, and the page's
   amber / yellow / orange accents become blue, neutral or red. */
html.dark .attr-edit.changed{background:rgba(var(--csc-a500-rgb,59,130,246),.16);color:var(--csc-a300,#93c5fd);border-color:var(--csc-a500,#3b82f6)}
html.dark .trow-short td,html.dark tr.card-row.pick-missing{background:rgba(239,68,68,.12)!important}
html.dark .trow-over td{background:rgba(34,197,94,.12)!important}
html.dark .bin-hdr td{background:#16213a}
html.dark .bin-hdr:hover td{background:#1b2742}
html.dark body:has(#recon-print-area) .text-amber-700,html.dark body:has(#recon-print-area) .text-amber-800{color:var(--csc-a300,#93c5fd)}
html.dark body:has(#recon-print-area) .text-yellow-700{color:#e2e8f0}
html.dark body:has(#recon-print-area) .bg-orange-100{background-color:rgba(239,68,68,.16)}
html.dark body:has(#recon-print-area) .text-orange-700{color:#fca5a5}
html.dark #scan-zero{background:#16213a;border-color:#3a4a6b;color:#e2e8f0}
html.dark #scan-zero:hover{background:#1b2742}
html.dark .var-pos{color:#4ade80}
html.dark .var-neg{color:#f87171}
/* Shop Inventory: bins (chips, "No bin", "Set Bin") are amber in light mode;
   blue in dark mode, as on Reconciliation. */
html.dark body:has(#inventory-status) .bg-amber-50{background-color:rgba(var(--csc-a500-rgb,59,130,246),.12)}
html.dark body:has(#inventory-status) .text-amber-700{color:var(--csc-a300,#93c5fd)}
html.dark body:has(#inventory-status) .border-amber-300{border-color:rgba(var(--csc-a500-rgb,59,130,246),.45)}
html.dark body:has(#inventory-status) .hover\:bg-amber-50:hover{background-color:rgba(var(--csc-a500-rgb,59,130,246),.18)}
html.dark body:has(#inventory-status) .bg-amber-600{background-color:var(--csc-a600,#2563eb)}
html.dark body:has(#inventory-status) .hover\:bg-amber-700:hover{background-color:var(--csc-a700,#1d4ed8)}
html.dark body:has(#inventory-status) .focus\:ring-amber-400:focus{--tw-ring-color:var(--csc-a500,#3b82f6)}
/* Set Progress zebra rows (set by its restripe()) */
html.dark #setRows .set-row.zebra{background-color:#16213a}
html.dark #setRows .set-row:hover{background-color:rgba(var(--csc-a500-rgb,59,130,246),.16)}
/* Admin dashboard subscription badges */
html.dark .sub-trial{background:rgba(245,158,11,.16);color:#fcd34d}
html.dark .sub-suspended,html.dark .sub-past_due{background:rgba(239,68,68,.16);color:#fca5a5}
html.dark .sub-none,html.dark .sub-cancelled{background:#1b2742;color:#94a3b8}
html.dark .sub-active{background:rgba(16,185,129,.16);color:#6ee7b7}
/* Barcode label previews stay white: they show the printed paper label. */
html.dark .bg-amber-100,
html.dark .hover\:bg-amber-100:hover{background-color:rgba(245,158,11,0.16)}
html.dark .bg-amber-50,
html.dark .hover\:bg-amber-50:hover{background-color:rgba(245,158,11,0.1)}
html.dark .bg-amber-50\/40{background-color:rgba(245,158,11,0.04)}
html.dark .bg-amber-50\/60{background-color:rgba(245,158,11,0.06)}
html.dark .bg-blue-100,
html.dark .hover\:bg-blue-100:hover{background-color:rgba(59,130,246,0.16)}
html.dark .bg-blue-50,
html.dark .hover\:bg-blue-50:hover{background-color:rgba(59,130,246,0.1)}
html.dark .bg-blue-50\/40{background-color:rgba(59,130,246,0.04)}
html.dark .bg-emerald-100,
html.dark .hover\:bg-emerald-100:hover{background-color:rgba(16,185,129,0.16)}
html.dark .bg-emerald-50,
html.dark .hover\:bg-emerald-50:hover{background-color:rgba(16,185,129,0.1)}
html.dark .bg-emerald-50\/40{background-color:rgba(16,185,129,0.04)}
html.dark .bg-gray-100,
html.dark .bg-slate-100,
html.dark .hover\:bg-gray-100:hover,
html.dark .hover\:bg-slate-100:hover{background-color:#1b2742}
html.dark .bg-gray-200,
html.dark .bg-slate-200,
html.dark .disabled\:bg-gray-200:disabled,
html.dark .hover\:bg-gray-200:hover{background-color:#24324f}
html.dark .bg-gray-50,
html.dark .bg-slate-50,
html.dark .disabled\:bg-slate-50:disabled,
html.dark .hover\:bg-gray-50:hover,
html.dark .hover\:bg-slate-50:hover{background-color:#16213a}
html.dark .bg-gray-50\/80,
html.dark .bg-slate-50\/80{background-color:rgba(22,33,58,0.8)}
html.dark .bg-gray-800,
html.dark .bg-slate-800,
html.dark .hover\:bg-slate-800:hover{background-color:#2b3858}
html.dark .bg-gray-900,
html.dark .bg-slate-900,
html.dark .hover\:bg-gray-900:hover,
html.dark .hover\:bg-slate-900:hover{background-color:#1e2a44}
html.dark .bg-green-50{background-color:rgba(34,197,94,0.1)}
html.dark .bg-indigo-200{background-color:rgba(99,102,241,0.24)}
html.dark .bg-indigo-50\/60{background-color:rgba(99,102,241,0.06)}
html.dark .bg-indigo-50\/70{background-color:rgba(99,102,241,0.07)}
html.dark .bg-orange-100{background-color:rgba(249,115,22,0.16)}
html.dark .bg-orange-50{background-color:rgba(249,115,22,0.1)}
html.dark .bg-purple-100{background-color:rgba(168,85,247,0.16)}
html.dark .bg-purple-50,
html.dark .hover\:bg-purple-50:hover{background-color:rgba(168,85,247,0.1)}
html.dark .bg-red-100,
html.dark .hover\:bg-red-100:hover{background-color:rgba(239,68,68,0.16)}
html.dark .bg-red-50,
html.dark .hover\:bg-red-50:hover{background-color:rgba(239,68,68,0.1)}
html.dark .bg-sky-100,
html.dark .hover\:bg-sky-100:hover{background-color:rgba(14,165,233,0.16)}
html.dark .bg-sky-50,
html.dark .hover\:bg-sky-50:hover{background-color:rgba(14,165,233,0.1)}
html.dark .bg-slate-50\/60,
html.dark .hover\:bg-gray-50\/60:hover,
html.dark .hover\:bg-slate-50\/60:hover{background-color:rgba(22,33,58,0.6)}
html.dark .bg-slate-900\/50{background-color:rgba(30,42,68,0.5)}
html.dark .bg-slate-900\/60{background-color:rgba(30,42,68,0.6)}
html.dark .bg-slate-950{background-color:#172036}
html.dark .bg-slate-950\/60{background-color:rgba(23,32,54,0.6)}
html.dark .bg-violet-100{background-color:rgba(139,92,246,0.16)}
html.dark .bg-white,
html.dark .focus\:bg-white:focus,
html.dark .hover\:bg-white:hover{background-color:#111a2e}
html.dark .bg-white\/50{background-color:rgba(17,26,46,0.5)}
html.dark .bg-white\/90{background-color:rgba(17,26,46,0.9)}
html.dark .border-amber-100{border-color:rgba(245,158,11,0.28)}
html.dark .border-amber-200,
html.dark .hover\:border-amber-200:hover{border-color:rgba(245,158,11,0.36)}
html.dark .border-amber-300,
html.dark .hover\:border-amber-300:hover{border-color:rgba(245,158,11,0.46)}
html.dark .border-blue-100{border-color:rgba(59,130,246,0.28)}
html.dark .border-blue-200{border-color:rgba(59,130,246,0.36)}
html.dark .border-blue-300,
html.dark .hover\:border-blue-300:hover{border-color:rgba(59,130,246,0.46)}
html.dark .border-emerald-200,
html.dark .hover\:border-emerald-200:hover{border-color:rgba(16,185,129,0.36)}
html.dark .border-emerald-300{border-color:rgba(16,185,129,0.46)}
html.dark .border-gray-100,
html.dark .border-slate-100,
html.dark .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
html.dark .divide-slate-100 > :not([hidden]) ~ :not([hidden]){border-color:#1f2a44}
html.dark .border-gray-200,
html.dark .border-slate-200,
html.dark .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
html.dark .divide-slate-200 > :not([hidden]) ~ :not([hidden]){border-color:#2b3858}
html.dark .border-gray-300,
html.dark .border-slate-300,
html.dark .hover\:border-slate-300:hover{border-color:#3a4a6b}
html.dark .border-gray-400{border-color:#4b5c7d}
html.dark .border-green-100{border-color:rgba(34,197,94,0.28)}
html.dark .border-green-200{border-color:rgba(34,197,94,0.36)}
html.dark .border-indigo-200,
html.dark .hover\:border-indigo-200:hover{border-color:rgba(99,102,241,0.36)}
html.dark .border-orange-300{border-color:rgba(249,115,22,0.46)}
html.dark .border-purple-300,
html.dark .hover\:border-purple-300:hover{border-color:rgba(168,85,247,0.46)}
html.dark .border-red-100{border-color:rgba(239,68,68,0.28)}
html.dark .border-red-200,
html.dark .hover\:border-red-200:hover{border-color:rgba(239,68,68,0.36)}
html.dark .border-red-300{border-color:rgba(239,68,68,0.46)}
html.dark .border-sky-100{border-color:rgba(14,165,233,0.28)}
html.dark .border-sky-200,
html.dark .hover\:border-sky-200:hover{border-color:rgba(14,165,233,0.36)}
html.dark .border-sky-300,
html.dark .hover\:border-sky-300:hover{border-color:rgba(14,165,233,0.46)}
html.dark .border-slate-200\/70{border-color:rgba(43,56,88,0.7)}
html.dark .border-violet-200{border-color:rgba(139,92,246,0.36)}
html.dark .divide-gray-50 > :not([hidden]) ~ :not([hidden]){border-color:#1a2440}
html.dark .from-amber-200{--tw-gradient-from:rgba(245,158,11,0.24) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
html.dark .from-slate-900{--tw-gradient-from:#1e2a44 var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
html.dark .from-slate-950{--tw-gradient-from:#172036 var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
html.dark .ring-emerald-300{--tw-ring-color:rgba(16,185,129,0.46)}
html.dark .ring-gray-300{--tw-ring-color:#3a4a6b}
html.dark .ring-indigo-300{--tw-ring-color:rgba(99,102,241,0.46)}
html.dark .ring-slate-200\/70{--tw-ring-color:rgba(43,56,88,0.7)}
html.dark .text-amber-600,
html.dark .hover\:text-amber-600:hover{color:#fbbf24}
html.dark .text-amber-700{color:#fcd34d}
html.dark .text-amber-800,
html.dark .text-amber-900,
html.dark .hover\:text-amber-900:hover{color:#fde68a}
html.dark .text-blue-600,
html.dark .hover\:text-blue-600:hover{color:#60a5fa}
html.dark .text-blue-700,
html.dark .hover\:text-blue-700:hover{color:#93c5fd}
html.dark .text-blue-800,
html.dark .text-blue-900,
html.dark .hover\:text-blue-800:hover,
html.dark .hover\:text-blue-900:hover{color:#bfdbfe}
html.dark .text-emerald-600,
html.dark .hover\:text-emerald-600:hover{color:#34d399}
html.dark .text-emerald-600\/70{color:rgba(52,211,153,0.7)}
html.dark .text-emerald-700{color:#6ee7b7}
html.dark .text-emerald-800,
html.dark .text-emerald-900{color:#a7f3d0}
html.dark .text-emerald-950\/70{color:rgba(167,243,208,0.7)}
html.dark .text-gray-500,
html.dark .text-slate-500,
html.dark .disabled\:text-gray-500:disabled,
html.dark .disabled\:text-slate-400:disabled,
html.dark .hover\:text-gray-500:hover,
html.dark .placeholder\:text-gray-500::placeholder,
html.dark .placeholder\:text-slate-400::placeholder{color:#94a3b8}
html.dark .text-gray-600,
html.dark .text-slate-600,
html.dark .hover\:text-gray-600:hover,
html.dark .hover\:text-slate-600:hover{color:#aab6c8}
html.dark .text-gray-700,
html.dark .text-slate-700,
html.dark .hover\:text-gray-700:hover,
html.dark .hover\:text-slate-700:hover{color:#cbd5e1}
html.dark .text-gray-800,
html.dark .text-slate-800{color:#e2e8f0}
html.dark .text-gray-900,
html.dark .text-slate-900,
html.dark .hover\:text-gray-900:hover,
html.dark .hover\:text-slate-900:hover{color:#f1f5f9}
html.dark .text-green-600{color:#4ade80}
html.dark .text-green-700{color:#86efac}
html.dark .text-indigo-700{color:#a5b4fc}
html.dark .text-indigo-800{color:#c7d2fe}
html.dark .text-orange-600{color:#fb923c}
html.dark .text-orange-700{color:#fdba74}
html.dark .text-orange-800{color:#fed7aa}
html.dark .text-purple-600{color:#c084fc}
html.dark .text-purple-700,
html.dark .hover\:text-purple-700:hover{color:#d8b4fe}
html.dark .text-purple-800,
html.dark .hover\:text-purple-800:hover{color:#e9d5ff}
html.dark .text-red-600,
html.dark .hover\:text-red-600:hover{color:#f87171}
html.dark .text-red-700,
html.dark .hover\:text-red-700:hover{color:#fca5a5}
html.dark .text-red-800,
html.dark .text-red-900,
html.dark .hover\:text-red-900:hover{color:#fecaca}
html.dark .text-rose-600{color:#fb7185}
html.dark .text-sky-600,
html.dark .hover\:text-sky-600:hover{color:#38bdf8}
html.dark .text-sky-700,
html.dark .hover\:text-sky-700:hover{color:#7dd3fc}
html.dark .text-sky-800,
html.dark .text-sky-900,
html.dark .hover\:text-sky-800:hover{color:#bae6fd}
html.dark .text-slate-700\/80{color:rgba(203,213,225,0.8)}
html.dark .text-slate-950{color:#f8fafc}
html.dark .text-violet-700{color:#c4b5fd}
html.dark .text-violet-800,
html.dark .text-violet-900{color:#ddd6fe}
html.dark .text-yellow-700{color:#fde047}
html.dark .to-rose-200{--tw-gradient-to:rgba(244,63,94,0.24) var(--tw-gradient-to-position)}
html.dark .to-slate-800{--tw-gradient-to:#2b3858 var(--tw-gradient-to-position)}
html.dark .via-orange-200{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(249,115,22,0.24) var(--tw-gradient-via-position),var(--tw-gradient-to)}
html.dark .via-slate-800{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#2b3858 var(--tw-gradient-via-position),var(--tw-gradient-to)}
html.dark .via-slate-900{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#1e2a44 var(--tw-gradient-via-position),var(--tw-gradient-to)}
html.dark .disabled\:bg-gray-300:disabled,
html.dark .disabled\:bg-slate-300:disabled{background-color:#2f3f60}
html.dark .disabled\:bg-gray-400:disabled{background-color:#475569}
html.dark .disabled\:text-gray-300:disabled{color:#d1d5db}
html.dark .focus-within\:border-emerald-400:focus-within,
html.dark .focus\:border-emerald-400:focus{border-color:#34d399}
html.dark .focus-within\:border-sky-400:focus-within,
html.dark .focus\:border-sky-400:focus,
html.dark .hover\:border-sky-400:hover{border-color:#38bdf8}
html.dark .focus-within\:ring-emerald-100:focus-within,
html.dark .focus\:ring-emerald-100:focus{--tw-ring-color:rgba(16,185,129,0.28)}
html.dark .focus-within\:ring-sky-100:focus-within,
html.dark .focus\:ring-sky-100:focus{--tw-ring-color:rgba(14,165,233,0.28)}
html.dark .focus\:border-blue-500:focus{border-color:#3b82f6}
html.dark .focus\:ring-amber-400:focus{--tw-ring-color:#fbbf24}
html.dark .focus\:ring-blue-500:focus{--tw-ring-color:#3b82f6}
html.dark .focus\:ring-emerald-500:focus{--tw-ring-color:#10b981}
html.dark .focus\:ring-gray-700:focus{--tw-ring-color:#374151}
html.dark .focus\:ring-purple-400:focus{--tw-ring-color:#c084fc}
html.dark .focus\:ring-sky-400:focus{--tw-ring-color:#38bdf8}
html.dark .focus\:ring-sky-500:focus{--tw-ring-color:#0ea5e9}
html.dark .hover\:bg-amber-700:hover{background-color:#b45309}
html.dark .hover\:bg-blue-50\/30:hover{background-color:rgba(59,130,246,0.03)}
html.dark .hover\:bg-blue-700:hover{background-color:#1d4ed8}
html.dark .hover\:bg-emerald-700:hover{background-color:#047857}
html.dark .hover\:bg-indigo-50:hover{background-color:rgba(99,102,241,0.1)}
html.dark .hover\:bg-sky-200:hover{background-color:rgba(14,165,233,0.24)}
html.dark .hover\:bg-sky-700:hover{background-color:#0369a1}
html.dark .hover\:bg-slate-50\/70:hover{background-color:rgba(22,33,58,0.7)}
html.dark .hover\:bg-slate-700:hover{background-color:#3a4a6b}
html.dark .hover\:bg-violet-50:hover{background-color:rgba(139,92,246,0.1)}
html.dark .hover\:border-blue-400:hover{border-color:#60a5fa}
html.dark .hover\:border-purple-200:hover{border-color:rgba(168,85,247,0.36)}
html.dark .hover\:border-violet-300:hover{border-color:rgba(139,92,246,0.46)}
html.dark .hover\:text-red-500:hover{color:#ef4444}
html.dark .hover\:text-rose-700:hover{color:#fda4af}
html.dark .hover\:text-white:hover{color:#ffffff}
html.dark .placeholder\:text-gray-400::placeholder{color:#9ca3af}
}