/* ============================================
   COULEURS POUR MOTEURS, MODES ET THÈMES
   ============================================
   Styles de couleurs distinctives pour différencier
   les moteurs de jeu, modes de jeu et thèmes
   
   Les data-attributes sont ajoutés dynamiquement 
   via JavaScript dans ui.js (renderGameModal)
   ============================================ */

/* ========================================
   MOTEURS DE JEU - Game Engines
   ======================================== */

/* Unreal Engine - Bleu électrique */
.engine-tag[data-engine*="unreal"] {
    background: rgba(0, 122, 204, 0.5) !important;
    border-color: rgba(0, 122, 204, 0.7) !important;
    box-shadow: 0 4px 16px rgba(0, 122, 204, 0.3) !important;
}

/* Unity - Gris anthracite */
.engine-tag[data-engine*="unity"] {
    background: rgba(96, 96, 96, 0.5) !important;
    border-color: rgba(96, 96, 96, 0.7) !important;
    box-shadow: 0 4px 16px rgba(96, 96, 96, 0.3) !important;
}

/* CryEngine - Bleu cyan glacé */
.engine-tag[data-engine*="cryengine"] {
    background: rgba(0, 191, 243, 0.5) !important;
    border-color: rgba(0, 191, 243, 0.7) !important;
    box-shadow: 0 4px 16px rgba(0, 191, 243, 0.3) !important;
}

/* Frostbite - Bleu glacier */
.engine-tag[data-engine*="frostbite"] {
    background: rgba(100, 181, 246, 0.5) !important;
    border-color: rgba(100, 181, 246, 0.7) !important;
    box-shadow: 0 4px 16px rgba(100, 181, 246, 0.3) !important;
}

/* Source Engine - Orange vif */
.engine-tag[data-engine*="source"] {
    background: rgba(255, 87, 34, 0.5) !important;
    border-color: rgba(255, 87, 34, 0.7) !important;
    box-shadow: 0 4px 16px rgba(255, 87, 34, 0.3) !important;
}

/* REDengine - Rouge crimson */
.engine-tag[data-engine*="redengine"] {
    background: rgba(211, 47, 47, 0.5) !important;
    border-color: rgba(211, 47, 47, 0.7) !important;
    box-shadow: 0 4px 16px rgba(211, 47, 47, 0.3) !important;
}

/* id Tech - Vert militaire */
.engine-tag[data-engine*="idtech"],
.engine-tag[data-engine*="id-tech"] {
    background: rgba(85, 139, 47, 0.5) !important;
    border-color: rgba(85, 139, 47, 0.7) !important;
    box-shadow: 0 4px 16px rgba(85, 139, 47, 0.3) !important;
}

/* Anvil - Bronze métallique */
.engine-tag[data-engine*="anvil"] {
    background: rgba(141, 110, 99, 0.5) !important;
    border-color: rgba(141, 110, 99, 0.7) !important;
    box-shadow: 0 4px 16px rgba(141, 110, 99, 0.3) !important;
}

/* Dunia - Vert jungle */
.engine-tag[data-engine*="dunia"] {
    background: rgba(56, 142, 60, 0.5) !important;
    border-color: rgba(56, 142, 60, 0.7) !important;
    box-shadow: 0 4px 16px rgba(56, 142, 60, 0.3) !important;
}

/* Decima Engine - Vert émeraude */
.engine-tag[data-engine*="decima"] {
    background: rgba(0, 150, 136, 0.5) !important;
    border-color: rgba(0, 150, 136, 0.7) !important;
    box-shadow: 0 4px 16px rgba(0, 150, 136, 0.3) !important;
}

/* Fox Engine - Orange feu */
.engine-tag[data-engine*="fox"] {
    background: rgba(255, 111, 0, 0.5) !important;
    border-color: rgba(255, 111, 0, 0.7) !important;
    box-shadow: 0 4px 16px rgba(255, 111, 0, 0.3) !important;
}

/* RAGE Engine (Rockstar) - Rouge/Orange agressif */
.engine-tag[data-engine*="rage"] {
    background: rgba(244, 67, 54, 0.5) !important;
    border-color: rgba(244, 67, 54, 0.7) !important;
    box-shadow: 0 4px 16px rgba(244, 67, 54, 0.3) !important;
}

/* Snowdrop - Bleu glace */
.engine-tag[data-engine*="snowdrop"] {
    background: rgba(129, 212, 250, 0.5) !important;
    border-color: rgba(129, 212, 250, 0.7) !important;
    box-shadow: 0 4px 16px rgba(129, 212, 250, 0.3) !important;
}

