/* ======================================================================
   أسباب النزول — V18 Smart Experience
   خاص بالقسم فقط، ويعمل فوق هوية V15 العامة بدون تعديل ملفات الموقع العامة.
   ====================================================================== */

:root {
    --noz-bg: var(--eq-theme-bg, #f7f9f6);
    --noz-surface: var(--eq-theme-surface, #ffffff);
    --noz-surface-2: var(--eq-theme-surface-soft, #f2f6f2);
    --noz-text: var(--eq-theme-text, #193029);
    --noz-muted: var(--eq-theme-muted, #66756f);
    --noz-border: var(--eq-theme-border, rgba(31, 79, 65, .14));
    --noz-primary: var(--eq-theme-link, #23624f);
    --noz-primary-strong: #174d3f;
    --noz-primary-soft: #e9f3ef;
    --noz-gold: #b89043;
    --noz-gold-strong: #8e6b2f;
    --noz-gold-soft: #f7efde;
    --noz-danger: #a14d43;
    --noz-shadow-sm: 0 7px 20px rgba(25, 54, 45, .055);
    --noz-shadow: 0 18px 48px rgba(25, 54, 45, .085);
    --noz-radius-xl: 28px;
    --noz-radius-lg: 22px;
    --noz-radius-md: 16px;
    --noz-radius-sm: 12px;
    --noz-font: var(--font2, "Vazirmatn_Regular", Tahoma, Arial, sans-serif);
    --noz-quran-font: var(--font3, "Amiri", "Traditional Arabic", serif);
    --noz-reader-size: 19px;
    --noz-reader-width: 930px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body.noz-v15 {
    color: var(--noz-text);
    background:
        radial-gradient(circle at 8% 4%, rgba(184, 144, 67, .07), transparent 28rem),
        radial-gradient(circle at 92% 28%, rgba(35, 98, 79, .065), transparent 30rem),
        var(--noz-bg);
}

.noz-v15 button,
.noz-v15 input,
.noz-v15 select { font-family: var(--noz-font); }

.noz-skip-link {
    position: fixed;
    inset-inline-start: 16px;
    top: 12px;
    z-index: 100000;
    transform: translateY(-180%);
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--noz-primary-strong);
    color: #fff !important;
    font: 800 14px/1.4 var(--noz-font);
    text-decoration: none;
    transition: transform .2s ease;
}
.noz-skip-link:focus { transform: translateY(0); }

.noz-main {
    width: min(1180px, calc(100% - 28px));
    margin: 0 auto;
    padding: 22px 0 58px;
    font-family: var(--noz-font);
}

.noz-main a { text-underline-offset: 3px; }

.noz-main a:focus-visible,
.noz-main button:focus-visible,
.noz-main input:focus-visible,
.noz-main select:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--noz-gold) 65%, transparent);
    outline-offset: 3px;
}

/* --------------------------- Hero / Index --------------------------- */
.noz-page-intro {
    position: relative;
    overflow: hidden;
    max-width: 950px;
    margin: 12px auto 18px;
    padding: clamp(24px, 5vw, 44px) clamp(18px, 5vw, 48px);
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-xl);
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--noz-surface) 96%, transparent), color-mix(in srgb, var(--noz-surface-2) 92%, transparent));
    box-shadow: var(--noz-shadow);
    text-align: center;
}

.noz-page-intro::before,
.noz-page-intro::after {
    position: absolute;
    color: rgba(184, 144, 67, .18);
    font: 700 54px/1 var(--noz-quran-font);
    pointer-events: none;
}
.noz-page-intro::before { content: "۞"; inset-inline-start: 22px; top: 14px; }
.noz-page-intro::after { content: "۞"; inset-inline-end: 22px; bottom: 10px; }

.noz-page-intro__eyebrow,
.noz-kicker {
    display: inline-block;
    color: var(--noz-gold-strong);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .02em;
}

.noz-page-intro h1 {
    margin: 4px 0 0;
    color: var(--noz-text);
    font-family: var(--noz-quran-font);
    font-size: clamp(30px, 5vw, 50px);
    line-height: 1.5;
}

.noz-page-intro p:last-child {
    max-width: 760px;
    margin: 9px auto 0;
    color: var(--noz-muted);
    font-size: clamp(14px, 2vw, 17px);
    line-height: 1.95;
}

