/* Halloween Eclipse — effet waou: lune, chauves-souris, néons, cartes premium */
:root{
  --night-1:#0b0b1a; --night-2:#111129; --night-3:#1a1030;
  --pumpkin:#ff7a00; --pumpkin-neon:#ff9a2b; --pumpkin-deep:#e86300;
  --moon:#f6f2d9; --moon-glow: rgba(246,242,217,.55);
  --violet:#5b36a6; --violet-deep:#2b1b52; --emerald:#1ee1a8; --blood:#e84545;
}

/* Fond ciel nocturne + halo de lune */
html, body{height:100%}
body{
  background: radial-gradient(1200px 600px at 75% -10%, rgba(246,242,217,.08), transparent 60%),
              radial-gradient(900px 500px at 15% 10%, rgba(91,54,166,.12), transparent 55%),
              linear-gradient(180deg, var(--night-3) 0%, var(--night-2) 50%, var(--night-1) 100%) !important;
  color:#f2f2f6;
}

/* Lune — en haut à droite */
body::before{
  content:''; position: fixed; top:40px; right:48px; width:120px; height:120px; border-radius:50%;
  background: radial-gradient(circle at 35% 35%, var(--moon) 0%, #e8e4cb 40%, #d7d3bb 60%, #c4c1a9 70%, transparent 72%),
              radial-gradient(circle at 60% 60%, rgba(0,0,0,.05) 0 70%, transparent 72%);
  box-shadow: 0 0 32px 12px var(--moon-glow), 0 0 72px 24px rgba(246,242,217,.25);
  filter: saturate(1.05) contrast(1.02);
  z-index:-1; pointer-events:none; /* passer derrière tous les contenus */
}

/* Nuages brumeux subtils */
#app::before{
  content:''; position: fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(60% 20% at 20% 15%, rgba(255,255,255,.05), transparent 60%),
    radial-gradient(50% 18% at 70% 10%, rgba(255,255,255,.04), transparent 60%),
    radial-gradient(40% 15% at 50% 20%, rgba(255,255,255,.03), transparent 60%);
  mix-blend-mode: screen;
}

/* Chauves-souris animées */
@keyframes bat-flight {
  0%   { transform: translateX(0) translateY(0) scale(1) rotate(0deg); opacity:.28 }
  25%  { transform: translateX(-40px) translateY(6px) scale(1.05) rotate(-3deg); opacity:.22 }
  50%  { transform: translateX(-90px) translateY(-6px) scale(1.1) rotate(3deg); opacity:.18 }
  75%  { transform: translateX(-130px) translateY(4px) scale(1.05) rotate(-2deg); opacity:.22 }
  100% { transform: translateX(-180px) translateY(0) scale(1) rotate(0deg); opacity:.28 }
}

/* Désactivation de la frise texte (🦇) pour laisser place aux animations JS/SVG */
#app::after{ content: none !important; }

