/* Reserva de cita: campo del formulario + modal de calendario.
   Usa los tokens de :root de cada página (--card, --line, --lamp, --rose-soft, --radius-*). */

/* ---------- campo dentro del formulario ---------- */
.booking-field .booking-label{ display:block; font-size:.82rem; font-weight:700; margin-bottom:.4rem; }
.booking-field .booking-label small{ font-weight:400; opacity:.8; font-size:inherit; }
.booking-open{ width:100%; justify-content:center; }
.booking-open[hidden]{ display:none; }
.btn.booking-open{ background:var(--lamp); border-color:var(--lamp); color:var(--lamp-ink); box-shadow:0 12px 26px -14px rgba(201,116,99,.6); }
@media (hover:hover){ .btn.booking-open:hover{ background:#d68d7e; border-color:#d68d7e; } }
.booking-chosen{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; }
.booking-chosen[hidden]{ display:none; }
.booking-when{
  flex:1 1 240px; display:inline-flex; align-items:center; gap:.6rem; text-align:left;
  padding:.8rem 1rem; min-height:44px; border-radius:var(--radius-sm); cursor:pointer;
  background:var(--rose-soft); color:var(--rose-dark); border:1.5px solid transparent; font-weight:700;
}
.booking-when svg, .booking-open svg{ width:1.15em; height:1.15em; flex:none; }
.booking-when .booking-change{ margin-left:auto; font-size:.78rem; font-weight:700; text-decoration:underline; opacity:.85; }
.booking-remove{
  background:transparent; border:1.5px solid var(--line); color:var(--text); border-radius:999px;
  padding:.6rem 1.1rem; min-height:44px; font-weight:700; font-size:.88rem; cursor:pointer;
}
@media (hover:hover){
  .booking-when:hover{ border-color:var(--lamp); }
  .booking-remove:hover{ border-color:var(--text); }
}
.booking-consent[hidden]{ display:none; }
.booking-consent label.booking-check{
  display:flex; gap:.65rem; align-items:flex-start; font-size:.86rem; font-weight:400; line-height:1.5; cursor:pointer;
}
.booking-consent input[type="checkbox"]{
  appearance:auto; width:1.15rem; height:1.15rem; min-height:0; padding:0; margin:.15rem 0 0; flex:none; accent-color:var(--lamp);
}
.booking-consent.invalid label.booking-check{ color:#E8A396; }
.booking-alert{
  margin:0; padding:.75rem 1rem; border-radius:var(--radius-sm); background:#FBEAEA; color:#9A3B2E; font-weight:700; font-size:.9rem;
}
.booking-alert[hidden]{ display:none; }

/* Sobre fondo oscuro (contacto de inicio y de "La conversación pendiente") */
.final-cta .booking-field .booking-label, .contact-section .booking-field .booking-label{ color:var(--on-night-muted); }
.final-cta .booking-remove, .contact-section .booking-remove{ border-color:rgba(255,255,255,.4); color:var(--on-night); }
@media (hover:hover){ .final-cta .booking-remove:hover, .contact-section .booking-remove:hover{ border-color:#fff; } }
.final-cta .booking-consent label.booking-check, .contact-section .booking-consent label.booking-check{ color:var(--on-night-muted); }
.final-cta .booking-consent a, .contact-section .booking-consent a{ color:var(--on-night); }

/* ---------- modal ---------- */
html:has(.booking-dialog[open]){ overflow:hidden; }
.booking-dialog{
  width:min(760px, calc(100vw - 2rem)); max-height:calc(100dvh - 2rem); padding:0; border:0;
  border-radius:var(--radius-lg); background:var(--card); color:var(--text);
  box-shadow:0 30px 70px -30px rgba(26,15,10,.55); overflow:auto; overscroll-behavior:contain;
}
.booking-dialog::backdrop{ background:rgba(26,15,10,.55); }
.booking-dialog[open]{ animation:booking-in .2s ease-out; }
@keyframes booking-in{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .booking-dialog[open]{ animation:none; } }

.booking-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
  padding:1.4rem 1.5rem 1rem; border-bottom:1px solid var(--line);
}
.booking-head h2{ font-size:1.4rem; font-style:italic; }
.booking-head p{ color:var(--text-muted); font-size:.88rem; margin-top:.3rem; }
.booking-x{
  flex:none; width:44px; height:44px; border-radius:999px; border:1.5px solid var(--line); background:transparent;
  display:grid; place-items:center; cursor:pointer; color:var(--text);
}
.booking-x svg{ width:18px; height:18px; }
@media (hover:hover){ .booking-x:hover{ border-color:var(--text); } }

.booking-body{ display:grid; grid-template-columns:1.15fr 1fr; }
.booking-cal{ padding:1.2rem 1.5rem 1.5rem; border-right:1px solid var(--line); }
.booking-slots{ padding:1.2rem 1.5rem 1.5rem; min-height:280px; }

.booking-month{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.8rem; }
.booking-month h3{ font-size:1.1rem; }
.booking-month h3::first-letter{ text-transform:uppercase; }
.booking-nav{
  width:40px; height:40px; border-radius:999px; border:1.5px solid var(--line); background:transparent; cursor:pointer;
  display:grid; place-items:center; color:var(--text);
}
.booking-nav svg{ width:16px; height:16px; }
.booking-nav:disabled{ opacity:.35; cursor:default; }

.booking-grid{ display:grid; grid-template-columns:repeat(7, 1fr); gap:.25rem; }
.booking-grid .dow{ text-align:center; font-size:.72rem; font-weight:800; color:var(--text-muted); padding:.3rem 0; letter-spacing:.06em; }
.booking-day{
  aspect-ratio:1; min-height:38px; border-radius:999px; border:1.5px solid transparent; background:transparent;
  font-weight:700; font-size:.92rem; color:var(--text); display:grid; place-items:center; cursor:pointer;
}
.booking-day[aria-disabled="true"]{ color:var(--text-muted); opacity:.45; font-weight:400; cursor:default; }
.booking-day.available{ background:var(--rose-soft); color:var(--rose-dark); }
.booking-day:not(.outside).available{ color:var(--text); }
.booking-day:not(.outside)[aria-disabled="true"]{ opacity:.6; }
.booking-day.outside{ opacity:.55; font-weight:400; }
.booking-day.outside[aria-disabled="true"]{ opacity:.4; }
.booking-day.outside.available{ font-weight:700; }
.booking-day.outside[aria-pressed="true"]{ opacity:1; color:var(--lamp-ink); }
.booking-day.today{ text-decoration:underline; text-underline-offset:3px; }
.booking-day[aria-pressed="true"], .booking-day:not(.outside).available[aria-pressed="true"]{ background:var(--lamp); color:var(--lamp-ink); }
@media (hover:hover){ .booking-day.available:hover{ border-color:var(--lamp); } }

.booking-slots h3{ font-size:1rem; margin-bottom:.8rem; text-transform:none; }
.booking-slots h3::first-letter{ text-transform:uppercase; }
.booking-slot-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)); gap:.5rem; }
.booking-slot{
  min-height:44px; border-radius:var(--radius-sm); border:1.5px solid var(--line); background:var(--card);
  font-weight:700; color:var(--text); cursor:pointer; font-variant-numeric:tabular-nums;
}
@media (hover:hover){ .booking-slot:hover{ border-color:var(--lamp); color:var(--rose-dark); } }
.booking-note{ color:var(--text-muted); font-size:.9rem; }
.booking-foot{ padding:0 1.5rem 1.2rem; font-size:.78rem; color:var(--text-muted); }
.booking-status{ padding:2.5rem 1.5rem; text-align:center; color:var(--text-muted); }
.booking-status .btn{ margin-top:1rem; }

@media (max-width: 640px){
  .booking-dialog{ width:100vw; max-width:100vw; max-height:92dvh; margin:auto 0 0; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
  .booking-body{ grid-template-columns:1fr; }
  .booking-cal{ border-right:0; border-bottom:1px solid var(--line); padding-inline:1rem; }
  .booking-slots{ min-height:0; padding-inline:1rem; }
  .booking-head{ padding-inline:1rem; }
  .booking-foot{ padding-inline:1rem; }
}

.grecaptcha-badge{ visibility:hidden; }