.interactive-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.95;
}

.mouse-glow {
  position: fixed;
  left: 0;
  top: 0;
  width: 340px;
  height: 340px;
  border-radius: 999px;
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 1;
  opacity: 0;
  background: radial-gradient(circle, color-mix(in srgb, var(--brand) 56%, #fff 44%) 0%, rgba(0, 0, 0, 0) 70%);
  mix-blend-mode: soft-light;
  filter: blur(8px);
  transition: opacity 0.25s ease;
}

.soft-grain {
  background-image: url("https://grainy-gradients.vercel.app/noise.svg");
  background-size: 260px 260px;
  opacity: var(--grain-opacity);
  mix-blend-mode: multiply;
  pointer-events: none;
}

:root {
  --bg-alt: #f2eadd;
  --grain-opacity: 0.08;
  --bg-mix-base: 90%;
  --bg-mix-black: 10%;
}

html[data-theme="dark"] {
  --bg-alt: #332f2a;
  --grain-opacity: 0.30;
  --bg-mix-base: 70%;
  --bg-mix-black: 30%;
}

body {
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--bg-alt) 70%, #ffffff 30%) 0%, transparent 42%),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--bg-alt) 60%, #ffffff 40%) 0%, transparent 40%),
    linear-gradient(180deg, var(--bg) 0%, color-mix(in srgb, var(--bg) var(--bg-mix-base), #000 var(--bg-mix-black)) 100%) !important;
}

@media (pointer: coarse) {
  .mouse-glow {
    display: none;
  }
}

.booking-modal-shell {
  box-shadow: 0 26px 90px -36px rgba(0, 0, 0, 0.7);
}

.booking-frame-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  background: #ffffff;
}

.booking-frame {
  width: 100%;
  border: 0;
  background: #ffffff;
}

.booking-frame-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
  background:
    radial-gradient(circle at 80% 0%, color-mix(in srgb, var(--brand) 35%, transparent) 0%, transparent 45%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.28));
  mix-blend-mode: multiply;
}

html[data-theme="dark"] .booking-frame {
  /* Hack visuel: harmonise l'iframe Google claire dans un shell dark */
  filter: invert(0.93) hue-rotate(180deg) saturate(0.86) contrast(0.92) brightness(0.9);
}

html[data-theme="dark"] .booking-frame-wrap::after {
  opacity: 0.3;
}

html[data-theme="dark"] .booking-modal-shell {
  box-shadow: 0 30px 100px -40px rgba(0, 0, 0, 0.95);
}