/* Azuretech booking hero — dark/light aware. Paired with booking-hero.js.
   All classes prefixed bh- to avoid collisions with page styles. */

/* ===== LIGHT · Color Mesh background ===== */
.bh-lm-base { background: linear-gradient(165deg, #FEFCFA 0%, #F6F8FB 52%, #F1F5FA 100%); }
.bh-lm-blooms {
  background:
    radial-gradient(46% 50% at 82% 16%, rgba(240,148,46,0.42) 0%, rgba(240,148,46,0.16) 42%, transparent 72%),
    radial-gradient(40% 44% at 96% 54%, rgba(247,176,102,0.40) 0%, rgba(247,176,102,0.12) 46%, transparent 74%),
    radial-gradient(50% 54% at 12% 84%, rgba(84,122,161,0.40) 0%, rgba(84,122,161,0.14) 44%, transparent 74%),
    radial-gradient(34% 38% at 24% 40%, rgba(120,168,214,0.34) 0%, transparent 66%),
    radial-gradient(42% 40% at 58% 100%, rgba(243,162,74,0.30) 0%, transparent 70%),
    radial-gradient(38% 40% at 4% 6%, rgba(57,94,139,0.22) 0%, transparent 68%);
  filter: blur(8px) saturate(118%); transform: translateZ(0); }
.bh-lm-sweep { background: conic-gradient(from 210deg at 70% 30%, rgba(240,148,46,0.12) 0deg, rgba(247,176,102,0.05) 70deg, transparent 150deg, rgba(84,122,161,0.12) 250deg, rgba(240,148,46,0.10) 360deg);
  filter: blur(40px); opacity:.9; animation: bh-lm-drift 26s ease-in-out infinite alternate; }
@keyframes bh-lm-drift { 0%{transform:translate3d(-2%,-1%,0) scale(1.05) rotate(0deg);opacity:.78;} 100%{transform:translate3d(2%,1.5%,0) scale(1.12) rotate(4deg);opacity:.95;} }
.bh-lm-grain { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:160px 160px; opacity:.045; mix-blend-mode:multiply; }
.bh-lm-readability { background: linear-gradient(105deg, rgba(255,255,255,0.78) 0%, rgba(255,255,255,0.40) 34%, rgba(255,255,255,0) 64%), radial-gradient(120% 90% at 50% 120%, rgba(255,255,255,0) 40%, rgba(247,248,250,0.55) 100%); }

/* ===== DARK · Color Mesh background ===== */
.bh-dm-base { background: radial-gradient(120% 90% at 50% -10%, #11151f 0%, #0a0d14 45%, #07090f 100%); }
.bh-dm-blob { position:absolute; border-radius:9999px; filter:blur(80px); will-change:transform; }
.bh-dm-blob-orange { width:46rem; height:46rem; top:-14rem; left:-6rem; background: radial-gradient(circle at 50% 50%, rgba(240,148,46,0.55) 0%, rgba(240,148,46,0.28) 38%, rgba(240,148,46,0) 72%); animation: bh-dm-a 26s ease-in-out infinite; }
.bh-dm-blob-slate { width:50rem; height:50rem; bottom:-20rem; right:-12rem; background: radial-gradient(circle at 50% 50%, rgba(84,122,161,0.50) 0%, rgba(57,94,139,0.26) 40%, rgba(57,94,139,0) 72%); animation: bh-dm-b 32s ease-in-out infinite; }
.bh-dm-blob-violet { width:38rem; height:38rem; top:18%; left:42%; background: radial-gradient(circle at 50% 50%, rgba(146,84,196,0.42) 0%, rgba(120,60,170,0.20) 42%, rgba(120,60,170,0) 72%); animation: bh-dm-c 38s ease-in-out infinite; }
.bh-dm-blob-amber { width:34rem; height:34rem; bottom:6%; left:6%; background: radial-gradient(circle at 50% 50%, rgba(243,162,74,0.40) 0%, rgba(197,112,26,0.18) 44%, rgba(197,112,26,0) 72%); animation: bh-dm-d 30s ease-in-out infinite; }
@keyframes bh-dm-a { 0%,100%{transform:translate3d(0,0,0) scale(1);} 50%{transform:translate3d(4%,3%,0) scale(1.08);} }
@keyframes bh-dm-b { 0%,100%{transform:translate3d(0,0,0) scale(1);} 50%{transform:translate3d(-4%,-3%,0) scale(1.06);} }
@keyframes bh-dm-c { 0%,100%{transform:translate3d(-50%,0,0) scale(1);} 50%{transform:translate3d(-46%,4%,0) scale(1.1);} }
@keyframes bh-dm-d { 0%,100%{transform:translate3d(0,0,0) scale(1);} 50%{transform:translate3d(5%,-4%,0) scale(1.07);} }
.bh-dm-sheen { background: conic-gradient(from 200deg at 30% 25%, rgba(240,148,46,0.10), rgba(146,84,196,0.08), rgba(84,122,161,0.10), rgba(240,148,46,0.10)); mix-blend-mode:screen; opacity:.7; }
.bh-dm-grain { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:160px 160px; opacity:.05; mix-blend-mode:overlay; }
.bh-dm-vignette { background: radial-gradient(120% 120% at 50% 42%, transparent 40%, rgba(7,9,15,0.55) 78%, rgba(7,9,15,0.85) 100%), linear-gradient(180deg, rgba(7,9,15,0.45) 0%, transparent 22%, transparent 70%, rgba(7,9,15,0.6) 100%); }
@media (prefers-reduced-motion: reduce) { .bh-lm-sweep, .bh-dm-blob { animation:none; } }

.bh-accent-text { background: linear-gradient(96deg, #f0942e 0%, #f7b066 55%, #f0942e 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }

/* booking card */
.bh-card { background:#fff; border:1px solid #fff; border-radius:1.75rem;
  box-shadow: 0 1px 1px rgba(16,24,40,.04), 0 8px 16px -6px rgba(16,24,40,.08), 0 24px 48px -12px rgba(240,148,46,.14), 0 2px 0 rgba(255,255,255,.9) inset; }
.dark .bh-card { background: linear-gradient(180deg, rgba(20,26,34,.78), rgba(12,16,22,.82)); border:1px solid rgba(255,255,255,.10); border-radius:1.5rem;
  -webkit-backdrop-filter: blur(20px) saturate(140%); backdrop-filter: blur(20px) saturate(140%);
  box-shadow: 0 1px 0 0 rgba(255,255,255,.06) inset, 0 30px 60px -18px rgba(0,0,0,.7), 0 18px 50px -20px rgba(240,148,46,.28), 0 0 0 1px rgba(240,148,46,.04); }

/* warm glow behind the booking card so it lifts off the mesh */
.bh-card-glow { position:absolute; inset:-1.25rem; border-radius:2.25rem; pointer-events:none; z-index:0;
  background: radial-gradient(62% 58% at 50% 42%, rgba(240,148,46,0.20) 0%, rgba(247,176,102,0.10) 45%, transparent 72%);
  filter: blur(26px); }
.dark .bh-card-glow { background: radial-gradient(62% 58% at 50% 42%, rgba(240,148,46,0.30) 0%, rgba(240,148,46,0.10) 48%, transparent 74%); filter: blur(34px); }

/* day chips */
.bh-day { border:1px solid #e2e8f0; background:#fff; color:#334155; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease; }
.bh-day .bh-dow { color:#94a3b8; } .bh-day .bh-num { color:#334155; }
.bh-day:hover:not(.is-active):not(:disabled) { background:#FFF3E6; transform:translateY(-1px); }
.bh-day.is-active { border-color:#f0942e; background:#f0942e; color:#fff; box-shadow:0 8px 18px -6px rgba(240,148,46,.55); }
.bh-day.is-active .bh-dow { color:rgba(255,255,255,.85); } .bh-day.is-active .bh-num { color:#fff; }
.bh-day:disabled { opacity:.4; cursor:not-allowed; }
.dark .bh-day { border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.03); color:#cbd5e1; }
.dark .bh-day .bh-dow { color:#64748b; } .dark .bh-day .bh-num { color:#cbd5e1; }
.dark .bh-day:hover:not(.is-active):not(:disabled) { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.2); }
.dark .bh-day.is-active { border-color:rgba(240,148,46,.6); background:rgba(240,148,46,.14); color:#fff; box-shadow:none; }
.dark .bh-day.is-active .bh-dow { color:#f3a24a; } .dark .bh-day.is-active .bh-num { color:#fff; }

/* time slots */
.bh-slot { border:1px solid #e2e8f0; background:#fff; color:#1e293b; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s ease; }
.bh-slot:hover:not(.is-active) { transform:translateY(-1px); }
.bh-slot .bh-ic { background:#f8fafc; color:#94a3b8; transition: background-color .18s ease, color .18s ease; }
.bh-slot:hover:not(.is-active) .bh-ic { background:#FFF3E6; color:#f0942e; }
.bh-slot .bh-lbl { color:#1e293b; } .bh-slot .bh-chk { opacity:0; color:#f0942e; transition: opacity .2s ease; }
.bh-slot.is-active { border-color:#f0942e; background:#f0942e; box-shadow:0 10px 22px -8px rgba(240,148,46,.6); }
.bh-slot.is-active .bh-ic { background:rgba(255,255,255,.25); color:#fff; } .bh-slot.is-active .bh-lbl { color:#fff; } .bh-slot.is-active .bh-chk { opacity:1; color:#fff; }
.dark .bh-slot { border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.03); color:#cbd5e1; }
.dark .bh-slot .bh-ic { background:rgba(255,255,255,.05); color:#94a3b8; } .dark .bh-slot .bh-lbl { color:#e2e8f0; }
.dark .bh-slot:hover:not(.is-active) { border-color:rgba(255,255,255,.25); background:rgba(255,255,255,.06); }
.dark .bh-slot.is-active { border-color:rgba(240,148,46,.7); background:rgba(240,148,46,.16); box-shadow:none; }
.dark .bh-slot.is-active .bh-ic { background:rgba(240,148,46,.25); color:#f3a24a; } .dark .bh-slot.is-active .bh-lbl { color:#fff; } .dark .bh-slot.is-active .bh-chk { opacity:1; color:#f3a24a; }

/* nav + cta + inputs */
.bh-navbtn { border:1px solid #e2e8f0; color:#94a3b8; transition: color .18s, border-color .18s, background-color .18s; }
.bh-navbtn:hover:not(:disabled) { color:#334155; border-color:#cbd5e1; }
.bh-navbtn:disabled { opacity:.35; cursor:not-allowed; }
.dark .bh-navbtn { border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.03); color:#94a3b8; }
.dark .bh-navbtn:hover:not(:disabled) { color:#fff; border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.06); }
.bh-cta { transition: transform .2s cubic-bezier(.16,1,.3,1), background-color .18s ease, box-shadow .2s ease, opacity .2s ease; box-shadow:0 14px 30px -10px rgba(240,148,46,.65); }
.bh-cta:hover:not(:disabled) { transform:translateY(-2px); background:#f3a24a; box-shadow:0 18px 40px -10px rgba(240,148,46,.8); }
.bh-cta:active:not(:disabled) { transform:translateY(0) scale(.99); }
.bh-cta:disabled { opacity:.6; cursor:not-allowed; }

.bh-input { border:1px solid #e2e8f0; background:#fff; color:#0f172a; transition: border-color .18s ease, box-shadow .18s ease; }
.bh-input::placeholder { color:#94a3b8; }
.bh-input:focus { outline:none; border-color:#f0942e; box-shadow:0 0 0 3px rgba(240,148,46,.18); }
.dark .bh-input { border-color:rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:#fff; }
.dark .bh-input::placeholder { color:#64748b; }
.dark .bh-input:focus { border-color:#f0942e; box-shadow:0 0 0 3px rgba(240,148,46,.25); }

.bh-pulse { animation: bh-pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
@keyframes bh-pulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.45;transform:scale(.7);} }

.bh-focus:focus-visible { outline:none; box-shadow:0 0 0 3px #F7F8FA, 0 0 0 5px rgba(240,148,46,.6); }
.dark .bh-focus:focus-visible { box-shadow:0 0 0 2px #0B0E14, 0 0 0 4px rgba(240,148,46,.7); }

@media (prefers-reduced-motion: reduce) { .bh-pulse{animation:none;} #booking-hero *{transition:none!important;} }