/* Section cards — colored left borders + hover tints */
.section-card-hr { border-left: 4px solid var(--section-hr) !important; }
.section-card-edu { border-left: 4px solid var(--section-edu) !important; }
.section-card-research { border-left: 4px solid var(--section-research) !important; }
.section-card-qa { border-left: 4px solid var(--section-qa) !important; }
.section-card-ict { border-left: 4px solid var(--section-ict) !important; }
.section-card-admin { border-left: 4px solid var(--section-admin) !important; }

.section-card-hr:hover { background-color: var(--section-hr-light) !important; }
.section-card-edu:hover { background-color: var(--section-edu-light) !important; }
.section-card-research:hover { background-color: var(--section-research-light) !important; }
.section-card-qa:hover { background-color: var(--section-qa-light) !important; }
.section-card-ict:hover { background-color: var(--section-ict-light) !important; }
.section-card-admin:hover { background-color: var(--section-admin-light) !important; }

/* Research purple — Bootstrap doesn't have a text-purple utility */
.text-research { color: var(--section-research) !important; }
.text-admin { color: var(--section-admin) !important; }

/* Disabled cards — no access */
.section-card-disabled {
    opacity: 0.55;
    pointer-events: none;
}
.section-card-disabled .card,
.section-card-disabled:hover {
    transform: none !important;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

/* Quick link cards — subtle left border */
.quick-link-card {
    border-left: 3px solid var(--bs-secondary) !important;
    background-color: #fff;
}
.quick-link-card:hover {
    background-color: var(--bs-gray-100, #f8f9fa) !important;
}

/* Section home page header banners */
.section-banner-hr {
    background-color: var(--section-hr-light) !important;
}
.section-banner-edu {
    background-color: var(--section-edu-light) !important;
}
.section-banner-research {
    background-color: var(--section-research-light) !important;
}
.section-banner-qa {
    background-color: var(--section-qa-light) !important;
}
.section-banner-ict {
    background-color: var(--section-ict-light) !important;
}
.section-banner-admin {
    background-color: var(--section-admin-light) !important;
}