/* Godot - Bleu ciel */
.engine-tag[data-engine*="godot"] {
    background: rgba(66, 165, 245, 0.5) !important;
    border-color: rgba(66, 165, 245, 0.7) !important;
    box-shadow: 0 4px 16px rgba(66, 165, 245, 0.3) !important;
}

/* ========================================
   MODES DE JEU - Game Modes
   ======================================== */

/* Single player - Bleu profond */
.mode-tag[data-mode*="single"] {
    background: rgba(25, 118, 210, 0.5) !important;
    border-color: rgba(25, 118, 210, 0.7) !important;
    box-shadow: 0 4px 16px rgba(25, 118, 210, 0.3) !important;
}

/* Multiplayer - Rouge vif */
.mode-tag[data-mode*="multiplayer"] {
    background: rgba(229, 57, 53, 0.5) !important;
    border-color: rgba(229, 57, 53, 0.7) !important;
    box-shadow: 0 4px 16px rgba(229, 57, 53, 0.3) !important;
}

/* Co-op / Cooperative - Vert coopératif */
.mode-tag[data-mode*="co-op"],
.mode-tag[data-mode*="cooperative"] {
    background: rgba(67, 160, 71, 0.5) !important;
    border-color: rgba(67, 160, 71, 0.7) !important;
    box-shadow: 0 4px 16px rgba(67, 160, 71, 0.3) !important;
}

/* Battle Royale - Orange intense */
.mode-tag[data-mode*="battle"],
.mode-tag[data-mode*="royale"] {
    background: rgba(255, 87, 34, 0.5) !important;
    border-color: rgba(255, 87, 34, 0.7) !important;
    box-shadow: 0 4px 16px rgba(255, 87, 34, 0.3) !important;
}

/* Split screen - Violet */
.mode-tag[data-mode*="split"] {
    background: rgba(142, 36, 170, 0.5) !important;
    border-color: rgba(142, 36, 170, 0.7) !important;
    box-shadow: 0 4px 16px rgba(142, 36, 170, 0.3) !important;
}

/* Massively Multiplayer Online (MMO) - Cyan brillant */
.mode-tag[data-mode*="massively"],
.mode-tag[data-mode*="mmo"] {
    background: rgba(0, 188, 212, 0.5) !important;
    border-color: rgba(0, 188, 212, 0.7) !important;
    box-shadow: 0 4px 16px rgba(0, 188, 212, 0.3) !important;
}

/* ========================================
   THÈMES DE JEU - Game Themes
   ======================================== */

/* Fantasy - Violet mystique */
.theme-tag[data-theme*="fantasy"] {
    background: rgba(142, 36, 170, 0.5) !important;
    border-color: rgba(142, 36, 170, 0.7) !important;
    box-shadow: 0 4px 16px rgba(142, 36, 170, 0.3) !important;
}

/* Science fiction - Bleu électrique */
.theme-tag[data-theme*="science"],
.theme-tag[data-theme*="sci-fi"] {
    background: rgba(33, 150, 243, 0.5) !important;
    border-color: rgba(33, 150, 243, 0.7) !important;
    box-shadow: 0 4px 16px rgba(33, 150, 243, 0.3) !important;
}

/* Horror - Violet très sombre */
.theme-tag[data-theme*="horror"] {
    background: rgba(74, 20, 140, 0.5) !important;
    border-color: rgba(74, 20, 140, 0.7) !important;
    box-shadow: 0 4px 16px rgba(74, 20, 140, 0.3) !important;
}

/* Survival - Vert militaire */
.theme-tag[data-theme*="survival"] {
    background: rgba(85, 139, 47, 0.5) !important;
    border-color: rgba(85, 139, 47, 0.7) !important;
    box-shadow: 0 4px 16px rgba(85, 139, 47, 0.3) !important;
}

/* Open world - Vert nature */
.theme-tag[data-theme*="open"] {
    background: rgba(56, 142, 60, 0.5) !important;
    border-color: rgba(56, 142, 60, 0.7) !important;
    box-shadow: 0 4px 16px rgba(56, 142, 60, 0.3) !important;
}

/* Historical - Brun antique */
.theme-tag[data-theme*="historical"] {
    background: rgba(121, 85, 72, 0.5) !important;
    border-color: rgba(121, 85, 72, 0.7) !important;
    box-shadow: 0 4px 16px rgba(121, 85, 72, 0.3) !important;
}