/* ----------------------------- Breadcrumb ----------------------------- */
.noz-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 7px;
    max-width: 980px;
    margin: 0 auto 14px;
    color: var(--noz-muted);
    font-size: 13px;
    font-weight: 700;
}
.noz-breadcrumb a {
    color: var(--noz-primary) !important;
    text-decoration: none;
}
.noz-breadcrumb a:hover { text-decoration: underline; }
.noz-breadcrumb span[aria-hidden] { opacity: .55; }

/* Hide duplicated legacy navigation visually; keep source links intact. */
.noz-detail-page .quranTitle,
.noz-detail-page .homeLink { display: none !important; }
.noz-index-page .quranTitle { display: none !important; }
.noz-index-page .homeLink { margin-top: -4px; }

/* ------------------------- Section cross linking ------------------------ */
.noz-section-links {
    max-width: 980px;
    margin: 0 auto 22px;
    padding: 18px;
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-lg);
    background: var(--noz-surface);
    box-shadow: var(--noz-shadow-sm);
}
.noz-section-links__title {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}
.noz-section-links__title h2 {
    margin: 2px 0 0;
    font-size: 18px;
    color: var(--noz-text);
}
.noz-section-links__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.noz-section-links__grid a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid var(--noz-border);
    border-radius: 999px;
    background: var(--noz-surface-2);
    color: var(--noz-primary) !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.noz-section-links__grid a:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--noz-primary) 38%, transparent);
    background: var(--noz-primary-soft);
}

/* ----------------------------- Surah Hub ----------------------------- */
.noz-surah-hub {
    max-width: 980px;
    margin: 0 auto 18px;
    padding: 18px;
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-lg);
    background: var(--noz-surface);
    box-shadow: var(--noz-shadow-sm);
}
.noz-surah-hub__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 13px;
}
.noz-surah-hub__head h2 {
    margin: 2px 0 0;
    color: var(--noz-text);
    font-size: clamp(17px, 2.5vw, 21px);
    line-height: 1.5;
}
.noz-surah-hub__number {
    display: grid;
    place-items: center;
    min-width: 58px;
    height: 48px;
    padding: 0 10px;
    border: 1px solid rgba(184, 144, 67, .28);
    border-radius: 14px;
    background: var(--noz-gold-soft);
    color: var(--noz-gold-strong);
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}
.noz-surah-hub__links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}
.noz-hub-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 76px;
    padding: 12px 14px;
    border: 1px solid var(--noz-border);
    border-radius: 14px;
    background: var(--noz-surface-2);
    color: var(--noz-text) !important;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.noz-hub-link span { font-weight: 900; }
.noz-hub-link small {
    margin-top: 3px;
    color: var(--noz-muted);
    font-size: 11.5px;
    line-height: 1.5;
}
.noz-hub-link:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--noz-primary) 38%, transparent);
    box-shadow: var(--noz-shadow-sm);
}
.noz-hub-link--primary {
    border-color: color-mix(in srgb, var(--noz-gold) 38%, transparent);
    background: var(--noz-gold-soft);
}
.noz-hub-link--primary span { color: var(--noz-gold-strong); }

/* ----------------------------- Page title ----------------------------- */
.noz-page-title {
    max-width: 980px;
    margin: 17px auto 12px;
    padding: 23px clamp(17px, 4vw, 34px);
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-lg);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--noz-surface) 98%, transparent), color-mix(in srgb, var(--noz-primary-soft) 42%, var(--noz-surface)));
    box-shadow: var(--noz-shadow-sm);
    color: var(--noz-text);
    font-family: var(--noz-quran-font);
    font-size: clamp(27px, 4vw, 40px);
    line-height: 1.6;
    text-align: center;
}

/* --------------------------- Legacy jump menu -------------------------- */
.noz-main form[name="surahList"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    max-width: 700px;
    margin: 0 auto 14px;
    padding: 12px;
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-md);
    background: var(--noz-surface);
    box-shadow: var(--noz-shadow-sm);
}
.noz-jump-label {
    color: var(--noz-muted);
    font-size: 12px;
    font-weight: 800;
    text-align: right;
}
.noz-main select[name="jumpmenu"] {
    width: 100%;
    min-height: 46px;
    padding: 8px 13px;
    border: 1px solid var(--noz-border);
    border-radius: 11px;
    outline: none;
    background: var(--noz-surface-2);
    color: var(--noz-text);
    font-weight: 800;
}

