/* ===================================================================
   Tahfeez Dashboard - custom branding / colour layer
   Loaded after the theme CSS. Works in BOTH light and dark modes.
   Sidebar is left to the theme's own menu colours (kept clean/white),
   brand colours are used only on content (buttons, titles, widgets).
   =================================================================== */
:root{
    --qtm-maroon:#7a1220;
    --qtm-gold:#b8860b;
    --qtm-gold-lt:#d4af37;
}

/* ---- Logo: pin size and never distort (object-fit keeps it square) ---- */
.navbar-custom .logo-topbar img,
.leftside-menu .logo img,
.auth-brand img{
    object-fit:contain !important;
    width:auto !important;
    max-width:100% !important;
}
.navbar-custom .logo-topbar .logo-lg img,
.leftside-menu .logo-lg img{ height:46px !important; max-height:46px !important; }
.navbar-custom .logo-topbar .logo-sm img,
.leftside-menu .logo-sm img{ height:34px !important; max-height:34px !important; }
.auth-brand img{ height:60px !important; }

/* ---- Cards get soft depth ---- */
.card{ border:0; box-shadow:0 3px 14px rgba(20,18,15,.06); border-radius:.6rem; }
.widget-flat{ transition:transform .15s ease, box-shadow .15s ease; }
.widget-flat:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(20,18,15,.12); }
[data-bs-theme=dark] .card{ box-shadow:0 3px 14px rgba(0,0,0,.35); }
[data-bs-theme=dark] .widget-flat:hover{ box-shadow:0 10px 24px rgba(0,0,0,.5); }

/* ---- Colourful stat tiles for dashboard widgets (same in both modes) ---- */
.stat-icon{
    width:54px; height:54px; border-radius:14px;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:26px; color:#fff; flex:0 0 auto;
    box-shadow:0 6px 14px rgba(0,0,0,.15);
}
.stat-primary{ background:linear-gradient(135deg,#4f46e5,#7c3aed); }
.stat-success{ background:linear-gradient(135deg,#0ea371,#22c55e); }
.stat-warning{ background:linear-gradient(135deg,#f59e0b,#f97316); }
.stat-info{    background:linear-gradient(135deg,#0ea5e9,#2563eb); }
.stat-danger{  background:linear-gradient(135deg,#e11d48,#fb7185); }
.stat-gold{    background:linear-gradient(135deg,var(--qtm-gold),var(--qtm-gold-lt)); }
.stat-maroon{  background:linear-gradient(135deg,var(--qtm-maroon),#b12a3a); }

/* ---- Section headings: gold->maroon accent bar (title text stays theme colour) ---- */
.header-title{ position:relative; padding-left:.7rem; font-weight:600; }
.header-title::before{
    content:""; position:absolute; left:0; top:3px; bottom:3px; width:4px;
    border-radius:4px; background:linear-gradient(180deg,var(--qtm-gold-lt),var(--qtm-maroon));
}

/* ---- Page title: maroon on light, gold on dark (so it stays visible) ---- */
[data-bs-theme=light] .page-title{ color:var(--qtm-maroon); font-weight:600; }
[data-bs-theme=dark]  .page-title{ color:var(--qtm-gold-lt); font-weight:600; }

/* ---- Brand primary button (readable white text in both modes) ---- */
.btn-primary{ background:var(--qtm-maroon); border-color:var(--qtm-maroon); }
.btn-primary:hover,.btn-primary:focus{ background:#5f0e19; border-color:#5f0e19; }

/* ---- text-primary / soft-primary: keep visible in each mode ---- */
[data-bs-theme=light] .text-primary{ color:var(--qtm-maroon) !important; }
[data-bs-theme=light] .bg-soft-primary{ background-color:rgba(122,18,32,.12) !important; }
[data-bs-theme=dark]  .text-primary{ color:#e79aa4 !important; }
[data-bs-theme=dark]  .bg-soft-primary{ background-color:rgba(231,154,164,.16) !important; }

/* ---- Table header tint only in light mode; leave dark to the theme ---- */
[data-bs-theme=light] .table-light th{ background:#faf6ee; color:#6b4e12; }

/* ---- Login split-screen background image ---- */
.auth-quran-bg{
    background:linear-gradient(rgba(18,22,16,.55),rgba(18,22,16,.7)),
               url('../images/auth-bg-quran.jpg') center/cover no-repeat !important;
}
.auth-quran-bg .auth-user-testimonial *{ color:#fff !important; text-shadow:0 1px 3px rgba(0,0,0,.5); }