/* ============================================================
   MAFORGEX POS — jetons de design  ("Forêt")

   Refonte du 21/09/2026, dérivée des maquettes de _docs/new_design/.
   Elle REMPLACE la palette « Blueberry Jam » (bleu acier #23679E) et la
   géométrie « tout en pilule » du kit Elegent.

   Marque — vert forêt, échantillonné au pixel sur les maquettes :
       bandeau #1D512B · remplissage de bouton #205C31 · onglet actif #245932
   La rampe ci-dessous est dérivée de ces trois valeurs. Comme la précédente,
   c'est une rampe monochrome : elle ne porte ni neutres ni sémantiques, qui
   sont dérivés autour d'elle.

   GÉOMÉTRIE — changement majeur : les maquettes ne sont PAS en pilule.
   Boutons, champs et selects passent à 8px. --q-r-pill garde son nom (13
   usages en aval) mais vaut désormais 8px ; --q-r-round le remplace là où
   un rond est réellement voulu (piste d'interrupteur, ascenseur).

   Deux rôles restent séparés, c'est la règle la plus souvent ratée :
     --q-primary      LE REMPLISSAGE. Identique dans les deux thèmes, pour que
                      les libellés restent blancs (#1A5C31 → blanc 8,02:1).
     --q-primary-ink  LA MÊME MARQUE EN TEXTE sur une surface (liens, boutons
                      fantômes, libellé de nav actif). #14532D donne 9,11:1 sur
                      blanc mais seulement 1,4:1 sur la carte sombre : le mode
                      sombre le relève à #6EE7A5 (11,06:1).
                      N'écrivez JAMAIS color: var(--q-primary).

   Tous les appariements ci-dessous ont été vérifiés : texte >= 4,5:1,
   UI non textuelle >= 3:1, dans les DEUX thèmes. Ratios en commentaire.
   ============================================================ */

/* ---------- IBM Plex Sans (self-hosted — POS terminals run offline) ---------- */

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-400.woff2") format("woff2");
    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: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-ext-400.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-500.woff2") format("woff2");
    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: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-ext-500.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-700.woff2") format("woff2");
    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: "IBM Plex Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-ext-700.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-400-italic.woff2") format("woff2");
    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: "IBM Plex Sans";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-ext-400-italic.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ============================================================
   LIGHT PALETTE
   ============================================================ */


