/* اقرأ — Quran-themed dashboard palette & background (deep green & gold) */

:root {
    /* exact brand colors from the اقرأ logo artwork (iqra_logo_v3) */
    --bs-primary: #0E3B31;
    --bs-primary-rgb: 14, 59, 49;
    --bs-primary-text-emphasis: #081F1C;
    --bs-primary-bg-subtle: #dcecdf;
    --bs-primary-border-subtle: #a9d0b4;

    --bs-link-color: #0E3B31;
    --bs-link-color-rgb: 14, 59, 49;
    --bs-link-hover-color: #081F1C;
    --bs-link-hover-color-rgb: 8, 31, 28;

    --quran-gold: #D9AD52;
    --quran-gold-light: #F3D98B;
    --quran-gold-dark: #B9863A;
    --quran-green: #0E3B31;
    --quran-green-mid: #0A2E28;
    --quran-green-dark: #081F1C;
    --quran-cream: #fbf6e6;
}

body {
    background-color: var(--quran-cream);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 320' width='320' height='320'%3E%3Cg font-family='Traditional Arabic, Geeza Pro, Damascus, Arial' fill='%230E3B31' opacity='0.06'%3E%3Ctext x='20' y='55' font-size='46' transform='rotate(-8 20 55)'%3E%D8%A8%D9%8E%3C/text%3E%3Ctext x='150' y='40' font-size='40' transform='rotate(6 150 40)'%3E%D8%AA%D9%90%3C/text%3E%3Ctext x='250' y='95' font-size='50' transform='rotate(-4 250 95)'%3E%D8%AB%D9%8F%3C/text%3E%3Ctext x='60' y='150' font-size='44' transform='rotate(10 60 150)'%3E%D8%AC%D9%91%3C/text%3E%3Ctext x='190' y='160' font-size='42' transform='rotate(-10 190 160)'%3E%D8%AD%D9%92%3C/text%3E%3Ctext x='10' y='250' font-size='48' transform='rotate(5 10 250)'%3E%D8%AE%D9%8D%3C/text%3E%3Ctext x='140' y='255' font-size='40' transform='rotate(-6 140 255)'%3E%D8%AF%D9%8B%3C/text%3E%3Ctext x='255' y='230' font-size='46' transform='rotate(8 255 230)'%3E%D8%B0%D9%8C%3C/text%3E%3Ctext x='90' y='305' font-size='38' transform='rotate(-5 90 305)'%3E%D8%B1%D9%8E%3C/text%3E%3Ctext x='260' y='310' font-size='36' transform='rotate(7 260 310)'%3E%D8%B2%D9%90%3C/text%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat;
}

/* sidebar: deep green instead of default navy/blue */
.sidebar,
.sidebar-content {
    background: linear-gradient(160deg, var(--quran-green) 0%, var(--quran-green-mid) 55%, var(--quran-green-dark) 100%) !important;
}

/* logo: bigger + centered in the sidebar; bigger still on auth pages */
.app-logo-img {
    height: 64px;
    width: auto;
}

.sidebar-brand {
    display: flex !important;
    align-items: center;
    justify-content: center !important;
    text-align: center !important;
    padding: 1.5rem 1rem !important;
    border-bottom: 1px solid rgba(251, 246, 230, 0.08);
    margin-bottom: 0.75rem;
    color: var(--quran-gold-light) !important;
}

.sidebar-brand .app-logo-img {
    height: 42px;
}

.sidebar-nav {
    padding: 0 0.75rem;
}

.sidebar-item {
    margin-bottom: 0.2rem;
}

.sidebar-link {
    background: transparent !important;
    color: rgba(251, 246, 230, 0.68) !important;
    border-radius: 10px;
    border-left: none !important;
    padding: 0.65rem 1rem !important;
    transition: background 0.15s ease-in-out, color 0.15s ease-in-out;
}

.sidebar-link:hover {
    background: rgba(251, 246, 230, 0.06) !important;
    color: var(--quran-cream) !important;
}

.sidebar-item.active > .sidebar-link,
.sidebar-dropdown .sidebar-item.active .sidebar-link {
    background: linear-gradient(90deg, rgba(217, 173, 82, .28), rgba(217, 173, 82, .10) 80%) !important;
    color: var(--quran-gold-light) !important;
    font-weight: 600;
}

.sidebar-dropdown .sidebar-link {
    padding-left: 2.75rem !important;
}

/* topbar */
.navbar {
    background-color: #ffffff;
    border-bottom: none;
    box-shadow: 0 1px 3px rgba(14, 59, 49, 0.08);
}

/* cards: soft, modern elevation across the whole dashboard */
.card {
    border: none;
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(14, 59, 49, 0.07);
}

/* buttons / links / accents */
.btn-primary,
.bg-primary {
    background-color: var(--quran-green) !important;
    border-color: var(--quran-green) !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: var(--quran-green-dark) !important;
    border-color: var(--quran-green-dark) !important;
}

.nav-link,
.page-link {
    color: var(--quran-green);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.active > .page-link,
.page-link.active {
    background-color: var(--quran-green) !important;
    border-color: var(--quran-green) !important;
    color: #ffffff !important;
}

/* dashboard stat cards: gold icon chip accent */
.card .stat {
    background: linear-gradient(135deg, rgba(217, 173, 82, .18), rgba(217, 173, 82, .08)) !important;
    color: var(--quran-green) !important;
    width: 48px !important;
    height: 48px !important;
}

.dashboard_icon {
    fill: var(--quran-gold) !important;
}

.card .card-title {
    color: #6b7a76;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.card h1.mt-1 {
    color: var(--quran-green-dark);
    font-weight: 700;
}

a,
a.link {
    color: var(--quran-green);
}

a:hover,
a.link:hover {
    color: var(--quran-green-dark);
}