/* ==========================================
   LOON ASSIST - Design Enhancements
   Formal Government Style - Professional & Unique
   ========================================== */


/* COLOR PALETTE - Sophisticated Government Blue & Gold */

:root {
    --primary-blue: #0d47a1;
    --dark-blue: #051d47;
    --light-blue: #1565c0;
    --accent-gold: #d4af37;
    --gold-light: #e8c750;
    --text-primary: #1a1f36;
    --text-secondary: #54606d;
    --background-light: #f5f7fa;
    --shadow-sm: 0 2px 8px rgba(13, 71, 161, 0.08);
    --shadow-md: 0 4px 16px rgba(13, 71, 161, 0.12);
    --shadow-lg: 0 12px 32px rgba(13, 71, 161, 0.15);
}


/* ==========================================
   DASHBOARD STAT CARDS - Enhanced
   ========================================== */

.stat-card {
    border-left: 5px solid var(--accent-gold) !important;
    padding: 2rem !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%) !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: var(--shadow-md) !important;
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--accent-gold), transparent);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: var(--shadow-lg) !important;
}

.stat-card:hover::before {
    opacity: 1;
}

.stat-label {
    font-size: 0.8rem !important;
    color: var(--text-secondary) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    margin-bottom: 0.75rem !important;
}

.stat-number {
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    color: var(--primary-blue) !important;
}


/* Icon Enhancements */

.stat-icon {
    width: 75px !important;
    height: 75px !important;
    border-radius: 12px !important;
    font-size: 2.5rem !important;
    flex-shrink: 0;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
}