/* ---------------------------------------------------------------------------
   IBM Plex Sans Arabic — auto-hébergée (pas de Google Fonts : les terminaux
   de caisse sont souvent hors ligne, cf. CLAUDE.md).

   Déclarée sous LA MÊME famille « IBM Plex Sans » que la version latine, avec
   un unicode-range limité aux blocs arabes. Le navigateur choisit donc seul
   la bonne fonte selon le caractère : aucun changement de --q-font n'est
   nécessaire et les contenus mixtes (prix, SKU, codes-barres) restent
   cohérents dans les deux langues.
   --------------------------------------------------------------------------- */

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-400.woff2") format("woff2");
    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 Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-500.woff2") format("woff2");
    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 Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-700.woff2") format("woff2");
    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 {
    /* ---- marque (identique dans les deux thèmes) ---- */
    --q-primary: #1A5C31;
    /* REMPLISSAGE — blanc dessus : 8,02:1 */
    --q-primary-ink: #14532D;
    /* la marque en TEXTE — 9,11:1 sur blanc, 8,57:1 sur le fond de page */
    --q-secondary: #166534;
    --q-tertiary: #3E8C57;
    --q-primary-grad: linear-gradient(135deg, #246B3B 0%, #14532D 100%);

    /* ---- rampe : survols, teintes douces, séries de graphique ---- */
    --q-primary-1: #14532D;
    --q-primary-2: #1A5C31;
    --q-primary-3: #246B3B;
    --q-primary-4: #3E8C57;
    --q-primary-5: #7DC095;
    --q-primary-6: #DCF3E2;

    /* ---- typographie ---- */
    --q-text: #0F172A;
    /* 17,85:1 sur la carte, 16,79:1 sur la page */
    --q-text-soft: #5A6B80;
    /* 5,46:1 sur la carte, 4,95:1 sur l'en-tête de tableau */
    --q-text-disabled: #AFBAC6;
    --q-text-inactive: #6F7F92;
    /* COMMANDES inertes (chevrons de pagination), pas du texte désactivé :
       3,72:1 sur --q-surface-2, donc le glyphe reste perceptible */
    --q-text-invert: #FFFFFF;

    /* ---- surfaces ---- */
    --q-white: #FFFFFF;
    --q-bg: #F7F5F0;
    /* page — gris neutre, échantillonné sur les maquettes */
    --q-surface: #F7F5F0;
    /* cartes, bandeau de contenu, panneaux */
    --q-surface-2: #F2F4F6;
    /* en-têtes de tableau, champs doux, boutons-icônes neutres */
    --q-surface-3: #E6EAEE;
    /* état pressé / survolé neutre */
    --q-border: #E5E9EC;

    /* ---- sémantiques ---- */
    --q-success: #166534;
    /* 7,13:1 sur blanc */
    --q-info: #246B3B;
    --q-warning: #9A3412;
    /* 7,31:1 sur blanc, 5,66:1 sur sa teinte douce */
    --q-danger: #B91C1C;
    /* Remplissage rouge sous un texte BLANC (pastille de la cloche) : identique
       dans les deux thèmes, comme --q-primary. Blanc sur #B91C1C : 6,47:1.
       (--q-danger sombre, #FB7185, ne tiendrait que 2,6:1 sous du blanc.) */
    --q-danger-fill: #B91C1C;
    /* 6,47:1 sur blanc, 5,29:1 sur sa teinte douce */

    /* Teintes douces — OPAQUES en thème clair : ce sont les fonds de badge
       relevés sur les maquettes, et un fond opaque rend le contrôle de
       contraste exact quelle que soit la ligne de tableau en dessous. */
    --q-primary-soft: #E6F2E9;
    /* fond de ligne sélectionnée */
    --q-success-soft: #DCF3E2;
    /* badge « Payée » — texte --q-success : 6,10:1 */
    --q-info-soft: #E9F1ED;
    /* tuile d'icône des rapports */
    --q-warning-soft: #FEDEAD;
    /* badge « Reste à payer » — texte --q-warning : 5,66:1 */
    --q-danger-soft: #FEE2E0;
    /* badge « Rupture de stock » — texte --q-danger : 5,29:1 */

    /* ---- rayons ---- */
    --q-r-pill: 8px;
    /* boutons, champs, selects — PLUS une pilule depuis le 21/09/2026 */
    --q-r-round: 999px;
    /* ce qui doit rester réellement rond : piste d'interrupteur, ascenseur */
    --q-r-panel: 12px;
    /* le bandeau de contenu extérieur */
    --q-r-card: 10px;
    /* cartes, panneaux, modales, menus déroulants */
    --q-r-area: 10px;
    /* zones de texte */
    --q-r-tile: 8px;
    /* tuiles d'icône des cartes statistiques */
    --q-r-nav: 6px;
    /* entrée de navigation active */
    --q-r-badge: 6px;
    /* badges de statut */
    --q-r-xs: 4px;
    /* cases à cocher */

    /* ---- métriques de coque ----
       La barre latérale a disparu le 21/09/2026 au profit d'une navigation
       horizontale. --q-sidebar-* est conservé le temps que les règles §3 du
       thème soient retirées ; --q-topbar-h désigne désormais le bandeau vert. */
    --q-shell-gap: 24px;
    --q-topbar-h: 68px;
    --q-subnav-h: 52px;
    --q-content-max: 1600px;
    --q-nav-inset: 8px;
    --q-sidebar-w: 218px;
    --q-sidebar-w-mini: 78px;

    /* ---- profondeur ----
       Les maquettes bordent les cartes au lieu de les faire flotter :
       l'ombre est quasi nulle, c'est --q-border qui dessine. */
    --q-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    --q-shadow-lift: 0 6px 16px -6px rgba(15, 23, 42, 0.14);
    --q-ring: 0 0 0 3px rgba(26, 92, 49, 0.22);

    /* ---- famille typographique ---- */
    --q-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    /* ---- échelle typographique ----
       Inchangée : les maquettes sont compatibles avec les métriques d'IBM Plex.
       ⚠ défaut D1 connu (DESIGN-BRIEF §13) : les trois woff2 latins 400/500/700
       sont identiques octet pour octet — en français, aucun gras n'est réel. */
    --q-fs-display: 40px;
    --q-fs-h1: 28px;
    --q-fs-h2: 25px;
    --q-fs-h3: 22px;
    --q-fs-title-lg: 20px;
    --q-fs-title-md: 18px;
    --q-fs-title-sm: 16px;
    --q-fs-body: 14px;
    --q-fs-body-sm: 12px;

    --q-fw-regular: 400;
    --q-fw-medium: 500;
    --q-fw-bold: 700;

    --q-lh-heading: 1.3;
    --q-lh-title: 1.4;
    --q-lh-body: 1.55;

    /* ============================================================
       ALIAS HÉRITÉS — anciens noms remappés sur la palette ci-dessus.
       À supprimer quand plus rien ne les référence (défaut D5).
       ============================================================ */
    --q-brand-1: var(--q-primary);
    --q-brand-2: var(--q-primary);
    --q-brand-grad: var(--q-primary-grad);

    --q-indigo: var(--q-tertiary);
    --q-indigo-soft: var(--q-info-soft);
    --q-coral: var(--q-danger);
    --q-coral-soft: var(--q-danger-soft);
    --q-teal: var(--q-secondary);
    --q-teal-soft: var(--q-success-soft);
    --q-amber: var(--q-warning);
    --q-amber-soft: var(--q-warning-soft);

    --q-panel: var(--q-surface);
    --q-surface-solid: var(--q-surface);
    --q-text-muted: var(--q-text-soft);
    --q-border-strong: #D3D9DE;
    /* Bordure des CHAMPS (input, select, recherche) : un champ blanc sur une
       carte blanche n'est délimité que par elle, il faut donc >= 3:1 (WCAG
       1.4.11). #868F99 : 3,28:1 sur la carte, 3,08:1 sur le fond de page.
       --q-border (#E5E9EC, 1,22:1) reste pour les filets décoratifs. */
    --q-field-border: #868F99;

    --q-sidebar: var(--q-primary-1);
    --q-sidebar-2: var(--q-primary-2);
    --q-sidebar-text: rgba(255, 255, 255, 0.82);
    --q-sidebar-text-active: var(--q-text-invert);

    --q-r-xl: var(--q-r-panel);
    --q-r-lg: var(--q-r-card);
    --q-r-md: var(--q-r-tile);
    --q-r-sm: var(--q-r-nav);
    /* défaut D4 : maforgex-pos-rtl.css appelait --q-radius-sm, inexistant */
    --q-radius-sm: var(--q-r-nav);
}

/* ============================================================
   PALETTE SOMBRE
   La profondeur vient du décrochage de surfaces (#0A140F page contre
   #16271D carte = 1,20, mieux que les 1,13 de l'ancienne palette bleue),
   PAS de l'ombre : une carte sombre n'en projette aucune.
   ============================================================ */

[data-theme="dark"] {
    --q-primary-ink: #6EE7A5;
    /* relevée : #14532D ne donne que 1,4:1 sur la carte sombre — ici 10,16:1 */

    --q-text: #E8F0EA;
    /* 13,47:1 sur la carte */
    --q-text-soft: #9FB3A8;
    /* 7,07:1 sur la carte */
    --q-text-disabled: #61756A;
    --q-text-inactive: #7E9488;
    /* 4,54:1 sur --q-surface-2 sombre */

    --q-bg: #0A140F;
    --q-surface: #16271D;
    --q-surface-2: #1E3326;
    --q-surface-3: #294435;
    --q-border: #2A4433;

    --q-secondary: #6EE7A5;
    --q-tertiary: #7DC095;
    --q-success: #6EE7A5;
    --q-info: #7DC095;
    --q-warning: #FBBF24;
    /* 10,2:1 sur la carte */
    --q-danger: #FB7185;
    /* 6,33:1 sur la carte */

    /* En sombre les teintes redeviennent translucides : elles doivent se poser
       sur la carte ET sur la ligne de tableau survolée sans trancher. */
    --q-primary-soft: rgba(110, 231, 165, 0.14);
    --q-success-soft: rgba(110, 231, 165, 0.16);
    --q-info-soft: rgba(125, 192, 149, 0.16);
    --q-warning-soft: rgba(251, 191, 36, 0.16);
    --q-danger-soft: rgba(251, 113, 133, 0.16);

    --q-border-strong: #365542;
    /* Champs en sombre : 3,28:1 sur la carte #16271D. */
    --q-field-border: #5A7A65;
    --q-sidebar: #0F1D15;
    --q-sidebar-2: #16271D;
    --q-sidebar-text: rgba(232, 240, 234, 0.82);

    --q-shadow: none;
    --q-shadow-lift: 0 12px 28px -10px rgba(0, 0, 0, 0.6);
    --q-ring: 0 0 0 3px rgba(110, 231, 165, 0.30);
}