/* --------------------------- Smart toolbar --------------------------- */
.noz-smartbar {
    position: sticky;
    top: 8px;
    z-index: 80;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 10px;
    align-items: center;
    max-width: 980px;
    margin: 0 auto 14px;
    padding: 10px;
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-md);
    background: color-mix(in srgb, var(--noz-surface) 92%, transparent);
    box-shadow: 0 12px 34px rgba(25, 54, 45, .11);
    backdrop-filter: blur(12px);
}
.noz-smartbar__jump {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
}
.noz-smartbar__jump input {
    width: 100%;
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid var(--noz-border);
    border-radius: 10px;
    background: var(--noz-surface-2);
    color: var(--noz-text);
    outline: 0;
}
.noz-smartbar__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}
.noz-tool-btn,
.noz-smartbar__go {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    padding: 7px 10px;
    border: 1px solid var(--noz-border);
    border-radius: 10px;
    background: var(--noz-surface);
    color: var(--noz-text);
    cursor: pointer;
    font-size: 13px;
    font-weight: 900;
    transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.noz-tool-btn:hover,
.noz-smartbar__go:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--noz-primary) 40%, transparent);
}
.noz-smartbar__go {
    border-color: var(--noz-primary);
    background: var(--noz-primary);
    color: #fff;
}
.noz-tool-btn[aria-pressed="true"] {
    border-color: color-mix(in srgb, var(--noz-gold) 55%, transparent);
    background: var(--noz-gold-soft);
    color: var(--noz-gold-strong);
}
.noz-continue-btn {
    grid-column: 1 / -1;
    justify-self: stretch;
    min-height: 38px;
    border-color: rgba(184, 144, 67, .33);
    background: var(--noz-gold-soft);
    color: var(--noz-gold-strong);
}


/* ----------------------------- Pagination ----------------------------- */
.noz-pagination {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    max-width: 760px;
    margin: 0 auto 15px;
}
.noz-pagination a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid var(--noz-border);
    border-radius: 12px;
    background: var(--noz-surface);
    color: var(--noz-primary) !important;
    font-weight: 900;
    text-decoration: none;
}
.noz-pagination a:hover { background: var(--noz-primary-soft); }

/* -------------------------- Scientific content ------------------------- */
.noz-main .surahDetails {
    width: min(var(--noz-reader-width), 100%);
    margin: 0 auto;
    padding: clamp(20px, 4vw, 38px);
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-xl);
    background: var(--noz-surface);
    box-shadow: var(--noz-shadow);
    color: var(--noz-text);
    font-family: var(--noz-quran-font) !important;
    font-size: var(--noz-reader-size);
    line-height: 2.15;
    overflow-wrap: anywhere;
}

/* Neutralize Word-export typography without changing content. */
.noz-main .surahDetails p,
.noz-main .surahDetails li,
.noz-main .surahDetails div.Section1,
.noz-main .surahDetails b,
.noz-main .surahDetails strong,
.noz-main .surahDetails span:not(.noz-quran-quote) {
    font-family: var(--noz-quran-font) !important;
    line-height: inherit !important;
}
.noz-main .surahDetails p {
    margin: 0 0 1.08em !important;
    text-align: right !important;
}
.noz-main .surahDetails p:last-child { margin-bottom: 0 !important; }
.noz-main .surahDetails .Section1 { width: 100%; }
.noz-main .surahDetails o\:p { display: none; }
.noz-main .surahDetails br + br { display: none; }

.noz-quran-quote {
    display: inline;
    padding: .08em .18em;
    border-radius: 6px;
    color: var(--noz-primary) !important;
    background: color-mix(in srgb, var(--noz-primary-soft) 65%, transparent);
    font-family: var(--noz-quran-font) !important;
    font-weight: 800;
}

