/* ============================================================
   Dr. Víctor Pérez de Arenaza — Pedir cita (calendario + formulario)
   Solo se carga en site/cita/. Usa las variables de site.css.
   ============================================================ */

.cita-section{background:var(--beige);}

/* ---------- reserva a través de Quirónsalud / Fundación Jiménez Díaz ----------
   Sustituye de momento al calendario propio (ver comentario en cita/index.html). */
.cita-external{
  max-width:560px;
  margin:0 auto;
  background:var(--blanco);
  border:1px solid var(--beige-border);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow-card);
  padding:44px 40px;
  text-align:center;
}
.cita-external-lead{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:19px;
  color:var(--verde-deep);
  margin:0 0 22px;
}
.cita-external-btn{
  display:inline-flex;
  margin:0 0 30px;
}
.cita-external-steps{
  text-align:left;
  max-width:380px;
  margin:0 auto 26px;
  padding-left:22px;
  font-size:14.5px;
  line-height:1.9;
  color:var(--text-body);
}
.cita-external-steps li{margin-bottom:4px;}
.cita-external-steps strong{color:var(--text-dark);}
.cita-external-note{
  font-size:13.5px;
  line-height:1.6;
  color:var(--text-muted);
  margin:0;
  padding-top:22px;
  border-top:1px solid var(--beige-border);
}
.cita-external-note a{color:var(--verde-deep); font-weight:600; text-decoration:underline;}

@media (max-width:540px){
  .cita-external{padding:32px 24px;}
}

/* ---------- notas secundarias bajo el lead (confirmación / FJD) ---------- */
.cita-note{
  max-width:620px;
  margin:12px auto 0;
  font-size:14px;
  line-height:1.6;
  color:var(--text-muted);
}
.cita-note a{color:var(--verde-deep); font-weight:600; text-decoration:underline;}

/* ---------- estados: cargando / error ---------- */
.cita-state{
  text-align:center; color:var(--text-muted); font-size:15px; padding:36px 0;
}
.cita-error{display:flex; flex-direction:column; align-items:center; gap:16px;}
.cita-error p{margin:0; max-width:420px;}

/* ---------- leyenda libre / no disponible ---------- */
.cita-legend{
  display:flex; justify-content:center; gap:28px; margin:0 0 28px;
  font-size:13.5px; color:var(--text-body); font-weight:600;
}
.cita-legend[hidden], .cita-calendar[hidden], .cita-error[hidden]{display:none;}
.cita-legend-item{display:inline-flex; align-items:center; gap:8px;}
.cita-dot{width:11px; height:11px; border-radius:50%; display:inline-block;}
.cita-dot-free{background:var(--verde);}
.cita-dot-booked{background:var(--text-muted); opacity:.5;}

/* ---------- calendario: una tarjeta por jueves ---------- */
.cita-calendar{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:18px;
}
.cita-day{
  background:var(--blanco);
  border:1px solid var(--beige-border);
  border-radius:var(--radius-card);
  padding:22px 20px;
  box-shadow:var(--shadow-card);
}
.cita-day-head{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:16.5px;
  color:var(--verde-deep);
  text-align:center;
  margin:0 0 16px;
  text-transform:capitalize;
}
.cita-slots{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.cita-slot{
  appearance:none; border:1.5px solid var(--beige-border); background:var(--beige);
  border-radius:10px; padding:10px 6px; font-family:var(--font-sans); font-weight:600;
  font-size:13.5px; color:var(--verde-deep); cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.cita-slot:hover, .cita-slot:focus-visible{
  background:var(--verde); color:#fff; border-color:var(--verde); transform:translateY(-2px);
  box-shadow:var(--shadow-card);
}
.cita-slot.is-booked{
  background:var(--beige-border); color:var(--text-muted); border-color:var(--beige-border);
  cursor:not-allowed; opacity:.75;
}
.cita-slot.is-booked:hover{transform:none; background:var(--beige-border); color:var(--text-muted); box-shadow:none;}
.cita-slot:disabled{pointer-events:none;}
.cita-day-empty{
  text-align:center; font-size:13px; color:var(--text-muted); padding:10px 0;
}

/* ============================================================
   MODAL de reserva — extiende .simple-modal-overlay / -card
   ============================================================ */
.cita-modal-card{max-width:520px; text-align:left; padding:38px 32px;}
.cita-modal-card .eyebrow{display:block; margin-bottom:6px;}
.cita-modal-card h3{font-size:20px; margin-bottom:18px; color:var(--verde-deep);}

.cita-form{display:flex; flex-direction:column; gap:16px;}
.cita-form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.cita-field{display:flex; flex-direction:column; gap:6px; text-align:left;}
.cita-field label{font-size:13px; font-weight:600; color:var(--text-dark);}
.cita-field input[type="text"],
.cita-field input[type="tel"],
.cita-field textarea{
  width:100%;
  border:1.5px solid var(--beige-border);
  border-radius:12px;
  padding:12px 14px;
  font-family:var(--font-sans);
  font-size:14.5px;
  color:var(--text-dark);
  background:var(--beige);
  resize:vertical;
  transition:border-color .2s ease, background .2s ease;
}
.cita-field input[type="text"]:focus,
.cita-field input[type="tel"]:focus,
.cita-field textarea:focus{
  outline:none; border-color:var(--verde); background:var(--blanco);
}
.cita-field input[type="file"]{
  font-size:13px; color:var(--text-body);
}
.cita-file-hint{font-size:12px; color:var(--text-muted); margin:2px 0 0;}
.cita-file-hint.is-error{color:#a8443a;}

/* honeypot anti-spam: invisible pero presente en el DOM para bots */
.cita-hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

.cita-consent{
  display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--text-body);
  line-height:1.5; cursor:pointer;
}
.cita-consent input{margin-top:3px; flex-shrink:0; width:16px; height:16px; accent-color:var(--verde);}
.cita-consent a{text-decoration:underline;}

.cita-form-error{
  font-size:13px; color:#a8443a; background:rgba(168,68,58,.08); border-radius:10px;
  padding:10px 14px; margin:0;
}

.cita-submit{width:100%; justify-content:center;}
.cita-submit[disabled]{opacity:.65; cursor:not-allowed;}

.cita-success{text-align:center;}
.cita-success h3{font-size:21px; margin-bottom:10px; color:var(--verde-deep);}
.cita-success p{font-size:14.5px; line-height:1.6; margin:0 0 22px;}
.cita-success .simple-modal-icon{color:var(--verde);}

@media (max-width:540px){
  .cita-form-row{grid-template-columns:1fr;}
  .cita-modal-card{padding:30px 22px;}
}
