/* ============================================================
   FATWA.CSS — Стили отображения фетвы
   Kawn Ad-Din | Подпроект «Ифта»
   Подключается один раз. Фетва — чистые данные (JSON).
   ============================================================ */

/* Шрифты — в css/fonts.css (самохостинг); @import Google Fonts удалён:
   он создавал render-blocking цепочку HTML→CSS→шрифтовый CSS. */

/* ==================== CSS-переменные ==================== */
:root {
    --fatwa-emerald:      #059669;
    --fatwa-emerald-dark: #047857;
    --fatwa-emerald-bg:   #f0f9f4;
    --fatwa-emerald-brd:  #a7f3d0;
    --fatwa-gold:         #b45309;
    --fatwa-gold-bg:      #fffbeb;
    --fatwa-gold-brd:     #fde68a;
    --fatwa-blue:         #1d4ed8;
    --fatwa-blue-bg:      #eff6ff;
    --fatwa-blue-brd:     #bfdbfe;
    --fatwa-text:         #1f2937;
    --fatwa-text-sec:     #374151;
    --fatwa-text-muted:   #6b7280;
    --fatwa-border:       #e5e7eb;
    --fatwa-arabic-font:  'Scheherazade New', 'Amiri', 'Traditional Arabic', serif;
    --fatwa-urdu-font:    'Noto Nastaliq Urdu', 'Amiri', serif;
    --fatwa-body-font:    'Noto Serif', Georgia, 'Times New Roman', serif;
}

/* ==================== КОНТЕЙНЕР ==================== */
.fatwa-container {
    max-width: 700px;
    margin: 0 auto;
    background: #fff;
    padding: 44px 48px;
    border-radius: 16px;
    box-shadow: 0 2px 24px rgba(0,0,0,0.07);
    font-family: var(--fatwa-body-font);
    color: var(--fatwa-text);
    font-size: 1rem;
    line-height: 1.8;
}


/* ==================== БИСМИЛЛЯ ==================== */
.fatwa-bismillah {
    font-family: var(--fatwa-arabic-font);
    font-size: 2em;
    color: var(--fatwa-emerald-dark);
    text-align: center;
    direction: rtl;
    padding-bottom: 28px;
    margin-bottom: 28px;
    border-bottom: 1px solid var(--fatwa-border);
    line-height: 2;
}

/* ==================== МЕТ-ДАННЫЕ (теги) ==================== */
.fatwa-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}
.fatwa-meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    font-family: 'Segoe UI', sans-serif;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}
.fatwa-meta-chip.category   { background: var(--fatwa-emerald-bg); color: var(--fatwa-emerald-dark); border: 1px solid var(--fatwa-emerald-brd); }
.fatwa-meta-chip.madhab     { background: var(--fatwa-blue-bg);    color: var(--fatwa-blue);         border: 1px solid var(--fatwa-blue-brd); }
.fatwa-meta-chip.tag        { background: #f3f4f6;                  color: #4b5563;                   border: 1px solid #e5e7eb; }

/* ==================== ЯЗЫКОВЫЕ ВКЛАДКИ ==================== */
.fatwa-lang-tabs {
    display: flex;
    gap: 2px;
    margin-bottom: 32px;
    border-bottom: 2px solid var(--fatwa-border);
}
.fatwa-lang-tab {
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Segoe UI', sans-serif;
    color: var(--fatwa-text-muted);
    cursor: pointer;
    border: none;
    background: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
    border-radius: 6px 6px 0 0;
}
.fatwa-lang-tab:hover  { color: var(--fatwa-text); background: #f9fafb; }
.fatwa-lang-tab.active { color: var(--fatwa-emerald); border-bottom-color: var(--fatwa-emerald); background: var(--fatwa-emerald-bg); }

.fatwa-lang-panel           { display: none; }
.fatwa-lang-panel.active    { display: block; }

/* ==================== БЛОК ВОПРОСА ==================== */
.fatwa-section-label {
    display: inline-block;
    font-family: 'Segoe UI', sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--fatwa-text-muted);
    background: #f3f4f6;
    border: 1px solid var(--fatwa-border);
    padding: 3px 10px;
    border-radius: 4px;
    margin-bottom: 12px;
}

.fatwa-question-title {
    font-family: var(--fatwa-body-font);
    font-size: 1.45em;
    font-weight: 600;
    color: var(--fatwa-text);
    line-height: 1.4;
    margin: 0 0 20px;
}

.fatwa-question-body {
    color: var(--fatwa-text-sec);
    font-size: 0.97em;
    line-height: 1.85;
    margin-bottom: 8px;
}
.fatwa-question-body p { margin-bottom: 12px; }
.fatwa-question-body p:last-child { margin-bottom: 0; }

/* ==================== РАЗДЕЛИТЕЛЬ СЕКЦИЙ ==================== */
.fatwa-section-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 32px 0;
}
.fatwa-section-divider::before,
.fatwa-section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--fatwa-border);
}
.fatwa-section-divider-icon {
    font-family: var(--fatwa-arabic-font);
    font-size: 1.2em;
    color: var(--fatwa-emerald);
    white-space: nowrap;
}

