/* Metah Typography System v2
   Visual direction: formal, calm, highly readable dashboard typography.
   UI/controls: Estedad Variable (local OFL)
   Book/Arabic/Quran reading: Amiri family (local OFL)
   Compatibility note: filename is intentionally kept as metah_typography_v1.css
   because all current entry templates already load this path. No external font request. */

@font-face {
  font-family: "Metah Estedad";
  src: url("../fonts/metah/Estedad-Variable.a30f0be474a2.woff2") format("woff2-variations"),
       url("../fonts/metah/Estedad-Variable.a30f0be474a2.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Metah Amiri";
  src: url("../fonts/metah/Amiri-Regular.4c15afb44240.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Metah Amiri";
  src: url("../fonts/metah/Amiri-Bold.3b9a176ac65e.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Metah Amiri";
  src: url("../fonts/metah/Amiri-Italic.47d4b07e0331.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Metah Amiri";
  src: url("../fonts/metah/Amiri-BoldItalic.d7c5ea7337af.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Metah Amiri Quran";
  src: url("../fonts/metah/AmiriQuran.7b8ea5fcf178.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --metah-font-ui: "Metah Estedad", system-ui, sans-serif;
  --metah-font-display: "Metah Estedad", system-ui, sans-serif;
  --metah-font-body: "Metah Estedad", system-ui, sans-serif;
  --metah-font-reading: "Metah Amiri", serif;
  --metah-font-arabic: "Metah Amiri", serif;
  --metah-font-quran: "Metah Amiri Quran", "Metah Amiri", serif;

  --metah-weight-regular: 400;
  --metah-weight-medium: 500;
  --metah-weight-semibold: 600;
  --metah-weight-bold: 700;
  --metah-weight-heavy: 780;

  --metah-body-size: 13.75px;
  --metah-body-leading: 1.80;
  --metah-control-size: 12.5px;
  --metah-muted-size: 12px;
  --metah-title-leading: 1.46;
}

html[dir="rtl"], html[lang="fa"], html[lang="ar"] {
  font-family: var(--metah-font-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
}

html[dir="rtl"] body,
html[lang="fa"] body,
html[lang="ar"] body {
  font-family: var(--metah-font-body) !important;
  font-size: var(--metah-body-size);
  line-height: var(--metah-body-leading);
  letter-spacing: 0;
}

/* ---------- Global UI text ---------- */
html[dir="rtl"] :is(
  p, li, dd, dt, td, th, label, legend, small,
  input, textarea, select, option, button,
  .form-control, .form-select, .form-text, .help-text,
  .description, .subtitle, .hint, .muted, .meta,
  .portal-alert, .dropdown-item, .nav-link, .breadcrumb-item
) {
  font-family: var(--metah-font-ui) !important;
}

html[dir="rtl"] :is(input, textarea, select, option, .form-control, .form-select) {
  font-size: 13.5px !important;
  line-height: 1.70 !important;
  font-weight: var(--metah-weight-regular) !important;
}
html[dir="rtl"] ::placeholder {
  font-family: var(--metah-font-ui) !important;
  font-weight: 400 !important;
  opacity: .58;
}

/* ---------- Heading system: formal, not shouty ---------- */
html[dir="rtl"] :is(h1,h2,h3,h4,h5,h6),
html[dir="rtl"] :is(.page-title,.hero-title,.section-title,.card-title,.panel-title,.modal-title),
html[dir="rtl"] :is([class$="-title"],[class$="-heading"],[class$="-headline"]),
html[dir="rtl"] :is(.portal-brand strong,.navbar-brand,.login-card h1) {
  font-family: var(--metah-font-display) !important;
  font-weight: var(--metah-weight-bold) !important;
  line-height: var(--metah-title-leading) !important;
  letter-spacing: -.018em;
}

html[dir="rtl"] h1 { font-size: clamp(1.55rem,1.95vw,2.05rem) !important; font-weight: 730 !important; }
html[dir="rtl"] h2 { font-size: clamp(1.22rem,1.50vw,1.58rem) !important; font-weight: 700 !important; }
html[dir="rtl"] h3 { font-size: clamp(1.04rem,1.18vw,1.28rem) !important; font-weight: 660 !important; }
html[dir="rtl"] :is(h4,h5,h6) { font-size: .96rem !important; font-weight: 640 !important; }

/* ---------- Controls ---------- */
html[dir="rtl"] :is(
  button,.btn,[role="button"],
  .btn-main,.btn-soft,.btn-linklike,.tool-btn,.icon-action-btn,
  .nav-link,.dropdown-item,
  .badge,.chip,[class*="-chip"],[class*="-badge"],
  .tab,[class*="-tab"],[class*="-step"]
) {
  font-family: var(--metah-font-ui) !important;
  font-weight: var(--metah-weight-semibold) !important;
  font-size: var(--metah-control-size);
  line-height: 1.65;
  letter-spacing: -.008em;
}

html[dir="rtl"] :is(label,legend,th) {
  font-family: var(--metah-font-ui) !important;
  font-weight: var(--metah-weight-semibold) !important;
  letter-spacing: -.006em;
}

/* Numbers and metrics: confident without being bulky. */
html[dir="rtl"] :is(
  .metric,.stat,.stat-value,.metric-value,.count,.counter,
  [class*="-count"],[class*="-metric"],
  .progress-number,.score,.session-number,.kpi-value
) {
  font-family: var(--metah-font-ui) !important;
  font-weight: 680 !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.015em;
}

/* Brand hierarchy */
.portal-brand strong,
.login-card h1,
.navbar-brand,
.brand-title {
  font-family: var(--metah-font-display) !important;
  font-weight: 700 !important;
}
.portal-brand small,
.login-card > p,
.navbar-brand small,
.brand-subtitle {
  font-family: var(--metah-font-ui) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  letter-spacing: 0 !important;
}

/* Tables */
table, table td, table th { font-family: var(--metah-font-ui) !important; }
table th { font-weight: 650 !important; }
table td { font-weight: 400 !important; line-height: 1.75; }

/* Main management families */
:is(.ap-card,.manager-card,.teacher-card,.qb-card,.calendar-card,.exam-card,
    .portal-card,.dashboard-card,.hub-card) :is(h1,h2,h3,h4,[class*="title"]) {
  font-family: var(--metah-font-display) !important;
}
:is(.ap-card,.manager-card,.teacher-card,.qb-card,.calendar-card,.exam-card,
    .portal-card,.dashboard-card,.hub-card) :is(p,small,.meta,.description,.hint) {
  font-family: var(--metah-font-ui) !important;
  font-weight: 400 !important;
}

/* Question bank: keep it crisp, not calligraphic. */
.qb-question-text,.qb-question-body,.qb-answer-text,.qb-edit-card textarea,.qb-session-card p {
  font-family: var(--metah-font-ui) !important;
  line-height: 1.95 !important;
}

/* ---------- Book reader: app shell Estedad, actual book Amiri ---------- */
.saed-reader-v6,
.saed-book-picker,
.minimal-range-picker {
  --reader-ui-font: var(--metah-font-ui);
  --reader-reading-font: var(--metah-font-reading);
}

.saed-reader-v6 :is(
  .reader-header-v6,.reader-tools-v6,.reader-tool-v6,.reader-toc-v6,
  .reader-toc-head-v6,.reader-toc-search-v6,.reader-footer-v6,
  .reader-meta-v6,.reader-kicker-v6,.reader-status-v6,
  button,input,select
),
.saed-book-picker :is(
  .reader-header,.reader-toolbar,.range-picker-bar,.picker-help,
  button,input,select,.surface-chip,.range-status-chip,.muted
),
.minimal-range-picker :is(
  .reader-header,.reader-toolbar,.range-picker-bar,.picker-help,
  button,input,select,.surface-chip,.range-status-chip,.muted
) {
  font-family: var(--metah-font-ui) !important;
}

.saed-reader-v6 .reader-document-host-v6,
.saed-reader-v6 .reader-document-host-v6 :is(.page-container,.ref-block,.fn-wrapper,.fn-row,p,li,td),
.saed-book-picker :is(.page-container,.ref-block,.fn-wrapper,.fn-row),
.minimal-range-picker :is(.page-container,.ref-block,.fn-wrapper,.fn-row) {
  font-family: var(--metah-font-reading) !important;
  font-weight: 400;
  letter-spacing: 0 !important;
}

.saed-reader-v6 .reader-document-host-v6 :is(
  .book-heading-block,.heading-block,.side-title,.side-title-main,.side-title-sub
) {
  font-family: var(--metah-font-reading) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.saed-reader-v6 .reader-toc-v6 :is(a,button,input,strong,small),
.saed-reader-v6 .reader-toc-body-v6 :is(a,.toc-link,.reader-toc-link-v6) {
  font-family: var(--metah-font-ui) !important;
}

/* Explicit Arabic/Quran utilities */
:lang(ar),.arabic,.arabic-text,[dir="rtl"][data-language="ar"] {
  font-family: var(--metah-font-arabic) !important;
  letter-spacing: 0 !important;
}
.quran,.ayah,.quran-text,[data-quran] {
  font-family: var(--metah-font-quran) !important;
  font-weight: 400 !important;
  line-height: 2.08 !important;
  letter-spacing: 0 !important;
}

/* ---------- Neutralise legacy Tahoma/Arial UI declarations ---------- */
html[dir="rtl"] :is(
  .range-dock-v33,.range-action-v33,.range-dock-v34,.range-action-v34,
  .reader-eyebrow,.reader-subtitle,.reader-actions,.tool-btn,
  .toc-search-input,.toc-link,.toc-empty,.side-col,.page-marker,
  .selected-word-box,.range-mini-status,.range-status-chip,
  .reader-page-jump-v52,.reader-volume-form-v52,.reader-action-message-v52,
  .reader-toc-header-v52,.reader-toc-link-v52,
  .exam-type-btn,.exam-plan-actions button,.exam-year-tabs button,
  .exam-selected-row input,.exam-note-field textarea,
  .ap-term-more-note textarea,.ap-term-day-compact,.ap-dashboard-context-v26 select,
  .ap-context-v26 select
) {
  font-family: var(--metah-font-ui) !important;
}

/* Login + landing stay product-like and quiet. */
.login-body,.login-card,.site-shell,.site-header,.landing-shell {
  font-family: var(--metah-font-ui) !important;
}
.login-card :is(h1,label,button,.btn-main),
.site-header :is(.brand,.nav-link,button),
.landing-shell :is(h1,h2,h3,.btn,.button) {
  font-family: var(--metah-font-display) !important;
}

/* Small text should remain readable; Estedad tolerates compact sizes well. */
html[dir="rtl"] :is(.text-muted,.small,small,[class*="meta"],[class*="hint"],[class*="subtitle"]) {
  line-height: 1.78;
}

/* Keep code and machine values untouched. */
code,pre,kbd,samp,.monospace {
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace !important;
  letter-spacing: 0 !important;
}

@media (max-width: 768px) {
  :root {
    --metah-body-size: 13.5px;
    --metah-control-size: 12.25px;
  }
  html[dir="rtl"] h1 { font-size: clamp(1.42rem,6.2vw,1.78rem) !important; }
  html[dir="rtl"] h2 { font-size: clamp(1.16rem,5.2vw,1.46rem) !important; }
  html[dir="rtl"] :is(input,textarea,select,.form-control,.form-select) { font-size: 16px !important; }
}



/* ---------- v2.1 compact visual scale ----------
   Estedad has a generous x-height, so old pixel sizes visually read larger.
   These overrides reduce visual mass without changing layout geometry. */
html[dir="rtl"] :is(
  .hero-card h1,
  .mh-subhero h1,
  .teachers-hero h1,
  .students-hero h1,
  .bh11-hero h1,
  .ap-hero h1,
  .exam-hero h1,
  .sc-hero h1,
  .sc-day-hero h1,
  .sc-hero-small h1,
  .qb-import-report-hero h1
) {
  font-size: clamp(1.55rem, 2vw, 2.05rem) !important;
  line-height: 1.42 !important;
}

html[dir="rtl"] :is(
  .bh11-title-wrap h2,
  .section-card > h2,
  .suggested-start-card h2,
  .range-panel-heading h2,
  .sc-panel h2,
  .exam-modal-head h2,
  .qb-import-session-head h2
) {
  font-size: clamp(1.02rem, 1.2vw, 1.28rem) !important;
  line-height: 1.5 !important;
}

html[dir="rtl"] :is(
  .class-card h3,
  .book-connect-info h3,
  .qb-offline-import-card h3,
  .qb-diagnostic-card h3,
  .qb-edit-meta-card h3
) {
  font-size: clamp(.98rem, 1.08vw, 1.18rem) !important;
  line-height: 1.5 !important;
}

html[dir="rtl"] :is(
  .stat-card strong,
  .session-metric strong,
  .qb-import-summary strong
) {
  font-size: clamp(1.28rem, 1.55vw, 1.62rem) !important;
}

/* Dense management dashboards should feel compact and deliberate. */
html[dir="rtl"] :is(
  .mh-card, .ap-card, .dashboard-card, .hub-card,
  .portal-card, .teacher-card, .calendar-card, .exam-card, .bh11-card
) :is(p, small, .meta, .description, .hint, .subtitle) {
  line-height: 1.72 !important;
}

html[dir="rtl"] :is(.login-card h1,.portal-brand strong,.navbar-brand,.brand-title) {
  font-size: clamp(1.25rem,1.5vw,1.55rem) !important;
}

@media (max-width: 768px) {
  html[dir="rtl"] :is(
    .hero-card h1,.mh-subhero h1,.teachers-hero h1,.students-hero h1,
    .bh11-hero h1,.ap-hero h1,.exam-hero h1,.sc-hero h1,.sc-day-hero h1,.sc-hero-small h1
  ) {
    font-size: clamp(1.34rem,5.8vw,1.65rem) !important;
  }
}

@media print {
  html,body,table,td,p,li { font-family: var(--metah-font-ui) !important; }
  h1,h2,h3,h4,h5,h6,th,.page-head,.print-tools { font-family: var(--metah-font-display) !important; }
}
