/**
 * KinKin-POS Dark Theme — Midnight Blue + Gold (UNIK-style)
 * Light mode = default (unchanged). Apply via html.theme-dark
 */

html.theme-dark {
    --primary-color: #C9A227;
    --primary-hover: #E5C158;
    --primary-light: rgba(201, 162, 39, 0.18);
    --primary-dark: #9A7B1A;
    --dm-bg: #0a0e17;
    --dm-surface: #111827;
    --dm-surface-2: #1a2332;
    --dm-surface-3: #243044;
    --dm-border: rgba(201, 162, 39, 0.14);
    --dm-text: #f1f5f9;
    --dm-text-muted: #94a3b8;
    --dm-text-dim: #64748b;
    color-scheme: dark;
}

/* ===== Page & layout ===== */
html.theme-dark body,
html.theme-dark body.bg-slate-50 {
    background-color: var(--dm-bg) !important;
    color: var(--dm-text);
}

html.theme-dark #main-wrapper,
html.theme-dark .main-content {
    background-color: var(--dm-bg) !important;
}

html.theme-dark main {
    background-color: var(--dm-bg) !important;
}

/* ===== Header & footer ===== */
html.theme-dark header.bg-gradient-primary,
html.theme-dark footer.bg-gradient-primary {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%) !important;
    border-color: rgba(201, 162, 39, 0.35) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4) !important;
}

html.theme-dark #theme-toggle-btn {
    background: rgba(201, 162, 39, 0.15) !important;
    border-color: rgba(201, 162, 39, 0.35) !important;
    color: #E5C158 !important;
}

html.theme-dark #theme-toggle-btn:hover {
    background: rgba(201, 162, 39, 0.28) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu,
html.theme-dark header.bg-gradient-primary .header-user-menu *:not(img) {
    color: var(--dm-text) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu .menu-muted {
    color: var(--dm-text-dim) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu .menu-title {
    color: var(--dm-text) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu a:hover {
    background: rgba(201, 162, 39, 0.1) !important;
}

html.theme-dark header.bg-gradient-primary .header-user-menu .bg-orange-50,
html.theme-dark header.bg-gradient-primary .header-user-menu .bg-gray-50 {
    background: rgba(201, 162, 39, 0.12) !important;
}

/* ===== Sidebar ===== */
html.theme-dark #sidebar {
    background: #0f172a !important;
    border-right-color: rgba(201, 162, 39, 0.2) !important;
}

html.theme-dark #sidebar > .flex.items-center.px-4 {
    background: linear-gradient(135deg, #0f172a, #1a2332) !important;
    border-bottom-color: rgba(201, 162, 39, 0.25) !important;
}

html.theme-dark #sidebar .logo-text {
    color: #E5C158 !important;
}

html.theme-dark #sidebar a {
    color: #cbd5e1 !important;
}

html.theme-dark #sidebar a:hover {
    background-color: rgba(201, 162, 39, 0.1) !important;
}

html.theme-dark #sidebar a span {
    color: #e2e8f0 !important;
}

html.theme-dark #sidebar a.active {
    background-color: rgba(201, 162, 39, 0.2) !important;
    border-left-color: #C9A227 !important;
}

html.theme-dark #sidebar a.active span {
    color: #fff !important;
    font-weight: 700 !important;
}

html.theme-dark #sidebar a.active svg {
    color: #E5C158 !important;
    stroke: #E5C158 !important;
}

html.theme-dark #sidebar .border-gray-100,
html.theme-dark #sidebar .border-t {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ===== Cards & panels ===== */
html.theme-dark .bg-white {
    background-color: var(--dm-surface) !important;
}

html.theme-dark .bg-slate-50,
html.theme-dark .bg-gray-50,
html.theme-dark .bg-gray-100 {
    background-color: var(--dm-surface-2) !important;
}

html.theme-dark .border-gray-100,
html.theme-dark .border-gray-200,
html.theme-dark .border-gray-300 {
    border-color: var(--dm-border) !important;
}

