/* Emerald Theme - Global CSS */
:root {
    --emerald-50: #f0fdf4;
    --emerald-100: #dcfce7;
    --emerald-200: #bbf7d0;
    --emerald-300: #6ee7b7;
    --emerald-400: #34d399;
    --emerald-500: #10b981;
    --emerald-600: #059669;
    --emerald-700: #047857;
    --emerald-800: #065f46;
    --emerald-900: #064e3b;
    --emerald-gradient: linear-gradient(135deg, #047857 0%, #059669 50%, #10b981 100%);
    --emerald-gradient-light: linear-gradient(135deg, #34d399 0%, #10b981 100%);
    
    /* Bootstrap Override */
    --primary: #059669 !important;
    --danger: #059669 !important;
    --success: #10b981 !important;
}

/* Primary Color Emerald */
.bg-emerald {
    background-color: #059669 !important;
}

.bg-emerald-light {
    background-color: #34d399 !important;
}

.bg-emerald-dark {
    background-color: #047857 !important;
}

.bg-emerald-gradient {
    background: var(--emerald-gradient) !important;
}

.text-emerald {
    color: #059669 !important;
}

.border-emerald {
    border-color: #059669 !important;
}

/* Gradient backgrounds for sections */
.header-emerald-gradient {
    background: linear-gradient(135deg, #047857 0%, #059669 50%, #10b981 100%);
    color: white;
}

.sidebar-emerald-gradient {
    background: linear-gradient(180deg, #065f46 0%, #047857 100%);
    color: white;
}

/* Hover states */
.hover-emerald:hover {
    background-color: #10b981 !important;
    transition: all 0.3s ease;
}

/* Light emerald backgrounds for subtle effects */
.bg-emerald-50 {
    background-color: #f0fdf4 !important;
}

.bg-emerald-100 {
    background-color: #dcfce7 !important;
}

.bg-emerald-200 {
    background-color: #bbf7d0 !important;
}

.bg-emerald-300 {
    background-color: #6ee7b7 !important;
}

.bg-emerald-400 {
    background-color: #34d399 !important;
}

.bg-emerald-500 {
    background-color: #10b981 !important;
}

.bg-emerald-600 {
    background-color: #059669 !important;
}

.bg-emerald-700 {
    background-color: #047857 !important;
}

.bg-emerald-800 {
    background-color: #065f46 !important;
}

.bg-emerald-900 {
    background-color: #064e3b !important;
}

/* Text colors */
.text-emerald-600 {
    color: #059669 !important;
}

.text-emerald-700 {
    color: #047857 !important;
}

/* Border colors */
.border-emerald-600 {
    border-color: #059669 !important;
}

.border-emerald-700 {
    border-color: #047857 !important;
}

/* Bootstrap Component Overrides to Emerald */
.btn-danger, .bg-danger, .badge-danger, .btn-primary, .bg-primary {
    background-color: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

.btn-danger:hover, .btn-danger:focus, .btn-danger:active,
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #047857 !important;
    border-color: #047857 !important;
    color: #fff !important;
}

.text-danger, .text-primary {
    color: #059669 !important;
}

/* Active state for navigation */
.nav-link.active,
.nav-item.active {
    color: #059669 !important;
    background-color: #f0fdf4 !important;
}

/* Emerald Button Variants */
.btn-emerald {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important;
    color: white !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.2) !important;
}

.btn-emerald-dark {
    background: linear-gradient(135deg, #065f46 0%, #047857 100%) !important;
    color: white !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(4, 120, 87, 0.2) !important;
}

.btn-emerald-outline {
    background: transparent !important;
    color: #059669 !important;
    border: 2px solid #059669 !important;
}

.btn-emerald-outline:hover {
    background: #059669 !important;
    color: white !important;
}

/* Modern Form Elements Overrides */
.form-control, .form-input, select, textarea {
    border-radius: 12px !important;
    padding: 0.75rem 1.25rem !important;
    border: 1px solid #e2e8f0 !important;
    font-size: 0.95rem;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
    height: auto !important;
}

.input-group-prepend .input-group-text {
    border-radius: 12px 0 0 12px !important;
    border: 1px solid #e2e8f0 !important;
    border-right: none !important;
    padding-left: 1.25rem;
    color: #059669;
}

.input-group .form-control {
    border-radius: 0 12px 12px 0 !important;
    border-left: none !important;
}

.input-group:focus-within .input-group-text,
.input-group:focus-within .form-control {
    border-color: #10b981 !important;
}

.form-control:focus, .form-input:focus {
    border-color: #10b981 !important;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1) !important;
    outline: none !important;
}

.btn {
    border-radius: 12px !important;
    padding: 0.75rem 1.5rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    transition: all 0.2s ease !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}

.btn:active {
    transform: translateY(0);
}

.card, .rounded-lg {
    border-radius: 20px !important;
    border: 1px solid #edf2f7 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05) !important;
    overflow: hidden;
    background: #fff;
}

/* AdminLTE & Admin Dashboard Emerald Theme Overrides */
.main-sidebar, .sidebar-dark-primary, .bg-primary, .btn-primary {
    background: linear-gradient(180deg, #065f46 0%, #047857 100%) !important;
}

/* Unified Sidebar Emerald Theme (Admin & Public) */
.main-sidebar, .sidebar-dark-primary, .sidebar-light, #accordionSidebar {
    background: linear-gradient(180deg, #065f46 0%, #047857 100%) !important;
    border-right: none !important;
}

/* High-Contrast Stat Boxes & Backgrounds (Non-Green Variants) */
.bg-warning, .small-box.bg-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important; /* Modern Orange-Yellow */
    color: #fff !important;
}

.bg-success, .small-box.bg-success {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important; /* Modern Emerald */
    color: #fff !important;
}

.bg-danger, .small-box.bg-danger {
    background: linear-gradient(135deg, #dc2626 0%, #ef4444 100%) !important; /* Modern Red */
    color: #fff !important;
}

.bg-info, .small-box.bg-info {
    background: linear-gradient(135deg, #0284c7 0%, #0ea5e9 100%) !important; /* Modern Blue */
    color: #fff !important;
}

.bg-primary, .small-box.bg-primary {
    background: linear-gradient(135deg, #047857 0%, #059669 100%) !important; /* Brand Emerald */
    color: #fff !important;
}

/* Common Sidebar Text & Branding Colors */
.sidebar-light .nav-link, 
.sidebar-light .sidebar-heading, 
.sidebar-light .sidebar-brand,
.sidebar-dark-primary .nav-link {
    color: rgba(255, 255, 255, 0.8) !important;
}

.sidebar-light .nav-link i,
.sidebar-dark-primary .nav-link i {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Sidebar Branding Refinement */
.sidebar-brand-text {
    text-transform: none !important;
    letter-spacing: 0.5px !important;
    color: #fff !important;
}

/* Sidebar Navigation Items - FIXED WHITE BOX CONFLICT */
.nav-item, .nav-item.active, .nav-item.menu-open {
    background: transparent !important; /* Ensure the container is always transparent */
}

.nav-item .nav-link {
    border-radius: 12px !important;
    margin: 4px 14px !important;
    padding: 0.85rem 1rem !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background-color: transparent !important;
}

/* Sidebar Active State - ONLY DARK EMERALD, NO WHITE */
.sidebar .nav-item .nav-link.active,
.sidebar .nav-item.active > .nav-link,
#accordionSidebar .nav-item .nav-link.active,
.nav-sidebar .menu-open > .nav-link {
    background-color: #023627 !important; /* Deep forest emerald */
    color: #fff !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
}

/* SETACTIVE HOVER - Even darker, no white pulse */
.sidebar .nav-item .nav-link.active:hover,
#accordionSidebar .nav-item .nav-link.active:hover,
.nav-sidebar .menu-open > .nav-link:hover {
    background-color: #011f16 !important; /* Absolute darkest forest green */
    transform: translateX(4px);
}

/* General Sidebar Hover */
.sidebar .nav-item .nav-link:not(.active):hover,
#accordionSidebar .nav-item .nav-link:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    transform: translateX(4px);
}

/* Sub-menu (Collapse) Modernization */
.collapse-inner {
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-radius: 12px !important;
    padding: 10px !important;
    margin: 5px 14px !important;
    border: none !important;
}

.collapse-item {
    color: rgba(255, 255, 255, 0.7) !important;
    border-radius: 8px !important;
    padding: 8px 15px !important;
    margin: 2px 0 !important;
    font-size: 0.85rem !important;
    display: block !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.collapse-item:hover, .collapse-item.active {
    background-color: #10b981 !important;
    color: #fff !important;
    padding-left: 20px !important;
}

.collapse-header {
    color: #34d399 !important;
    font-size: 0.7rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding-left: 15px !important;
}

/* Sidebar Heading Overrides */
.sidebar-heading {
    color: rgba(255, 255, 255, 0.4) !important;
    padding-left: 25px !important;
    font-size: 0.65rem !important;
}

/* Fix for top navbar */
.main-header.navbar {
    border-bottom: 1px solid #edf2f7 !important;
}

/* Global Rounding and Background Fix for Sections */
.card, .info-box, .small-box, .modal-content, .alert {
    border-radius: 15px !important;
    border: none !important;
    overflow: hidden !important;
    background-color: #ffffff !important; /* FORCED OPAQUE */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
}

.modal-header, .modal-body, .modal-footer {
    background-color: #ffffff !important; /* ENSURE BODY IS NOT TRANSPARENT */
}

.modal-header {
    border-bottom: 1px solid #edf2f7 !important;
}

.modal-footer {
    border-top: 1px solid #edf2f7 !important;
}

/* Charts and Tables containers */
.table-responsive {
    border-radius: 12px !important;
}

/* Inputs and Buttons in Admin */
.form-control, .form-control-sm, .select2-container--bootstrap4 .select2-selection {
    border-radius: 10px !important;
    padding: 0.5rem 0.75rem !important;
    height: auto !important;
}

.btn-sm {
    border-radius: 8px !important;
}

/* Badge and Status Label Modernization */
.badge {
    border-radius: 50px !important;
    padding: 6px 14px !important;
    font-weight: 600 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

/* Soft Emerald for Active/Success */
.badge-success, .badge-active {
    background-color: #dcfce7 !important; /* Soft Emerald 100 */
    color: #059669 !important; /* Strong Emerald 600 */
    border: 1px solid #bbf7d0 !important;
}

/* Soft Red/Grey for Inactive/Danger */
.badge-danger, .badge-inactive {
    background-color: #fee2e2 !important; /* Soft Red 100 */
    color: #dc2626 !important; /* Red 600 */
    border: 1px solid #fecaca !important;
}

/* Soft Amber for Pending/Warning */
.badge-warning, .badge-pending {
    background-color: #fef3c7 !important; /* Soft Amber 100 */
    color: #d97706 !important; /* Amber 600 */
    border: 1px solid #fde68a !important;
}

/* Soft Blue for Info */
.badge-info {
    background-color: #e0f2fe !important;
    color: #0284c7 !important;
    border: 1px solid #bae6fd !important;
}

.badge-secondary {
    background-color: #f3f4f6 !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb !important;
}

/* Specific Sidebar active/hover tweaks */
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active, 
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active:hover {
    background-color: #10b981 !important;
    color: #fff !important;
}

/* Mobile & Tablet Responsiveness Tweaks */
@media (max-width: 991px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .row {
        margin-left: -10px;
        margin-right: -10px;
    }
    
    [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 768px) {
    body {
        font-size: 15px;
    }
    
    .btn {
        width: 100%;
        margin-bottom: 12px;
        padding: 0.85rem !important;
    }
    
    .form-control, .form-input {
        font-size: 16px !important; /* Prevents auto-zoom on iOS */
    }
}


/* Override SB Admin Scroll to Top */
.scroll-to-top {
    background: var(--emerald-500) !important;
    transition: all 0.3s ease;
}
.scroll-to-top:hover {
    background: var(--emerald-600) !important;
}