/* ==========================================================================
   Typographie moderne — site public + admin
   Chargé en dernier dans layouts/frontend.blade.php et layouts/admin.blade.php.
   - Anglais : Inter (graisses 100 → 900) ; arabe : IBM Plex Sans Arabic (300 → 700),
     hébergées sur le site (fonts/inter, fonts/ibm-plex-sans-arabic)
   - Tailles en rem, titres fluides avec clamp() (taille d'origine sur grand
     écran, réduction progressive jusqu'à 375px de large)
   Pour revenir en arrière : retirer la balise <link> de typography.css.
   ========================================================================== */

/* Inter — graisses numériques correctes (les déclarations du thème déclarent
   plusieurs fichiers différents sous le même poids "bold"). */
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Thin.woff2') format('woff2'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-ExtraLight.woff2') format('woff2'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Light.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-ExtraBold.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Site'; src: url('../fonts/inter/Inter-Black.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }

/* IBM Plex Sans Arabic (licence SIL OFL, voir fonts/ibm-plex-sans-arabic/LICENSE.txt).
   unicode-range : utilisée uniquement pour les caractères arabes ; le texte latin reste en Inter
   et le fichier n'est téléchargé que si la page contient de l'arabe. */
@font-face { font-family: 'IBM Plex Arabic Site'; src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-300-normal.woff2') format('woff2'); font-weight: 300; 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; }
@font-face { font-family: 'IBM Plex Arabic Site'; src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-400-normal.woff2') format('woff2'); font-weight: 400; 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; }
@font-face { font-family: 'IBM Plex Arabic Site'; src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-500-normal.woff2') format('woff2'); font-weight: 500; 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; }
@font-face { font-family: 'IBM Plex Arabic Site'; src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-600-normal.woff2') format('woff2'); font-weight: 600; 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; }
@font-face { font-family: 'IBM Plex Arabic Site'; src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-700-normal.woff2') format('woff2'); font-weight: 700; 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; }

:root {
    --font-sans: 'Inter Site', 'IBM Plex Arabic Site', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    /* Échelle typographique fluide (min mobile → max desktop) */
    --fs-xs:   0.75rem;                                      /* 12px */
    --fs-sm:   0.875rem;                                     /* 14px */
    --fs-base: 1rem;                                         /* 16px */
    --fs-md:   clamp(1rem, 0.98rem + 0.09vw, 1.0625rem);     /* 16 → 17px */
    --fs-lg:   clamp(1.125rem, 1.08rem + 0.19vw, 1.25rem);   /* 18 → 20px */
    --fs-xl:   clamp(1.25rem, 1.16rem + 0.38vw, 1.5rem);     /* 20 → 24px */
    --fs-2xl:  clamp(1.375rem, 1.24rem + 0.56vw, 1.75rem);   /* 22 → 28px */
    --fs-3xl:  clamp(1.625rem, 1.45rem + 0.75vw, 2.125rem);  /* 26 → 34px */
    --fs-4xl:  clamp(2rem, 1.74rem + 1.13vw, 2.75rem);       /* 32 → 44px */

    --lh-tight: 1.3;   /* un peu d'air pour les points et signes de l'arabe */
    --lh-snug:  1.35;
    --lh-body:  1.6;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-family: var(--font-sans);
    font-size: var(--fs-base);
    line-height: var(--lh-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Une seule police partout, en épargnant les polices d'icônes
   (Font Awesome, UIcons, Summernote…) et le code. */
body,
body *:not(i):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not([class*="fa-"]):not([class^="fi-"]):not([class*=" fi-"]):not([class^="note-icon"]):not([class*=" note-icon"]):not(code):not(pre):not(kbd):not(samp) {
    font-family: var(--font-sans) !important;
}

/* --------------------------------------------------------------------------
   Titres et paragraphes
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
    line-height: var(--lh-tight);
    letter-spacing: normal; /* pas d'espacement négatif : il casse les liaisons de l'arabe */
    text-wrap: balance;
}
h1 { font-size: var(--fs-4xl); }
h2 { font-size: var(--fs-3xl); }
h3 { font-size: var(--fs-2xl); }
h4 { font-size: var(--fs-xl); }
h5 { font-size: var(--fs-lg); }
h6 { font-size: var(--fs-md); }

p {
    line-height: var(--lh-body);
    text-wrap: pretty;
}

small, .small { font-size: var(--fs-sm); }

input, select, textarea, button {
    font-family: var(--font-sans);
}

/* --------------------------------------------------------------------------
   Classes de titres du thème (ex. .dm-title-60px, .fi-title-48px…)
   Taille d'origine conservée sur grand écran, réduite en douceur sur mobile
   (interpolation entre 375px et 1440px de largeur d'écran).
   -------------------------------------------------------------------------- */
body [class*="title-20px"], body [class*="text-20px"] { font-size: clamp(1.0625rem, 0.9965rem + 0.282vw, 1.25rem); }
body [class*="title-24px"], body [class*="text-24px"] { font-size: clamp(1.25rem, 1.162rem + 0.376vw, 1.5rem); }
body [class*="title-26px"], body [class*="text-26px"] { font-size: clamp(1.375rem, 1.287rem + 0.376vw, 1.625rem); }
body [class*="title-30px"], body [class*="text-30px"] { font-size: clamp(1.375rem, 1.1989rem + 0.751vw, 1.875rem); }
body [class*="title-32px"], body [class*="text-32px"] { font-size: clamp(1.375rem, 1.1549rem + 0.939vw, 2rem); }
body [class*="title-34px"], body [class*="text-34px"] { font-size: clamp(1.375rem, 1.1109rem + 1.127vw, 2.125rem); }
body [class*="title-36px"], body [class*="text-36px"] { font-size: clamp(1.375rem, 1.0669rem + 1.315vw, 2.25rem); }
body [class*="title-40px"], body [class*="text-40px"] { font-size: clamp(1.5625rem, 1.2324rem + 1.408vw, 2.5rem); }
body [class*="title-44px"], body [class*="text-44px"] { font-size: clamp(1.6875rem, 1.3134rem + 1.596vw, 2.75rem); }
body [class*="title-48px"], body [class*="text-48px"] { font-size: clamp(1.875rem, 1.4789rem + 1.69vw, 3rem); }
body [class*="title-50px"], body [class*="text-50px"] { font-size: clamp(1.9375rem, 1.5194rem + 1.784vw, 3.125rem); }
body [class*="title-54px"], body [class*="text-54px"] { font-size: clamp(2.0625rem, 1.6004rem + 1.972vw, 3.375rem); }
body [class*="title-56px"], body [class*="text-56px"] { font-size: clamp(2.1875rem, 1.7254rem + 1.972vw, 3.5rem); }
body [class*="title-60px"], body [class*="text-60px"] { font-size: clamp(2.3125rem, 1.8063rem + 2.16vw, 3.75rem); }
body [class*="title-64px"], body [class*="text-64px"] { font-size: clamp(2.5rem, 1.9718rem + 2.254vw, 4rem); }
body [class*="title-66px"], body [class*="text-66px"] { font-size: clamp(2.5625rem, 2.0123rem + 2.347vw, 4.125rem); }
body [class*="title-70px"], body [class*="text-70px"] { font-size: clamp(2.6875rem, 2.0933rem + 2.535vw, 4.375rem); }
body [class*="title-76px"], body [class*="text-76px"] { font-size: clamp(2.9375rem, 2.2993rem + 2.723vw, 4.75rem); }
body [class*="title-78px"], body [class*="text-78px"] { font-size: clamp(3rem, 2.3398rem + 2.817vw, 4.875rem); }
body [class*="title-90px"], body [class*="text-90px"] { font-size: clamp(3.5rem, 2.7518rem + 3.192vw, 5.625rem); }
body [class*="title-94px"], body [class*="text-94px"] { font-size: clamp(3.625rem, 2.8327rem + 3.38vw, 5.875rem); }
body [class*="title-100px"], body [class*="text-100px"] { font-size: clamp(3.875rem, 3.0387rem + 3.568vw, 6.25rem); }

/* Interligne proportionnel pour les grands titres : le thème fixe des
   interlignes en px (ex. 76px pour 60px) qui deviennent trop grands quand
   la police rétrécit sur mobile. */
body [class*="title-24px"], body [class*="title-26px"],
body [class*="title-30px"], body [class*="title-32px"], body [class*="title-34px"], body [class*="title-36px"],
body [class*="title-40px"], body [class*="title-44px"], body [class*="title-48px"], body [class*="title-50px"],
body [class*="title-54px"], body [class*="title-56px"], body [class*="title-60px"], body [class*="title-64px"],
body [class*="title-66px"], body [class*="title-70px"], body [class*="title-76px"], body [class*="title-78px"],
body [class*="title-90px"], body [class*="title-94px"], body [class*="title-100px"] {
    line-height: var(--lh-tight);
    letter-spacing: normal; /* pas d'espacement négatif : il casse les liaisons de l'arabe */
    text-wrap: balance;
}