/* =============================================================
   iTas-online · Science Theme overrides
   Loaded AFTER css/main.css to replace the legacy red/orange
   palette with the navy + cyan science palette used on the
   homepage. No SCSS recompile needed.
   ============================================================= */

:root {
    /* ---- Science palette ---- */
    --sci-navy:        #0b2540;
    --sci-navy-deep:   #07182b;
    --sci-cyan:        #11c2db;
    --sci-cyan-soft:   rgba(17, 194, 219, 0.15);
    --sci-teal:        #0d8b9a;
    --sci-mint:        #21d4a0;
    --sci-amber:       #f5a623;
    --sci-surface:     #f4f8fb;
    --sci-brand-red:   #b41412;
    --sci-text:        #0b2540;
    --sci-text-muted:  #5b6d80;
    --sci-border:      rgba(11, 37, 64, 0.12);

    /* ---- Bootstrap variable overrides ---- */
    --bs-primary:       #0b2540;
    --bs-primary-rgb:   11, 37, 64;
    --bs-secondary:     #11c2db;
    --bs-secondary-rgb: 17, 194, 219;
    --bs-success:       #21d4a0;
    --bs-success-rgb:   33, 212, 160;
    --bs-info:          #0d8b9a;
    --bs-info-rgb:      13, 139, 154;
    --bs-warning:       #f5a623;
    --bs-warning-rgb:   245, 166, 35;
    --bs-danger:        #b41412;
    --bs-danger-rgb:    180, 20, 18;
    --bs-light:         #f4f8fb;
    --bs-light-rgb:     244, 248, 251;
    --bs-dark:          #07182b;
    --bs-dark-rgb:      7, 24, 43;

    --bs-link-color:        #0b2540;
    --bs-link-color-rgb:    11, 37, 64;
    --bs-link-hover-color:  #11c2db;
    --bs-link-hover-color-rgb: 17, 194, 219;

    --bs-body-color:        #0b2540;
    --bs-body-color-rgb:    11, 37, 64;
    --bs-emphasis-color:    #0b2540;
    /* Let headings inherit color from their context so they remain
       readable on both light and dark backgrounds (e.g. the hero). */
    --bs-heading-color:     inherit;

    --bs-border-color:      rgba(11, 37, 64, 0.12);
}

/* ---------------------------------------------------------------
   Text utilities
   --------------------------------------------------------------- */
.text-primary     { color: var(--sci-navy)  !important; }
.text-secondary   { color: var(--sci-cyan)  !important; }
.text-success     { color: var(--sci-mint)  !important; }
.text-info        { color: var(--sci-teal)  !important; }
.text-warning     { color: var(--sci-amber) !important; }
.text-danger      { color: var(--sci-brand-red) !important; }
.text-light       { color: var(--sci-surface)   !important; }
.text-dark        { color: var(--sci-navy-deep) !important; }
.text-body        { color: var(--sci-text)  !important; }
.text-muted       { color: var(--sci-text-muted) !important; }

/* ---------------------------------------------------------------
   Background utilities
   --------------------------------------------------------------- */
