/**
 * Theme Variables CSS
 * 
 * This file defines CSS variables that are controlled by the centralized
 * theme configuration (config/theme.php). These variables are used throughout
 * the application to maintain a consistent color theme.
 * 
 * To change the application's primary color, update config/theme.php
 * and then update the CSS variable values below to match.
 */

:root {
    /* Primary Theme Colors - Green Theme */
    --primary-color: #198754;
    --primary-dark: #198754;
    --primary-light: #d1e7dd;
    --primary-lighter: #e8f5e9;
    --primary-hover: #198754;
    
    /* Bootstrap Primary Override */
    --bootstrap-primary: #198754;
    --bootstrap-primary-hover: #198754;
    
    /* Text Colors */
    --text-primary: #198754;
    
    /* Border Colors */
    --border-primary: #198754;
    
    /* Background Colors */
    --background-primary: #198754;
    
    /* AdminLTE Theme Colors */
    --adminlte-primary: #198754;
    --adminlte-primary-dark: #198754;
    --adminlte-primary-light: #d1e7dd;
    
    /* Excel Green (for export buttons - keeping existing green) */
    --excel-green: #198754;
    --excel-green-dark: #198754;
    --excel-green-hover: #198754;
    
    /* Success Green (for success states) */
    --success-green: #198754;
    --success-green-light: #e8f5e8;
}

/* Override checkbox accent color to green */
input[type="checkbox"] {
    accent-color: #198754;
}

/* Override text-primary color */
.text-primary {
    color: var(--text-primary) !important;
}

/* Override box-primary border color */
.box-primary {
    border-top-color: var(--primary-color) !important;
}

/* Override box-info to use green theme instead of blue */
.box-info {
    border-top-color: var(--primary-color) !important;
}

/* Override bg-primary class to use green theme - but exclude buttons */
.bg-primary:not(.btn) {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

/* Keep Edit buttons in original blue color - override skin-green */
#btn-edit.btn-primary,
button#btn-edit.btn-primary {
    background-color: #0275d4 !important;
    border-color: #0275d4 !important;
    color: #fff !important;
}

#btn-edit.btn-primary:hover,
button#btn-edit.btn-primary:hover {
    background-color: #025aa5 !important;
    border-color: #025aa5 !important;
    color: #fff !important;
}

/* Override authentication buttons (Login, Password Reset) to use green theme */
.login-box .btn-primary,
.login-box button[type="submit"].btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

.login-box .btn-primary:hover,
.login-box button[type="submit"].btn-primary:hover {
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

/* Override modal header background */
.modal-header {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

/* Override active menu items and hover states */
.sidebar-menu > li.active > a,
.sidebar-menu > li > a:hover {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

.treeview-menu li a:hover {
    background: var(--primary-color) !important;
    color: #fff !important;
}

/* Override scroll arrow background */
.scroll-arrow {
    background: var(--primary-color) !important;
}

/* Override nav-tabs active border */
.nav-tabs > li.active > a {
    border-top: 3px solid var(--primary-color) !important;
}

/* Override permission group headers */
.permission-group h5 {
    color: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
}

/* Override selected table row background */
table.dataTable tbody tr.selected {
    background-color: var(--primary-lighter) !important;
}

/* Override DataTable selected rows with checkboxes */
#dataTable tbody tr.selected {
    background-color: var(--primary-lighter) !important;
}

/* Override merged row styles */
table.dataTable tbody tr.merged-row {
    background-color: var(--primary-lighter) !important;
    border-left: 4px solid var(--success-green) !important;
}

table.dataTable tbody tr.merged-row:hover {
    background-color: var(--primary-light) !important;
}

/* Override footer links */
.main-footer a {
    color: var(--primary-color) !important;
}

.main-footer a:hover {
    color: var(--primary-dark) !important;
}

/* Override DataTable pagination */
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

.pagination > li > a,
.pagination > li > span {
    color: var(--primary-color) !important;
}

.pagination > li > a:hover,
.pagination > li > span:hover {
    color: var(--primary-dark) !important;
}