/* Navbar néon chic */
.navbar-halloween{
  background:
    linear-gradient(90deg, rgba(255,122,0,.10), rgba(255,122,0,.18), rgba(255,122,0,.10)),
    linear-gradient(180deg, rgba(43,27,82,1) 0%, rgba(22,13,43,1) 100%) !important;
  border-bottom: 3px solid var(--pumpkin-deep);
  box-shadow: 0 8px 30px rgba(0,0,0,.8), 0 0 46px rgba(255,122,0,.25), inset 0 -1px 0 rgba(255,154,43,.28);
  backdrop-filter: blur(2px);
}
.navbar-brand, .navbar-halloween .nav-link{ color:#f4f2ff !important; text-shadow: 0 0 10px rgba(255,122,0,.25); }
.navbar-halloween .nav-link:hover{ color:#fff !important; background: rgba(255,122,0,.12); border-radius:10px; }

/* Titres de section: néon citrouille */
.section-label, h2, h3{
  color: var(--pumpkin-neon) !important;
  text-shadow: 0 0 14px rgba(255,122,0,.45), 0 0 34px rgba(255,154,43,.25);
  letter-spacing: .6px;
}

/* Cartes plats premium */
.dishes-table{ width:100%; border-collapse:separate; border-spacing: 0 16px; }
.dishes-table tr{
  background: radial-gradient(180px 60px at 80% 0%, rgba(255,122,0,.10), transparent 60%),
              linear-gradient(180deg, rgba(20,12,34,.9), rgba(16,10,28,.9));
  border-radius: 16px; overflow:hidden; position: relative; z-index:2; /* au-dessus de la lune/bats */
  box-shadow: 0 12px 30px rgba(0,0,0,.5), 0 0 30px rgba(91,54,166,.15);
  border:1px solid rgba(255,255,255,.06);
  transition: transform .35s cubic-bezier(.4,0,.2,1), box-shadow .35s ease, border-color .35s ease;
}
.dishes-table tr:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(0,0,0,.6), 0 0 38px rgba(255,122,0,.22);
  border-color: rgba(255,154,43,.25);
}

.dish-label{ color:#f8f5ff !important; font-weight:700; font-size:1.1rem; padding:16px 18px 6px 18px !important; position:relative; }
.dish-label::before{ content:''; position:absolute; left:18px; right:18px; bottom:-4px; height:1px; background: linear-gradient(90deg, transparent, rgba(255,154,43,.55), transparent); opacity:.8; }
.dish-description{ color: rgba(240,240,248,.92) !important; font-size:.95rem; line-height:1.65; padding:0 18px 16px 18px !important; }

/* Pastille prix: pilule néon */
.dish-price{
  font-weight:800 !important; color:#2a0f00 !important; font-size:1.05rem;
  background: linear-gradient(135deg, #ffd199 0%, #ff9a2b 45%, #ff7a00 100%);
  padding:10px 14px !important; border-radius:14px; margin:0 14px 0 0; min-width:70px;
  box-shadow: 0 10px 22px rgba(255,122,0,.35), inset 0 1px 0 rgba(255,255,255,.35);
}

/* Boutons action wishlist (si présents) */
.btn-wishlist{ color:#ffd6b0 !important; }
.btn-wishlist:hover{ color:#fff !important; text-shadow: 0 0 10px rgba(255,122,0,.55); }

/* Dish options - contraste renforcé (Eclipse) */
.dish-options{
  color: rgba(242,242,246,0.96) !important;
  border-left: 2px dotted var(--pumpkin-neon);
  margin-left: 1rem; padding-left: 0.75rem;
}

.dish-options, .dish-options *{ text-shadow: 0 1px 2px rgba(0,0,0,.65); }

.dish-options .option,
.dish-options .extra,
.dish-options .supplement,
.dish-options li,
.dish-options span{ color:#ffffff !important; }

.dish-options a{ color: var(--pumpkin-neon) !important; text-decoration: none; }
.dish-options a:hover{ color: #ffd199 !important; }

.dish-options .price,
.dish-options .supplement-amount{ color: var(--pumpkin) !important; font-weight: 700; }

/* Footer/toolbar bas : lueur citrouille */
.footer-toolbar, .navbar-fixed-bottom, .fixed-bottom{
  background:
    repeating-linear-gradient(90deg, rgba(255,122,0,.12) 0 28px, rgba(255,154,43,.18) 28px 30px),
    linear-gradient(0deg, rgba(22,13,43,1), rgba(31,18,56,1));
  border-top: 3px solid var(--pumpkin-deep);
  box-shadow: 0 -8px 30px rgba(0,0,0,.8), 0 0 46px rgba(255,122,0,.25), inset 0 1px 0 rgba(255,154,43,.25);
}

/* Tabs/Collapse: ne montrer que l’actif */
.tab-content > .tab-pane{ display:none; }
.tab-content > .active, .tab-content > .show{ display:block; }
.collapse:not(.show){ display:none; }

/* Accessibilité focus */
.dishes-table tr:focus-within{ outline: 2px solid rgba(255,154,43,.55); outline-offset:4px; }

/* Responsive */
@media(max-width:768px){
  .dish-label{ font-size:1.05rem; padding:14px 14px 6px 14px !important; }
  .dish-description{ font-size:.92rem; padding:0 14px 14px 14px !important; }
  .dish-price{ padding:8px 12px !important; min-width:64px; }
}
