/*
Theme Name: GeneratePress Child
Template: generatepress
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Zalando+Sans:ital,wght@0,200..900;1,200..900&display=swap');
/* ========================================
   VARIABLES CSS GLOBALES - SYSTÈME DE PERSONNALISATION
   ======================================== */
:root {
    /* === COULEURS PRINCIPALES === */
    --background-color: #fff;
    --font-color: #000;
    --font-color-light: #fff;
    --font-color-dark: #000;
    --font-color-dark-light: #000;
    --secondary-color: #208bfe;
    --accent-color: #208bfe;
    --text-muted: #666;
    --border-color: #e0e0e0;
    --hover-color: #f5f5f5;

    /* === COULEURS HEADER/NAVIGATION === */
    --header-bg: #fff;
    --nav-text-color: #000;
    --nav-hover-color: #208bfe;
    --nav-active-color: #208bfe;
    --nav-bg-hover: transparent;
    --nav-border-hover: #208bfe;

    /* === COULEURS FOOTER === */
    --footer-bg: #fff;
    --footer-text-color: #000;

    /* === COULEURS ARTICLES/CARDS === */
    --card-bg: #fff;
    --card-text-color: #666;
    --card-title-color: #000;
    --card-meta-color: #666;
    --card-border-color: #e0e0e0;
    --card-hover-bg: #f9f9f9;

    /* === COULEURS CATÉGORIES === */
    --category-bg: #208bfe;
    --category-text: #fff;
    --category-border: #208bfe;
    --category-hover-bg: #1a73d9;

    /* === TYPOGRAPHIE === */
    --font-family-primary: "Lato", sans-serif;
    --font-family-heading: inherit;
    --font-size-base: 18px;
    --font-size-small: 16px;
    --font-size-large: 20px;
    --font-size-h1: 3.5rem;
    --font-size-h2: 2rem;
    --font-size-h3: 1.5rem;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --line-height-base: 1.6;
    --line-height-heading: 1.2;

    /* === ESPACEMENTS === */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;
    --spacing-3xl: 4rem;

    /* === BORDURES ET RAYONS === */
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-xl: 16px;
    --border-width: 1px;
    --border-style: solid;

    /* === OMBRES === */
    --shadow-none: none;
    --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);
    --shadow-2xl: 0 25px 50px rgba(0, 0, 0, 0.25);

    /* === NAVIGATION - STYLES === */
    --nav-layout: flex; /* flex, block, inline-flex */
    --nav-gap: 2rem;
    --nav-padding: 0.5rem 0;
    --nav-font-weight: var(--font-weight-medium);
    --nav-font-size: var(--font-size-base);
    --nav-border-bottom-width: 2px;
    --nav-border-bottom-style: solid;
    --nav-transition: all 0.3s ease;

    /* === CARDS - STYLES CONFIGURABLES === */
    --card-shadow: var(--shadow-none); /* Modifiable : var(--shadow-sm), var(--shadow-md), etc. */
    --card-border: none; /* Modifiable : var(--border-width) var(--border-style) var(--card-border-color) */
    --card-border-radius: var(--border-radius-lg);
    --card-padding: var(--spacing-lg);
    --card-margin: var(--spacing-md);
    --card-transition: all 0.3s ease;
    --card-hover-transform: none; /* Modifiable : translateY(-2px), scale(1.02), etc. */
    --card-hover-shadow: var(--card-shadow); /* Peut être différent au hover */

    /* === ARTICLES - ESPACEMENT === */
    --article-padding-desktop: 20%;
    --article-padding-tablet: 0.5rem;
    --article-padding-mobile: 0.5rem;
    --article-margin-desktop: 3rem;
    --article-margin-tablet: 3rem;
    --article-margin-mobile: 1rem;

    /* === LOGO === */
    --logo-max-width-desktop: 4vw;
    --logo-max-width-mobile: 47vw;

    /* === FOOTER === */
    --footer-position: fixed; /* Modifiable : static, relative, fixed */
    --footer-font-size: 1rem;
    --footer-line-height: 1rem;
    --footer-padding: var(--spacing-md);

    /* === ANIMATIONS === */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* === BREAKPOINTS (pour référence dans les media queries) === */
    --breakpoint-mobile: 767px;
    --breakpoint-tablet: 1024px;
    --breakpoint-desktop: 1200px;
}