/**
 * Thème test — aligné sur https://notre.guide/ansedelolivier
 *
 * REVERT :
 * 1. Dans index.html : NOTRE_GUIDE_THEME = false et NOTRE_GUIDE_INTEGRATION = false
 * 2. Supprimer ou commenter la ligne <link rel="stylesheet" href="notre-guide-theme.css">
 */
html.ng-theme {
  --ng-primary: #0f0eff;
  --ng-sky: #4fc0e3;
  --ng-accent: #7fc7ff;
  --ng-coral: #b93030;
  --ng-icon: #5c1818;
  --ng-bg: #eef1f7;
  --ng-surface: rgba(255, 255, 255, 0.92);
  --ng-surface-soft: rgba(255, 255, 255, 0.78);
  --ng-text: #1c1917;
  --ng-muted: #57534e;
  --ng-radius: 1.15rem;
}

html.ng-theme body {
  color: var(--ng-text);
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
}

html.ng-theme .font-luxury {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
}

html.ng-theme #luxury-video-bg {
  opacity: 0.22;
}

html.ng-theme #luxury-video-bg .luxury-video-scrim {
  background:
    radial-gradient(ellipse 90% 70% at 50% 20%, rgba(238, 241, 247, 0.2), rgba(238, 241, 247, 0.85) 72%),
    linear-gradient(to bottom, rgba(238, 241, 247, 0.55) 0%, rgba(238, 241, 247, 0.92) 100%);
}

html.ng-theme .luxury-glass,
html.ng-theme .luxury-glass-soft {
  background: var(--ng-surface);
  border-color: rgba(15, 14, 255, 0.12) !important;
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
  box-shadow: 0 8px 28px rgba(15, 14, 255, 0.06);
}

html.ng-theme header.luxury-glass {
  background: linear-gradient(90deg, var(--ng-sky) 0%, var(--ng-sky) 42%, rgba(185, 48, 48, 0.92) 42%, rgba(185, 48, 48, 0.92) 100%);
  border-bottom-color: rgba(15, 14, 255, 0.2) !important;
}

html.ng-theme header .text-amber-500,
html.ng-theme header .text-amber-400,
html.ng-theme header h1 {
  color: #fff !important;
}

html.ng-theme header .text-stone-400,
html.ng-theme header .text-stone-500,
html.ng-theme header .text-stone-600,
html.ng-theme header #header-version {
  color: rgba(255, 255, 255, 0.88) !important;
}

html.ng-theme header img {
  border-color: rgba(255, 255, 255, 0.65) !important;
}

html.ng-theme .ng-guide-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--ng-icon);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(92, 24, 24, 0.15);
  transition: background 0.15s, transform 0.12s;
}

html.ng-theme .ng-guide-nav-link:hover {
  background: #fff;
  transform: translateY(-1px);
}

html.ng-theme #luxury-hero {
  border-bottom-color: rgba(15, 14, 255, 0.1) !important;
  background: linear-gradient(180deg, rgba(79, 192, 227, 0.18) 0%, rgba(238, 241, 247, 0.95) 100%);
}

html.ng-theme #luxury-hero .text-amber-500\/90,
html.ng-theme #luxury-hero [data-i18n="heroEyebrow"] {
  color: var(--ng-icon) !important;
}

html.ng-theme #luxury-hero h2 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  color: var(--ng-primary) !important;
  text-shadow: none !important;
}

html.ng-theme #luxury-hero p {
  color: var(--ng-muted) !important;
  text-shadow: none !important;
}

html.ng-theme .luxury-gold-line {
  background: linear-gradient(90deg, transparent, rgba(79, 192, 227, 0.65), transparent);
}

html.ng-theme #notre-guide-section {
  background: var(--ng-bg);
}

html.ng-theme #notre-guide-section .ng-guide-panel {
  background: var(--ng-surface);
  border: 1px solid rgba(15, 14, 255, 0.1);
  border-radius: calc(var(--ng-radius) + 0.25rem);
  box-shadow: 0 12px 36px rgba(15, 14, 255, 0.08);
}

html.ng-theme #notre-guide-section .ng-guide-open-btn {
  background: var(--ng-accent);
  color: var(--ng-text);
  border: 1px solid rgba(127, 199, 255, 0.6);
}

html.ng-theme #notre-guide-section .ng-guide-open-btn:hover {
  background: var(--ng-sky);
  color: #fff;
}

html.ng-theme #notre-guide-section iframe {
  border-radius: var(--ng-radius);
  background: #fff;
}