/* ---------------------------- Post actions ---------------------------- */
.noz-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    max-width: 900px;
    margin: 18px auto 0;
}
.noz-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid var(--noz-border);
    border-radius: 12px;
    background: var(--noz-surface);
    color: var(--noz-primary) !important;
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
}
.noz-action--primary {
    border-color: var(--noz-primary);
    background: var(--noz-primary);
    color: #fff !important;
}
.noz-share-status {
    min-height: 24px;
    margin: 6px auto 0;
    color: var(--noz-muted);
    font-size: 12px;
    text-align: center;
}

/* ----------------------------- Index search ---------------------------- */
.noz-index-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    max-width: 900px;
    margin: 0 auto 18px;
    padding: 11px;
    border: 1px solid var(--noz-border);
    border-radius: var(--noz-radius-md);
    background: var(--noz-surface);
    box-shadow: var(--noz-shadow-sm);
}
.noz-search-wrap { position: relative; }
.noz-search-wrap::before {
    content: "⌕";
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--noz-muted);
    font-size: 21px;
    pointer-events: none;
}
#nozSurahSearch {
    width: 100%;
    min-height: 48px;
    padding: 10px 44px 10px 14px;
    border: 1px solid var(--noz-border);
    border-radius: 12px;
    background: var(--noz-surface-2);
    color: var(--noz-text);
    outline: 0;
    font-weight: 800;
}
.noz-result-count {
    min-width: 112px;
    color: var(--noz-muted);
    font-size: 13px;
    font-weight: 850;
    text-align: center;
}

.noz-main .grid-box {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
    margin: 0;
    padding: 0 !important;
    list-style: none;
}
.noz-main .grid-box > a {
    display: block;
    min-width: 0;
    color: inherit !important;
    text-decoration: none;
}
.noz-main .surahListing {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
    min-height: 72px;
    height: 100%;
    margin: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid var(--noz-border) !important;
    border-radius: var(--noz-radius-md) !important;
    background: var(--noz-surface) !important;
    color: var(--noz-text) !important;
    box-shadow: var(--noz-shadow-sm);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.noz-main .grid-box > a:hover .surahListing,
.noz-main .grid-box > a:focus-visible .surahListing {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--noz-primary) 38%, transparent) !important;
    box-shadow: var(--noz-shadow);
}
.noz-surah-number {
    display: inline-grid;
    place-items: center;
    min-width: 44px;
    height: 40px;
    padding: 0 7px;
    border-radius: 11px;
    background: var(--noz-primary-soft);
    color: var(--noz-primary);
    font-size: 12px;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
}
.noz-surah-name { font-weight: 900; }
.noz-surah-arrow { color: var(--noz-gold); font-size: 19px; }
.noz-empty-search {
    grid-column: 1 / -1;
    padding: 34px 18px;
    border: 1px dashed var(--noz-border);
    border-radius: var(--noz-radius-md);
    color: var(--noz-muted);
    text-align: center;
}