/* Stealth - Gris foncé */
.theme-tag[data-theme*="stealth"] {
    background: rgba(69, 90, 100, 0.5) !important;
    border-color: rgba(69, 90, 100, 0.7) !important;
    box-shadow: 0 4px 16px rgba(69, 90, 100, 0.3) !important;
}

/* Sandbox - Beige sable */
.theme-tag[data-theme*="sandbox"] {
    background: rgba(188, 170, 164, 0.5) !important;
    border-color: rgba(188, 170, 164, 0.7) !important;
    box-shadow: 0 4px 16px rgba(188, 170, 164, 0.3) !important;
}

/* 4X (explore, expand, exploit, and exterminate) - Bleu stratégique */
.theme-tag[data-theme*="4x"] {
    background: rgba(21, 101, 192, 0.5) !important;
    border-color: rgba(21, 101, 192, 0.7) !important;
    box-shadow: 0 4px 16px rgba(21, 101, 192, 0.3) !important;
}

/* Warfare - Rouge militaire */
.theme-tag[data-theme*="warfare"] {
    background: rgba(198, 40, 40, 0.5) !important;
    border-color: rgba(198, 40, 40, 0.7) !important;
    box-shadow: 0 4px 16px rgba(198, 40, 40, 0.3) !important;
}

/* Comedy - Jaune joyeux */
.theme-tag[data-theme*="comedy"] {
    background: rgba(255, 179, 0, 0.5) !important;
    border-color: rgba(255, 179, 0, 0.7) !important;
    box-shadow: 0 4px 16px rgba(255, 179, 0, 0.3) !important;
}

/* Drama - Violet profond */
.theme-tag[data-theme*="drama"] {
    background: rgba(106, 27, 154, 0.5) !important;
    border-color: rgba(106, 27, 154, 0.7) !important;
    box-shadow: 0 4px 16px rgba(106, 27, 154, 0.3) !important;
}

/* Romance - Rose romantique */
.theme-tag[data-theme*="romance"] {
    background: rgba(233, 30, 99, 0.5) !important;
    border-color: rgba(233, 30, 99, 0.7) !important;
    box-shadow: 0 4px 16px rgba(233, 30, 99, 0.3) !important;
}

/* Thriller - Rouge sombre */
.theme-tag[data-theme*="thriller"] {
    background: rgba(183, 28, 28, 0.5) !important;
    border-color: rgba(183, 28, 28, 0.7) !important;
    box-shadow: 0 4px 16px rgba(183, 28, 28, 0.3) !important;
}

/* Mystery - Indigo mystérieux */
.theme-tag[data-theme*="mystery"] {
    background: rgba(63, 81, 181, 0.5) !important;
    border-color: rgba(63, 81, 181, 0.7) !important;
    box-shadow: 0 4px 16px rgba(63, 81, 181, 0.3) !important;
}

/* Kids - Bleu ciel enfantin */
.theme-tag[data-theme*="kids"] {
    background: rgba(100, 181, 246, 0.5) !important;
    border-color: rgba(100, 181, 246, 0.7) !important;
    box-shadow: 0 4px 16px rgba(100, 181, 246, 0.3) !important;
}

/* Educational - Vert éducatif */
.theme-tag[data-theme*="educational"] {
    background: rgba(104, 159, 56, 0.5) !important;
    border-color: rgba(104, 159, 56, 0.7) !important;
    box-shadow: 0 4px 16px rgba(104, 159, 56, 0.3) !important;
}

/* Business - Bleu corporatif */
.theme-tag[data-theme*="business"] {
    background: rgba(13, 71, 161, 0.5) !important;
    border-color: rgba(13, 71, 161, 0.7) !important;
    box-shadow: 0 4px 16px rgba(13, 71, 161, 0.3) !important;
}

/* Party - Orange festif */
.theme-tag[data-theme*="party"] {
    background: rgba(255, 112, 67, 0.5) !important;
    border-color: rgba(255, 112, 67, 0.7) !important;
    box-shadow: 0 4px 16px rgba(255, 112, 67, 0.3) !important;
}

/* Erotic - Rouge passion */
.theme-tag[data-theme*="erotic"] {
    background: rgba(211, 47, 47, 0.5) !important;
    border-color: rgba(211, 47, 47, 0.7) !important;
    box-shadow: 0 4px 16px rgba(211, 47, 47, 0.3) !important;
}

/* Non-fiction - Gris neutre */
.theme-tag[data-theme*="non-fiction"] {
    background: rgba(117, 117, 117, 0.5) !important;
    border-color: rgba(117, 117, 117, 0.7) !important;
    box-shadow: 0 4px 16px rgba(117, 117, 117, 0.3) !important;
}