html.ng-theme .text-amber-500,
html.ng-theme .text-amber-400,
html.ng-theme .text-amber-600,
html.ng-theme .text-amber-100,
html.ng-theme .text-rose-300,
html.ng-theme .text-rose-400,
html.ng-theme .text-rose-500 {
  color: var(--ng-primary) !important;
}

html.ng-theme .text-stone-100,
html.ng-theme .text-stone-200,
html.ng-theme .text-stone-300 {
  color: var(--ng-text) !important;
}

html.ng-theme .text-stone-400,
html.ng-theme .text-stone-500,
html.ng-theme .text-stone-600 {
  color: var(--ng-muted) !important;
}

html.ng-theme .bg-amber-600,
html.ng-theme .bg-amber-700,
html.ng-theme .bg-green-700 {
  background-color: var(--ng-accent) !important;
  color: var(--ng-text) !important;
}

html.ng-theme .bg-amber-600:hover,
html.ng-theme .hover\:bg-amber-500:hover,
html.ng-theme .bg-green-700:hover,
html.ng-theme .hover\:bg-green-600:hover {
  background-color: var(--ng-sky) !important;
  color: #fff !important;
}

html.ng-theme .bg-stone-800,
html.ng-theme .bg-stone-900,
html.ng-theme .bg-stone-950 {
  background-color: rgba(255, 255, 255, 0.72) !important;
  color: var(--ng-text) !important;
}

html.ng-theme .border-stone-700,
html.ng-theme .border-stone-800,
html.ng-theme .border-amber-900\/25,
html.ng-theme .border-amber-900\/20,
html.ng-theme .border-amber-800\/60 {
  border-color: rgba(15, 14, 255, 0.12) !important;
}

html.ng-theme .place-card,
html.ng-theme .tourism-app-card,
html.ng-theme .review-panel,
html.ng-theme .review-card {
  background: var(--ng-surface-soft) !important;
  border-radius: var(--ng-radius);
}

html.ng-theme .place-card.active {
  border-color: var(--ng-sky) !important;
  background: rgba(127, 199, 255, 0.18) !important;
}

html.ng-theme .place-card.in-itin {
  box-shadow: inset 0 0 0 2px var(--ng-accent) !important;
}

html.ng-theme .lang-btn.active {
  background: var(--ng-primary) !important;
  color: #fff !important;
}

html.ng-theme .lang-btn {
  color: var(--ng-muted);
}

html.ng-theme .lang-btn:hover {
  background: rgba(127, 199, 255, 0.25);
  color: var(--ng-primary);
}

html.ng-theme .filter-btn.bg-amber-600,
html.ng-theme .review-filter-btn.bg-amber-600,
html.ng-theme .nav-tab.bg-amber-600 {
  background-color: var(--ng-primary) !important;
  color: #fff !important;
}

html.ng-theme .catalog-scroll {
  scrollbar-color: var(--ng-sky) rgba(15, 14, 255, 0.08);
}

html.ng-theme .catalog-scroll::-webkit-scrollbar-thumb {
  background: var(--ng-sky);
}

html.ng-theme #route-info {
  background: rgba(127, 199, 255, 0.2) !important;
  color: var(--ng-text) !important;
}

html.ng-theme #map {
  background: #dbeafe;
}

html.ng-theme .leaflet-control-layers {
  background: var(--ng-surface) !important;
  color: var(--ng-text) !important;
  border-color: rgba(15, 14, 255, 0.15) !important;
}

html.ng-theme .leaflet-control-layers-toggle {
  filter: none;
}

html.ng-theme .leaflet-popup-content-wrapper {
  border-color: rgba(79, 192, 227, 0.55) !important;
}

html.ng-theme .gps-pulse {
  background: var(--ng-primary);
  box-shadow: 0 0 0 0 rgba(15, 14, 255, 0.55);
}

html.ng-theme .marker-itin-add {
  background: var(--ng-primary);
}

html.ng-theme .marker-itin-remove {
  background: var(--ng-accent);
  color: var(--ng-text);
}

html.ng-theme .ai-chat-panel {
  background: var(--ng-surface) !important;
  border-color: rgba(15, 14, 255, 0.12) !important;
}

html.ng-theme .ai-msg-user {
  background: rgba(127, 199, 255, 0.22) !important;
  border-color: rgba(79, 192, 227, 0.45) !important;
  color: var(--ng-text) !important;
}

html.ng-theme .ai-msg-bot {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(15, 14, 255, 0.1) !important;
  color: var(--ng-text) !important;
}

html.ng-theme #ng-theme-test-badge {
  display: inline-flex !important;
}