/* ==========================================================================
   Rah e Ilm — Black & Gold Theme
   Overrides AdminLTE / Bootstrap defaults with the academy's brand palette.
   ========================================================================== */

:root{
    --rei-gold:        #d4af37;
    --rei-gold-light:  #f3d879;
    --rei-gold-deep:   #a9791f;
    --rei-black:       #0b0b0c;
    --rei-black-2:     #131315;
    --rei-black-3:     #1b1b1e;
    --rei-card-bg:     #17171a;
    --rei-text:        #ece3cf;
    --rei-text-muted:  #b8ac8a;
    --rei-border:      rgba(212,175,55,.35);
    --rei-shadow:      0 4px 18px rgba(0,0,0,.55);
}

/* -------------------- Base / Texture -------------------- */
html, body{
    background-color: var(--rei-black) !important;
    color: var(--rei-text) !important;
}

body{
    background-image:
        radial-gradient(circle at 15% 10%, rgba(212,175,55,.06), transparent 40%),
        radial-gradient(circle at 85% 90%, rgba(212,175,55,.05), transparent 45%),
        repeating-linear-gradient(45deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 2px, transparent 2px, transparent 6px);
    background-attachment: fixed;
}

.app-main, .app-content, .app-content-header, .content-wrapper{
    background: transparent !important;
    color: var(--rei-text);
}

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

::selection{ background: var(--rei-gold); color:#000; }

/* Scrollbar */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background: var(--rei-black-2); }
::-webkit-scrollbar-thumb{ background: var(--rei-gold-deep); border-radius:4px; }

