/* ===========================================================
   EUPHORIA — Thème CSS onirique & néon (palette logo train)
   Version Dark + Light (auto + toggle)
   =========================================================== */

:root {
  /* === Couleurs issues du logo EUPHORIA === */
  --clr-blue:   #004c97;   /* train / accent bleu */
  --clr-orange: #ff6b35;   /* avant train */
  --clr-yellow: #ffd23f;   /* soleil */
  --clr-green:  #2ec4b6;   /* vert turquoise */
  --clr-violet: #c44dff;   /* arc-en-ciel violet */
  --clr-bg-dark: #0b1d33;  /* fond nuit */
  --clr-bg-card-dark: #102544;
  --clr-bg-input-dark: #1d2f4a;
  --clr-text-dark: #f1f1f1;
  --clr-muted-dark: #d7d7db;

  --clr-bg-light: #fdfdfd;
  --clr-bg-card-light: #ffffff;
  --clr-bg-input-light: #f4f4f8;
  --clr-text-light: #222;
  --clr-muted-light: #555;

  /* Dégradés néon */
  --clr-neon1: var(--clr-orange);
  --clr-neon2: var(--clr-yellow);
  --clr-neon3: var(--clr-green);
  --clr-neon4: var(--clr-violet);
  --gradient-neon: linear-gradient(90deg,var(--clr-orange),var(--clr-yellow),var(--clr-green),var(--clr-violet));
}

/* ======================= DARK MODE ======================= */
body {
  background-color: var(--clr-bg-dark);
  color: var(--clr-text-dark);
  font-family: "Inter","Segoe UI",sans-serif;
  font-size: 1rem;
  line-height: 1.6;
}

p, .form-label, .form-check-label, .small, .text-muted {
  color: var(--clr-muted-dark) !important;
}

h1,h2,h3,h4,h5,h6 {
  color: #fff;
  font-weight: 700;
}

a {
  color: var(--clr-green);
  text-decoration: none;
}
a:hover {
  color: var(--clr-violet);
  text-decoration: underline;
}

header.glassy, .navbar {
  background: rgba(10,20,40,0.85) !important;
  backdrop-filter: blur(12px);
}
.navbar .nav-link { color: var(--clr-text-dark) !important; }
.navbar .nav-link.active, .navbar .nav-link:hover { color: var(--clr-yellow) !important; }

.card, .modal-content, .alert {
  background-color: var(--clr-bg-card-dark);
  color: var(--clr-text-dark);
  border: 1px solid rgba(255,255,255,0.1);
}

