/* =========================================
   0. PRINT TEMPLATE HANDLING & LAYOUT FIXES
   ========================================= */

/* Prevent horizontal scroll/zoom issues caused by hidden elements */
html, body {
    width: 100%;
    overflow-x: hidden;
    position: relative;
}

/* 
   Completely remove print template from flow so it doesn't 
   expand the mobile viewport or cause "jumping".
*/
.print-only {
    position: fixed; /* Fixed takes it out of the document flow entirely */
    top: 0;
    left: -10000px; /* Far off-screen */
    width: 8.5in;
    height: auto;
    z-index: -9999;
    pointer-events: none;
    visibility: hidden; /* Hide from eye, but keep DOM present for html2pdf */
}

@media print {
    /* RESET HTML/BODY HEIGHT TO PREVENT BLANK PAGES */
    html, body {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    /* HIDE EVERYTHING except print template */
    body > *:not(#printTemplate) { 
        display: none !important; 
    }
    
    /* SHOW AND POSITION PRINT TEMPLATE ON PAPER */
    #printTemplate {
        position: relative !important; 
        left: 0 !important;
        top: 0 !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: visible !important;
        z-index: 9999;
    }

    #printTemplate * { visibility: visible !important; }

    .bg-slate-900 {
        background-color: #0f172a !important;
        color: #ffffff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .theme-card { border: none !important; box-shadow: none !important; }
}

/* =========================================
   GENERAL STYLES
   ========================================= */

input, select, textarea { transition: all 0.2s; }
input:focus, select:focus { outline: none; border-color: #f97316 !important; }

/* Custom select arrow */
select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.5rem 1.5rem;
    padding-right: 2.5rem;
}

body, header, .theme-card, .theme-input { transition: background-color 0.3s, color 0.3s, border-color 0.3s; }

/* =========================================
   1. SIDEBAR & MENU DEFAULTS 
   ========================================= */

.theme-sidebar {
    background-color: #1e293b; 
    border-right: 1px solid #334155;
}

.theme-sidebar > div:first-child > div { margin-bottom: 0 !important; }

.theme-menu-item {
    padding-top: 1rem !important;    
    padding-bottom: 1rem !important; 
    border: 1px solid transparent;   
}

/* =========================================
   2. LIGHT MODE OVERRIDES
   ========================================= */

body.light-mode { background: #f3f4f6 !important; } 

/* Header Light Mode */
body.light-mode .theme-header { 
    background: #ffffff !important; 
    border-bottom: 2px solid #fed7aa !important; 
}
body.light-mode .theme-header h1 { color: #1e293b !important; } 
body.light-mode .theme-header p.text-orange-400 { color: #f97316 !important; }
body.light-mode .theme-header i.fa-home { color: #ffffff !important; } 
body.light-mode .theme-header button i.fa-bars { color: #334155 !important; } 
body.light-mode .theme-header .tracking-wider { color: #64748b !important; } 
body.light-mode .theme-header #headerWelcome { color: #1e293b !important; } 

/* Header Buttons Light Mode */
body.light-mode .theme-header button.bg-slate-700 {
    background-color: #334155 !important; 
    color: #ffffff !important;             
    border: none !important;
}
body.light-mode .theme-header button.bg-slate-700:hover { 
    background-color: #475569 !important; 
}

/* Mobile Header Icons: Orange in Light Mode */
body.light-mode .theme-header .mobile-icon-btn {
    color: #f97316 !important;
}
body.light-mode .theme-header .mobile-icon-btn:hover {
    color: #ea580c !important;
}

body.light-mode .theme-header button.bg-orange-500 { background-color: #f97316 !important; color: #fff !important; }
body.light-mode .theme-header button.bg-red-600 { background-color: #dc2626 !important; color: #fff !important; }
body.light-mode .theme-header button.bg-green-600 { background-color: #16a34a !important; color: #fff !important; }

/* Page Body Buttons */
body.light-mode button.bg-slate-700:not(.theme-header button):not(.theme-menu-item):not(.rounded-full) {
    background-color: #e2e8f0 !important; 
    color: #334155 !important;             
    border-color: #94a3b8 !important;      
}
body.light-mode button.bg-slate-700:not(.theme-header button):not(.theme-menu-item):not(.rounded-full):hover {
    background-color: #cbd5e1 !important;
}

/* Sidebar Light Mode - GENERAL */
body.light-mode .theme-sidebar { 
    background-color: #f3f4f6 !important; 
    border-right: 1px solid #d1d5db; 
}

/* Sidebar Light Mode - HEADER SECTION ONLY (The Gradient Top) */
body.light-mode .theme-sidebar .sticky.top-0 {
    background: linear-gradient(to right, #ea580c, #dc2626) !important;
    border-bottom: 1px solid #fed7aa;
}
/* Force text/icons inside the Gradient Header to be WHITE */
body.light-mode .theme-sidebar .sticky.top-0 h2,
body.light-mode .theme-sidebar .sticky.top-0 p,
body.light-mode .theme-sidebar .sticky.top-0 i { 
    color: #ffffff !important; 
}
/* Force the Close Button inside the Gradient Header to be TRANSPARENT WHITE */
body.light-mode .theme-sidebar .sticky.top-0 button {
    background-color: rgba(255,255,255,0.2) !important;
    color: #ffffff !important;
}
body.light-mode .theme-sidebar .sticky.top-0 button:hover {
    background-color: rgba(255,255,255,0.3) !important;
}

/* Sidebar Light Mode - MENU ITEMS (The Buttons) */
/* RESTORE these to clean white/gray look */
body.light-mode .theme-menu-item {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important; 
    color: #334155 !important; 
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
body.light-mode .theme-menu-item:hover { background-color: #f1f5f9 !important; }

/* Restore Icon colors for Menu Items in Light Mode */
body.light-mode .theme-menu-item .text-orange-500 { color: #f97316 !important; }
body.light-mode .theme-menu-item .text-white { color: #334155 !important; } /* Fix generic white text class on light mode */
body.light-mode .theme-menu-item .fa-life-ring { color: #60a5fa !important; }
body.light-mode .theme-menu-item .fa-lightbulb { color: #facc15 !important; }
body.light-mode .theme-menu-item .fa-sign-out-alt { color: #ef4444 !important; }

/* Theme Toggle */
body.light-mode .theme-toggle { background: #cbd5e1; border: 1px solid #94a3b8; }
body.light-mode .theme-toggle-circle { 
    left: 33px; 
    color: #ffffff;
}
body.light-mode .theme-toggle-circle i { display: none; }
body.light-mode .theme-toggle-circle::after {
    content: "\f185"; 
    font-family: "Font Awesome 6 Free"; 
    font-weight: 900;
    color: #ffffff; 
    font-size: 0.9rem;
}

/* Cards & Inputs */
body.light-mode .theme-card { 
    background-color: #ffffff !important; 
    border-color: #e2e8f0; 
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1); 
}
body.light-mode .theme-input { 
    background-color: #f1f5f9 !important; 
    border-color: #cbd5e1; 
    color: #334155; 
}
body.light-mode .theme-input:focus {
    background-color: #ffffff !important;
    border-color: #f97316 !important; 
}
body.light-mode .theme-text-primary { color: #1e293b; }
body.light-mode .theme-text-secondary { color: #64748b; }

/* Modals */
body.light-mode .theme-modal { background-color: #ffffff !important; border: 1px solid #e2e8f0; }
body.light-mode .theme-modal .bg-gradient-to-r { 
    background: linear-gradient(to right, #ea580c, #dc2626) !important; 
}
body.light-mode .theme-modal .theme-text-primary,
body.light-mode .theme-modal button i.fa-times { color: #ffffff !important; }
body.light-mode .theme-modal thead { background-color: #f3f4f6 !important; color: #334155 !important; }
body.light-mode .theme-modal tbody, body.light-mode .theme-modal tbody td { color: #334155 !important; }
body.light-mode .theme-modal tbody tr { border-bottom: 1px solid #f1f5f9 !important; }
body.light-mode .theme-modal tbody td:nth-child(4) { color: #ea580c !important; font-weight: 700 !important; }

/* Extras */
body.light-mode .lg\:block.bg-gradient-to-br.from-orange-600 {
    background: linear-gradient(to bottom right, #fb923c, #f97316) !important; 
    box-shadow: 0 10px 15px -3px rgba(249, 115, 22, 0.3);
    border: 1px solid #f97316;
}
body.light-mode button[onclick="toggleMobileSummary()"] {
    background: linear-gradient(to right, #fb923c, #f97316) !important;
}
body.light-mode #mobileSummaryContent { background: #f97316 !important; }

/* Theme Toggle Component */
.theme-toggle {
    position: relative; width: 60px; height: 30px; border-radius: 15px;
    background: #334155; cursor: pointer; border: none; padding: 0;
}
.theme-toggle-circle {
    position: absolute; top: 3px; left: 3px; width: 24px; height: 24px;
    border-radius: 50%; background: #f97316; display: flex;
    align-items: center; justify-content: center; transition: all 0.3s;
}

.mobile-card-item { border-bottom: 1px dashed rgba(148, 163, 184, 0.2); padding-bottom: 1rem; margin-bottom: 1rem; }
.mobile-card-item:last-child { border-bottom: none; }

/* Print Template Look (White Paper) */
#printTemplate {
    background-color: #ffffff !important;
    color: #0f172a !important; 
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}
#printTemplate h1, #printTemplate h2, #printTemplate h3, 
#printTemplate p, #printTemplate span, #printTemplate div, #printTemplate td {
    color: inherit;
}
#printTemplate .text-slate-900 { color: #0f172a !important; }
#printTemplate .text-slate-600 { color: #475569 !important; }
#printTemplate .text-slate-500 { color: #64748b !important; }
#printTemplate .bg-slate-900 { background-color: #0f172a !important; color: #ffffff !important; }
#printTemplate .border-slate-200 { border-color: #e2e8f0 !important; }
#printTemplate .border-slate-300 { border-color: #cbd5e1 !important; }
#printTemplate .text-orange-600 { color: #ea580c !important; }
#printTemplate .border-orange-500 { border-color: #f97316 !important; }
#printTemplate .bg-orange-50\/50 { background-color: #fff7ed !important; }