/* ------------------------- Personal smart panel ------------------------- */
.noz-personal-panel {
    max-width: 980px;
    margin: 0 auto 20px;
    padding: 16px;
    border: 1px solid rgba(184, 144, 67, .26);
    border-radius: var(--noz-radius-lg);
    background: linear-gradient(135deg, var(--noz-gold-soft), color-mix(in srgb, var(--noz-surface) 72%, var(--noz-gold-soft)));
}
.noz-personal-panel[hidden] { display: none; }
.noz-personal-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}
.noz-personal-panel__head h2 { margin: 0; font-size: 17px; }
.noz-personal-panel__items { display: flex; flex-wrap: wrap; gap: 8px; }
.noz-personal-card {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid rgba(184, 144, 67, .3);
    border-radius: 999px;
    background: var(--noz-surface);
    color: var(--noz-text) !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

/* ------------------------------- Toast ------------------------------- */
.noz-toast {
    position: fixed;
    inset-inline-start: 50%;
    bottom: 24px;
    z-index: 100001;
    transform: translate(-50%, 14px);
    max-width: min(92vw, 480px);
    padding: 11px 15px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 12px;
    background: #18372e;
    color: #fff;
    box-shadow: 0 16px 40px rgba(0,0,0,.2);
    opacity: 0;
    pointer-events: none;
    font-size: 13px;
    font-weight: 800;
    text-align: center;
    transition: opacity .2s ease, transform .2s ease;
}
.noz-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

/* ----------------------------- Focus mode ----------------------------- */
body.noz-focus-mode #header,
body.noz-focus-mode #footer,
body.noz-focus-mode .noz-breadcrumb,
body.noz-focus-mode .noz-surah-hub,
body.noz-focus-mode .noz-main form[name="surahList"] { display: none !important; }
body.noz-focus-mode .noz-main { padding-top: 10px; }
body.noz-focus-mode .noz-smartbar { top: 8px; }
body.noz-focus-mode .surahDetails { box-shadow: none; }

/* ------------------------------- Dark ------------------------------- */
html[data-theme="dark"] body.noz-v15,
body.noz-v15.dark-mode,
body.noz-v15[data-theme="dark"] {
    --noz-bg: #101713;
    --noz-surface: #17211c;
    --noz-surface-2: #1c2822;
    --noz-text: #eef5f0;
    --noz-muted: #aab8b0;
    --noz-border: rgba(215, 231, 222, .13);
    --noz-primary: #91c5ae;
    --noz-primary-strong: #74ae96;
    --noz-primary-soft: #20382e;
    --noz-gold: #d1ae68;
    --noz-gold-strong: #e2c682;
    --noz-gold-soft: #302a20;
    --noz-shadow-sm: 0 8px 24px rgba(0,0,0,.15);
    --noz-shadow: 0 18px 48px rgba(0,0,0,.2);
}

/* ----------------------------- Responsive ----------------------------- */
@media (max-width: 900px) {
    .noz-surah-hub__links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .noz-main .grid-box { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .noz-smartbar { grid-template-columns: 1fr; }
    .noz-smartbar__actions { justify-content: stretch; }
    .noz-tool-btn { flex: 1 1 auto; }
}

@media (max-width: 620px) {
    .noz-main { width: min(100% - 18px, 1180px); padding-top: 12px; }
    .noz-page-intro { border-radius: 20px; padding: 25px 16px; }
    .noz-page-intro::before,
    .noz-page-intro::after { font-size: 38px; opacity: .7; }
    .noz-section-links,
    .noz-surah-hub { padding: 14px; border-radius: 17px; }
    .noz-section-links__title { display: block; }
    .noz-surah-hub__links { grid-template-columns: 1fr 1fr; gap: 7px; }
    .noz-hub-link { min-height: 68px; padding: 10px; }
    .noz-hub-link small { display: none; }
    .noz-page-title { padding: 18px 13px; border-radius: 18px; }
    .noz-smartbar { position: static; border-radius: 14px; }
    .noz-smartbar__jump { grid-template-columns: 1fr auto; }
    .noz-smartbar__actions { display: grid; grid-template-columns: repeat(3, 1fr); }
    .noz-tool-btn { padding-inline: 6px; }
    .noz-main .surahDetails { padding: 20px 15px; border-radius: 18px; font-size: var(--noz-reader-size); line-height: 2.05; }
    .noz-main .grid-box { grid-template-columns: 1fr; gap: 8px; }
    .noz-index-tools { grid-template-columns: 1fr; }
    .noz-result-count { text-align: start; min-width: 0; }
    .noz-pagination { gap: 7px; }
}

@media (max-width: 400px) {
    .noz-surah-hub__links { grid-template-columns: 1fr; }
    .noz-smartbar__actions { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .noz-v15 *, .noz-v15 *::before, .noz-v15 *::after {
        transition-duration: .001ms !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media print {
    #header, #footer, .noz-breadcrumb, .noz-surah-hub, .noz-smartbar,
    .noz-main form[name="surahList"], .noz-pagination, .noz-actions,
    .noz-toast { display: none !important; }
    body.noz-v15 { background: #fff !important; color: #000 !important; }
    .noz-main { width: 100%; padding: 0; }
    .noz-page-title, .noz-main .surahDetails {
        width: 100%; max-width: none; border: 0; box-shadow: none; background: #fff;
    }
}


/* ======================================================================
   V17 — ترتيب العناوين والأرقام + تحسينات دلالية للفهرس
   ====================================================================== */
.noz-page-title {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 92px;
    padding-inline: clamp(72px, 10vw, 105px);
}
.noz-page-title__text { display: block; min-width: 0; }
.noz-page-title__number {
    position: absolute;
    inset-inline-start: clamp(14px, 3vw, 26px);
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    min-width: 52px;
    height: 52px;
    padding: 0 10px;
    border: 1px solid color-mix(in srgb, var(--noz-gold) 42%, transparent);
    border-radius: 15px;
    background: var(--noz-gold-soft);
    color: var(--noz-gold-strong);
    font: 950 15px/1 var(--noz-font);
    font-variant-numeric: tabular-nums;
}
.noz-page-lead {
    max-width: 900px;
    margin: -2px auto 15px;
    padding: 0 14px;
    color: var(--noz-muted);
    font-size: clamp(13px, 2vw, 15px);
    font-weight: 650;
    line-height: 1.9;
    text-align: center;
}
.noz-content-title {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: var(--noz-reader-width);
    margin: 18px auto 9px;
    color: var(--noz-text);
    font-family: var(--noz-quran-font);
    font-size: clamp(21px, 3.2vw, 29px);
    line-height: 1.6;
}
.noz-content-title__number {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    min-width: 42px;
    height: 38px;
    padding: 0 8px;
    border: 1px solid color-mix(in srgb, var(--noz-primary) 23%, transparent);
    border-radius: 11px;
    background: var(--noz-primary-soft);
    color: var(--noz-primary);
    font: 900 12px/1 var(--noz-font);
    font-variant-numeric: tabular-nums;
}
.noz-surah-hub { margin-top: 20px; }
.noz-main .grid-box { direction: rtl; }
.noz-main .grid-box > .noz-surah-item {
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}
.noz-main .grid-box > .noz-surah-item > a {
    display: block;
    height: 100%;
    min-width: 0;
    color: inherit !important;
    text-decoration: none;
}
.noz-main .grid-box > .noz-surah-item > a:hover .surahListing,
.noz-main .grid-box > .noz-surah-item > a:focus-visible .surahListing {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--noz-primary) 38%, transparent) !important;
    box-shadow: var(--noz-shadow);
}
.noz-main .surahListing {
    direction: rtl;
    grid-template-columns: auto minmax(0, 1fr) auto;
}
.noz-surah-number { grid-column: 1; justify-self: start; }
.noz-surah-name { grid-column: 2; text-align: right; }
.noz-surah-arrow { grid-column: 3; justify-self: end; }

@media (max-width: 520px) {
    .noz-page-title {
        min-height: 82px;
        padding-inline: 64px 14px;
        text-align: right;
        justify-content: flex-start;
    }
    .noz-page-title__number {
        inset-inline-start: 10px;
        min-width: 44px;
        height: 44px;
        border-radius: 12px;
        font-size: 13px;
    }
    .noz-page-title__text { font-size: clamp(23px, 7vw, 30px); }
    .noz-content-title { padding-inline: 4px; }
}


/* ======================================================================
   V18 — روابط فعلية للسور + بطاقة السورة المميزة
   ====================================================================== */
.noz-surah-hub { margin-top: 22px; }
.noz-surah-hub__links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.noz-hub-link--tafsir {
    border-color: color-mix(in srgb, var(--noz-primary) 30%, transparent);
    background: color-mix(in srgb, var(--noz-primary-soft) 72%, var(--noz-surface));
}
.noz-hub-link--tafsir span { color: var(--noz-primary); }
.noz-surah-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    margin-top: 12px;
    min-height: 100px;
    padding: 17px 18px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--noz-gold) 42%, transparent);
    border-radius: 18px;
    background:
        radial-gradient(circle at 9% 20%, rgba(184, 144, 67, .14), transparent 12rem),
        linear-gradient(135deg, color-mix(in srgb, var(--noz-gold-soft) 72%, var(--noz-surface)), var(--noz-surface));
    color: var(--noz-text) !important;
    text-decoration: none;
    box-shadow: var(--noz-shadow-sm);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.noz-surah-card::after {
    content: "۞";
    position: absolute;
    inset-inline-end: 18px;
    bottom: -19px;
    color: rgba(184, 144, 67, .11);
    font: 700 92px/1 var(--noz-quran-font);
    pointer-events: none;
}
.noz-surah-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--noz-gold) 68%, transparent);
    box-shadow: var(--noz-shadow);
}
.noz-surah-card__badge {
    position: absolute;
    top: 10px;
    inset-inline-end: 12px;
    padding: 5px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--noz-gold) 15%, transparent);
    color: var(--noz-gold-strong);
    font-size: 10.5px;
    font-weight: 900;
}
.noz-surah-card__number {
    display: grid;
    place-items: center;
    min-width: 58px;
    height: 58px;
    border: 1px solid color-mix(in srgb, var(--noz-gold) 45%, transparent);
    border-radius: 16px;
    background: color-mix(in srgb, var(--noz-gold-soft) 86%, var(--noz-surface));
    color: var(--noz-gold-strong);
    font: 950 14px/1 var(--noz-font);
    font-variant-numeric: tabular-nums;
}
.noz-surah-card__body { min-width: 0; padding-top: 3px; }
.noz-surah-card__body strong {
    display: block;
    margin-bottom: 4px;
    color: var(--noz-text);
    font-family: var(--noz-quran-font);
    font-size: clamp(18px, 2.8vw, 23px);
    line-height: 1.45;
}
.noz-surah-card__body small {
    display: block;
    color: var(--noz-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.75;
}
.noz-surah-card__cta {
    position: relative;
    z-index: 1;
    align-self: end;
    white-space: nowrap;
    color: var(--noz-gold-strong);
    font-size: 12px;
    font-weight: 900;
}
.noz-page-title,
.noz-content-title { direction: rtl; }

@media (max-width: 760px) {
    .noz-surah-hub__links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .noz-surah-card { grid-template-columns: auto minmax(0, 1fr); padding-top: 34px; }
    .noz-surah-card__cta { grid-column: 2; justify-self: start; }
}
@media (max-width: 430px) {
    .noz-surah-hub { padding: 13px; }
    .noz-surah-hub__links { grid-template-columns: 1fr; }
    .noz-hub-link { min-height: 67px; }
    .noz-surah-card { gap: 10px; padding-inline: 12px; }
    .noz-surah-card__number { min-width: 48px; height: 48px; border-radius: 13px; }
    .noz-surah-card__body small { font-size: 11px; }
}

/* V18: رقم مركز السورة على يمين العنوان مباشرة */
.noz-surah-hub__head { justify-content: flex-start; direction: rtl; }
.noz-surah-hub__head > div { min-width: 0; }
.noz-surah-hub__number { flex: 0 0 auto; }

/* ======================================================================
   V18 UI polish — search RTL + clearer surah cards
   ====================================================================== */

/* البحث: النص والـplaceholder عربيان ومحاذيان لليمين */
#nozSurahSearch {
    direction: rtl;
    text-align: right;
    font-family: var(--noz-font);
    font-size: 16px;
    line-height: 1.5;
    padding-inline: 46px 14px;
}

