.section--quran .quran__search-label {
    display: block;
}

.section--quran .quran__loading-state {
    grid-column: span 2;
}

.section--quran .quran__surah-title {
    font-size: 2.2rem;
}

.section--quran .quran__resume-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.section--quran .quran__resume-meta {
    margin: 0;
}

.section--quran .quran__resume-card[data-resume-source="bookmark"] .quran__resume-action i {
    color: var(--accent);
}

.section--quran .quran__reader-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.section--quran #saveQuranBookmarkBtn.is-active {
    border-color: var(--accent);
    color: var(--accent);
}

.section--quran .quran__ayahs {
    font-size: 1.6rem;
    line-height: 2.2;
    text-align: justify;
    direction: rtl;
}

.section--quran .surah-item {
    direction: rtl;
    padding: 10px;
    justify-content: space-between;
}

.section--quran .surah-item .home-btn-text {
    font-weight: 700;
}

.section--quran .surah-item__icon {
    width: 35px;
    height: 35px;
    font-size: 1rem;
}

.section--quran .surah-num {
    flex-shrink: 0;
    font-size: 0.85rem;
    padding: 2px 8px;
}


.section--quran .quran__empty-state {
    grid-column: span 2;
}

.section--quran .quran__ayahs--loading {
    opacity: 0.72;
}

.section--quran .quran__ayah {
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    direction: inherit;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.18s ease, box-shadow 0.18s ease;
}

.section--quran .quran__ayah:hover {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
}

.section--quran .quran__ayah:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
}

.section--quran .quran__ayah.is-active {
    background: color-mix(in srgb, var(--accent) 14%, transparent);
}

.section--quran .quran__ayah-num {
    color: var(--muted);
    white-space: nowrap;
}


.section--quran .quran-study-panel {
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px;
    background: color-mix(in srgb, var(--surface) 88%, var(--accent) 12%);
}

.section--quran .quran-study-panel.is-hidden {
    display: none;
}

.section--quran .quran-study-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.section--quran .quran-study-panel__title {
    margin: 0;
}

.section--quran .quran-study-panel__text {
    font-size: 1.5rem;
    line-height: 2.1;
}

.section--quran .quran-study-panel__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.section--quran .quran-study-panel__status {
    font-size: 0.95rem;
}

.section--quran .quran-study-panel__audio-status {
    font-size: 0.92rem;
    min-height: 1.2em;
}

.section--quran #quranRepeatAyahBtn.is-active {
    border-color: var(--accent);
    color: var(--accent);
}

.section--quran .quran-study-panel__content {
    display: grid;
    gap: 10px;
}

.section--quran .quran-study-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.section--quran .quran-study-card__title {
    margin: 0 0 8px;
    font-size: 1rem;
}

.section--quran .quran-study-card__body {
    margin: 0;
    line-height: 1.8;
}


.section--quran .quran-review-card {
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px 14px;
    background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%);
}

.section--quran .quran-review-card.is-hidden {
    display: none;
}

.section--quran .quran-review-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.section--quran .quran-review-card__count {
    font-weight: 700;
}

.section--quran .quran-review-card__hint,
.section--quran .quran-review-card__meta {
    margin-top: 4px;
}

.section--quran #quranAddReviewBtn.is-active,
.section--quran #quranMarkMemorizedBtn.is-active,
.section--quran #quranReviewNextBtn.is-active {
    border-color: var(--accent);
    color: var(--accent);
}
