/* --- Premium Dark Mode Overrides (Global) --- */

/* 1. Base Layer: Deep Blue-Gray (Not Pitch Black) */
.dark body {
    background-color: #0f172a !important;
    /* slate-950/gray-950 mix */
    color: #f3f4f6;
    /* gray-100 */
}

/* 2. Surface Layer: Cards, Modals, Headers */
.dark .bg-white,
.dark .bg-gray-50,
.dark .bg-gray-100,
.dark .bg-gray-200 {
    background-color: #1e293b !important;
    /* slate-800 */
    color: #e2e8f0;
    /* slate-200 */
    border-color: #334155 !important;
    /* slate-700 */
}

/* 3. Text Hierarchy */
.dark .text-gray-900,
.dark .text-gray-800 {
    color: #f8fafc !important;
}

/* slate-50 */
.dark .text-gray-700 {
    color: #e2e8f0 !important;
}

/* slate-200 */
.dark .text-gray-600 {
    color: #cbd5e1 !important;
}

/* slate-300 */
.dark .text-gray-500 {
    color: #94a3b8 !important;
}

/* slate-400 */

/* 4. Inputs & Form Elements (Integrated, not white patches) */
.dark input,
.dark select,
.dark textarea {
    background-color: #0f172a !important;
    /* slate-950 (Darker than card) */
    border: 1px solid #334155 !important;
    /* slate-700 */
    color: #f8fafc !important;
    /* White text */
    box-shadow: none !important;
}

.dark input:focus,
.dark select:focus {
    border-color: #3b82f6 !important;
    /* blue-500 */
    background-color: #0f172a !important;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3) !important;
}

/* 5. Tables: Elegant & Readable */
.dark table {
    border-color: #334155 !important;
}

.dark thead,
.dark th {
    background-color: #0f172a !important;
    /* Dark header */
    color: #94a3b8 !important;
    /* slate-400 uppercase text */
    border-bottom: 1px solid #334155 !important;
}

/* Fix Focus/Active State for Headers to prevent White Background */
.dark th:focus,
.dark th:active,
.dark th:focus-visible {
    background-color: #0f172a !important;
    color: #f8fafc !important;
    outline: none !important;
    box-shadow: none !important;
}

.dark td {
    border-color: #334155 !important;
    /* Subtle row dividers */
    color: #e2e8f0;
}

/* Hover Effects */
.dark tbody tr:hover {
    background-color: #334155 !important;
    /* slate-700 Highlight */
}

/* 6. Total Bar (Distinct high-contrast footer) */
.dark #fixedTotalValue {
    color: #4ade80 !important;
    /* green-400 (Bright Neon Green) */
}

/* 7. Modals & Overlays */
.dark .bg-opacity-90,
.dark .bg-opacity-75,
.dark .bg-opacity-50 {
    background-color: rgba(15, 23, 42, 0.9) !important;
    /* Slate tint */
    backdrop-filter: blur(4px);
}

.dark .shadow-2xl,
.dark .shadow-lg,
.dark .shadow-sm {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.7) !important;
}

/* 8. Scrollbars (Integrated) */
.dark .scrollbar-friendly::-webkit-scrollbar-track {
    background: #0f172a;
}

.dark .scrollbar-friendly::-webkit-scrollbar-thumb {
    background-color: #475569;
    /* slate-600 */
    border: 3px solid #0f172a;
    border-radius: 99px;
}

.dark .scrollbar-friendly::-webkit-scrollbar-thumb:hover {
    background-color: #64748b;
    /* slate-500 */
}

/* 9. Dropdowns */
.dark .multi-select-dropdown {
    background-color: #1e293b !important;
    border-color: #475569 !important;
}

.dark .dropdown-item:hover {
    background-color: #334155 !important;
    /* Slate-700 */
    color: #f8fafc !important;
}

/* Fix Dropdown Header (Select All / Clear) */
.dark .dropdown-actions-header {
    background-color: #1e293b !important;
    /* Match dropdown bg */
    border-bottom: 1px solid #475569 !important;
}

/* Adjust Action Buttons contrast in Dropdown */
.dark .dropdown-actions-header .text-blue-600 {
    color: #60a5fa !important;
    /* Blue-400 */
}

.dark .dropdown-actions-header .text-red-500 {
    color: #f87171 !important;
    /* Red-400 */
}

/* 11. Fix Row Selection Visibility (Dark Mode) */
.dark tr.selected-row {
    background-color: rgba(30, 58, 138, 0.5) !important;
    /* Blue-900 transparent */
    color: #f8fafc !important;
}

.dark tr.selected-row .text-gray-700 {
    color: #f8fafc !important;
    /* Force cell text white */
}

/* 12. Fix Input Confusion (Make inputs distinct from headers) */
.dark .quantity-input {
    background-color: #0f172a !important;
    /* Slate-950 */
    border: 1px solid #475569 !important;
    /* Visible Border */
    color: #ffffff !important;
    text-align: center;
    border-radius: 0.25rem;
}

.dark .quantity-input:focus {
    border-color: #3b82f6 !important;
    /* Blue focus */
    box-shadow: 0 0 0 1px #3b82f6 !important;
}


/* 13. Specific Color Overrides (Fixing Yellow/Green badges) */
.dark .bg-yellow-50,
.dark .bg-yellow-50\/50,
.dark .hover\:bg-yellow-100\/50:hover {
    background-color: rgba(234, 179, 8, 0.1) !important;
    /* Yellow-500 @ 10% */
    border-color: rgba(234, 179, 8, 0.3) !important;
}

.dark .text-yellow-700,
.dark .text-yellow-800 {
    color: #facc15 !important;
    /* Yellow-400 */
}

/* Green Header fixes if needed, though emerald-600 is usually fine. 
   Maybe slight desaturation for dark mode if requested, but sticking to button fix first. */
.dark .border-yellow-100,

/* 11. Refine Disabled Cells (Make them disappear/blend) */
.dark td.bg-gray-100\/50 {
    background-color: transparent !important;
    border-color: #1e293b !important;
    /* Match row hover or background slightly? Or subtle divider? */
    /* Let's keep the row divider using table row border rules, but hide the cell background. */
}

/* Also ensure the disabled input inside is invisible or very faint */
.dark input.bg-gray-100\/50 {
    background-color: transparent !important;
    border-color: transparent !important;
    opacity: 0.1;
    /* Almost invisible hint */
}

/* 12. Fix Active Row Glitch (Prevent white background on focus) */
/* 12. Fix Active Row Glitch (Prevent white background on focus) */
.dark tbody tr:focus-within {
    outline: 4px solid #facc15 !important;
    /* Yellow-400 Thick Highlight */
    outline-offset: -4px;
    /* Pull inside to avoid overlap */
    z-index: 20;
    /* Ensure it floats above neighbors */
    background-color: #1e293b !important;
    /* Keep it dark slate */
    color: #fff !important;
    /* Ensure text is visible */
    position: relative;
    /* Needed for z-index */
}

/* 13. FORCE Transparency for Disabled Inputs (Override Global Dark Input) */
.dark input.bg-transparent,
.dark input.opacity-10 {
    background-color: transparent !important;
    border-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: transparent !important;
    /* Hide any potential placeholders */
}

/* 14. Fix Summary Header Hover in Dark Mode */
.dark .summary-accordion-header {
    background-color: #1e293b !important;
    color: #f8fafc !important;
}

.dark .summary-accordion-header:hover {
    background-color: #334155 !important;
    /* Slate-700 to match table hover */
    color: #f8fafc !important;
    /* Ensure text remains visible */
}