/* =====================================================================
   KsTU SOIS theme — palette drawn from the institutional crest.
   Loaded AFTER adminlte.min.css so selectors below override the defaults.
   Palette:
     --kstu-navy        #12265a  shield / primary surfaces
     --kstu-navy-deep   #0a1838  sidebar deep background
     --kstu-navy-dark   #091330  hover/active deepest
     --kstu-gold        #d4a017  gear + banner accent / active state
     --kstu-gold-light  #e6ba3a  gold hover
     --kstu-crimson     #c8102e  flame accent / danger
     --kstu-cream       #f6f1e3  soft page surface
   ===================================================================== */

:root {
    --kstu-navy: #12265a;
    --kstu-navy-deep: #0a1838;
    --kstu-navy-dark: #091330;
    --kstu-gold: #d4a017;
    --kstu-gold-light: #e6ba3a;
    --kstu-crimson: #c8102e;
    --kstu-cream: #f6f1e3;
    --kstu-ink: #1a1f36;
}

/* ---------- Global body / backgrounds ---------- */
body,
.content-wrapper {
    background-color: #f1f3f7 !important;
    color: var(--kstu-ink);
}

/* ---------- Top navbar ---------- */
.main-header.navbar-dark,
.main-header.navbar {
    background: linear-gradient(90deg, var(--kstu-navy) 0%, var(--kstu-navy-deep) 100%) !important;
    border-bottom: 3px solid var(--kstu-gold) !important;
}

.main-header .nav-link,
.main-header .navbar-nav .nav-link {
    color: #ffffff !important;
}

.main-header .nav-link:hover,
.main-header .navbar-nav .nav-link:hover {
    color: var(--kstu-gold-light) !important;
}

.main-header .navbar-badge {
    background-color: var(--kstu-gold) !important;
    color: var(--kstu-navy) !important;
    border: 1px solid var(--kstu-navy-deep);
}

/* ---------- Sidebar ---------- */
.main-sidebar,
.main-sidebar.sidebar-dark-primary {
    background: linear-gradient(180deg, var(--kstu-navy) 0%, var(--kstu-navy-deep) 100%) !important;
}

.sidebar-dark-primary .brand-link,
.main-sidebar .brand-link {
    background-color: var(--kstu-navy-deep) !important;
    border-bottom: 2px solid var(--kstu-gold) !important;
    color: #ffffff !important;
}

.sidebar-dark-primary .brand-link .brand-text {
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
}

.sidebar-dark-primary .brand-image {
    border: 2px solid var(--kstu-gold) !important;
    background-color: #ffffff !important;
    opacity: 1 !important;
}

.sidebar-dark-primary .user-panel {
    border-bottom: 1px solid rgba(212, 160, 23, 0.25) !important;
}

.sidebar-dark-primary .user-panel .info a {
    color: #ffffff !important;
}

.sidebar-dark-primary .user-panel .image img {
    border: 2px solid var(--kstu-gold) !important;
}

/* Sidebar menu items */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link {
    color: rgba(255, 255, 255, 0.85);
    border-left: 3px solid transparent;
    border-radius: 0;
    margin-bottom: 2px;
}