.stat-icon.clients {
    background: linear-gradient(135deg, #2196F3 0%, #1565c0 100%) !important;
    color: white !important;
}

.stat-icon.pending {
    background: linear-gradient(135deg, #FF9800 0%, #f57c00 100%) !important;
    color: white !important;
}

.stat-icon.approved {
    background: linear-gradient(135deg, #42c768 0%, #2e9c56 100%) !important;
    color: white !important;
}

.stat-icon.released {
    background: linear-gradient(135deg, var(--accent-gold) 0%, #c49a2a 100%) !important;
    color: white !important;
}


/* ==========================================
   TABLE ENHANCEMENTS
   ========================================== */

.requests-table {
    border-collapse: separate;
    border-spacing: 0;
}

.requests-table thead {
    background: linear-gradient(145deg, rgba(250, 213, 78, 0.96) 0%, rgba(230, 176, 53, 0.95) 45%, rgba(196, 142, 32, 0.98) 100%) !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.28) !important;
    backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.24) !important;
}

.requests-table thead th {
    color: #1f1d17 !important;
    font-weight: 700 !important;
    letter-spacing: 0.19em !important;
    padding: 1.2rem 1.3rem !important;
    text-transform: uppercase !important;
    font-size: 0.95rem !important;
    border: none !important;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.18) !important;
}

.requests-table thead th:first-child {
    border-radius: 8px 0 0 0;
}

.requests-table thead th:last-child {
    border-radius: 0 8px 0 0;
}

.requests-table tbody tr {
    border-bottom: 1px solid rgba(15, 61, 105, 0.08) !important;
    transition: all 0.2s ease !important;
}

.requests-table tbody tr:hover {
    background: rgba(212, 175, 55, 0.04) !important;
    box-shadow: inset 0 0 8px rgba(15, 61, 105, 0.05);
}

.requests-table tbody tr:last-child td {
    border-bottom: none;
}

.requests-table tbody tr:last-child td:first-child {
    border-radius: 0 0 0 8px;
}

.requests-table tbody tr:last-child td:last-child {
    border-radius: 0 0 8px 0;
}

.requests-table tbody td {
    padding: 1.1rem !important;
    color: #111111 !important;
    font-family: 'Times New Roman', Times, serif !important;
    font-weight: 500;
}


/* ==========================================\n   SECTION HEADERS\n   ========================================== */

.section-header {
    \n border-bottom: 3px solid var(--accent-gold) !important;
    \n padding-bottom: 1.2rem !important;
    \n margin-bottom: 2rem !important;
    \n
}

\n\n.section-header h2 {
    \n color: var(--primary-blue) !important;
    \n font-weight: 800 !important;
    \n letter-spacing: 0.5px !important;
    \n font-size: 1.5rem !important;
    \n
}

\n\n
/* ==========================================\n   BUTTONS - Professional Effects\n   ========================================== */

\n\nbutton,
.btn,
input[type=\"submit\"], input[type=\"button\"] {\n    font-weight: 700 !important;\n    border-radius: 8px !important;\n    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;\n    letter-spacing: 0.5px !important;\n    position: relative;\n    overflow: hidden;\n}\n\nbutton:hover, .btn:hover, input[type=\"submit\"]:hover, input[type=\"button\"]:hover {\n    transform: translateY(-2px) !important;\n    box-shadow: 0 8px 20px rgba(15, 61, 105, 0.25) !important;\n}\n\nbutton:active, .btn:active {\n    transform: translateY(0px) !important;\n}\n\n/* ==========================================\n   NAVBAR ENHANCEMENTS\n   ========================================== */\n\n.navbar {\n    border-bottom: 3px solid var(--accent-gold) !important;\n    box-shadow: 0 4px 12px rgba(13, 71, 161, 0.2) !important;\n}\n\n.logo-section {\n    transition: all 0.3s ease !important;\n}\n\n.logo-section:hover {\n    transform: scale(1.03) !important;\n}\n\n.logo-main {\n    letter-spacing: 1.5px !important;\n    font-weight: 900 !important;\n}\n\n.logo-sub {\n    font-size: 0.75rem !important;\n    letter-spacing: 0.5px !important;\n}\n\n/* ==========================================\n   FORM ENHANCEMENTS\n   ========================================== */\n\ninput[type=\"text\"],\ninput[type=\"email\"],\ninput[type=\"password\"],\ninput[type=\"number\"],\ninput[type=\"date\"],\ntextarea,\nselect {\n    border: 2px solid rgba(15, 61, 105, 0.1) !important;\n    border-radius: 8px !important;\n    transition: all 0.3s ease !important;\n    font-family: inherit !important;\n    font-weight: 500 !important;\n}\n\ninput[type=\"text\"]:focus,\ninput[type=\"email\"]:focus,\ninput[type=\"password\"]:focus,\ninput[type=\"number\"]:focus,\ninput[type=\"date\"]:focus,\ntextarea:focus,\nselect:focus {\n    border-color: var(--accent-gold) !important;\n    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.1) !important;\n    outline: none !important;\n}\n\nlabel {\n    font-weight: 700 !important;\n    color: var(--text-primary) !important;\n    letter-spacing: 0.3px !important;\n    margin-bottom: 0.5rem !important;\n    display: block !important;\n}\n\n/* ==========================================\n   SIDEBAR ENHANCEMENTS\n   ========================================== */\n\n.sidebar {\n    box-shadow: 4px 0 12px rgba(13, 71, 161, 0.15) !important;\n}\n\n.sidebar-header {\n    border-bottom: 2px solid var(--accent-gold) !important;\n    padding-bottom: 1.5rem !important;\n}\n\n.sidebar-logo {\n    transition: transform 0.3s ease !important;\n}\n\n.sidebar-logo:hover {\n    transform: scale(1.05) !important;\n}\n\n.nav-item {\n    transition: all 0.2s ease !important;\n    border-radius: 8px !important;\n    margin: 0.25rem 0.75rem !important;\n}\n\n.nav-item:hover {\n    background: rgba(212, 175, 55, 0.1) !important;\n    transform: translateX(4px) !important;\n}\n\n.nav-item.active {\n    background: rgba(212, 175, 55, 0.2) !important;\n    border-left: 4px solid var(--accent-gold) !important;\n}\n\n/* ==========================================\n   WELCOME SECTION\n   ========================================== */\n\n.welcome-section {\n    border-bottom: 3px solid var(--accent-gold) !important;\n    padding-bottom: 2rem !important;\n    margin-bottom: 2.5rem !important;\n}\n\n.welcome-text h1 {\n    color: var(--primary-blue) !important;\n    font-weight: 900 !important;\n    letter-spacing: 1px !important;\n}\n\n.welcome-text p {\n    color: var(--text-secondary) !important;\n    font-weight: 600 !important;\n    letter-spacing: 0.5px !important;\n}\n\n/* ==========================================\n   GENERAL POLISH\n   ========================================== */\n\nbody {\n    letter-spacing: 0.3px !important;\n}\n\nh1, h2, h3, h4, h5, h6 {\n    font-weight: 800 !important;\n    letter-spacing: 0.5px !important;\n    color: var(--primary-blue) !important;\n}\n\np {\n    color: var(--text-secondary) !important;\n}\n\n/* Smooth animations */\n* {\n    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;\n}\n\n/* Focus states for accessibility */\n:focus-visible {\n    outline: 3px solid var(--accent-gold) !important;\n    outline-offset: 2px !important;\n}\n\n/* ==========================================\n   ADVANCED FORM STYLING\n   ========================================== */\n\n/* Form Containers */\n.form-group,\n.form-section,\n.form-row {\n    margin-bottom: 1.5rem !important;\n}\n\n/* Enhanced Input Fields */\ninput[type=\"text\"],\ninput[type=\"email\"],\ninput[type=\"password\"],\ninput[type=\"number\"],\ninput[type=\"date\"],\ninput[type=\"time\"],\ninput[type=\"tel\"],\ntextarea,\nselect {\n    width: 100% !important;\n    padding: 0.875rem 1rem !important;\n    font-size: 1rem !important;\n    background-color: #ffffff !important;\n    border: 2px solid rgba(13, 71, 161, 0.12) !important;\n    border-radius: 8px !important;\n    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;\n    font-family: 'Segoe UI', sans-serif !important;\n    font-weight: 500 !important;\n}\n\ninput[type=\"text\"]:hover,\ninput[type=\"email\"]:hover,\ninput[type=\"password\"]:hover,\ninput[type=\"number\"]:hover,\ninput[type=\"date\"]:hover,\ninput[type=\"time\"]:hover,\ninput[type=\"tel\"]:hover,\ntextarea:hover,\nselect:hover {\n    border-color: rgba(13, 71, 161, 0.25) !important;\n    box-shadow: 0 2px 8px rgba(13, 71, 161, 0.08) !important;\n}\n\ninput[type=\"text\"]:focus,\ninput[type=\"email\"]:focus,\ninput[type=\"password\"]:focus,\ninput[type=\"number\"]:focus,\ninput[type=\"date\"]:focus,\ninput[type=\"time\"]:focus,\ninput[type=\"tel\"]:focus,\ntextarea:focus,\nselect:focus {\n    border-color: var(--accent-gold) !important;\n    box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.15), inset 0 0 0 1px var(--accent-gold) !important;\n    outline: none !important;\n    background-color: #fafbfc !important;\n}\n\n/* Disabled State */\ninput:disabled,\ntextarea:disabled,\nselect:disabled {\n    background-color: #f0f2f5 !important;\n    color: #999 !important;\n    cursor: not-allowed !important;\n    border-color: #ddd !important;\n}\n\n/* Textarea Specific */\ntextarea {\n    resize: vertical !important;\n    min-height: 120px !important;\n    line-height: 1.6 !important;\n}\n\n/* Select Dropdown */\nselect {\n    cursor: pointer !important;\n    background-image: url(\"data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d47a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e\") !important;\n    background-repeat: no-repeat !important;\n    background-position: right 0.75rem center !important;\n    background-size: 1.5em !important;\n    padding-right: 2.5rem !important;\n    appearance: none !important;\n    -webkit-appearance: none !important;\n    -moz-appearance: none !important;\n}\n\n/* Labels - Professional */\nlabel {\n    font-size: 0.95rem !important;\n    font-weight: 700 !important;\n    color: var(--text-primary) !important;\n    letter-spacing: 0.3px !important;\n    margin-bottom: 0.6rem !important;\n    display: block !important;\n    text-transform: none !important;\n}\n\nlabel.required::after {\n    content: ' *' !important;\n    color: #e74c3c !important;\n    font-weight: 800 !important;\n}\n\n/* Form Validation */\ninput.error,\ntextarea.error,\nselect.error {\n    border-color: #e74c3c !important;\n    background-color: #fef5f5 !important;\n}\n\ninput.error:focus,\ntextarea.error:focus,\nselect.error:focus {\n    box-shadow: 0 0 0 4px rgba(231, 76, 60, 0.1) !important;\n}\n\ninput.success,\ntextarea.success,\nselect.success {\n    border-color: #27ae60 !important;\n    background-color: #f0fdf4 !important;\n}\n\n/* Checkboxes & Radio Buttons */\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n    width: 1.25rem !important;\n    height: 1.25rem !important;\n    cursor: pointer !important;\n    accent-color: #000 !important;\n    transition: all 0.2s ease !important;\n}\n\ninput[type=\"checkbox\"]:hover,\ninput[type=\"radio\"]:hover {\n    transform: scale(1.1) !important;\n}\n\ninput[type=\"checkbox\"]:focus,\ninput[type=\"radio\"]:focus {\n    outline: 2px solid #000 !important;\n    outline-offset: 2px !important;\n}\n\n/* ==========================================\n   ADVANCED BUTTON STYLING\n   ========================================== */\n\n/* Primary Buttons */\nbutton,\n.btn,\ninput[type=\"submit\"],\ninput[type=\"button\"],\n.button {\n    padding: 0.875rem 1.75rem !important;\n    font-size: 0.95rem !important;\n    font-weight: 700 !important;\n    letter-spacing: 0.5px !important;\n    text-transform: uppercase !important;\n    border: none !important;\n    border-radius: 8px !important;\n    cursor: pointer !important;\n    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;\n    position: relative !important;\n    overflow: hidden !important;\n    box-shadow: 0 4px 12px rgba(13, 71, 161, 0.2) !important;\n}\n\nbutton::before,\n.btn::before,\ninput[type=\"submit\"]::before,\ninput[type=\"button\"]::before {\n    content: '' !important;\n    position: absolute !important;\n    top: 0 !important;\n    left: -100% !important;\n    width: 100% !important;\n    height: 100% !important;\n    background: rgba(255, 255, 255, 0.2) !important;\n    transition: left 0.4s ease !important;\n    z-index: 1 !important;\n}\n\nbutton:hover::before,\n.btn:hover::before,\ninput[type=\"submit\"]:hover::before,\ninput[type=\"button\"]:hover::before {\n    left: 100% !important;\n}\n\nbutton:hover,\n.btn:hover,\ninput[type=\"submit\"]:hover,\ninput[type=\"button\"]:hover {\n    transform: translateY(-3px) !important;\n    box-shadow: 0 8px 24px rgba(13, 71, 161, 0.3) !important;\n}\n\nbutton:active,\n.btn:active,\ninput[type=\"submit\"]:active,\ninput[type=\"button\"]:active {\n    transform: translateY(-1px) !important;\n    box-shadow: 0 2px 8px rgba(13, 71, 161, 0.2) !important;\n}\n\n/* Disabled Button State */\nbutton:disabled,\n.btn:disabled,\ninput[type=\"submit\"]:disabled,\ninput[type=\"button\"]:disabled {\n    opacity: 0.5 !important;\n    cursor: not-allowed !important;\n    transform: none !important;\n}\n\n/* Button Variants */\nbutton.primary,\n.btn-primary {\n    background: linear-gradient(135deg, var(--accent-gold) 0%, #c49a2a 100%) !important;\n    color: var(--primary-blue) !important;\n}\n\nbutton.secondary,\n.btn-secondary {\n    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%) !important;\n    color: white !important;\n}\n\nbutton.success,\n.btn-success {\n    background: linear-gradient(135deg, #27ae60 0%, #1e8449 100%) !important;\n    color: white !important;\n}\n\nbutton.danger,\n.btn-danger {\n    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;\n    color: white !important;\n}\n\nbutton.info,\n.btn-info {\n    background: linear-gradient(135deg, var(--light-blue) 0%, var(--primary-blue) 100%) !important;\n    color: white !important;\n}\n\n/* ==========================================\n   TABLE ENHANCEMENTS\n   ========================================== */\n\ntable {\n    width: 100% !important;\n    border-collapse: separate !important;\n    border-spacing: 0 !important;\n}\n\ntable thead {\n    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--light-blue) 100%) !important;\n}\n\ntable thead th {\n    color: white !important;\n    font-weight: 700 !important;\n    letter-spacing: 0.5px !important;\n    padding: 1rem !important;\n    text-align: left !important;\n    text-transform: uppercase !important;\n    font-size: 0.85rem !important;\n    border: none !important;\n}\n\ntable tbody tr {\n    border-bottom: 1px solid rgba(13, 71, 161, 0.1) !important;\n    transition: all 0.2s ease !important;\n}\n\ntable tbody tr:hover {\n    background: rgba(212, 175, 55, 0.05) !important;\n    box-shadow: inset 0 0 8px rgba(13, 71, 161, 0.05) !important;\n}\n\ntable tbody td {\n    padding: 1rem !important;\n    color: var(--text-secondary) !important;\n    font-weight: 500 !important;\n}\n\ntable tbody tr:last-child td {\n    border-bottom: 2px solid var(--accent-gold) !important;\n}\n\n/* ==========================================\n   ALERT & MESSAGE BOXES\n   ========================================== */\n\n.alert,\n.alert-box,\n.message,\n.notification {\n    padding: 1.25rem !important;\n    border-radius: 8px !important;\n    border-left: 5px solid !important;\n    margin-bottom: 1.5rem !important;\n    font-weight: 500 !important;\n}\n\n.alert-success,\n.alert-box.success {\n    background-color: #f0fdf4 !important;\n    border-left-color: #27ae60 !important;\n    color: #1e8449 !important;\n}\n\n.alert-error,\n.alert-danger,\n.alert-box.error {\n    background-color: #fef5f5 !important;\n    border-left-color: #e74c3c !important;\n    color: #c0392b !important;\n}\n\n.alert-warning,\n.alert-box.warning {\n    background-color: #fffbf0 !important;\n    border-left-color: #f39c12 !important;\n    color: #d68910 !important;\n}\n\n.alert-info,\n.alert-box.info {\n    background-color: #f0f7ff !important;\n    border-left-color: var(--light-blue) !important;\n    color: var(--primary-blue) !important;\n}\n\n/* ==========================================\n   MODAL & DIALOG ENHANCEMENTS\n   ========================================== */\n\n.modal,\n.dialog,\n.modal-content {\n    border-radius: 12px !important;\n    box-shadow: 0 20px 60px rgba(13, 71, 161, 0.3) !important;\n    border: 1px solid rgba(212, 175, 55, 0.2) !important;\n}\n\n.modal-header,\n.dialog-header {\n    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--light-blue) 100%) !important;\n    color: white !important;\n    padding: 1.5rem !important;\n    border-radius: 12px 12px 0 0 !important;\n    font-weight: 800 !important;\n    letter-spacing: 0.5px !important;\n}\n\n.modal-body,\n.dialog-body {\n    padding: 2rem !important;\n}\n\n.modal-footer,\n.dialog-footer {\n    padding: 1.5rem !important;\n    border-top: 1px solid rgba(13, 71, 161, 0.1) !important;\n    background: #f9fafb !important;\n    border-radius: 0 0 12px 12px !important;\n}\n\n/* ==========================================\n   INTAKE FORM LOGO STYLING\n   ========================================== */\n\n/* Yellow Circular Border for Logos */\n.l-seal,\n.intake-paper img[src*=\"seal\"],\n.intake-paper img[src*=\"logo\"],\n.bp-icon {\n    border: 4px solid var(--accent-gold) !important;\n    border-radius: 50% !important;\n    padding: 8px !important;\n    box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3) !important;\n    transition: all 0.3s ease !important;\n}\n\n.l-seal:hover,\n.intake-paper img[src*=\"seal\"]:hover,\n.intake-paper img[src*=\"logo\"]:hover {\n    transform: scale(1.05) !important;\n    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.4) !important;\n}\n\n/* Logo Container Styling */\n.header-left-logos,\n.header-right-logos {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    gap: 20px !important;\n}\n\n/* Center Logo Styling */\n.logo-placeholder {\n    text-align: center !important;\n}\n\n.m-logo img {\n    border: 4px solid var(--accent-gold) !important;\n    border-radius: 50% !important;\n    padding: 8px !important;\n    box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3) !important;\n}\n\n
 select.no-arrow-select {
    background-image: none !important;
    padding-right: 1rem !important;
}

select.no-arrow-select {
    background-image: none !important;
    background-color: transparent !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    padding-right: 1rem !important;
}

select.no-arrow-select::-ms-expand {
    display: none !important;
}

select.no-arrow-select::-webkit-appearance: none !important;
select.no-arrow-select::-moz-appearance: none !important;

/* Intake history display override */

#generalIntakeForm input:disabled,
#generalIntakeForm textarea:disabled,
#generalIntakeForm select:disabled {
    color: #000 !important;
    background-color: #fff !important;
    cursor: default !important;
    opacity: 1 !important;
}