/* CIT — Selector publico (Fase 4) */
.cit-sel{--cit-azul:#0f5767;--cit-azul2:#37d67a;--cit-coral2:#22b567;--cit-borde:#e2e8f0;--cit-gris:#64748b;--cit-fondo:#f8fafc;
  max-width:820px;margin:0 auto;padding:8px 16px 48px;font-family:inherit;color:#0f172a;line-height:1.55}
.cit-sel h2{font-size:26px;line-height:1.25;margin:0 0 8px;color:var(--cit-azul)}
.cit-sel h3{font-size:15px;margin:0 0 6px;color:var(--cit-azul)}
.cit-sel-lead{color:var(--cit-gris);margin:0 0 22px}
.cit-sel-step{animation:citFade .25s ease}
@keyframes citFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.cit-sel-urgencia{background:#fff7ed;border:1px solid #fdba74;border-left:4px solid #ea580c;
  border-radius:10px;padding:12px 16px;margin:0 0 24px;font-size:14px;color:#7c2d12}
.cit-sel-urgencia a{color:#7c2d12;font-weight:700}

.cit-sel-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.cit-sel-card{display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:1px solid var(--cit-borde);
  border-radius:14px;padding:20px;cursor:pointer;transition:.15s;font:inherit;color:inherit}
.cit-sel-card:hover{border-color:var(--cit-azul);box-shadow:0 6px 18px rgba(15,110,110,.10);transform:translateY(-2px)}
.cit-sel-ico{font-size:26px}
.cit-sel-tit{font-weight:700;font-size:16px;color:var(--cit-azul)}
.cit-sel-desc{font-size:13.5px;color:var(--cit-gris)}
.cit-sel-precio{font-size:22px;font-weight:800;color:var(--cit-azul);margin-top:6px}
.cit-sel-precio small{display:block;font-size:12px;font-weight:600;color:var(--cit-gris)}
.cit-sel-precio-sm{font-size:16px}
.cit-sel-meta{font-size:12px;color:var(--cit-gris)}
.cit-sel-todos{margin-top:22px;font-size:14px}
.cit-sel-todos a{color:var(--cit-azul);font-weight:600}
.cit-sel-todos span{color:#cbd5e1;margin:0 8px}

.cit-sel-back{background:none;border:0;color:var(--cit-gris);font:inherit;font-size:14px;cursor:pointer;padding:0 0 12px}
.cit-sel-back:hover{color:var(--cit-azul)}
.cit-sel-nav{margin-top:24px}
.cit-sel-btn{background:var(--cit-azul2);color:#fff;border:0;border-radius:10px;padding:14px 24px;
  font:inherit;font-weight:700;font-size:15px;cursor:pointer;display:inline-block;text-decoration:none}
.cit-sel-btn:hover{background:var(--cit-coral2)}
.cit-sel-btn[disabled]{background:#94a3b8;cursor:default}
.cit-sel-btn-sm{padding:10px 18px;font-size:14px}

.cit-sel-box{background:var(--cit-fondo);border:1px solid var(--cit-borde);border-radius:12px;padding:16px 18px;margin:0 0 14px}
.cit-sel-q{font-weight:700;margin:0 0 10px;font-size:15px}
.cit-sel-nota{font-size:13px;color:var(--cit-gris);margin:8px 0 0}
.cit-sel-radio,.cit-sel-check{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--cit-borde);
  border-radius:9px;padding:11px 13px;margin-bottom:8px;cursor:pointer;font-size:14px}
.cit-sel-radio:hover,.cit-sel-check:hover{border-color:var(--cit-azul)}
.cit-sel-radio input,.cit-sel-check input{margin-top:2px;flex:0 0 auto}
.cit-sel-radio em{color:var(--cit-gris);font-style:normal;font-size:12.5px}

.cit-sel-alerta{background:#fef2f2;border:1px solid #fca5a5;border-radius:10px;padding:12px 14px;font-size:13.5px;color:#7f1d1d;margin-top:10px}
.cit-sel-alerta a{color:#7f1d1d;font-weight:700}
.cit-sel-info{background:#eff6ff;border-color:#93c5fd;color:#1e3a8a}
.cit-sel-info a{color:#1e3a8a}

.cit-sel-dia{border:1px solid var(--cit-borde);border-radius:12px;padding:14px 16px;margin-bottom:12px;background:#fff}
.cit-sel-dia-h{font-weight:700;color:var(--cit-azul);margin-bottom:10px;font-size:15px}
.cit-sel-dia-h small{display:block;font-weight:500;color:var(--cit-gris);font-size:12.5px}
.cit-sel-horas{display:flex;flex-wrap:wrap;gap:8px}
.cit-sel-hora{border:1px solid var(--cit-borde);background:#fff;border-radius:8px;padding:9px 14px;font:inherit;font-size:14px;cursor:pointer}
.cit-sel-hora:hover{border-color:var(--cit-azul);color:var(--cit-azul)}
.cit-sel-hora.sel{background:var(--cit-azul);color:#fff;border-color:var(--cit-azul)}

.cit-sel-resumen{border:1px solid var(--cit-borde);border-radius:12px;overflow:hidden;margin-bottom:16px;background:#fff}
.cit-sel-rr{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;border-bottom:1px solid var(--cit-borde);font-size:14px}
.cit-sel-rr:last-child{border-bottom:0}
.cit-sel-rr span{color:var(--cit-gris)}
.cit-sel-rr strong{text-align:right}
.cit-sel-cobros{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.cit-sel-cobro{border:1px solid var(--cit-borde);border-radius:12px;padding:16px;background:#fff}
.cit-sel-cobro-off{background:var(--cit-fondo);opacity:.85}
.cit-sel-monto{font-size:24px;font-weight:800;color:var(--cit-azul);margin:0}
.cit-sel-cobro ul{margin:10px 0 0;padding-left:18px;font-size:13px;color:var(--cit-gris)}
.cit-sel-total{display:flex;justify-content:space-between;align-items:center;background:var(--cit-azul);color:#fff;
  border-radius:12px;padding:14px 18px;font-size:15px}
.cit-sel-total strong{font-size:22px}
.cit-sel-legal{font-size:12.5px;color:var(--cit-gris);margin-top:12px;border-left:3px solid var(--cit-borde);padding-left:12px}

.cit-sel-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cit-sel label{display:block;font-size:13px;font-weight:600;color:#334155}
.cit-sel input[type=text],.cit-sel input[type=tel],.cit-sel input[type=email],.cit-sel input[type=date],
.cit-sel select,.cit-sel textarea{width:100%;border:1px solid var(--cit-borde);border-radius:9px;padding:11px 12px;
  font:inherit;font-size:15px;font-weight:400;margin-top:5px;background:#fff;color:#0f172a}
.cit-sel input:focus,.cit-sel select:focus,.cit-sel textarea:focus{outline:2px solid var(--cit-azul);outline-offset:1px}
.cit-sel-full{display:block;margin-top:12px}
.cit-sel-opt{font-weight:400;color:var(--cit-gris)}
.cit-sel-menor{background:#fffbeb;border:1px solid #fcd34d;border-radius:12px;padding:14px 16px;margin-top:14px}
.cit-sel-consent{margin-top:18px}
.cit-sel-consent .cit-sel-check{align-items:flex-start;font-size:13px;line-height:1.5}
.cit-sel-consent a{color:var(--cit-azul);font-weight:600}
.cit-sel-err{color:#b91c1c;font-size:14px;font-weight:600;margin:12px 0 0;min-height:18px}

.cit-sel-otp{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.cit-sel-otp input{max-width:180px;letter-spacing:.35em;font-size:20px;text-align:center}

.cit-sel-ok{text-align:center;padding:16px 0}
.cit-sel-ok-ico{display:inline-flex;width:56px;height:56px;border-radius:50%;background:#dcfce7;color:#166534;
  align-items:center;justify-content:center;font-size:28px;margin-bottom:12px}
.cit-sel-folio{font-size:15px;color:var(--cit-gris)}
.cit-sel-ok .cit-sel-resumen{text-align:left;margin-top:16px}

.cit-sel-load{position:fixed;inset:0;background:rgba(255,255,255,.72);display:flex;align-items:center;justify-content:center;z-index:9999}
.cit-sel-spin{width:44px;height:44px;border:4px solid var(--cit-borde);border-top-color:var(--cit-azul);border-radius:50%;animation:citSpin .8s linear infinite}
@keyframes citSpin{to{transform:rotate(360deg)}}

@media (max-width:640px){
  .cit-sel h2{font-size:22px}
  .cit-sel-grid2,.cit-sel-cobros{grid-template-columns:1fr}
  .cit-sel-rr{flex-direction:column;gap:2px}
  .cit-sel-rr strong{text-align:left}
}
.cit-sel-msi{background:#f0fdf4;border:1px solid #86efac;border-radius:10px;padding:12px 14px;margin-top:12px;font-size:14px;color:#14532d}
.cit-sel-msi .cit-sel-nota{color:#166534}
/* El overlay declara display:flex, que gana sobre el [hidden] del navegador:
   sin esto el spinner tapaba la pagina completa y se comia los clics. */
.cit-sel [hidden],.cit-sel-load[hidden]{display:none!important}
/* El tema pinta TODOS los <button> en blanco: sin color explicito los
   horarios salian invisibles (texto blanco sobre fondo blanco). */
/* Hay una hoja en linea del sitio con
   `button,...,[class*="-btn"] { color:#fff !important }`. Sin !important
   aqui, los horarios salen en blanco sobre blanco. */
.cit-sel .cit-sel-hora{color:var(--cit-azul)!important;background:#fff!important}
.cit-sel .cit-sel-hora:hover{color:var(--cit-azul)!important;background:#f1f5f9!important}
.cit-sel .cit-sel-hora.sel{color:#fff!important;background:var(--cit-azul)!important}
.cit-sel .cit-sel-card{color:#0f172a!important;background:#fff!important}
.cit-sel .cit-sel-back{color:var(--cit-gris)!important;background:none!important}
.cit-sel .cit-sel-btn{color:#fff!important;background:var(--cit-azul2)!important}
.cit-sel .cit-sel-btn:hover{color:#fff!important;background:var(--cit-coral2)!important}
/* Dos horarios concretos, no la agenda completa (regla del agendador HSZV). */
.cit-sel-propuestas{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:6px}
.cit-sel .cit-sel-prop{display:flex;flex-direction:column;gap:4px;text-align:left;border:1px solid var(--cit-borde);
  border-radius:14px;padding:18px 20px;cursor:pointer;font:inherit;color:#0f172a!important;background:#fff!important;transition:.15s}
.cit-sel .cit-sel-prop:hover{border-color:var(--cit-azul);box-shadow:0 6px 18px rgba(15,110,110,.10);transform:translateY(-2px)}
.cit-sel .cit-sel-prop.sel{border-color:var(--cit-azul);background:#eaf2f0!important;box-shadow:inset 0 0 0 1px var(--cit-azul)}
.cit-sel-prop-f{font-weight:700;color:var(--cit-azul);font-size:15px}
.cit-sel-prop-h{font-size:28px;font-weight:800;color:var(--cit-azul);line-height:1.1}
.cit-sel-prop-a{font-size:12.5px;color:var(--cit-gris)}
@media (max-width:640px){.cit-sel-propuestas{grid-template-columns:1fr}}

/* Avance por semanas: nunca se muestra la agenda completa. */
.cit-sel .cit-sel-semana{margin:0 0 .6rem;font-weight:600;color:#0f766e!important}
.cit-sel .cit-sel-nota{color:#475569!important}
.cit-sel .cit-sel-atras{margin-left:.75rem;color:#475569!important}