/* -------------------- Header / Topbar -------------------- */
.app-header{
    background: linear-gradient(180deg,#141416,#0a0a0b) !important;
    border-bottom: 1px solid var(--rei-border) !important;
    box-shadow: var(--rei-shadow);
}
.app-header .nav-link{ color: var(--rei-text) !important; }
.app-header .nav-link:hover{ color: var(--rei-gold) !important; }
.app-header .dropdown-menu{
    background: var(--rei-black-3) !important;
    border: 1px solid var(--rei-border) !important;
}
.app-header .dropdown-item{ color: var(--rei-text) !important; }
.app-header .dropdown-item:hover{ background: rgba(212,175,55,.12) !important; color: var(--rei-gold-light) !important; }

/* -------------------- Sidebar -------------------- */
.app-sidebar{
    background:
        radial-gradient(circle at 50% 0%, rgba(212,175,55,.08), transparent 55%),
        repeating-linear-gradient(135deg, rgba(255,255,255,.015) 0px, rgba(255,255,255,.015) 2px, transparent 2px, transparent 7px),
        linear-gradient(180deg,#111113,#050506) !important;
    border-right: 1px solid var(--rei-border) !important;
}
.app-sidebar .sidebar-brand{
    border-bottom: 1px solid var(--rei-border);
    background: rgba(0,0,0,.35);
}
.app-sidebar .brand-image{
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(212,175,55,.5);
}
.app-sidebar .brand-text{
    color: var(--rei-gold-light) !important;
    font-weight: 700;
    letter-spacing: .3px;
}
.app-sidebar .nav-sidebar > .nav-item > .nav-link{
    color: var(--rei-text) !important;
    border-radius: 8px;
    margin: 2px 8px;
}
.app-sidebar .nav-sidebar > .nav-item > .nav-link .nav-icon{ color: var(--rei-gold); }
.app-sidebar .nav-sidebar > .nav-item > .nav-link:hover{
    background: rgba(212,175,55,.12) !important;
    color: var(--rei-gold-light) !important;
}
.app-sidebar .nav-sidebar > .nav-item > .nav-link.active{
    background: linear-gradient(90deg, rgba(212,175,55,.28), rgba(212,175,55,.05)) !important;
    color: var(--rei-gold-light) !important;
    border-left: 3px solid var(--rei-gold);
}
.app-sidebar .nav-sidebar .nav-badge{ margin-left:auto; }

/* -------------------- Cards -------------------- */
.card{
    background: var(--rei-card-bg) !important;
    color: var(--rei-text) !important;
    border: 1px solid var(--rei-border) !important;
    box-shadow: var(--rei-shadow);
    border-radius: 12px;
    overflow: hidden;
}
.card-header{
    background: rgba(212,175,55,.08) !important;
    border-bottom: 1px solid var(--rei-border) !important;
    color: var(--rei-gold-light) !important;
}
.card-footer{
    background: rgba(0,0,0,.3) !important;
    border-top: 1px solid var(--rei-border) !important;
}
.card-title{ color: var(--rei-gold-light) !important; }
.card-outline.card-primary{ border-top: 3px solid var(--rei-gold) !important; }
.card-outline.card-success{ border-top: 3px solid #6fbf73 !important; }
.card-outline.card-warning{ border-top: 3px solid var(--rei-gold) !important; }

/* Toggle-style checkbox buttons (Select Days / Optional etc.) */
.btn-check + .btn-outline-info{
    color: var(--rei-text-muted) !important;
    border-color: #444 !important;
    background: #17171a !important;
}
.btn-check + .btn-outline-info:hover{
    border-color: var(--rei-gold) !important;
    color: var(--rei-text) !important;
}
.btn-check:checked + .btn-outline-info{
    background: linear-gradient(135deg, var(--rei-gold-light), var(--rei-gold-deep)) !important;
    border-color: var(--rei-gold-deep) !important;
    color: #191300 !important;
    font-weight: 600;
}

/* Generic bg-* badges/cards used for stat colors -> remap to gold family with distinct tints */
.bg-primary, .text-bg-primary{ background: linear-gradient(135deg,#caa43a,#8f6e17) !important; color:#111 !important; }
.bg-success, .text-bg-success{ background: linear-gradient(135deg,#5fae62,#2f6b31) !important; color:#fff !important; }
.bg-warning, .text-bg-warning{ background: linear-gradient(135deg,#f3d879,#c99a1e) !important; color:#1a1300 !important; }
.bg-danger, .text-bg-danger{ background: linear-gradient(135deg,#c65b5b,#7d2727) !important; color:#fff !important; }
.bg-info, .text-bg-info{ background: linear-gradient(135deg,#5f9db0,#2b5866) !important; color:#fff !important; }
.bg-secondary, .text-bg-secondary{ background:#3a3a3d !important; color:#eee !important; }
.bg-warning-subtle{ background: rgba(212,175,55,.15) !important; }
.bg-body-tertiary{ background: var(--rei-black) !important; }
.bg-body-secondary{ background: var(--rei-black-2) !important; }

/* -------------------- Buttons -------------------- */
.btn-primary, .btn-warning{
    background: linear-gradient(135deg, var(--rei-gold-light), var(--rei-gold-deep)) !important;
    border: 1px solid var(--rei-gold-deep) !important;
    color:#191300 !important;
    font-weight: 600;
}
.btn-primary:hover, .btn-warning:hover{
    filter: brightness(1.1);
    color:#191300 !important;
}
.btn-success{ background: linear-gradient(135deg,#6fbf73,#2f6b31) !important; border:1px solid #2f6b31 !important; color:#fff !important; }
.btn-danger{ background: linear-gradient(135deg,#d17a7a,#7d2727) !important; border:1px solid #7d2727 !important; color:#fff !important; }
.btn-outline-warning, .btn-outline-primary{ border-color: var(--rei-gold) !important; color: var(--rei-gold-light) !important; }
.btn-outline-warning:hover, .btn-outline-primary:hover{ background: var(--rei-gold) !important; color:#111 !important; }
.btn-default, .btn-flat{ background: transparent !important; color: var(--rei-text) !important; border:1px solid var(--rei-border) !important; }
.btn-secondary{ background:#2b2b2e !important; border:1px solid #444 !important; color:#eee !important; }

/* -------------------- Forms -------------------- */
.form-control, .form-select{
    background: #0f0f10 !important;
    border: 1px solid var(--rei-border) !important;
    color: var(--rei-text) !important;
}
.form-control:focus, .form-select:focus{
    border-color: var(--rei-gold) !important;
    box-shadow: 0 0 0 .2rem rgba(212,175,55,.2) !important;
    background:#0f0f10 !important;
    color: var(--rei-text) !important;
}
.form-control::placeholder{ color:#7d745c; }
.form-label{ color: var(--rei-text-muted); font-weight:500; }
.input-group-text{ background:#0f0f10 !important; border:1px solid var(--rei-border) !important; color: var(--rei-gold); }
.form-floating > label{ color:#8a7f61; }
.form-check-input{ background-color:#0f0f10; border:1px solid var(--rei-border); }
.form-check-input:checked{ background-color: var(--rei-gold); border-color: var(--rei-gold); }

/* -------------------- Tables -------------------- */
.table{ color: var(--rei-text) !important; border-color: var(--rei-border) !important; --bs-table-bg: transparent; }
.table > :not(caption) > * > *{ background: transparent !important; color: var(--rei-text) !important; border-color: rgba(212,175,55,.18) !important; }
.table-dark, thead.table-dark{
    --bs-table-bg:#000 !important;
    background: linear-gradient(180deg,#1a1a1c,#0b0b0c) !important;
    color: var(--rei-gold-light) !important;
}
.table-hover > tbody > tr:hover > *{ background: rgba(212,175,55,.08) !important; }
.table-responsive{ border-radius: 8px; overflow: hidden; }

/* -------------------- Badges / Alerts -------------------- */
.badge{ font-weight:600; }
.alert-dark{ background: var(--rei-black-3) !important; color: var(--rei-gold-light) !important; border:1px solid var(--rei-border) !important; }
.alert-danger{ background:#3a1414 !important; color:#f3b5b5 !important; border:1px solid #7d2727 !important; }
.alert-success{ background:#123a1a !important; color:#b6e6bd !important; border:1px solid #2f6b31 !important; }
.alert-warning{ background: rgba(212,175,55,.12) !important; color: var(--rei-gold-light) !important; border:1px solid var(--rei-border) !important; }

/* -------------------- Modal -------------------- */
.modal-content{
    background: var(--rei-card-bg) !important;
    color: var(--rei-text) !important;
    border: 1px solid var(--rei-border) !important;
}
.modal-header{ border-bottom: 1px solid var(--rei-border) !important; }
.modal-footer{ border-top: 1px solid var(--rei-border) !important; }
.btn-close{ filter: invert(1) grayscale(1) brightness(1.6); }

/* -------------------- Login / Register -------------------- */
.login-box .card, .register-box .card{
    background: var(--rei-card-bg) !important;
    border: 1px solid var(--rei-gold) !important;
    box-shadow: 0 0 35px rgba(212,175,55,.15), var(--rei-shadow);
}
.login-logo-wrap{
    display:flex; justify-content:center; margin-bottom:.5rem;
}
.login-logo-wrap img{
    width:120px; height:120px; border-radius:50%;
    box-shadow: 0 0 25px rgba(212,175,55,.55);
    border: 2px solid var(--rei-gold);
}
.brand-title-gold{
    text-align:center;
    color: var(--rei-gold-light);
    font-weight:700;
    letter-spacing:.5px;
    margin-top:.4rem;
}

/* -------------------- Product / Profile Cards (Courses & Students) -------------------- */
.rei-grid{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); }
.rei-item-card{
    background: var(--rei-card-bg);
    border:1px solid var(--rei-border);
    border-radius:14px;
    overflow:hidden;
    box-shadow: var(--rei-shadow);
    display:flex; flex-direction:column;
    transition: transform .15s ease, box-shadow .15s ease;
}
.rei-item-card:hover{ transform: translateY(-3px); box-shadow: 0 8px 24px rgba(212,175,55,.18); }
.rei-item-img{
    width:100%; aspect-ratio: 3 / 4; object-fit:cover; height:auto;
    background:#000;
    border-bottom:1px solid var(--rei-border);
}
.rei-item-avatar-wrap{
    width:100%; padding-top:1.1rem; display:flex; justify-content:center;
}
.rei-item-avatar{
    width:88px; height:88px; border-radius:50%; object-fit:cover;
    border:2px solid var(--rei-gold);
    box-shadow:0 0 12px rgba(212,175,55,.35);
}
.rei-item-body{ padding:.85rem 1rem; text-align:center; flex:1; display:flex; flex-direction:column; }
.rei-item-title{ color: var(--rei-gold-light); font-weight:700; font-size:1rem; margin-bottom:.15rem; }
.rei-item-title-header{
    color: var(--rei-gold-light);
    font-weight:700;
    font-size:.95rem;
    text-align:center;
    padding:.6rem .75rem;
    background: rgba(212,175,55,.08);
    border-bottom: 1px solid var(--rei-border);
}
.rei-item-sub{ color: var(--rei-text-muted); font-size:.82rem; margin-bottom:.6rem; }
.rei-item-footer{ padding:.6rem 1rem; border-top:1px solid var(--rei-border); }

/* Search bar */
.rei-search{
    background:#0f0f10; border:1px solid var(--rei-gold); border-radius:30px;
    padding:.5rem 1rem; display:flex; align-items:center; gap:.5rem;
}
.rei-search input{ background:transparent!important; border:none!important; color:var(--rei-text)!important; box-shadow:none!important; }
.rei-search i{ color: var(--rei-gold); }

/* -------------------- Stat Cards (Dashboard) -------------------- */
.rei-stat{
    background: var(--rei-card-bg);
    border:1px solid var(--rei-border);
    border-radius:14px;
    padding:1rem 1.1rem;
    box-shadow: var(--rei-shadow);
    height:100%;
}
.rei-stat .rei-stat-icon{
    width:52px; height:52px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, var(--rei-gold-light), var(--rei-gold-deep));
    color:#191300; font-size:1.4rem; flex-shrink:0;
}
.rei-stat .rei-stat-value{ font-size:1.6rem; font-weight:700; color:#fff; }
.rei-stat .rei-stat-label{ color: var(--rei-text-muted); font-size:.8rem; }

/* Footer */
.app-footer{
    background: linear-gradient(0deg,#101012,#0a0a0b) !important;
    border-top:1px solid var(--rei-border) !important;
    color: var(--rei-text-muted) !important;
}

/* -------------------- Utility -------------------- */
.text-gold{ color: var(--rei-gold-light) !important; }
.border-gold{ border-color: var(--rei-gold) !important; }
.rei-empty{ padding:2.5rem 1rem; text-align:center; color: var(--rei-text-muted); }
.rei-empty i{ font-size:2.2rem; color: var(--rei-gold-deep); display:block; margin-bottom:.5rem; }

/* -------------------- Accordion -------------------- */
.accordion-item{
    background: #0f0f10 !important;
    border: 1px solid var(--rei-border) !important;
    margin-bottom: .6rem;
    border-radius: 10px !important;
    overflow: hidden;
}
.accordion-button{
    background: #0f0f10 !important;
    color: var(--rei-text) !important;
    font-weight: 600;
    box-shadow: none !important;
}
.accordion-button:not(.collapsed){
    background: rgba(212,175,55,.1) !important;
    color: var(--rei-gold-light) !important;
}
.accordion-button::after{
    filter: invert(1) brightness(1.6);
}
.accordion-button:focus{
    box-shadow: none !important;
    border-color: var(--rei-border) !important;
}
.accordion-body{
    background: #0a0a0b;
    color: var(--rei-text);
    border-top: 1px solid var(--rei-border);
}

/* -------------------- Mobile tuning -------------------- */
@media (max-width: 576px){
    .rei-grid{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.7rem; }
    .rei-stat .rei-stat-value{ font-size:1.25rem; }
    .app-content-header h3{ font-size:1.25rem; }
    .table-responsive{ font-size:.85rem; }
}