/* Importation des polices */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* Variables CSS */
:root {
    /* Couleurs principales */
    --primary-dark: #0C2D48;
    --primary-dark-trans: rgba(12, 45, 72, 0.8);
    --primary-medium: #145DA0;
    --primary-light: #2980b9;
    --deep-black: #0A0A0A;
    --light-gray: #DCE1E3;
    --text-white: #FFFFFF;

    /* Accents et états */
    --accent-blue: #0476F2;
    --accent-light: #2588F5;
    --warning: #f39c12;
    --danger: #e74c3c;
    --info: #3498db;
    
    /* Valeurs RGB pour les opérations de transparence */
    --primary-dark-rgb: 12, 45, 72;
    --primary-medium-rgb: 20, 93, 160;
    --accent-blue-rgb: 4, 118, 242;

    /* Couleurs RP */
    --roleplay-primary: #0476F2;
    --roleplay-secondary: #2588F5;
    --roleplay-accent: #4A9CF7;
    --roleplay-light: #6FB0FA;
    --roleplay-glow: rgba(4, 118, 242, 0.6);
    --roleplay-transparent: rgba(11, 20, 85, 0.15);
    --roleplay-hover: rgba(11, 20, 85, 0.2);
    --roleplay-primary-rgb: 4, 118, 242;

    /* Couleurs HRP */
    --hrp-primary: #015f40;
    --hrp-secondary: #01734d;
    --hrp-accent: #01885a;
    --hrp-light: #01a067;
    --hrp-glow: rgba(1, 95, 64, 0.6);
    --hrp-hover: rgba(1, 95, 64, 0.2);
    --hrp-primary-rgb: 1, 95, 64;

    /* Couleurs Important */
    --important-primary: #BB070E;
    --important-light: #FAE2E3;
    --important-dark: #7F0509;
    --important-accent: #E00B1B;
    --important-glow: rgba(187, 7, 14, 0.6);
    --important-hover: rgba(187, 7, 14, 0.2);
    --important-primary-rgb: 187, 7, 14;

    /* Couleurs Assistant IA - Tons harmonieux avec le forum */
    --ai-primary: #6366f1;               /* Indigo principal */
    --ai-secondary: #8b5cf6;             /* Violet secondaire */
    --ai-accent: #a855f7;                /* Violet accent */
    --ai-dark: #312e81;                  /* Indigo sombre */
    --ai-light: #c4b5fd;                 /* Violet clair */
    --ai-neural: #7c3aed;                /* Violet neural */
    --ai-energy: #6d28d9;                /* Violet énergétique */
    --ai-glow-color: #8b5cf6;            /* Couleur de lueur */
    --ai-subtle: #e0e7ff;                /* Indigo très clair */

    /* Variantes RGB pour transparences */
    --ai-primary-rgb: 99, 102, 241;
    --ai-secondary-rgb: 139, 92, 246;
    --ai-accent-rgb: 168, 85, 247;
    --ai-dark-rgb: 49, 46, 129;
    --ai-neural-rgb: 124, 58, 237;

    /* Effets lumineux IA */
    --ai-glow-primary: rgba(99, 102, 241, 0.6);
    --ai-glow-secondary: rgba(139, 92, 246, 0.5);
    --ai-glow-accent: rgba(168, 85, 247, 0.4);
    --ai-glow-neural: rgba(124, 58, 237, 0.3);

    /* Transparences IA */
    --ai-trans-primary: rgba(99, 102, 241, 0.15);
    --ai-trans-secondary: rgba(139, 92, 246, 0.12);
    --ai-trans-accent: rgba(168, 85, 247, 0.1);
    --ai-trans-dark: rgba(49, 46, 129, 0.8);

    /* Hovers IA */
    --ai-hover-primary: rgba(99, 102, 241, 0.25);
    --ai-hover-secondary: rgba(139, 92, 246, 0.2);
    --ai-hover-accent: rgba(168, 85, 247, 0.18);

    /* Gradients IA */
    --ai-gradient-main: linear-gradient(135deg, var(--ai-primary), var(--ai-secondary));
    --ai-gradient-accent: linear-gradient(135deg, var(--ai-accent), var(--ai-neural));
    --ai-gradient-dark: linear-gradient(135deg, var(--ai-dark), var(--deep-black));
    --ai-gradient-subtle: linear-gradient(135deg, var(--ai-light), var(--ai-subtle));

    /* Effets de lueur */
    --glow-blue: rgba(20, 93, 160, 0.6);
    --glow-green: rgba(0, 168, 107, 0.6);

    /* Polices */
    --font-main: 'Inter', sans-serif;
    --font-title: 'Bebas Neue', sans-serif;
    --font-special: 'Bebas Neue', sans-serif;
    --font-mono: 'Roboto Mono', monospace;

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

    /* Rayons de bordure */
    --border-radius-sm: 0.25rem;
    --border-radius-md: 0.5rem;
    --border-radius-lg: 1rem;
    --border-radius-xl: 2rem;
    --border-radius-circle: 50%;

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* Z-index */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal: 1040;
    --z-popover: 1050;
    --z-tooltip: 1060;

    /* Breakpoints */
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;

    /* Ombres */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 5px 15px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 15px 45px rgba(0, 0, 0, 0.4);

    /* Opacités */
    --opacity-light: 0.8;
    --opacity-medium: 0.5;
    --opacity-dim: 0.3;

    /* Largeurs de bordure */
    --border-width-sm: 1px;
    --border-width-md: 2px;
    --border-width-lg: 3px;

    /* Variables composées */
    --header-height: 72px;
    --sidebar-width: 250px;
    --sidebar-compact-width: 70px;
    --card-padding: var(--spacing-lg);
    --section-margin: var(--spacing-xxl);
    
    /* Arrière-plans translucides */
    --bg-dark-trans: rgba(10, 10, 10, 0.8);
    --bg-primary-trans: rgba(12, 45, 72, 0.7);
}