/*
 Theme Name:   Kadence Ludo
 Theme URI:    https://ludotheque-gruyere.ch
 Description:  Theme enfant Kadence pour la Ludotheque de la Gruyere
 Author:       Ludotheque de la Gruyere
 Template:     kadence
 Version:      1.0.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  kadence-ludo
*/

/* ==========================================================================
   Variables CSS - Palette Ludotheque
   ========================================================================== */

:root {
    /* ----------------------------------------------------------------------
       Couleurs principales — alias sémantiques pilotés par Kadence Customizer
       (Apparence → Personnaliser → Couleurs). Fallback hex si Kadence absent.
       ---------------------------------------------------------------------- */
    --ludo-primary:        var(--global-palette1, #e36c1d);  /* Accentuation */
    --ludo-primary-light:  var(--global-palette3, #f59a4a);  /* Accent - complement */
    --ludo-accent:         var(--global-palette2, #e5007d);  /* Accentuation - alt */
    --ludo-secondary:      var(--global-palette2, #C41E68);  /* alias accent */
    --ludo-magenta:        var(--global-palette2, #C41E68);  /* alias accent */
    --ludo-peach:          #f7ceac;                          /* couleur fixe (pas dans la palette Kadence) */

    /* Textes — palettes Kadence Contrast */
    --ludo-text-strong:    var(--global-palette4, #1a1a2e);  /* Texte le plus fort (titres) */
    --ludo-text-dark:      var(--global-palette5, #374151);  /* Strong text */
    --ludo-text:           var(--global-palette6, #6b7280);  /* Texte moyen */
    --ludo-text-subtle:    var(--global-palette7, #9ca3af);  /* Subtle text */
    --ludo-white:          var(--global-palette9, #ffffff);

    /* ----------------------------------------------------------------------
       Fonds
       ---------------------------------------------------------------------- */
    --light-bg:            var(--global-palette8, #faf9f7);  /* Subtle background */
    --ludo-bg:             #FFF9F5;                           /* fond peach très clair (custom) */
    --light-card:          var(--global-palette9, #ffffff);
    --light-card-hover:    #f5f5f4;
    --light-border:        rgba(0, 0, 0, 0.08);

    /* ----------------------------------------------------------------------
       Échelle typographique fluide (clamp responsive)
       Valeurs bumpées vs initial pour meilleure lisibilité globale.
       Les shortcodes (status, rentals, games-preview) overrident ces valeurs
       en interne pour conserver des tailles compactes adaptées à leur design.
       ---------------------------------------------------------------------- */
    --ludo-font-xs:      clamp(12px, calc(11px + 0.15vw), 13px);    /* Labels, codes, fine print */
    --ludo-font-sm:      clamp(13px, calc(12px + 0.2vw), 15px);     /* Meta, tableaux, badges */
    --ludo-font-base:    clamp(15px, calc(14px + 0.15vw), 16px);    /* Body, inputs, contact items */
    --ludo-font-md:      clamp(16px, calc(15px + 0.2vw), 18px);     /* Paragraphes, contact values */
    --ludo-font-lg:      clamp(18px, calc(16px + 0.3vw), 22px);      /* h3 cards, hero desc */
    --ludo-font-xl:      clamp(20px, calc(18.4px + 0.3vw), 24px);    /* Featured h3, gros badges */
    --ludo-font-title:   clamp(2.5rem, 5vw, 4rem);                   /* H1 de page (= prod Divi : 40-64px) */
    --ludo-font-display: clamp(2rem, 4vw, 3rem);                     /* Titres de section h2 (= prod : 32-48px) */
    /* Note : hero h1 et marquee numbers restent en clamp custom (cas uniques) */

    /* ----------------------------------------------------------------------
       Couleurs fonctionnelles (fixes — séparées de la palette brand)
       ---------------------------------------------------------------------- */
    --ludo-success: #10b981;
    --ludo-warning: #f59e0b;
    --ludo-error:   #ef4444;
    --ludo-info:    #3B82F6;

    /* Espacements */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --spacing-2xl: 5rem;

    /* Border radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);

    /* Transitions */
    --transition-fast: 150ms ease;
    --transition-base: 300ms ease;
    --transition-slow: 350ms ease;
}

/* Fond du site */
body {
    background-color: var(--light-bg, #faf9f7);

    /* Lissage des polices (equivalent Divi, affine le rendu) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}