html.theme-dark .shadow-sm,
html.theme-dark .shadow-md,
html.theme-dark .shadow-lg,
html.theme-dark .shadow-xl {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

/* ===== Typography ===== */
html.theme-dark .text-gray-900,
html.theme-dark .text-gray-800,
html.theme-dark .text-gray-700 {
    color: var(--dm-text) !important;
}

html.theme-dark .text-gray-600,
html.theme-dark .text-gray-500 {
    color: var(--dm-text-muted) !important;
}

html.theme-dark .text-gray-400,
html.theme-dark .text-gray-300 {
    color: var(--dm-text-dim) !important;
}

html.theme-dark .text-black {
    color: var(--dm-text) !important;
}

/* Keep semantic colors readable */
html.theme-dark .text-green-600 { color: #4ade80 !important; }
html.theme-dark .text-red-600 { color: #f87171 !important; }
html.theme-dark .text-indigo-600 { color: #a5b4fc !important; }
html.theme-dark .text-orange-500,
html.theme-dark .text-orange-600 { color: #fb923c !important; }
html.theme-dark .text-blue-600 { color: #60a5fa !important; }
html.theme-dark .text-yellow-600 { color: #E5C158 !important; }

html.theme-dark .bg-green-50 { background: rgba(34, 197, 94, 0.12) !important; }
html.theme-dark .bg-green-100 { background: rgba(34, 197, 94, 0.18) !important; }
html.theme-dark .bg-red-100 { background: rgba(239, 68, 68, 0.15) !important; }
html.theme-dark .bg-indigo-100 { background: rgba(99, 102, 241, 0.15) !important; }
html.theme-dark .bg-orange-100 { background: rgba(249, 115, 22, 0.15) !important; }
html.theme-dark .bg-yellow-100 { background: rgba(201, 162, 39, 0.15) !important; }
html.theme-dark .bg-blue-100 { background: rgba(59, 130, 246, 0.15) !important; }

html.theme-dark .hover\:bg-gray-50:hover {
    background-color: var(--dm-surface-3) !important;
}

/* ===== Forms ===== */
html.theme-dark input,
html.theme-dark select,
html.theme-dark textarea {
    background-color: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.theme-dark input::placeholder,
html.theme-dark textarea::placeholder {
    color: var(--dm-text-dim) !important;
}

html.theme-dark input:focus,
html.theme-dark select:focus,
html.theme-dark textarea:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.2) !important;
}

/* ===== Tables ===== */
html.theme-dark table thead {
    background-color: var(--dm-surface-2) !important;
}

html.theme-dark table tbody tr {
    border-color: var(--dm-border) !important;
}

html.theme-dark table tbody tr:hover {
    background-color: var(--dm-surface-3) !important;
}

html.theme-dark .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--dm-border) !important;
}

/* ===== Dashboard specifics ===== */
html.theme-dark .kpi-skeleton,
html.theme-dark .chart-skeleton {
    background: linear-gradient(90deg, var(--dm-surface-2) 0%, var(--dm-surface-3) 40%, var(--dm-surface-2) 100%) !important;
    background-size: 200% 100%;
}

html.theme-dark .kpi-card .absolute.bg-green-500,
html.theme-dark .kpi-card .absolute.bg-red-500,
html.theme-dark .kpi-card .absolute.bg-indigo-500,
html.theme-dark .kpi-card .absolute.bg-orange-500,
html.theme-dark .kpi-card .absolute.bg-yellow-400,
html.theme-dark .kpi-card .absolute.bg-blue-500 {
    opacity: 0.9;
}

/* ===== Menu cards (dashboard grid) ===== */
html.theme-dark .menu-card.bg-gradient-primary,
html.theme-dark a.bg-gradient-primary:not(header):not(footer):not([href*="type="]) {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.theme-dark .menu-card.bg-gradient-primary h3,
html.theme-dark a.bg-gradient-primary h3 {
    color: var(--dm-text) !important;
}

/* ===== Login page ===== */
html.theme-dark body:has(.login-wrapper) {
    background: linear-gradient(145deg, #050810 0%, #0a0e17 40%, #0f172a 100%) !important;
}

html.theme-dark .login-card {
    background: rgba(17, 24, 39, 0.85) !important;
    border-color: rgba(201, 162, 39, 0.2) !important;
}

html.theme-dark .left-panel {
    background: linear-gradient(160deg, #0f172a 0%, #1a2332 50%, rgba(201, 162, 39, 0.25) 100%) !important;
}

html.theme-dark .right-panel {
    background: rgba(15, 23, 42, 0.9) !important;
}

html.theme-dark .right-panel h2 {
    color: #f1f5f9 !important;
}

html.theme-dark .form-field input {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(201, 162, 39, 0.15) !important;
    color: #f1f5f9 !important;
}

html.theme-dark .lang-selector {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(201, 162, 39, 0.12) !important;
}

html.theme-dark .dev-credit {
    color: rgba(255, 255, 255, 0.4) !important;
}

html.theme-dark #login-theme-toggle {
    background: rgba(201, 162, 39, 0.12);
    border: 1px solid rgba(201, 162, 39, 0.3);
    color: #E5C158;
}

/* ===== Swal ===== */
html.theme-dark .swal2-popup {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border: 1px solid var(--dm-border);
}

html.theme-dark .swal2-title,
html.theme-dark .swal2-html-container {
    color: var(--dm-text) !important;
}

html.theme-dark .swal2-input,
html.theme-dark .swal2-textarea {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}

/* Dashboard quick-print modal (80mm) */
html.theme-dark .quick-print-item {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.theme-dark .quick-print-item span {
    color: var(--dm-text) !important;
}

html.theme-dark .quick-print-item:hover {
    background: rgba(16, 185, 129, 0.12) !important;
    border-color: rgba(16, 185, 129, 0.45) !important;
}

html.theme-dark .quick-print-item .text-emerald-600 {
    color: #34d399 !important;
}

/* ===== Scrollbar ===== */
html.theme-dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html.theme-dark ::-webkit-scrollbar-track {
    background: var(--dm-bg);
}

html.theme-dark ::-webkit-scrollbar-thumb {
    background: rgba(201, 162, 39, 0.35);
    border-radius: 4px;
}

html.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: rgba(201, 162, 39, 0.55);
}

/* ===== Gradient headers on superadmin ===== */
html.theme-dark .bg-gradient-to-r.from-purple-600,
html.theme-dark [class*="from-gray-800"] {
    filter: brightness(0.85);
}