/* Persian fonts, all served from this site (SIL Open Font License). The one in use is chosen in Settings. */
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-arabic-400.woff2) format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-arabic-500.woff2) format('woff2'); font-weight: 500 600; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-arabic-700.woff2) format('woff2'); font-weight: 700 900; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-latin-400.woff2) format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-latin-500.woff2) format('woff2'); font-weight: 500 600; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: Estedad; src: url(/static/vendor/fonts/estedad-latin-700.woff2) format('woff2'); font-weight: 700 900; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: Shabnam; src: url(/static/vendor/fonts/shabnam.woff2) format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Shabnam; src: url(/static/vendor/fonts/shabnam-medium.woff2) format('woff2'); font-weight: 500 600; font-display: swap; }
@font-face { font-family: Shabnam; src: url(/static/vendor/fonts/shabnam-bold.woff2) format('woff2'); font-weight: 700 900; font-display: swap; }
@font-face { font-family: Sahel; src: url(/static/vendor/fonts/sahel.woff2) format('woff2'); font-weight: 400 600; font-display: swap; }
@font-face { font-family: Sahel; src: url(/static/vendor/fonts/sahel-bold.woff2) format('woff2'); font-weight: 700 900; font-display: swap; }
@font-face { font-family: Samim; src: url(/static/vendor/fonts/samim.woff2) format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Samim; src: url(/static/vendor/fonts/samim-medium.woff2) format('woff2'); font-weight: 500 600; font-display: swap; }
@font-face { font-family: Samim; src: url(/static/vendor/fonts/samim-bold.woff2) format('woff2'); font-weight: 700 900; font-display: swap; }

:root { --font: Estedad, Vazirmatn, "Segoe UI", Tahoma, sans-serif; }
:root[data-font=vazirmatn] { --font: Vazirmatn, "Segoe UI", Tahoma, sans-serif; }
:root[data-font=shabnam] { --font: Shabnam, Vazirmatn, "Segoe UI", Tahoma, sans-serif; }
:root[data-font=sahel] { --font: Sahel, Vazirmatn, "Segoe UI", Tahoma, sans-serif; }
:root[data-font=samim] { --font: Samim, Vazirmatn, "Segoe UI", Tahoma, sans-serif; }
body, button, input, select, textarea, .chart .bar-value, .chart .bar-label { font-family: var(--font); }
/* Persian reads better with a little more room between lines and numbers that line up in tables */
body { line-height: 1.85; }
td, .num, .money, .tile .value { font-variant-numeric: tabular-nums; }
.font-picks { display: grid; gap: 6px; }
.font-pick { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.font-pick:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.font-pick[data-font=estedad] .font-sample { font-family: Estedad; }
.font-pick[data-font=vazirmatn] .font-sample { font-family: Vazirmatn; }
.font-pick[data-font=shabnam] .font-sample { font-family: Shabnam; }
.font-pick[data-font=sahel] .font-sample { font-family: Sahel; }
.font-pick[data-font=samim] .font-sample { font-family: Samim; }
.font-sample { font-size: 15px; }
/* A figure and its unit stay on one line and shrink to the tile's width; only the change badge may drop below */
.tile { container-type: inline-size; }
.tiles .tile .value { display: flex; flex-wrap: wrap; align-items: center; column-gap: 6px; white-space: nowrap; font-size: clamp(13px, 10.5cqi, 26px); }
