/* سكة فرح العمر — brand faces for the Filament admin panel, mirroring the public
   frontend: Thmanyah Serif Text for headings, Alexandria for everything else.

   Self-hosted from `public/fonts/` (see the README in `public/fonts/thmanyah/`).
   Alexandria is a variable font whose `wght` axis runs 100-900, so one file per
   unicode subset covers every weight the panel asks for; the Arabic and Latin
   subsets are split exactly as Google serves them so a page
   only fetches what it renders. `font-display: swap` everywhere, and each stack
   keeps Arabic-capable fallbacks for the moment before the face loads. */
@font-face {
    font-family: 'Alexandria';
    src: url('/fonts/alexandria/Alexandria-arabic.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

@font-face {
    font-family: 'Alexandria';
    src: url('/fonts/alexandria/Alexandria-latin.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Thmanyah Serif Text';
    src: url('/fonts/thmanyah/Thmanyah-Serif-Text-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Thmanyah Serif Text';
    src: url('/fonts/thmanyah/Thmanyah-Serif-Text-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Thmanyah Serif Text';
    src: url('/fonts/thmanyah/Thmanyah-Serif-Text-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    /* `--font-family` and `--serif-font-family` — the vars Filament inlines into
       Tailwind's `--default-font-family` and its `fi-font-sans` / `fi-font-serif`
       utilities — are deliberately NOT set here. The base layout writes its own
       unlayered `:root` block for them *after* this stylesheet, so anything declared
       here loses. They are configured on the panel instead, via `->font()` /
       `->serifFont()` in `AdminPanelProvider`; the Arabic fallbacks that those
       single-family values can't carry are supplied by the rules below.

       The Tailwind tokens behind the plain `font-sans` / `font-serif` utilities do
       belong here: Filament's theme declares them inside `@layer theme`, and an
       unlayered rule beats any layer regardless of source order. */
    --font-sans: 'Alexandria', 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif;
    --font-serif: 'Thmanyah Serif Text', 'Noto Naskh Arabic', 'Amiri', serif;
    /* Brand constants, also used as the fallback palette before the settings row
       exists: Primary Teal / Secondary Camel. */
    --brand-teal: #0a3b3a;
    --brand-camel: #bf9171;
}

.fi-body,
.fi-simple-layout {
    font-family: 'Alexandria', 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif;
}

/* Arabic is a connected script, so letter-spacing is never right in this panel:
   positive tracking tears the joining strokes apart and negative tracking crushes
   them. Filament ships `tracking-tight` on page and section headings, the logo,
   badges, stat values and prose h1/h2, so neutralise the lot rather than chasing each
   selector as the framework adds them. An unlayered rule outranks anything in a
   `@layer` whatever its specificity, so no `!important` is needed.

   The one-time-code input is the deliberate exception: its letter-spacing spreads
   Latin digits into their boxes, which is layout rather than typography. */
*:not(.fi-one-time-code-input) {
    letter-spacing: normal;
}

/* Page and section headings pick up the serif face, matching the public site's
   editorial hierarchy. */
.fi-header-heading,
.fi-section-header-heading,
.fi-modal-heading {
    font-family: 'Thmanyah Serif Text', 'Noto Naskh Arabic', 'Amiri', serif;
}

/* FilePond (FileUpload dropzone) ships its own font-family on `.filepond--root`,
   so the brand face never reaches the drop label or any inner text. Re-apply the
   stack to the root and let every descendant inherit it. */
.filepond--root,
.filepond--root * {
    font-family: 'Alexandria', 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
}

/* Make the whole rich editor area tall and clickable, not just the first line.
   Targets the TipTap contenteditable element directly. */
.fi-fo-rich-editor .tiptap,
.fi-fo-rich-editor [contenteditable="true"] {
    min-height: 24rem;
}

/* Stronger visual hierarchy in infolists: by default Filament paints both the
   entry label and its value with the same color (gray-950 / white), so they
   read as one block. Mute the label so the value stands out as the answer.
   Selectors match the core specificity and win on source order (this file is
   loaded after the framework theme). */
.fi-in-entry .fi-in-entry-label {
    color: #52525b; /* zinc-600 */
    font-weight: 600;
}

.dark .fi-in-entry .fi-in-entry-label {
    color: #a1a1aa; /* zinc-400 */
}

/* Iconify icon previews (icon picker options, table and infolist) are served
   as monochrome black SVGs from the Iconify API via <img>, so `currentColor`
   can't reach them. Invert them in dark mode so they read as light-on-dark.
   Scoped to the `sikkah-iconify-icon` class so uploaded photo thumbnails are
   never inverted. */
.dark .sikkah-iconify-icon {
    filter: invert(1);
}