.bg-primary       { background-color: var(--sci-navy)  !important; color: #fff; }
.bg-secondary     { background-color: var(--sci-cyan)  !important; color: var(--sci-navy-deep); }
.bg-success       { background-color: var(--sci-mint)  !important; color: var(--sci-navy-deep); }
.bg-info          { background-color: var(--sci-teal)  !important; color: #fff; }
.bg-warning       { background-color: var(--sci-amber) !important; color: var(--sci-navy-deep); }
.bg-danger        { background-color: var(--sci-brand-red) !important; color: #fff; }
.bg-light         { background-color: var(--sci-surface)   !important; }
.bg-dark          { background-color: var(--sci-navy-deep) !important; color: #fff; }

/* ---------------------------------------------------------------
   Border utilities
   --------------------------------------------------------------- */
.border-primary   { border-color: var(--sci-navy)  !important; }
.border-secondary { border-color: var(--sci-cyan)  !important; }
.border-success   { border-color: var(--sci-mint)  !important; }
.border-info      { border-color: var(--sci-teal)  !important; }
.border-warning   { border-color: var(--sci-amber) !important; }
.border-danger    { border-color: var(--sci-brand-red) !important; }
.border-dark      { border-color: var(--sci-navy-deep) !important; }

/* ---------------------------------------------------------------
   Solid buttons
   --------------------------------------------------------------- */
.btn-primary {
    --bs-btn-bg:               var(--sci-navy);
    --bs-btn-border-color:     var(--sci-navy);
    --bs-btn-color:            #fff;
    --bs-btn-hover-bg:         #133e69;
    --bs-btn-hover-border-color: #133e69;
    --bs-btn-hover-color:      #fff;
    --bs-btn-active-bg:        #0a1f36;
    --bs-btn-active-border-color: #0a1f36;
    --bs-btn-active-color:     #fff;
    --bs-btn-disabled-bg:      var(--sci-navy);
    --bs-btn-disabled-border-color: var(--sci-navy);
}

.btn-secondary {
    --bs-btn-bg:               var(--sci-cyan);
    --bs-btn-border-color:     var(--sci-cyan);
    --bs-btn-color:            var(--sci-navy-deep);
    --bs-btn-hover-bg:         #6fe3f0;
    --bs-btn-hover-border-color: #6fe3f0;
    --bs-btn-hover-color:      var(--sci-navy-deep);
    --bs-btn-active-bg:        #0c9eb3;
    --bs-btn-active-border-color: #0c9eb3;
    --bs-btn-active-color:     #fff;
    --bs-btn-disabled-bg:      var(--sci-cyan);
    --bs-btn-disabled-border-color: var(--sci-cyan);
}

.btn-success {
    --bs-btn-bg:               var(--sci-mint);
    --bs-btn-border-color:     var(--sci-mint);
    --bs-btn-color:            var(--sci-navy-deep);
    --bs-btn-hover-bg:         #4ee0b8;
    --bs-btn-hover-border-color: #4ee0b8;
    --bs-btn-active-bg:        #18b487;
    --bs-btn-active-border-color: #18b487;
}

.btn-info {
    --bs-btn-bg:               var(--sci-teal);
    --bs-btn-border-color:     var(--sci-teal);
    --bs-btn-color:            #fff;
    --bs-btn-hover-bg:         #11a5b6;
    --bs-btn-hover-border-color: #11a5b6;
}

.btn-warning {
    --bs-btn-bg:               var(--sci-amber);
    --bs-btn-border-color:     var(--sci-amber);
    --bs-btn-color:            var(--sci-navy-deep);
    --bs-btn-hover-bg:         #f7b948;
    --bs-btn-hover-border-color: #f7b948;
}

.btn-danger {
    --bs-btn-bg:               var(--sci-brand-red);
    --bs-btn-border-color:     var(--sci-brand-red);
    --bs-btn-color:            #fff;
    --bs-btn-hover-bg:         #d23030;
    --bs-btn-hover-border-color: #d23030;
}

.btn-light {
    --bs-btn-bg:               var(--sci-surface);
    --bs-btn-border-color:     var(--sci-surface);
    --bs-btn-color:            var(--sci-navy);
    --bs-btn-hover-bg:         #e6eef5;
    --bs-btn-hover-border-color: #e6eef5;
    --bs-btn-hover-color:      var(--sci-navy);
}

.btn-dark {
    --bs-btn-bg:               var(--sci-navy-deep);
    --bs-btn-border-color:     var(--sci-navy-deep);
    --bs-btn-color:            #fff;
    --bs-btn-hover-bg:         #102e4d;
    --bs-btn-hover-border-color: #102e4d;
}

/* ---------------------------------------------------------------
   Outline buttons
   --------------------------------------------------------------- */
.btn-outline-primary {
    --bs-btn-color:            var(--sci-navy);
    --bs-btn-border-color:     var(--sci-navy);
    --bs-btn-hover-bg:         var(--sci-navy);
    --bs-btn-hover-border-color: var(--sci-navy);
    --bs-btn-hover-color:      #fff;
    --bs-btn-active-bg:        var(--sci-navy-deep);
    --bs-btn-active-border-color: var(--sci-navy-deep);
    --bs-btn-active-color:     #fff;
    --bs-btn-disabled-color:   var(--sci-navy);
    --bs-btn-disabled-border-color: var(--sci-navy);
}

.btn-outline-secondary {
    --bs-btn-color:            var(--sci-teal);
    --bs-btn-border-color:     var(--sci-cyan);
    --bs-btn-hover-bg:         var(--sci-cyan);
    --bs-btn-hover-border-color: var(--sci-cyan);
    --bs-btn-hover-color:      var(--sci-navy-deep);
    --bs-btn-active-bg:        var(--sci-cyan);
    --bs-btn-active-border-color: var(--sci-cyan);
}

.btn-outline-success {
    --bs-btn-color:            var(--sci-mint);
    --bs-btn-border-color:     var(--sci-mint);
    --bs-btn-hover-bg:         var(--sci-mint);
    --bs-btn-hover-border-color: var(--sci-mint);
    --bs-btn-hover-color:      var(--sci-navy-deep);
}

.btn-outline-info {
    --bs-btn-color:            var(--sci-teal);
    --bs-btn-border-color:     var(--sci-teal);
    --bs-btn-hover-bg:         var(--sci-teal);
    --bs-btn-hover-border-color: var(--sci-teal);
    --bs-btn-hover-color:      #fff;
}

.btn-outline-warning {
    --bs-btn-color:            var(--sci-amber);
    --bs-btn-border-color:     var(--sci-amber);
    --bs-btn-hover-bg:         var(--sci-amber);
    --bs-btn-hover-border-color: var(--sci-amber);
    --bs-btn-hover-color:      var(--sci-navy-deep);
}

.btn-outline-danger {
    --bs-btn-color:            var(--sci-brand-red);
    --bs-btn-border-color:     var(--sci-brand-red);
    --bs-btn-hover-bg:         var(--sci-brand-red);
    --bs-btn-hover-border-color: var(--sci-brand-red);
    --bs-btn-hover-color:      #fff;
}

.btn-outline-dark {
    --bs-btn-color:            var(--sci-navy-deep);
    --bs-btn-border-color:     var(--sci-navy-deep);
    --bs-btn-hover-bg:         var(--sci-navy-deep);
    --bs-btn-hover-border-color: var(--sci-navy-deep);
    --bs-btn-hover-color:      #fff;
}

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

a:hover {
    color: var(--sci-cyan);
}

.link-primary   { color: var(--sci-navy)      !important; }
.link-secondary { color: var(--sci-cyan)      !important; }
.link-success   { color: var(--sci-mint)      !important; }
.link-info      { color: var(--sci-teal)      !important; }
.link-warning   { color: var(--sci-amber)     !important; }
.link-danger    { color: var(--sci-brand-red) !important; }
.link-light     { color: var(--sci-surface)   !important; }
.link-dark      { color: var(--sci-navy-deep) !important; }

/* ---------------------------------------------------------------
   Forms / focus states
   --------------------------------------------------------------- */
.form-control:focus,
.form-select:focus {
    border-color: var(--sci-cyan);
    box-shadow: 0 0 0 0.2rem rgba(17, 194, 219, 0.20);
}

.form-check-input:checked {
    background-color: var(--sci-cyan);
    border-color: var(--sci-cyan);
}

.form-check-input:focus {
    border-color: var(--sci-cyan);
    box-shadow: 0 0 0 0.2rem rgba(17, 194, 219, 0.20);
}

/* ---------------------------------------------------------------
   Tables / Badges / Alerts
   --------------------------------------------------------------- */
.table-active,
.table > :not(caption) > * > .table-active {
    --bs-table-bg-state: var(--sci-cyan-soft);
}

.badge.bg-primary,
.badge.text-bg-primary   { background-color: var(--sci-navy) !important; color: #fff !important; }
.badge.bg-secondary,
.badge.text-bg-secondary { background-color: var(--sci-cyan) !important; color: var(--sci-navy-deep) !important; }
.badge.bg-success,
.badge.text-bg-success   { background-color: var(--sci-mint) !important; color: var(--sci-navy-deep) !important; }
.badge.bg-info,
.badge.text-bg-info      { background-color: var(--sci-teal) !important; color: #fff !important; }
.badge.bg-warning,
.badge.text-bg-warning   { background-color: var(--sci-amber) !important; color: var(--sci-navy-deep) !important; }
.badge.bg-danger,
.badge.text-bg-danger    { background-color: var(--sci-brand-red) !important; color: #fff !important; }

.alert-primary   { background-color: rgba(11, 37, 64, 0.08);  border-color: rgba(11, 37, 64, 0.25);  color: var(--sci-navy); }
.alert-secondary { background-color: rgba(17, 194, 219, 0.10); border-color: rgba(17, 194, 219, 0.35); color: var(--sci-teal); }
.alert-success   { background-color: rgba(33, 212, 160, 0.12); border-color: rgba(33, 212, 160, 0.35); color: #117a59; }
.alert-info      { background-color: rgba(13, 139, 154, 0.10); border-color: rgba(13, 139, 154, 0.35); color: var(--sci-teal); }
.alert-warning   { background-color: rgba(245, 166, 35, 0.14); border-color: rgba(245, 166, 35, 0.45); color: #8a5a08; }
.alert-danger    { background-color: rgba(180, 20, 18, 0.10);  border-color: rgba(180, 20, 18, 0.35);  color: var(--sci-brand-red); }

/* ---------------------------------------------------------------
   Navbar (top bar)
   --------------------------------------------------------------- */
.navbar-light .navbar-nav .nav-link {
    color: var(--sci-navy);
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .show > .nav-link {
    color: var(--sci-cyan);
}

.navbar-brand { color: var(--sci-navy); }

.dropdown-item:focus,
.dropdown-item:hover {
    background-color: var(--sci-cyan-soft);
    color: var(--sci-navy);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--sci-cyan);
    color: var(--sci-navy-deep);
}

/* ---------------------------------------------------------------
   Pagination
   --------------------------------------------------------------- */
.page-link {
    color: var(--sci-navy);
}

.page-link:hover {
    color: var(--sci-cyan);
    background-color: var(--sci-cyan-soft);
}

.page-item.active .page-link {
    background-color: var(--sci-navy);
    border-color: var(--sci-navy);
    color: #fff;
}

/* ---------------------------------------------------------------
   Progress bars
   --------------------------------------------------------------- */
.progress-bar { background-color: var(--sci-cyan); }
.progress-bar.bg-primary  { background-color: var(--sci-navy)  !important; }
.progress-bar.bg-success  { background-color: var(--sci-mint)  !important; }
.progress-bar.bg-info     { background-color: var(--sci-teal)  !important; }
.progress-bar.bg-warning  { background-color: var(--sci-amber) !important; }
.progress-bar.bg-danger   { background-color: var(--sci-brand-red) !important; }

/* ---------------------------------------------------------------
   Accordion
   --------------------------------------------------------------- */
.accordion-button:not(.collapsed) {
    background-color: var(--sci-cyan-soft);
    color: var(--sci-navy);
    box-shadow: inset 0 -1px 0 var(--sci-border);
}

.accordion-button:focus {
    border-color: var(--sci-cyan);
    box-shadow: 0 0 0 0.2rem rgba(17, 194, 219, 0.20);
}

/* ---------------------------------------------------------------
   DataTables (the project uses datatables.bootstrap5)
   --------------------------------------------------------------- */
table.dataTable thead th,
table.dataTable thead td {
    color: var(--sci-navy);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--sci-navy) !important;
    border-color: var(--sci-navy) !important;
    color: #fff !important;
}

/* ---------------------------------------------------------------
   Misc legacy tweaks
   --------------------------------------------------------------- */
.shadow-primary { box-shadow: 0 12px 28px rgba(11, 37, 64, 0.20) !important; }