/*
 * Variables CSS Centralisées - Thème Perso
 * Description: Toutes les variables CSS utilisées dans le thème
 * Version: 1.0.0
 * Auteur: Perso
 */

/* ===========================================
   VARIABLES CSS GLOBALES
   =========================================== */

:root {
    /* ===== COULEURS PRINCIPALES ===== */
    --primary-color: #ca9724;
    --primary-hover: #b8861f;
    
    /* ===== COULEURS DE BASE ===== */
    --white: #ffffff;
    --black: #000000;
    --gray-light: #f5f5f5;
    --gray-medium: #888888;
    --gray-dark: #333333;
    
    /* ===== COULEURS DE FOND ===== */
    --bg-main: #ffffff;
    --bg-light: #f9f9f9;
    --bg-section: #f8f9fa;
    
    /* ===== BORDURES ET EFFETS ===== */
    --border-color: #e0e0e0;
    --shadow-light: 0 2px 10px rgba(0, 0, 0, 0.1);
    --overlay-dark: rgba(0, 0, 0, 0.9);
    
    /* ===== TYPOGRAPHIE ===== */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    
    /* ===== ALIAS POUR COMPATIBILITÉ ===== */
    /* Texte */
    --text-color: var(--gray-dark);
    --text-light: #555555;
    --text-muted: var(--gray-medium);
    --secondary-color: #686868;
    
    /* Fond */
    --background-color: var(--bg-main);
    --background-light: var(--bg-light);
    --section-bg: var(--bg-section);
    --light-gray: var(--gray-light);
    
    /* Header */
    --header-bg: var(--bg-main);
    --header-text: var(--gray-dark);
    --header-accent: var(--primary-color);
    --header-border: rgba(202, 151, 36, 0.2);
    --header-shadow: var(--shadow-light);
    
    /* Boutons */
    --btn-signin-bg: transparent;
    --btn-signin-border: var(--primary-color);
    --btn-signin-text: var(--primary-color);
    --btn-login-bg: var(--primary-color);
    --btn-login-text: var(--white);
    
    /* Footer */
    --footer-bg: var(--black);
    --footer-text: var(--white);
    --footer-text-secondary: #cccccc;
    --footer-border: var(--gray-dark);
    --footer-hover: var(--gray-medium);
    --social-bg: var(--gray-dark);
    --social-hover: #555555;
    
    /* Autres */
    --overlay-color: var(--overlay-dark);
    --hover-text-light: #dcdcdc;
}

/* ===========================================
   VARIABLES SPÉCIFIQUES AUX PAGES
   =========================================== */

/* Variables pour la page À propos */
.page-id-about,
.about {
    --bg-page: #F5F7F9;
    --overlay-page: var(--overlay-dark);
}

/* Variables pour les mentions légales */
.mentions-legales-page {
    --bg-light-page: var(--bg-light);
    --border-page: var(--border-color);
}