/* ==================== ЗАГОЛОВОК ОТВЕТА (арабский) ==================== */
.fatwa-answer-header {
    font-family: var(--fatwa-arabic-font);
    font-size: 1.5em;
    color: var(--fatwa-emerald-dark);
    text-align: center;
    direction: rtl;
    line-height: 2;
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--fatwa-emerald-bg) 0%, #ffffff 100%);
    border: 1px solid var(--fatwa-emerald-brd);
    border-radius: 10px;
    margin-bottom: 24px;
}

/* ==================== ТЕКСТ ОТВЕТА ==================== */
.fatwa-answer-body {
    color: var(--fatwa-text-sec);
    font-size: 0.97em;
    line-height: 1.85;
}
.fatwa-answer-body p { margin-bottom: 14px; }
.fatwa-answer-body p:last-child { margin-bottom: 0; }

/* ── Цитата (blockquote из Quill) ─────────────────────────── */
.fatwa-answer-body blockquote,
.fatwa-question-body blockquote,
.fatwa-recommendation-text blockquote,
.fatwa-advice-text blockquote {
    border-inline-start: 3px solid #10b981;
    margin: 12px 0;
    padding: 8px 14px;
    background: var(--emerald-50, #f0fdf4);
    color: var(--emerald-dark, #065f46);
    font-style: italic;
    border-radius: 0 6px 6px 0;
}
/* RTL / арабский — полоса справа, без курсива */
[dir="rtl"] .fatwa-answer-body blockquote,
[dir="rtl"] .fatwa-question-body blockquote,
[dir="rtl"] .fatwa-recommendation-text blockquote,
[dir="rtl"] .fatwa-advice-text blockquote,
.fatwa-lang-panel[data-lang="ar"] .fatwa-answer-body blockquote,
.fatwa-lang-panel[data-lang="ur"] .fatwa-answer-body blockquote {
    border-inline-start: none;
    border-inline-end: 3px solid #10b981;
    border-radius: 6px 0 0 6px;
    font-style: normal;
}

/* ==================== БЛОК «ОРИГИНАЛЬНЫЙ ТЕКСТ ИЗ КНИГ» ==================== */
.fatwa-sources-section {
    margin: 28px 0;
    border: 1px solid var(--fatwa-emerald-brd);
    border-radius: 12px;
    overflow: hidden;
}
.fatwa-sources-header {
    font-family: 'Segoe UI', sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--fatwa-emerald-dark);
    background: var(--fatwa-emerald-bg);
    padding: 10px 20px;
    border-bottom: 1px solid var(--fatwa-emerald-brd);
}
.fatwa-sources-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Единый блок-цитата из книги */
.fatwa-source-item {}

/* ==================== АРАБСКИЙ ТЕКСТ ==================== */
.fatwa-arabic-text {
    font-family: var(--fatwa-arabic-font);
    /* Арабский источник — смысловое ядро фетвы: кегль не ниже основного текста
       (0.78em был нечитаем), арабице нужен увеличенный интерлиньяж */
    font-size: 1.2em;
    line-height: 2;
    direction: rtl;
    text-align: end;
    color: #1a2e1a;
    background: #fbfffc;
    border: 1px solid var(--fatwa-emerald-brd);
    border-radius: 8px;
    padding: 16px 22px;
}

/* ==================== ПЕРЕВОД АРАБСКОГО ==================== */
.fatwa-translation {
    background: var(--fatwa-emerald-bg);
    border-inline-start: 3px solid var(--fatwa-emerald);
    border-radius: 0 8px 8px 0;
    padding: 14px 18px;
    font-style: italic;
    color: var(--fatwa-text-sec);
    font-size: 0.94em;
    line-height: 1.75;
}

/* ==================== ССЫЛКА НА КНИГУ ==================== */
.fatwa-book-ref {
    font-family: var(--fatwa-arabic-font);
    font-size: 0.98em;
    color: var(--fatwa-text-muted);
    text-align: end;
    direction: rtl;
    font-style: italic;
    padding: 4px 0;
    border-top: 1px dashed var(--fatwa-emerald-brd);
    margin-top: 8px;
}

/* ==================== INLINE АРАБСКИЙ ТЕРМИН ==================== */
.arabic-term {
    font-family: var(--fatwa-arabic-font);
    font-size: 1.05em;
    color: var(--fatwa-emerald-dark);
    font-weight: 500;
}

/* ==================== БЛОК РЕКОМЕНДАЦИИ (жёлтый) ==================== */
.fatwa-recommendation-block {
    background: var(--fatwa-gold-bg);
    border: 1px solid var(--fatwa-gold-brd);
    border-inline-start: 4px solid #f59e0b;
    border-radius: 0 10px 10px 0;
    padding: 20px 24px;
    margin: 28px 0;
}
.fatwa-recommendation-label {
    font-family: 'Segoe UI', sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #92400e;
    margin-bottom: 10px;
}
.fatwa-recommendation-text {
    color: #78350f;
    font-size: 0.95em;
    line-height: 1.8;
    margin-bottom: 10px;
}
.fatwa-recommendation-text:last-child { margin-bottom: 0; }

/* ==================== БЛОК СОВЕТА (синий) ==================== */
.fatwa-advice-block {
    background: var(--fatwa-blue-bg);
    border: 1px solid var(--fatwa-blue-brd);
    border-inline-start: 4px solid #3b82f6;
    border-radius: 0 10px 10px 0;
    padding: 20px 24px;
    margin: 28px 0;
}
.fatwa-advice-label {
    font-family: 'Segoe UI', sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #1e40af;
    margin-bottom: 10px;
}
.fatwa-advice-text {
    color: #1e3a8a;
    font-size: 0.95em;
    line-height: 1.8;
}

/* ==================== ЗАКРЫВАЮЩАЯ ФРАЗА ==================== */
.fatwa-closing {
    text-align: center;
    margin-top: 36px;
    padding-top: 28px;
    border-top: 1px solid var(--fatwa-border);
}
.fatwa-closing-arabic {
    font-family: var(--fatwa-arabic-font);
    font-size: 1.35em;
    color: var(--fatwa-emerald-dark);
    display: block;
    margin-bottom: 6px;
    direction: rtl;
    line-height: 2;
}
.fatwa-closing-translation {
    font-size: 0.88em;
    color: var(--fatwa-text-muted);
    font-style: italic;
}

/* ==================== ИСТОЧНИК ==================== */
.fatwa-source-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    padding-top: 16px;
    border-top: 1px solid var(--fatwa-border);
    font-family: 'Segoe UI', sans-serif;
    font-size: 12px;
    color: var(--fatwa-text-muted);
}
.fatwa-source-footer a {
    color: var(--fatwa-emerald);
    text-decoration: none;
}
.fatwa-source-footer a:hover { text-decoration: underline; }