#nozSurahSearch::placeholder {
    direction: rtl;
    text-align: right;
    color: var(--noz-muted);
    opacity: .88;
}

/* تثبيت أيقونة البحث جهة اليمين في RTL */
.noz-search-wrap::before {
    inset-inline-start: 14px;
    inset-inline-end: auto;
}

/* بطاقات السور: اسم ورقم أوضح */
.noz-main .surahListing {
    min-height: 76px;
    gap: 12px;
    padding: 13px 15px !important;
}

.noz-surah-name {
    font-size: clamp(17px, 1.25vw, 19px);
    line-height: 1.45;
    font-weight: 950;
    letter-spacing: 0;
}

.noz-surah-number {
    min-width: 48px;
    height: 42px;
    padding-inline: 8px;
    font-size: 13px;
    line-height: 1;
    font-weight: 950;
}

.noz-surah-arrow {
    font-size: 20px;
}

/* الموبايل: نحافظ على وضوح الاسم بدون تضخيم البطاقة */
@media (max-width: 520px) {
    .noz-index-tools {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .noz-result-count {
        min-width: 0;
        text-align: right;
        padding-inline: 2px;
    }

    #nozSurahSearch {
        min-height: 46px;
        font-size: 16px;
    }

    .noz-main .surahListing {
        min-height: 68px;
        padding: 10px 12px !important;
    }

    .noz-surah-name {
        font-size: 17px;
    }

    .noz-surah-number {
        min-width: 44px;
        height: 38px;
        font-size: 12.5px;
    }
}