/*
 * Tokens : variables globales
 * Variables :root, typographies, couleurs, dimensions et ombres.
 * Author: EcareWeb
 * 2026
 */

:root {

    /* Typographie globale */
    --font-main: Arial, sans-serif;
    --font-bison: 'Bison', Arial, sans-serif;

    /* Tailles de texte */
    --fs-title-xl: 48px;
    --fs-title-lg: 30px;
    --fs-title-md: 24px;
    --fs-text-20: 20px;
    --fs-text-md: 18px;
    --fs-pill: 18px;
    --fs-btn: 18px;

    /* Typo bison */
    --fs-title-bison: 28px;
    --fs-title-bison-50px: 50px;
    --color-title-bison: #1b5e20;
    --color-title-bison-bg: #e8f3df;
    --ls-title-bison: 1px;

    /* Footer */
    --fs-footer: 14px;
    --fs-footer-title: 22px;

    /* Poids */
    --fw-bold: 700;
    --fw-normal: 400;

    /* Line-height */
    --lh-tight: 1.2;
    --lh-normal: 1.5;

    /* Couleurs */
    --color-white: #ffffff;
    --color-black: #000000;
    --color-green: #217e00;
    --color-orange: #F48830;
    --color-brown: #483c32;

    /* CTA / badges / boutons */
    --color-badge-new-bg: #f2b544;
    --color-badge-new-text: #1f160c;

    --color-btn-cta-bg: transparent;
    --color-btn-cta-bg-hover: #8b6b4f;
    --color-btn-cta-text-hover: #f2b544;
    --font-btn-hover: Arial, sans-serif;
    --color-btn-cta-text: #ffffff;
    --color-btn-cta-border: rgba(255, 255, 255, 0.75);

    --color-home-toggle-bg: #c7ffca;
    --color-home-toggle-text: #000;

    --color-home-btn-primary-bg: #ffea00;
    --color-home-btn-primary-bg-hover: #fff;
    --color-home-btn-primary-text: #000;

    --color-home-btn-outline-bg: rgba(0, 0, 0, 0.18);
    --color-home-btn-outline-bg-hover: rgba(0, 0, 0, 0.32);
    --color-home-btn-outline-text: #ffffff;
    --color-home-btn-outline-border: rgba(255, 255, 255, 0.95);

    /* Bouton secondaire home */
    --color-home-btn-second-bg: #483c32;
    --color-home-btn-second-bg-hover: #8a6e57;
    --color-home-btn-second-text: #fff;

    --home-btn-second-padding-y: 17px;
    --home-btn-second-padding-x: 40px;
    --home-btn-second-min-width: auto;

    /* Paddings / largeurs home */
    --pill-padding-y: 15px;
    --pill-padding-x: 20px;

    --home-toggle-padding-y: 15px;
    --home-toggle-padding-x: 20px;
    --home-toggle-min-width: 0;
    --home-toggle-max-width: auto;

    --home-btn-primary-padding-y: 17px;
    --home-btn-primary-padding-x: 40px;
    --home-btn-primary-min-width: auto;

    --home-btn-outline-padding-y: 15px;
    --home-btn-outline-padding-x: 35px;
    --home-btn-outline-min-width: auto;
    --home-btn-outline-gap-x: 10px;

    --btn-cta-padding-y: 17px;
    --btn-cta-padding-x: 40px;
    --btn-cta-min-width: auto;

    /* Radius / ombres / fx */
    --radius-pill: 50px;

    --shadow-text: 2px 2px 4px rgba(0, 0, 0, 0.8);
    --shadow-soft: 0 6px 18px rgba(0, 0, 0, 0.22);
    --shadow-soft-hover: 0 10px 24px rgba(0, 0, 0, 0.28);
    --shadow-btn-readable: 0 8px 22px rgba(0, 0, 0, 0.38);
    --shadow-title-glow: 0 0 14px rgba(255, 255, 255, 0.55), 0 0 28px rgba(255, 255, 255, 0.28);
    --shadow-card-soft: 0 14px 34px rgba(0, 0, 0, 0.06);

    --transition-main: all 0.25s ease;

    /* Tailles icônes */
    --img-icon-xs: 80px;
    --img-icon-sm: 150px;
    --img-icon-md: 220px;
    --img-icon-lg: 320px;

    /* Composant cartes info */
    --info-box-max-width: 1180px;
    --info-box-padding-desktop: 15px 40px;
    --info-box-padding-tablet: 28px 26px;
    --info-box-padding-mobile: 22px 18px;
    --info-box-radius-desktop: 18px;
    --info-box-radius-tablet: 16px;
    --info-box-radius-mobile: 14px;
    --info-box-border-color: #e8e3dc;
    --info-box-border-width: 8px;
    --info-box-border-width-mobile: 6px;
    --info-box-title-size-desktop: 26px;
    --info-box-title-size-tablet: 24px;
    --info-box-title-size-mobile: 22px;
    --info-box-text-size-desktop: 16px;
    --info-box-text-size-tablet: 18px;
    --info-box-text-size-mobile: 16px;
    --info-box-text-color: #1f1f1f;
    --info-box-green: #2f8f0f;
    --info-box-orange: #F48830;

    /* Checkout — espacement interne carte commande */
    --checkout-order-card-padding-y: 28px;
    --checkout-order-card-padding-x: 32px;
    --checkout-order-card-padding-mobile-y: 20px;
    --checkout-order-card-padding-mobile-x: 18px;
}