/* ==================== АДАПТИВ ==================== */
@media (max-width: 640px) {
    .fatwa-container  { padding: 24px 18px; border-radius: 12px; }
    .fatwa-bismillah  { font-size: 1.5em; }
    .fatwa-question-title { font-size: 1.2em; }
    .fatwa-arabic-text { font-size: 1.1em; padding: 12px 14px; }
    .fatwa-lang-tab   { padding: 7px 12px; font-size: 12px; }
}

/* ============================================================
   MODAL EMPTY STATE + INLINE FORMATTING TAGS (v5)
   ============================================================ */

.modal-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    gap: 12px;
}
.modal-empty-icon { font-size: 48px; opacity: 0.6; }
.modal-empty-title {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
}
.modal-empty-sub {
    font-size: 14px;
    color: #6b7280;
    max-width: 320px;
}
.modal-empty button {
    margin-top: 8px;
    padding: 10px 20px;
    background: #059669;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
}
.modal-empty button:hover { background: var(--emerald-dark, #047857); }

/* Inline Arabic text [ar]...[/ar] */
.inline-arabic {
    font-family: 'Scheherazade New', 'Amiri', 'Noto Sans Arabic', serif;
    font-size: 1.15em;
    line-height: 1.8;
    display: inline;
    direction: rtl;
    unicode-bidi: embed;
    background: var(--emerald-50, #f0fdf4);
    border-bottom: 1.5px solid var(--emerald-light, #86efac);
    padding: 0 4px;
    border-radius: 2px;
    color: #166534;
}

/* Translation [tr]...[/tr] */
.inline-translation {
    font-style: italic;
    color: #4b5563;
}
.inline-translation::before { content: '('; }
.inline-translation::after  { content: ')'; }

/* Highlight [hl]...[/hl] */
.inline-highlight {
    background: #fef9c3;
    color: #78350f;
    font-weight: 600;
    padding: 0 3px;
    border-radius: 3px;
}

/* ============================================================
   CALLOUT БЛОКИ — p.ql-callout-{color} из Quill-редактора
   Сохраняются в HTML фетвы и отображаются на публичной странице
   ============================================================ */
.ql-callout-green,
.ql-callout-yellow,
.ql-callout-blue,
.ql-callout-red,
.ql-callout-purple {
    border-inline-start: 4px solid;
    border-radius: 0 8px 8px 0;
    padding: 12px 16px;
    margin: 10px 0;
    line-height: 1.7;
}
[dir="rtl"] .ql-callout-green,
[dir="rtl"] .ql-callout-yellow,
[dir="rtl"] .ql-callout-blue,
[dir="rtl"] .ql-callout-red,
[dir="rtl"] .ql-callout-purple {
    border-inline-start: none;
    border-inline-end: 4px solid;
    border-radius: 8px 0 0 8px;
}

.ql-callout-green  { background: var(--emerald-50, #f0fdf4); border-color: #16a34a; color: #14532d; }
.ql-callout-yellow { background: #fefce8; border-color: #ca8a04; color: #713f12; }
.ql-callout-blue   { background: #eff6ff; border-color: #2563eb; color: #1e3a8a; }
.ql-callout-red    { background: #fff1f2; border-color: #dc2626; color: #7f1d1d; }
.ql-callout-purple { background: #faf5ff; border-color: #9333ea; color: #4c1d95; }

/* ============================================================
   АРАБСКАЯ ВКЛАДКА — крупный шрифт
   Стоит в самом конце файла чтобы перебить все предыдущие
   font-size правила с меньшей специфичностью
   ============================================================ */
.fatwa-lang-panel[data-lang="ar"],
.fatwa-lang-panel[data-lang="ar"] p,
.fatwa-lang-panel[data-lang="ar"] span,
.fatwa-lang-panel[data-lang="ar"] div {
    font-family: 'Scheherazade New', 'Amiri', serif !important;
}
.fatwa-lang-panel[data-lang="ar"] .fatwa-question-body,
.fatwa-lang-panel[data-lang="ar"] .fatwa-answer-body {
    font-size: 1.4em !important;
    line-height: 2.3 !important;
}
.fatwa-lang-panel[data-lang="ar"] .fatwa-question-body p,
.fatwa-lang-panel[data-lang="ar"] .fatwa-answer-body p {
    font-size: 1em !important;
    line-height: inherit !important;
    margin-bottom: 16px !important;
}
.fatwa-lang-panel[data-lang="ar"] .fatwa-recommendation-text,
.fatwa-lang-panel[data-lang="ar"] .fatwa-recommendation-text p,
.fatwa-lang-panel[data-lang="ar"] .fatwa-advice-text,
.fatwa-lang-panel[data-lang="ar"] .fatwa-advice-text p {
    font-size: 1.3em !important;
    line-height: 2.2 !important;
}

/* ============================================================
   УРДУ ВКЛАДКА — шрифт Noto Nastaliq Urdu
   ============================================================ */
.fatwa-lang-panel[data-lang="ur"],
.fatwa-lang-panel[data-lang="ur"] p,
.fatwa-lang-panel[data-lang="ur"] span,
.fatwa-lang-panel[data-lang="ur"] div {
    font-family: 'Noto Nastaliq Urdu', 'Amiri', serif !important;
    direction: rtl !important;
    text-align: end !important;
}
.fatwa-lang-panel[data-lang="ur"] .fatwa-question-body,
.fatwa-lang-panel[data-lang="ur"] .fatwa-answer-body {
    font-size: 1.35em !important;
    line-height: 2.4 !important;
}
.fatwa-lang-panel[data-lang="ur"] .fatwa-question-body p,
.fatwa-lang-panel[data-lang="ur"] .fatwa-answer-body p {
    font-size: 1em !important;
    line-height: inherit !important;
    margin-bottom: 16px !important;
}
.fatwa-lang-panel[data-lang="ur"] .fatwa-recommendation-text,
.fatwa-lang-panel[data-lang="ur"] .fatwa-recommendation-text p,
.fatwa-lang-panel[data-lang="ur"] .fatwa-advice-text,
.fatwa-lang-panel[data-lang="ur"] .fatwa-advice-text p {
    font-size: 1.25em !important;
    line-height: 2.3 !important;
}

/* Инлайн-класс для урду текста внутри любого языкового блока */
.urdu-text {
    font-family: 'Noto Nastaliq Urdu', 'Amiri', serif;
    direction: rtl;
    unicode-bidi: embed;
    font-size: 1.2em;
    line-height: 2.4;
}

/* ==================== СПИСКИ ИЗ QUILL ==================== */
.fatwa-answer-body ul,
.fatwa-answer-body ol,
.fatwa-question-body ul,
.fatwa-question-body ol,
.fatwa-recommendation-text ul,
.fatwa-recommendation-text ol,
.fatwa-advice-text ul,
.fatwa-advice-text ol {
    padding-inline-start: 1.6em;
    margin: 8px 0 14px;
}

.fatwa-answer-body ul,
.fatwa-question-body ul,
.fatwa-recommendation-text ul,
.fatwa-advice-text ul {
    list-style-type: disc;
}

.fatwa-answer-body ol,
.fatwa-question-body ol,
.fatwa-recommendation-text ol,
.fatwa-advice-text ol {
    list-style-type: decimal;
}

.fatwa-answer-body li,
.fatwa-question-body li,
.fatwa-recommendation-text li,
.fatwa-advice-text li {
    margin-bottom: 6px;
    line-height: 1.85;
}

/* RTL списки (арабский) */
[dir="rtl"] .fatwa-answer-body ul,
[dir="rtl"] .fatwa-answer-body ol,
[dir="rtl"] .fatwa-question-body ul,
[dir="rtl"] .fatwa-question-body ol {
    padding-inline-start: 0;
    padding-inline-end: 1.6em;
}

/* ==================== РАЗДЕЛИТЕЛЬ (DIVIDER) ==================== */
.fatwa-divider {
    display: block;
    text-align: center;
    margin: 16px 0;
    line-height: 1;
    user-select: none;
}
.fatwa-divider::before {
    content: '* * *';
    display: block;
    color: #9ca3af;
    font-size: 13px;
    letter-spacing: 0.5em;
    font-family: serif;
}
.fatwa-divider::after {
    display: none;
}

/* ==================== ИЗОБРАЖЕНИЯ ==================== */
.fatwa-img-small  { width: 25%;  height: auto; display: block; margin: 14px auto; border-radius: 6px; }
.fatwa-img-medium { width: 50%;  height: auto; display: block; margin: 14px auto; border-radius: 6px; }
.fatwa-img-large  { width: 75%;  height: auto; display: block; margin: 14px auto; border-radius: 6px; }
.fatwa-img-full   { width: 100%; height: auto; display: block; margin: 14px auto; border-radius: 6px; }

/* ==================== ТАБЛИЦЫ ==================== */
.fatwa-table-embed {
    overflow-x: auto;
    margin: 16px 0;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}
.fatwa-table-embed table,
.fatwa-answer-body table,
.fatwa-question-body table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.6;
}
.fatwa-table-embed table th,
.fatwa-answer-body table th,
.fatwa-question-body table th {
    background: #059669;
    color: #fff;
    padding: 10px 14px;
    text-align: start;
    font-weight: 600;
    font-size: 13px;
}
.fatwa-table-embed table td,
.fatwa-answer-body table td,
.fatwa-question-body table td {
    padding: 9px 14px;
    border-bottom: 1px solid #e5e7eb;
    color: #374151;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.fatwa-table-embed table tr:last-child td,
.fatwa-answer-body table tr:last-child td,
.fatwa-question-body table tr:last-child td {
    border-bottom: none;
}
.fatwa-table-embed table tr:nth-child(even) td,
.fatwa-answer-body table tr:nth-child(even) td,
.fatwa-question-body table tr:nth-child(even) td {
    background: var(--emerald-50, #f0fdf4);
}
.fatwa-table-embed td[contenteditable]:focus {
    outline: 2px solid #059669;
    outline-offset: -2px;
    background: #f0fff8;
}
.fatwa-table-embed th[contenteditable]:focus {
    outline: 2px solid #059669;
    outline-offset: -2px;
    background: color-mix(in srgb, var(--emerald, #059669) 20%, transparent);
    color: var(--emerald-dark, #065f46);
}
/* Скрытая таблица — не отображается читателю */
.fatwa-table-hidden {
    display: none;
}