/* ============================================================
   Glow Theme
   Layers a glowing look on top of the base template using the
   BLC logo's own two-tone palette (see :root in style.css):
     --primary : #022A6A  (navy — the logo's outer ring / BLC text)
     --accent  : #FC0005  (red  — the logo's inner ring)
     --light   : #F3F6F9
     --dark    : #191C24
   Navy carries structure (fills, text); red carries the glow on
   the elements meant to catch the eye. Loaded once, site-wide,
   right after style.css.
   ============================================================ */

:root {
    --glow-rgb: 2, 42, 106;     /* navy, for ambient/soft glow */
    --accent-rgb: 252, 0, 5;    /* red, for attention-grabbing glow */
}

/* ---------------- Sidebar navigation ---------------- */
.sidebar .navbar .navbar-nav .nav-link {
    transition: box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.sidebar .navbar .navbar-nav .nav-link:hover,
.sidebar .navbar .navbar-nav .nav-link.active {
    box-shadow: 0 0 16px 1px rgba(var(--accent-rgb), .4);
}
.sidebar .navbar .navbar-nav .nav-link:hover i,
.sidebar .navbar .navbar-nav .nav-link.active i {
    box-shadow: 0 0 10px rgba(var(--accent-rgb), .5);
}

.sidebar .navbar .dropdown-item {
    transition: box-shadow .2s ease, color .2s ease, background .2s ease;
}
.sidebar .navbar .dropdown-item:hover {
    color: var(--primary);
    background: rgba(var(--glow-rgb), .08);
    box-shadow: inset 3px 0 0 var(--accent), 0 0 10px rgba(var(--accent-rgb), .2);
}

.sidebar .navbar-brand h3 {
    text-shadow: 0 0 14px rgba(var(--accent-rgb), .5);
}

/* ---------------- Buttons ---------------- */
.btn-primary {
    background: linear-gradient(135deg, #0B3E96, var(--primary) 55%, #011C48);
    border-color: var(--primary);
    box-shadow: 0 4px 14px rgba(var(--accent-rgb), .3);
    transition: box-shadow .25s ease, transform .15s ease, background .25s ease;
}
.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(135deg, #0F4AB0, var(--primary) 55%, #01224F);
    box-shadow: 0 6px 22px rgba(var(--accent-rgb), .5), 0 0 0 3px rgba(var(--accent-rgb), .15);
    transform: translateY(-1px);
}
.btn-primary:active {
    transform: translateY(0);
}
.btn-outline-primary {
    transition: box-shadow .2s ease, color .2s ease, background .2s ease;
}
.btn-outline-primary:hover {
    box-shadow: 0 0 14px rgba(var(--accent-rgb), .35);
}

/* ---------------- Cards / widget panels ---------------- */
.bg-light.rounded,
.ibox {
    transition: box-shadow .3s ease;
}
.bg-light.rounded:hover,
.ibox:hover {
    box-shadow: 0 0 24px rgba(var(--glow-rgb), .18);
}

/* ---------------- Large stat / feature icons ---------------- */
i.fa-3x.text-primary,
i.fa-2x.text-primary {
    filter: drop-shadow(0 0 8px rgba(var(--accent-rgb), .5));
}

/* ---------------- Badges & solid primary fills ---------------- */
.badge.bg-primary,
span.bg-primary,
div.bg-primary {
    box-shadow: 0 0 10px rgba(var(--accent-rgb), .45);
}

/* ---------------- Form focus ---------------- */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(var(--glow-rgb), .18), 0 0 10px rgba(var(--glow-rgb), .2);
}

/* ---------------- Tables: subtle row highlight ---------------- */
.table-hover > tbody > tr:hover {
    box-shadow: inset 3px 0 0 var(--accent);
    background-color: rgba(var(--glow-rgb), .05);
}

/* ---------------- Scrollbar accent (WebKit) ---------------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--light); }
::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
    box-shadow: 0 0 6px rgba(var(--accent-rgb), .5);
}

/* ---------------- Sign-in card (login pages) ---------------- */
.bg-light.rounded.p-4.p-sm-5,
.bg-light.rounded.p-4.p-sm-5:hover {
    box-shadow: 0 0 50px rgba(var(--glow-rgb), .16), 0 14px 40px rgba(25, 28, 36, .12);
    border: 1px solid rgba(var(--accent-rgb), .18);
}
.bg-light.rounded.p-4.p-sm-5 .btn-primary {
    animation: glow-breathe 2.4s ease-in-out infinite;
}
@keyframes glow-breathe {
    0%, 100% { box-shadow: 0 4px 14px rgba(var(--accent-rgb), .3); }
    50%      { box-shadow: 0 6px 28px rgba(var(--accent-rgb), .75), 0 0 0 4px rgba(var(--accent-rgb), .15); }
}