.sidebar-dark-primary .nav-sidebar .nav-link:hover {
    background-color: rgba(212, 160, 23, 0.15) !important;
    color: var(--kstu-gold-light) !important;
    border-left-color: var(--kstu-gold) !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar .nav-link.active {
    background-color: var(--kstu-gold) !important;
    color: var(--kstu-navy-deep) !important;
    border-left-color: var(--kstu-crimson) !important;
    box-shadow: 0 0 0 0 transparent !important;
    font-weight: 600;
}

.sidebar-dark-primary .nav-sidebar .nav-link.active .nav-icon {
    color: var(--kstu-navy-deep) !important;
}

/* Treeview (submenu) panel */
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link {
    color: rgba(255, 255, 255, 0.75) !important;
    padding-left: 1.25rem;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link:hover {
    background-color: rgba(212, 160, 23, 0.12) !important;
    color: var(--kstu-gold-light) !important;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active {
    background-color: rgba(212, 160, 23, 0.85) !important;
    color: var(--kstu-navy-deep) !important;
    border-left: 3px solid var(--kstu-crimson) !important;
    font-weight: 600;
}

/* Sidebar scrollbar */
.main-sidebar .os-scrollbar-handle {
    background: var(--kstu-gold) !important;
}

/* ---------- Buttons ---------- */
.btn-primary {
    background-color: var(--kstu-navy) !important;
    border-color: var(--kstu-navy-deep) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--kstu-navy-deep) !important;
    border-color: var(--kstu-navy-dark) !important;
    box-shadow: 0 0 0 0.2rem rgba(18, 38, 90, 0.3) !important;
}

.btn-warning {
    background-color: var(--kstu-gold) !important;
    border-color: #b4870f !important;
    color: var(--kstu-navy-deep) !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: var(--kstu-gold-light) !important;
    border-color: var(--kstu-gold) !important;
    color: var(--kstu-navy-deep) !important;
}

.btn-danger {
    background-color: var(--kstu-crimson) !important;
    border-color: #9f0c24 !important;
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: #a10d25 !important;
    border-color: #7d0a1d !important;
}

.btn-outline-primary {
    color: var(--kstu-navy) !important;
    border-color: var(--kstu-navy) !important;
}

.btn-outline-primary:hover {
    background-color: var(--kstu-navy) !important;
    color: #ffffff !important;
}

/* ---------- Links ---------- */
a {
    color: var(--kstu-navy);
}

a:hover {
    color: var(--kstu-gold);
}

/* ---------- Cards ---------- */
.card {
    border-top: 3px solid var(--kstu-navy);
    box-shadow: 0 2px 6px rgba(18, 38, 90, 0.08);
}

.card-primary:not(.card-outline) > .card-header,
.card.card-primary.card-outline {
    background-color: var(--kstu-navy) !important;
}

.card-primary:not(.card-outline) > .card-header {
    color: #ffffff !important;
}

.card.card-primary.card-outline {
    background-color: #ffffff !important;
    border-top: 3px solid var(--kstu-navy) !important;
}

.card-warning:not(.card-outline) > .card-header {
    background-color: var(--kstu-gold) !important;
    color: var(--kstu-navy-deep) !important;
}

.card-danger:not(.card-outline) > .card-header {
    background-color: var(--kstu-crimson) !important;
}

/* ---------- Info boxes / small boxes on dashboard ---------- */
.bg-primary,
.bg-info {
    background-color: var(--kstu-navy) !important;
    color: #ffffff !important;
}

.bg-warning {
    background-color: var(--kstu-gold) !important;
    color: var(--kstu-navy-deep) !important;
}

.bg-danger {
    background-color: var(--kstu-crimson) !important;
}

.bg-success {
    background-color: #1e7a47 !important;
}

.small-box.bg-info,
.small-box.bg-primary {
    background: linear-gradient(135deg, var(--kstu-navy) 0%, var(--kstu-navy-deep) 100%) !important;
}

.small-box.bg-warning {
    background: linear-gradient(135deg, var(--kstu-gold) 0%, #b4870f 100%) !important;
    color: var(--kstu-navy-deep) !important;
}

.small-box.bg-danger {
    background: linear-gradient(135deg, var(--kstu-crimson) 0%, #8d0b20 100%) !important;
}

.small-box .icon > i {
    color: rgba(255, 255, 255, 0.2) !important;
}

.small-box.bg-warning .icon > i {
    color: rgba(10, 24, 56, 0.2) !important;
}

/* ---------- Badges ---------- */
.badge-primary { background-color: var(--kstu-navy) !important; }
.badge-warning { background-color: var(--kstu-gold) !important; color: var(--kstu-navy-deep) !important; }
.badge-danger  { background-color: var(--kstu-crimson) !important; }

/* ---------- Text colors ---------- */
.text-primary { color: var(--kstu-navy) !important; }
.text-warning { color: var(--kstu-gold) !important; }
.text-danger  { color: var(--kstu-crimson) !important; }

/* ---------- Content header (breadcrumbs) ---------- */
.content-header h1 {
    color: var(--kstu-navy);
    font-weight: 600;
}

.breadcrumb-item.active { color: var(--kstu-gold); }
.breadcrumb-item > a { color: var(--kstu-navy); }

/* ---------- Tables ---------- */
.table thead th,
table.dataTable thead th {
    background-color: var(--kstu-navy) !important;
    color: #ffffff !important;
    border-color: var(--kstu-navy-deep) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(18, 38, 90, 0.03);
}

.table-hover tbody tr:hover {
    background-color: rgba(212, 160, 23, 0.08) !important;
}

/* ---------- Pagination ---------- */
.page-item.active .page-link {
    background-color: var(--kstu-navy) !important;
    border-color: var(--kstu-navy-deep) !important;
    color: #ffffff !important;
}

.page-link {
    color: var(--kstu-navy) !important;
}

.page-link:hover {
    background-color: rgba(212, 160, 23, 0.15) !important;
    color: var(--kstu-navy-deep) !important;
}

/* ---------- Forms ---------- */
.form-control:focus {
    border-color: var(--kstu-gold) !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 160, 23, 0.2) !important;
}

.input-group-text {
    background-color: var(--kstu-cream) !important;
    border-color: #d8d2c0 !important;
    color: var(--kstu-navy) !important;
}

.custom-control-input:checked ~ .custom-control-label::before,
.icheck-primary > input:first-child:checked + input[type="hidden"] + label::before,
.icheck-primary > input:first-child:checked + label::before {
    background-color: var(--kstu-navy) !important;
    border-color: var(--kstu-navy-deep) !important;
}

/* ---------- Login page ---------- */
.login-page {
    background: linear-gradient(135deg, var(--kstu-navy) 0%, var(--kstu-navy-deep) 100%) !important;
    min-height: 100vh;
}

.login-page .card {
    border-top: 4px solid var(--kstu-gold);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.login-logo a,
.register-logo a {
    color: var(--kstu-navy) !important;
    font-weight: 700;
}

.login-logo a b {
    color: var(--kstu-gold) !important;
}

.login-box-msg {
    color: var(--kstu-navy) !important;
    font-weight: 500;
}

/* ---------- Footer ---------- */
.main-footer {
    background-color: #ffffff !important;
    border-top: 2px solid var(--kstu-gold) !important;
    color: var(--kstu-navy) !important;
}

/* ---------- Preloader ---------- */
.preloader {
    background-color: var(--kstu-navy) !important;
}

/* ---------- Tabs ---------- */
.nav-tabs .nav-link.active {
    color: var(--kstu-navy) !important;
    border-top: 2px solid var(--kstu-gold) !important;
    font-weight: 600;
}

/* ---------- Alerts ---------- */
.alert-primary {
    background-color: rgba(18, 38, 90, 0.1) !important;
    border-color: var(--kstu-navy) !important;
    color: var(--kstu-navy-deep) !important;
}

.alert-warning {
    background-color: rgba(212, 160, 23, 0.15) !important;
    border-color: var(--kstu-gold) !important;
    color: #7a5a0a !important;
}

.alert-danger {
    background-color: rgba(200, 16, 46, 0.1) !important;
    border-color: var(--kstu-crimson) !important;
    color: #7d0a1d !important;
}

/* ---------- Select2 (common widget in this project) ---------- */
.select2-container--bootstrap4 .select2-selection {
    border-color: #ced4da !important;
}

.select2-container--bootstrap4.select2-container--focus .select2-selection {
    border-color: var(--kstu-gold) !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 160, 23, 0.2) !important;
}

.select2-container--bootstrap4 .select2-results__option--highlighted[aria-selected] {
    background-color: var(--kstu-navy) !important;
    color: #ffffff !important;
}