.form-control, .form-select {
  background-color: var(--clr-bg-input-dark);
  color: var(--clr-text-dark);
  border: 1px solid rgba(255,255,255,0.2);
}
.form-control::placeholder { color: #bbb; }

footer {
  background-color: var(--clr-bg-dark);
  color: #aaa;
}
footer a { color: var(--clr-green); }
footer a:hover { color: var(--clr-yellow); }

.badge, .filter-pill {
  background: var(--clr-orange);
  color: #000 !important;
  font-weight: 600;
  border-radius: 50px;
  padding: 0.25rem 0.6rem;
}
.filter-pill.active {
  background: var(--clr-violet);
  color: #000 !important;
}

.btn-neon {
  background: var(--gradient-neon);
  border: none;
  color: #000;
  font-weight: 600;
  box-shadow: 0 0 10px rgba(255,210,63,0.6);
}
.btn-neon:hover {
  background: linear-gradient(90deg,var(--clr-yellow),var(--clr-green),var(--clr-violet));
  color: #000;
}
.btn-outline-neon {
  border: 1px solid var(--clr-orange);
  color: var(--clr-orange);
  background: transparent;
}
.btn-outline-neon:hover { background: var(--clr-orange); color: #000; }

.text-gradient {
  background: var(--gradient-neon);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ======================= LIGHT MODE ======================= */
@media (prefers-color-scheme: light) {
  body {
    background-color: var(--clr-bg-light);
    color: var(--clr-text-light);
  }
  p, .form-label, .form-check-label, .small, .text-muted {
    color: var(--clr-muted-light) !important;
  }
  h1,h2,h3,h4,h5,h6 { color: var(--clr-text-light); }
  header.glassy, .navbar {
    background: rgba(255,255,255,0.9) !important;
    border-bottom: 1px solid rgba(0,0,0,0.1);
  }
  .navbar .nav-link { color: var(--clr-text-light) !important; }
  .navbar .nav-link.active, .navbar .nav-link:hover { color: var(--clr-violet) !important; }
  .card, .modal-content, .alert {
    background-color: var(--clr-bg-card-light);
    color: var(--clr-text-light);
    border: 1px solid rgba(0,0,0,0.1);
  }
  .form-control, .form-select {
    background-color: var(--clr-bg-input-light);
    color: var(--clr-text-light);
    border: 1px solid rgba(0,0,0,0.2);
  }
  footer {
    background-color: var(--clr-bg-light);
    color: #555;
  }
  footer a { color: var(--clr-violet); }
  footer a:hover { color: #000; }
}

.hero-home {
  position: relative;
}
.hero-illustration {
  max-height: 420px;
  object-fit: contain;
  filter: drop-shadow(0 0 25px rgba(255,210,63,0.4));
  border-radius: 1rem;
}

/* Hero commun */
.hero { 
  background: radial-gradient(circle at 20% 30%, rgba(255,210,63,.10), transparent 55%),
              radial-gradient(circle at 80% 70%, rgba(196,77,255,.10), transparent 55%);
  border-radius: 1rem; padding: 3rem 2rem; margin-bottom: 2rem;
}
.hero .hero-illustration { max-height: 360px; border-radius: .75rem; object-fit: contain;
  filter: drop-shadow(0 0 20px rgba(255,210,63,.30));
}
/* Boutons centrés */
.hero-buttons { display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; }
@media (min-width: 992px){ .hero-buttons { justify-content:flex-start; } }

.hover-glow {
  transition: transform .2s, box-shadow .2s;
}
.hover-glow:hover {
  transform: translateY(-5px);
  box-shadow: 0 0 20px rgba(255,210,63,0.4);
}

.cookie-banner {
  position: fixed;
  bottom: 1rem; left: 50%;
  transform: translateX(-50%);
  max-width: 600px;
  width: 90%;
  background: rgba(20,20,30,0.95);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  z-index: 2000;
  box-shadow: 0 0 15px rgba(0,0,0,0.6);
  color: var(--clr-text-dark);
  font-size: 0.9rem;
}
.cookie-banner p { margin-bottom: 0.5rem; }
.cookie-choices label { font-size: 0.85rem; }
#manageCookiesLink { opacity: .9; }
#manageCookiesLink:hover { text-decoration: underline; opacity: 1; }
/* Fallback si Bootstrap n'est pas encore chargé */
.d-none { display: none !important; }

/* Carte cookies — flottante bas droite */
.cookie-card{
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 360px;
  max-width: calc(100vw - 2rem);
  background: rgba(20, 24, 40, 0.95);
  color: var(--clr-text-dark);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 0.9rem;
  box-shadow: 0 12px 40px rgba(0,0,0,0.45), 0 0 20px rgba(255,210,63,0.15);
  z-index: 9999;            /* plus haut que tout */
  overflow: hidden;         /* contenu propre */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  pointer-events: auto;     /* cliquable même si parent overlay */
}

.cookie-header{
  padding: .75rem 1rem;
  background: linear-gradient(90deg,var(--clr-orange),var(--clr-yellow),var(--clr-green),var(--clr-violet));
  color: #000;
  display:flex; align-items:center; justify-content:space-between;
}
.cookie-header .btn-close{
  filter: invert(1); opacity:.8;
}
.cookie-body{ padding: 1rem; }
.cookie-choices label{ font-size: .9rem; }

/* Mobile: s'élargit au centre */
@media (max-width: 480px){
  .cookie-card{ right:.75rem; left:.75rem; width:auto; bottom:.75rem; }
}


	
