/* Regeneración Capilar Canary V6.4 — booking conversion + section rhythm.
 * Scope: only the capilar canary. Does not change the approved hero, value cards,
 * treatments or before/after components.
 */

/* Let the booking breathe instead of enclosing every section in another capsule. */
body.zv-capilar-canary-v6 .zvtl5-booking{
  position:relative!important;
  margin-top:72px!important;
  padding:48px 0 34px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:2% -7% 5%;
  pointer-events:none;
  background:
    radial-gradient(circle at 77% 22%,rgba(202,166,87,.12),transparent 29%),
    radial-gradient(circle at 12% 74%,rgba(230,207,168,.20),transparent 31%);
  filter:blur(14px);
}
body.zv-capilar-canary-v6 .zvtl5-booking-grid{
  grid-template-columns:minmax(300px,.35fr) minmax(0,.65fr)!important;
  gap:48px!important;
  align-items:start!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-copy{
  padding:18px 0 0!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-copy > h2{
  max-width:430px!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-copy > p:not(.zvtl-kicker){
  max-width:420px!important;
  line-height:1.7!important;
}

/* Campaign card: stronger urgency accent without changing the approved layout. */
body.zv-capilar-canary-v6 .zvtl5-booking-offer{
  position:relative!important;
  overflow:hidden!important;
  margin-top:22px!important;
  padding:22px 22px 18px!important;
  border:1px solid rgba(184,141,51,.22)!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,#fffdf9 0%,#fff8ec 100%)!important;
  box-shadow:0 18px 42px rgba(78,57,36,.06)!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-offer:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:#b52f2a;
}
body.zv-capilar-canary-v6 .zvtl5-booking-offer strong{
  font-size:27px!important;
}
body.zv-capilar-canary-v6 .zvtl64-urgency{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:15px;
  padding:12px 13px;
  border:1px solid rgba(181,47,42,.42);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(181,47,42,.14),rgba(181,47,42,.055));
  color:#8f211d;
  box-shadow:0 10px 26px rgba(181,47,42,.08);
  animation:zvtl64Glow 2.6s ease-in-out infinite;
  font:700 10px/1.35 Manrope,sans-serif;
}
body.zv-capilar-canary-v6 .zvtl64-urgency__copy{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
body.zv-capilar-canary-v6 .zvtl64-urgency__copy b{color:#8a1d19}
body.zv-capilar-canary-v6 .zvtl64-urgency__copy small{color:#99423d}
body.zv-capilar-canary-v6 .zvtl64-urgency__dot{
  width:8px;
  height:8px;
  min-width:8px;
  border-radius:50%;
  background:#c72f28;
  box-shadow:0 0 0 0 rgba(199,47,40,.46);
  animation:zvtl64Pulse 1.9s ease-out infinite;
}
body.zv-capilar-canary-v6 .zvtl64-urgency__timer{
  white-space:nowrap;
  padding:7px 9px;
  border-radius:999px;
  background:#fff;
  color:#a9231e;
  border:1px solid rgba(181,47,42,.38);
  box-shadow:0 5px 15px rgba(181,47,42,.08);
  font:800 12px/1 Manrope,sans-serif;
  letter-spacing:.035em;
  font-variant-numeric:tabular-nums;
}
body.zv-capilar-canary-v6 .zvtl64-urgency.is-expired{
  border-color:rgba(136,118,103,.18);
  background:rgba(136,118,103,.06);
  color:#796d63;
  box-shadow:none;
  animation:none;
}
body.zv-capilar-canary-v6 .zvtl64-urgency.is-expired .zvtl64-urgency__dot{background:#9e9187;animation:none}
body.zv-capilar-canary-v6 .zvtl64-urgency.is-expired .zvtl64-urgency__timer{color:#796d63;border-color:rgba(136,118,103,.18)}
@keyframes zvtl64Pulse{70%{box-shadow:0 0 0 9px rgba(199,47,40,0)}100%{box-shadow:0 0 0 0 rgba(199,47,40,0)}}
@keyframes zvtl64Glow{
  0%,100%{box-shadow:0 10px 26px rgba(181,47,42,.08),0 0 0 0 rgba(199,47,40,0)}
  50%{box-shadow:0 14px 34px rgba(181,47,42,.17),0 0 0 4px rgba(199,47,40,.10)}
}

/* Month radar: show only months that truly contain availability. */
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-radar{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:9px!important;
  margin:0 0 16px!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-chip[hidden]{display:none!important}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-chip{
  min-width:72px!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-radar.is-single-month .zvb-next-turn{display:none!important}

/* Month changes happen from the availability pills, so arrows cannot lead to empty months. */
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar__nav [data-month-prev],
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar__nav [data-month-next]{display:none!important}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar__nav{
  justify-content:center!important;
}

/* Until a date is chosen, do not reserve a large empty area for time slots. */
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar-shell.zvtl64-no-date{
  gap:0!important;
  min-height:0!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar-shell.zvtl64-no-date .zvb-slots{
  display:none!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar-shell.zvtl64-no-date + .zvb-actions{
  display:none!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-booking.zvtl64-awaiting-date .zvb-stage{
  min-height:0!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar-shell.zvtl64-has-date .zvb-slots{
  display:block!important;
  animation:zvtl64RevealSlots .32s ease both;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-calendar-shell.zvtl64-has-date + .zvb-actions{
  animation:zvtl64RevealSlots .32s .05s ease both;
}
@keyframes zvtl64RevealSlots{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Keep the selected-date state compact and intentional. */
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-slots{
  min-height:0!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-slot-grid{
  min-height:0!important;
}
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-slot-empty{
  min-height:86px!important;
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
}

/* The booking itself remains the visual anchor while the outer section stays free. */
body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-booking{
  border:1px solid rgba(184,141,51,.18)!important;
  border-radius:30px!important;
  box-shadow:0 28px 70px rgba(72,53,34,.07)!important;
}

@media(max-width:1180px){
  body.zv-capilar-canary-v6 .zvtl5-booking-grid{
    grid-template-columns:minmax(260px,.38fr) minmax(0,.62fr)!important;
    gap:30px!important;
  }
}
@media(max-width:960px){
  body.zv-capilar-canary-v6 .zvtl5-booking{
    margin-top:56px!important;
    padding-top:30px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-booking-grid{
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-booking-copy{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(260px,.7fr)!important;
    column-gap:24px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-booking-copy > .zvtl-kicker,
  body.zv-capilar-canary-v6 .zvtl5-booking-copy > h2,
  body.zv-capilar-canary-v6 .zvtl5-booking-copy > p:not(.zvtl-kicker){grid-column:1!important}
  body.zv-capilar-canary-v6 .zvtl5-booking-points,
  body.zv-capilar-canary-v6 .zvtl5-booking-offer{grid-column:2!important}
  body.zv-capilar-canary-v6 .zvtl5-booking-points{grid-row:1 / span 3!important;margin-top:0!important}
  body.zv-capilar-canary-v6 .zvtl5-booking-offer{grid-row:4!important}
}
@media(max-width:720px){
  body.zv-capilar-canary-v6 .zvtl5-booking-copy{
    display:block!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-booking-offer{margin-top:18px!important}
  body.zv-capilar-canary-v6 .zvtl64-urgency{
    align-items:flex-start;
    flex-direction:column;
  }
  body.zv-capilar-canary-v6 .zvtl64-urgency__timer{align-self:flex-start}
  body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-radar{gap:7px!important}
  body.zv-capilar-canary-v6 .zvtl5-booking-shell .zvb-month-chip{min-width:66px!important}
}
@media(prefers-reduced-motion:reduce){
  body.zv-capilar-canary-v6 .zvtl64-urgency,
  body.zv-capilar-canary-v6 .zvtl64-urgency__dot{animation:none!important}
}