/* Tun rejimi — html[data-theme="dark"] */

html[data-theme="dark"] body {
    background-color: #0b1020 !important;
    color: #e2e8f0;
}

/* ——— index.php ——— */
html[data-theme="dark"] .header-bg {
    background: linear-gradient(145deg, #061a17 0%, #0d3d36 42%, #0a2520 100%);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
    border-bottom: 1px solid rgba(255, 215, 0, 0.12);
}

html[data-theme="dark"] .header-bg .header-title,
html[data-theme="dark"] .header-bg h1 {
    color: #f1f5f9;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .header-subtitle {
    color: rgba(226, 232, 240, 0.85);
}

html[data-theme="dark"] .header-book-icon {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.2), rgba(0, 150, 136, 0.25));
    border-color: rgba(255, 215, 0, 0.35);
    color: #ffe082;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .header-bg-pattern {
    opacity: 0.22;
}

html[data-theme="dark"] .header-bg .reciter-open-btn {
    background: rgba(255, 215, 0, 0.12);
    color: #fcd34d;
    border-color: rgba(255, 215, 0, 0.4);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .header-bg .reciter-open-btn:hover {
    background: rgba(255, 215, 0, 0.22);
}

html[data-theme="dark"] .header-bg .theme-toggle-btn {
    background: rgba(255, 215, 0, 0.12);
    color: #fcd34d;
    border-color: rgba(255, 215, 0, 0.4);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .header-bg .theme-toggle-btn:hover {
    background: rgba(255, 215, 0, 0.22);
}

html[data-theme="dark"] .reciter-modal-content {
    background: #141c2f;
    color: #e2e8f0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .reciter-modal-content .modal-title {
    color: #f1f5f9;
}

html[data-theme="dark"] .reciter-modal-content .btn-close {
    filter: invert(1) grayscale(1);
    opacity: 0.65;
}

html[data-theme="dark"] .reciter-modal-hint {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .reciter-modal-title-ico {
    color: #5eead4;
}

html[data-theme="dark"] .reciter-item {
    background: #1a2438;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
}

html[data-theme="dark"] .reciter-item:hover {
    background: #1e2d45;
    border-color: rgba(45, 212, 191, 0.35);
}

html[data-theme="dark"] .reciter-item.active {
    background: linear-gradient(135deg, #0f2e2a 0%, #1a2438 100%);
    border-color: #0f766e;
    box-shadow: 0 4px 20px rgba(15, 118, 110, 0.25);
}

html[data-theme="dark"] .reciter-item-check {
    background: #334155;
    color: transparent;
}

html[data-theme="dark"] .reciter-item.active .reciter-item-check {
    background: #0f766e;
    color: #fff;
}

html[data-theme="dark"] .nav-pills .nav-link {
    background: #141c2f !important;
    border-color: #2d3a52 !important;
    color: #94a3b8 !important;
}

html[data-theme="dark"] .nav-pills .nav-link.active {
    background: linear-gradient(135deg, #0d5c52, #0a7d6e) !important;
    color: #fff !important;
    border-color: #0f766e !important;
    box-shadow: 0 8px 24px rgba(13, 92, 82, 0.45);
}

html[data-theme="dark"] .quran-card {
    background: #141c2f;
    border-color: rgba(255, 255, 255, 0.06);
    color: #e2e8f0;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .quran-card:hover {
    border-color: #0f766e;
    box-shadow: 0 12px 36px rgba(15, 118, 110, 0.25);
}

html[data-theme="dark"] .icon-box {
    background: rgba(15, 118, 110, 0.25);
    color: #5eead4;
}

html[data-theme="dark"] .sura-info-left h5 {
    color: #f1f5f9;
}

html[data-theme="dark"] .badge-city {
    background: rgba(255, 215, 0, 0.12);
    border-color: rgba(255, 215, 0, 0.25);
    color: #fcd34d;
}

html[data-theme="dark"] .verses-count {
    color: #94a3b8;
}

html[data-theme="dark"] .arabic-name-right {
    color: #5eead4;
}

html[data-theme="dark"] .juz-card {
    background: #141c2f;
    border: 1px solid rgba(255, 255, 255, 0.06);
    color: #5eead4;
}

html[data-theme="dark"] .juz-card .juz-meta {
    color: #94a3b8;
}

html[data-theme="dark"] .juz-card:hover {
    background: linear-gradient(135deg, #0d5c52, #0a7d6e);
    color: #fff;
}

html[data-theme="dark"] .juz-card:hover .juz-meta {
    color: rgba(255, 255, 255, 0.92);
}

/* ——— read.php ——— */
html[data-theme="dark"] body.read-page {
    background: #0b1020 !important;
    padding-top: 124px;
}

@media (max-width: 576px) {
    html[data-theme="dark"] body.read-page {
        padding-top: 118px;
    }
}

html[data-theme="dark"] .player-bar {
    background: linear-gradient(180deg, #0f172a 0%, #0c1424 50%, #0a101f 100%);
    border-bottom-color: rgba(45, 212, 191, 0.15);
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.55),
        0 1px 0 rgba(255, 255, 255, 0.04) inset;
}

html[data-theme="dark"] .player-back-btn {
    background: #1e293b;
    border-color: #334155;
    color: #5eead4;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .player-back-btn:hover {
    color: #99f6e4;
    border-color: #475569;
}

html[data-theme="dark"] .player-card {
    background: linear-gradient(180deg, #1a2438 0%, #141c2f 100%);
    border-color: rgba(45, 212, 191, 0.12);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.05) inset,
        0 8px 32px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .player-time-label {
    color: #94a3b8;
}

html[data-theme="dark"] .player-time-disp {
    color: #cbd5e1;
}

html[data-theme="dark"] .player-card .progress-box {
    background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset;
}

html[data-theme="dark"] .player-card .progress-fill {
    background: linear-gradient(90deg, #0d9488 0%, #14b8a6 50%, #2dd4bf 100%);
    box-shadow: 0 0 14px rgba(45, 212, 191, 0.35);
}

html[data-theme="dark"] .play-btn {
    background: linear-gradient(145deg, #0f766e 0%, #0d5c52 50%, #0a3d36 100%);
    box-shadow:
        0 4px 18px rgba(15, 118, 110, 0.45),
        0 1px 0 rgba(255, 255, 255, 0.1) inset;
}

html[data-theme="dark"] .play-btn:hover {
    box-shadow:
        0 6px 24px rgba(45, 212, 191, 0.25),
        0 1px 0 rgba(255, 255, 255, 0.12) inset;
}

html[data-theme="dark"] .quran-box {
    background: #141c2f;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .verse-row {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .verse-row.verse-active {
    background: linear-gradient(270deg, rgba(15, 118, 110, 0.22) 0%, rgba(45, 212, 191, 0.08) 100%);
    box-shadow: inset 3px 0 0 0 #2dd4bf;
}

html[data-theme="dark"] .verse-row.verse-active .v-num {
    background: #0f766e;
    color: #fff;
    border-color: #14b8a6;
}

html[data-theme="dark"] .arabic-text {
    color: #f1f5f9;
}

html[data-theme="dark"] .v-num {
    border-color: #0f766e;
    color: #5eead4;
}

html[data-theme="dark"] .sura-heading-card {
    background: linear-gradient(180deg, #1a2438 0%, #141c2f 100%);
    border-color: rgba(45, 212, 191, 0.2);
}

html[data-theme="dark"] .sura-heading-card .uz {
    color: #e2e8f0;
}

html[data-theme="dark"] .sura-heading-card .ar {
    color: #5eead4;
}

html[data-theme="dark"] .sura-heading-card .text-muted {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .bismillah-line {
    color: #5eead4 !important;
}

html[data-theme="dark"] .zoom-controls button {
    background: #1e293b;
    border-color: #334155;
    color: #5eead4;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* Tajvid: tun rejimida biroz yumshoqroq kontrast */
html[data-theme="dark"] .madda_normal,
html[data-theme="dark"] .madda_permissible,
html[data-theme="dark"] .madda_necessary,
html[data-theme="dark"] .madda_obligatory {
    color: #f87171 !important;
}

html[data-theme="dark"] .ghunnah,
html[data-theme="dark"] .idgham_with_ghunnah,
html[data-theme="dark"] .idgham_wo_ghunnah,
html[data-theme="dark"] .idgham_shafawi {
    color: #4ade80 !important;
}

html[data-theme="dark"] .ikhafa,
html[data-theme="dark"] .ikhafa_shafawi {
    color: #fb923c !important;
}

html[data-theme="dark"] .qalqalah {
    color: #60a5fa !important;
}

html[data-theme="dark"] .iqlab {
    color: #22d3ee !important;
}

html[data-theme="dark"] .ham_wasl,
html[data-theme="dark"] .laam_shamsiyah,
html[data-theme="dark"] .slnt,
html[data-theme="dark"] .silent {
    color: #64748b !important;
}