/**
 * @file
 * Variables CSS pour le thème Travila avec la palette Soaland
 * Basé sur le guide de style THEME_STYLE_GUIDE.md
 */

:root {
  /* === PALETTE SOALAND === */
  
  /* Couleurs principales */
  --color-primary-brown: #3d210a;
  --color-primary-green: #5ba510;
  
  /* Déclinaisons / Secondaires */
  --color-brown-light: #7a4a24;
  --color-green-light: #8fd242;
  --color-beige-sand: #f5f0e6;
  --color-beige-sand-2: #E0D0B3;
  --color-beige-sand-3: #CBB07F;
  --color-beige-sand-4: #AB8031;
  --color-beige-sand-5: #d2a8a3;
  --color-beige-sand-6: #e7c7c8;
  --color-beige-sand-7: #dfd1cc;
  --color-beige-sand-8: #fbe4d7;
  
  /* Couleurs d'accent */
  --color-gold: #cfa75e;
  --color-orange-earth: #e07a3f;
  
  /* Neutres (Texte et Structure) */
  --color-white-cream: #faf9f6;
  --color-gray-light: #e5e5e5;
  --color-gray-dark: #463f3a;
  --color-black-soft: #111111;
  
  /* === VARIABLES BOOTSTRAP COMPATIBLES === */
  
  /* Variables principales remappées pour Travila */
  --bs-primary: var(--color-primary-brown);
  --bs-secondary: var(--color-brown-light);
  --bs-success: var(--color-primary-green);
  --bs-info: var(--color-gold);
  --bs-warning: var(--color-orange-earth);
  --bs-danger: #dc3545;
  --bs-light: var(--color-gray-light);
  --bs-dark: var(--color-gray-dark);
  
  /* Corps et arrière-plans */
  --bs-body-bg: var(--color-white-cream);
  --bs-body-color: var(--color-gray-dark);
  --bs-body-font-family: "Manrope", sans-serif;
  
  /* Bordures */
  --bs-border-color: var(--color-gray-light);
  --bs-border-radius: 8px;
  --bs-border-radius-sm: 4px;
  --bs-border-radius-lg: 12px;
  
  /* Couleurs de lien */
  --bs-link-color: var(--color-primary-green);
  --bs-link-hover-color: var(--color-green-light);
  
  /* === VARIABLES TRAVILA SPÉCIFIQUES === */
  
  /* Header et Navigation */
  --travila-header-bg: var(--color-primary-brown);
  --travila-header-text: var(--color-white-cream);
  --travila-topbar-bg: var(--color-primary-brown);
  
  /* Boutons */
  --travila-btn-primary-bg: var(--color-primary-green);
  --travila-btn-primary-hover: var(--color-green-light);
  --travila-btn-secondary-bg: var(--color-brown-light);
  --travila-btn-secondary-hover: var(--color-orange-earth);
  
  /* Cartes et sections */
  --travila-card-bg: var(--color-white-cream);
  --travila-section-alt-bg: var(--color-beige-sand);
  
  /* États interactifs */
  --travila-hover-opacity: 0.9;
  --travila-focus-color: var(--color-gold);
  --travila-focus-width: 2px;
  
  /* Ombres */
  --travila-shadow-light: 0 2px 4px rgba(0, 0, 0, 0.1);
  --travila-shadow-medium: 0 4px 8px rgba(0, 0, 0, 0.15);
  --travila-shadow-heavy: 0 8px 16px rgba(0, 0, 0, 0.2);
  
  /* Espacement (multiples de 8px) */
  --travila-spacing-xs: 8px;
  --travila-spacing-sm: 16px;
  --travila-spacing-md: 24px;
  --travila-spacing-lg: 32px;
  --travila-spacing-xl: 48px;
  
  /* Typographie */
  --travila-font-family: "Manrope", sans-serif;
  --travila-title-color: var(--color-black-soft);
  --travila-text-color: var(--color-gray-dark);
  --travila-text-on-dark: var(--color-white-cream);
  
  /* === NEUTRALS POUR COMPATIBILITÉ === */
  --bs-neutral-0: var(--color-white-cream);
  --bs-neutral-100: var(--color-gray-light);
  --bs-neutral-500: var(--color-gray-dark);
  --bs-neutral-1000: var(--color-black-soft);
}

/* === CLASSES UTILITAIRES === */

/* Couleurs de fond */
.bg-primary-brown { background-color: var(--color-primary-brown) !important; }
.bg-primary-green { background-color: var(--color-primary-green) !important; }
.bg-brown-light { background-color: var(--color-brown-light) !important; }
.bg-green-light { background-color: var(--color-green-light) !important; }
.bg-beige-sand { background-color: var(--color-beige-sand) !important; }
.bg-gold { background-color: var(--color-gold) !important; }
.bg-orange-earth { background-color: var(--color-orange-earth) !important; }

/* Couleurs de texte */
.text-primary-brown { color: var(--color-primary-brown) !important; }
.text-primary-green { color: var(--color-primary-green) !important; }
.text-brown-light { color: var(--color-brown-light) !important; }
.text-green-light { color: var(--color-green-light) !important; }
.text-gold { color: var(--color-gold) !important; }
.text-orange-earth { color: var(--color-orange-earth) !important; }
.text-on-dark { color: var(--color-white-cream) !important; }

/* Couleurs de bordure */
.border-primary-brown { border-color: var(--color-primary-brown) !important; }
.border-primary-green { border-color: var(--color-primary-green) !important; }
.border-gold { border-color: var(--color-gold) !important; }