/* css/student_theme.css */

/* --- 1. CUSTOM COLOR PALETTE OVERRIDES --- */
:root {
    --smc-darkest: #355872;
    --smc-dark: #7AAACE;
    --smc-light: #9CD5FF;
    --smc-card: #e1fae6;
    --smc-gray: #F7F8F0;
    --smc-gray2: #e0e9ee;
    --smc-white: #FFFFFF;
}

/* --- 2. GLOBAL BACKGROUNDS & TEXT --- */
body { background-color: var(--smc-white) !important; }
.bg-white { background-color: var(--smc-white) !important; }
.bg-light { background-color: var(--smc-gray) !important; }
.text-primary { color: var(--smc-dark) !important; }
.text-primary-white { color: var(--smc-white) !important; }
.text-success { color: var(--smc-dark) !important; }
.text-success2 { color: var(--smc-darkest) !important; }
.text-light { color: var(--smc-light) !important; }
.bg-darkest { background-color: var(--smc-darkest) !important; }
.bg-light2 { background-color: var(--smc-light) !important; }
.bg-card { background-color: var(--smc-card) !important; }
.bg-dark { background-color: var(--smc-dark) !important; }
.bg-gray2 { background-color: var(--smc-gray2) !important; }

/* --- 3. BUTTONS --- */
.btn-primary {
    background-color: var(--smc-dark) !important;
    border-color: var(--smc-dark) !important;
    color: var(--smc-white) !important;
}
.btn-primary:hover {
    background-color: var(--smc-darkest) !important;
    border-color: var(--smc-darkest) !important;
}

.btn-success2 {
    transition: all 0.3s ease-in-out; 
}

.btn-success2:hover {
    background-color: var(--smc-light) !important;
    border-color: var(--smc-light) !important;
}
.btn-outline-secondary {
    border-color: var(--smc-dark) !important;
    color: var(--smc-dark) !important;
}
.btn-outline-secondary:hover {
    background-color: var(--smc-dark) !important;
    color: var(--smc-white) !important;
}

.btn-success {
    background-color: var(--smc-light) !important;
    border-color: var(--smc-light) !important;
    color: var(--smc-darkest) !important;
    font-weight: bold;
}
.btn-success2 {
    background-color: var(--smc-darkest) !important;
    border-color: var(--smc-darkest) !important;
    color: var(--smc-white) !important;
    font-weight: bold;
}

/* --- 4. TABLES & PROGRESS BARS --- */
.table-dark {
    background-color: var(--smc-darkest) !important;
    color: var(--smc-white) !important;
}
.table-dark th {
    background-color: var(--smc-darkest) !important;
    color: var(--smc-white) !important;
    border-color: var(--smc-dark) !important;
}
.progress-bar.bg-success {
    background-color: var(--smc-light) !important;
}
.table-middle td { vertical-align: middle; }
.dashboard-table th { white-space: nowrap; }

/* --- 5. STUDENT SIDEBAR OVERRIDES --- */
#sidebar .bg-primary {
    background-color: var(--smc-dark) !important;
}

#sidebar .nav-link.active {
    background-color: var(--smc-dark) !important;
    color: var(--smc-white) !important;
}

#sidebar .nav-link:hover:not(.active) {
    background-color: rgba(78, 113, 255, 0.15) !important; 
    color: var(--smc-darkest) !important;
}

#sidebar .link-danger:hover {
    background-color: rgba(220, 53, 69, 0.1) !important;
}

/* --- 6. DESKTOP SIDEBAR COLLAPSE TOGGLE --- */
#sidebar {
    transition: margin-left 0.3s ease-in-out; 
}

@media (min-width: 992px) {
    #sidebar.collapsed {
        margin-left: -260px !important; 
    }
}

/* --- 7. CARDS & WIDGETS (HOVER EFFECTS) --- */
.dashboard-card,
.profile-card,
.hover-card {
    border-radius: 16px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dashboard-card:hover,
.profile-card:hover,
.hover-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.12) !important;
}

.info-box {
    background-color: var(--smc-gray);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    height: 100%;
    border-left: 4px solid var(--smc-dark);
    transition: background-color 0.2s ease;
}

.info-box.alt-border {
    border-left-color: var(--smc-darkest);
}

.info-box:hover {
    background-color: var(--smc-gray2);
}

.info-label {
    font-size: 0.75rem;
    letter-spacing: 0.5px;
}