:root {
    /* ================================================================
       TOUT L'IMMOBILIER LANDES - Design System
       Palette : Bleu ocean (primary), Orange (focus), Vert (success)
       Reprise de la charte de l'ancien site : #00A1DB / #F59A00 / #3AAA35
       Format : OKLch - fallback hex en commentaire
       ================================================================ */

    /* --- Primary : Bleu ocean --- */
    --primary-2x-light: oklch(96.31% 0.019 222);   /* #E6F6FC */
    --primary-x-light:  oklch(88.81% 0.055 223);   /* #B3E3F5 */
    --primary-light:    oklch(78.40% 0.104 224);   /* #66C7EA */
    --primary-main:     oklch(66.72% 0.138 233);   /* #00A1DB */
    --primary-dark:     oklch(57.40% 0.119 233);   /* #0083B3 */
    --primary-x-dark:   oklch(47.63% 0.098 232);   /* #00658A */
    --primary-2x-dark:  oklch(38.21% 0.075 228);   /* #004A62 */

    /* --- Focus : Orange (h2, chiffres cles, CTA secondaires) --- */
    --focus-2x-light: oklch(96.77% 0.028 81);      /* #FEF3E0 */
    --focus-x-light:  oklch(91.88% 0.066 79);      /* #FCE0B3 */
    --focus-light:    oklch(84.66% 0.127 78);      /* #FAC266 */
    --focus-main:     oklch(76.14% 0.167 68);      /* #F59A00 */
    --focus-dark:     oklch(64.70% 0.141 70);      /* #C47C00 */
    --focus-x-dark:   oklch(52.55% 0.113 71);      /* #935D00 */
    --focus-2x-dark:  oklch(39.64% 0.085 73);      /* #623E00 */

    /* --- Degrade du bandeau conseils de la home, repris tel quel de l'ancien
           site (`--color-main-yellow` / `--color-main-green`) : ces deux teintes
           n'existent nulle part ailleurs dans la charte. --- */
    --gradient-jaune: #FFED00;
    --gradient-vert:  #95C11F;

    /* --- Success : Vert (rubrique location, bouton telephone) --- */
    --success-light: oklch(79.04% 0.122 143);      /* #8ACF87 */
    --success-main:  oklch(65.09% 0.185 143);      /* #3AAA35 */
    --success-dark:  oklch(55.33% 0.156 143);      /* #2E882A */

    /* --- Secondary : le meme vert que --success-*, decline pour le gabarit de
           fiche d'annonce (intertitres Exterieur / Interieur, bandeau Points
           d'interets, bouton des diagnostics). Les 3 autres sites du framework
           ont une palette --secondary-* ; celle-ci evite de reecrire leur CSS.
           Les 3 nuances centrales pointent sur --success-* : une seule source
           de verite pour le vert de la charte. --- */
    --secondary-2x-light: oklch(96.80% 0.030 143); /* #E9FAE8 */
    --secondary-x-light:  oklch(93.00% 0.055 143); /* #D3F2D1 */
    --secondary-light:    var(--success-light);    /* #8ACF87 */
    --secondary-main:     var(--success-main);     /* #3AAA35 */
    --secondary-dark:     var(--success-dark);     /* #2E882A */
    --secondary-x-dark:   oklch(45.50% 0.126 143); /* #216720 */
    --secondary-2x-dark:  oklch(35.80% 0.098 143); /* #164915 */

    /* --- Neutral --- */
    --neutral-2x-light: oklch(98.51% 0.000 90);    /* #FAFAFA */
    --neutral-x-light:  oklch(97.31% 0.000 90);    /* #F6F6F6 */
    --neutral-light:    oklch(89.75% 0.000 90);    /* #DDDDDD */
    --neutral-main:     oklch(80.47% 0.000 90);    /* #BFBFBF */
    --neutral-mid:      oklch(55.21% 0.000 90);    /* #727272 */
    --neutral-dark:     oklch(46.14% 0.007 240);   /* #55595C */
    --neutral-x-dark:   oklch(35.33% 0.001 17);    /* #3C3B3B */
    --neutral-2x-dark:  oklch(25.20% 0.000 90);    /* #222222 */
    --neutral-black:    #000;

    /* --- Fonds de zones structurelles --- */
    --bg-body:          #FFF;
    --bg-footer:        oklch(97.31% 0.000 90);    /* #F6F6F6 - zone claire du footer */
    --bg-footer-bottom: #000;                      /* barre legale, comme l'ancien site */

    /* --- Font Family --- */
    --ff-body:     'Lato', system-ui, Arial, 'Helvetica Neue', Helvetica, sans-serif;
    --ff-headline: 'Lato', system-ui, Arial, 'Helvetica Neue', Helvetica, sans-serif;

    /* --- Font Weight (Lato : 300 light / 400 regular / 700 bold / 900 black) --- */
    --fw-light:  300;
    --fw-normal: 400;
    --fw-bold:   700;
    --fw-black:  900;

    /* --- Spacing fluide (complete Bootstrap 1-5) --- */
    --space-1: 0.25rem;                    /* 4px   - equivalent Bootstrap *-1 */
    --space-2: 0.5rem;                     /* 8px   - equivalent Bootstrap *-2 */
    --space-3: 1rem;                       /* 16px  - equivalent Bootstrap *-3 */
    --space-4: clamp(1.5rem, 2vw, 2rem);   /* 24px → 32px - base Bootstrap *-4 */
    --space-5: clamp(2rem, 3vw, 3rem);     /* 32px → 48px - equivalent Bootstrap *-5 */
    --space-6: clamp(4rem, 5vw, 5rem);     /* 64px → 80px */
    --space-7: clamp(5rem, 7vw, 7rem);     /* 80px → 112px */
    --space-8: clamp(6rem, 10vw, 10rem);   /* 96px → 160px */

    /* --- Radius --- */
    --radius-xs: .25rem;
    --radius-sm: .4rem;
    --radius-md: .6rem;
    --radius-lg: 3rem;
    --radius-xl: 50%;

    /* --- Shadows --- */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.10);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-xl: 0 8px 30px rgba(0, 0, 0, 0.20);

    /* --- Hero : decoupe diagonale reprise de l'ancien site --- */
    --hero-slice-height: 70px;
    --hero-slice-angle: -2deg;

    /* --- Filters svg (icones sources en #000, recolorees par filtre) --- */
    --fill-svg-primary-main:   invert(54%) sepia(58%) saturate(4374%) hue-rotate(164deg) brightness(94%) contrast(104%);
    --fill-svg-primary-dark:   invert(33%) sepia(96%) saturate(724%) hue-rotate(158deg) brightness(100%) contrast(107%);
    --fill-svg-primary-x-dark: invert(15%) sepia(94%) saturate(3615%) hue-rotate(182deg) brightness(98%) contrast(102%);
    --fill-svg-primary-light:  invert(69%) sepia(49%) saturate(422%) hue-rotate(153deg) brightness(96%) contrast(91%);

    --fill-svg-focus-main: invert(55%) sepia(80%) saturate(1000%) hue-rotate(4deg) brightness(99%) contrast(103%);
    --fill-svg-focus-dark: invert(47%) sepia(27%) saturate(3822%) hue-rotate(19deg) brightness(96%) contrast(102%);

    --fill-svg-success-main: invert(58%) sepia(10%) saturate(3172%) hue-rotate(69deg) brightness(92%) contrast(85%);

    --fill-svg-neutral-2x-dark: invert(6%) sepia(6%) saturate(11%) hue-rotate(314deg) brightness(91%) contrast(82%);
    --fill-svg-neutral-dark:    invert(35%) sepia(5%) saturate(438%) hue-rotate(163deg) brightness(91%) contrast(84%);
    --fill-svg-neutral-mid:     invert(45%) sepia(0%) saturate(1260%) hue-rotate(213deg) brightness(97%) contrast(86%);
    --fill-svg-white:           invert(100%) sepia(100%) saturate(1%) hue-rotate(39deg) brightness(106%) contrast(101%);
    --fill-svg-red:             invert(23%) sepia(77%) saturate(5985%) hue-rotate(353deg) brightness(99%) contrast(79%);

    /* --- Transitions --- */
    --transition-fast:   0.15s ease;
    --transition-base:   0.2s ease;
    --transition-medium: 0.3s ease;
    --transition-slow:   0.5s ease;

    /* --- Modal overlay --- */
    --modal-overlay-bg: rgba(0, 0, 0, 0.6);

    /* --- Z INDEX --- */
    --zindex-header: 1021;
    --zindex-topBar: 1022;
    --zindex-hero: 1010;
    --zindex-floating-contact: 1015;
    --zindex-invisibleLink: 102;
    --zindex-favori: 102;
    --zindex-modal-backdrop: 1022;
    --zindex-modal-content: 1051;
    --zindex-logo-mobile: 1020;
}

/* ================================================================
   OVERRIDE BOOTSTRAP
   ================================================================ */
:root {
    --bs-link-color-rgb: 0, 161, 219;         /* #00A1DB primary-main */
    --bs-link-hover-color-rgb: 0, 131, 179;   /* #0083B3 primary-dark */
    --bs-body-font-family: var(--ff-body);
    --bs-body-font-size: 1.125rem;            /* 18px, comme l'ancien site */
    --bs-body-font-weight: 300;
    --bs-body-line-height: 1.6;
    --bs-body-color: #000;
    --bs-body-bg: var(--bg-body);
    --bs-border-color: var(--neutral-light);
}

.nav {
    --bs-nav-link-hover-color: var(--primary-dark);
}

.offcanvas {
    --bs-offcanvas-width: calc(100% - 25px) !important;
}
