/* Agendar cita y próximas citas (19/10/2026). Botones grandes, como el resto de los flujos por pasos de la Torre. */
.cita-form .grid { gap: 14px; }
.cita-grupo { margin: 0; padding: 12px 14px; border: 1px solid var(--deus-borde, #2a3a48); border-radius: 10px; }
.cita-grupo legend { padding: 0 6px; font-weight: 700; }
.cita-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.cita-chip { position: relative; display: inline-flex; margin: 0; padding: 0; cursor: pointer; }
.cita-chip input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.cita-chip span, button.cita-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; font-size: .95rem; border: 1px solid var(--deus-borde, #2a3a48); border-radius: 999px; background: transparent; color: inherit; }
.cita-chip input:checked + span, button.cita-chip[aria-pressed="true"] { background: var(--deus-acento, #3b8fe6); border-color: var(--deus-acento, #3b8fe6); color: #fff; font-weight: 700; }
.cita-chip input:focus-visible + span { outline: 2px solid #fff; outline-offset: 2px; }
.cita-fila { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 8px 0; }
.cita-radio { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; }
.cita-radio input { width: 20px; height: 20px; min-height: 0; margin: 0; }
.cita-radio[hidden], .cita-ficha-lista[hidden] { display: none; }
.cita-ficha-lista { margin: 0 0 6px 30px; }
.cita-mas > summary { cursor: pointer; padding: 6px 0; }
.cita-guardar { min-height: 52px; font-size: 1.05rem; }

.cita-proximas h2 { margin-top: 28px; }
.cita-item { display: grid; grid-template-columns: 78px 1fr; gap: 6px 14px; margin: 10px 0; padding: 12px 14px; border: 1px solid var(--deus-borde, #2a3a48); border-radius: 10px; }
.cita-item.hoy { border-color: var(--deus-acento, #3b8fe6); }
.cita-fecha { text-align: center; }
.cita-fecha b { display: block; font-size: 1.1rem; }
.cita-fecha small { color: var(--deus-tenue, #9fb3c2); }
.cita-que p { margin: 2px 0; }
.cita-piso { padding: 1px 8px; font-size: .75rem; border: 1px solid var(--deus-borde, #2a3a48); border-radius: 999px; }
.cita-acciones { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.cita-acciones form { margin: 0; }
@media (max-width: 520px) { .cita-chip span, button.cita-chip { min-height: 46px; } }

/* En la ficha y en el piso */
.ficha-citas .cita-item { grid-template-columns: 78px 1fr; }

/* En el teléfono los días y las horas van en una sola fila que se desliza, para no ocupar media pantalla. */
@media (max-width: 520px) {
  #cita-dias, #cita-horas { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
  #cita-dias .cita-chip, #cita-horas .cita-chip { flex: 0 0 auto; }
  .cita-form { padding-bottom: 80px; }
}