/* Agenda pública de MITS - estilo tipo cal.com */
@font-face{font-family:'Plus Jakarta Sans';font-weight:400;font-display:swap;src:url('/assets/fonts/plus-jakarta-sans-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:600;font-display:swap;src:url('/assets/fonts/plus-jakarta-sans-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:700;font-display:swap;src:url('/assets/fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2')}

:root{
  --fondo:#0b0d13; --tarjeta:#14171f; --linea:#262a35; --texto:#f2f1f7; --suave:#9b98ad;
  --dia:#232733; --dia-hover:#2e3341; --sel-fondo:#f2f1f7; --sel-texto:#0b0d13;
  --marca:#8b3dff; --marca-osc:#6d1fe0; --ok:#3fcf86; --error:#ff6b81;
  color-scheme:dark;
}
@media (prefers-color-scheme:light){
  :root{
    --fondo:#f4f3f8; --tarjeta:#ffffff; --linea:#e5e2ee; --texto:#15121f; --suave:#6d6886;
    --dia:#efecf6; --dia-hover:#e2ddf0; --sel-fondo:#15121f; --sel-texto:#ffffff;
    --ok:#0f8a4a; --error:#c62844; color-scheme:light;
  }
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--fondo);color:var(--texto);font:15px/1.5 'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
a{color:var(--marca)}
h1{font-size:1.45rem;line-height:1.25;margin:.2rem 0 .8rem}
h2{font-size:1.05rem;margin:0}
h3{font-size:1rem;margin:0 0 .8rem}
.suave{color:var(--suave)} .chico{font-size:.85rem}
.centrado{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:4vh 16px 24px}
.tarjeta{background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;width:100%}
.tarjeta.chica{max-width:520px;padding:28px}
.logo{display:block;margin-bottom:14px}
.logo img{display:block;height:40px;width:auto;max-width:100%}
.logo.grande{display:flex;justify-content:center;margin:4px 0 0}
.logo.grande img{height:56px}
.logo.arriba img{height:28px}
.logo.arriba{margin-bottom:22px}
.titulo-logo{margin:0 0 14px}
.pie{text-align:center;padding:16px;font-size:.8rem;color:var(--suave)}
.pie a{color:inherit;text-decoration:none}

/* Perfil */
.perfil{max-width:620px;padding:32px;text-align:center}
.tipos{list-style:none;padding:0;margin:24px 0 0;text-align:left;border:1px solid var(--linea);border-radius:12px;overflow:hidden}
.tipos li+li{border-top:1px solid var(--linea)}
.tipos a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;color:var(--texto);text-decoration:none}
.tipos a:hover{background:var(--dia)}
.tipos a span:first-child{display:flex;flex-direction:column}
.tipos small{color:var(--suave);font-size:.85rem}
.pildora{white-space:nowrap;font-size:.8rem;font-weight:600;background:var(--dia);border-radius:8px;padding:3px 8px}

/* Booker: info | calendario | horarios */
.booker{max-width:1060px;display:grid;grid-template-columns:280px 1fr 240px}
.info{padding:24px;border-right:1px solid var(--linea)}
.info .logo{margin-bottom:18px}
.datos{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column;gap:10px;font-weight:600}
.datos select{max-width:200px;background:transparent;color:var(--texto);border:0;font:inherit;font-weight:600;padding:0;cursor:pointer}
.datos select option{background:var(--tarjeta)}
.descripcion{color:var(--suave);font-size:.9rem}
.aviso{background:var(--dia);border-radius:10px;padding:10px 12px;font-size:.88rem;margin-bottom:14px}
.paso{padding:24px}
.paso-fecha{border-right:1px solid var(--linea)}
.mes{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.mes h2::first-letter{text-transform:uppercase}
.flecha{width:34px;height:34px;border-radius:8px;border:0;background:transparent;color:var(--texto);font-size:1.4rem;cursor:pointer}
.flecha:hover:not(:disabled){background:var(--dia)}
.flecha:disabled{opacity:.3;cursor:default}
.dias-semana,.grilla{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dias-semana span{text-align:center;font-size:.72rem;font-weight:700;text-transform:uppercase;color:var(--suave);padding-bottom:4px}
.grilla button{aspect-ratio:1;border:0;border-radius:8px;font:inherit;font-weight:700;color:var(--texto);background:var(--dia);cursor:pointer;position:relative}
.grilla button:hover{background:var(--dia-hover)}
.grilla button:disabled{background:transparent;color:var(--suave);font-weight:400;cursor:default;opacity:.55}
.grilla button.hoy::after{content:'';position:absolute;bottom:6px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:currentColor}
.grilla button.sel{background:var(--sel-fondo);color:var(--sel-texto)}
.grilla .vacio{visibility:hidden}
.grilla.cargando{opacity:.4;pointer-events:none}
.paso-hora{max-height:560px;overflow:auto}
.paso-hora h3::first-letter{text-transform:uppercase}
.horas{display:flex;flex-direction:column;gap:8px}
.horas button{border:1px solid var(--linea);background:transparent;color:var(--texto);border-radius:8px;padding:10px;font:inherit;font-weight:600;cursor:pointer}
.horas button:hover{border-color:var(--texto)}
.horas .nada{color:var(--suave);font-size:.9rem}

/* Paso del formulario: ocupa calendario + horarios */
.booker.con-form .paso-fecha,.booker.con-form .paso-hora{display:none}
.paso-form{grid-column:2/4;display:flex;flex-direction:column;gap:12px;max-width:520px}
.paso-form[hidden]{display:none}
.volver{align-self:flex-start;background:none;border:0;color:var(--suave);font:inherit;cursor:pointer;padding:0}
.elegido{font-weight:700;margin:0}
.elegido::first-letter{text-transform:uppercase}
label{display:flex;flex-direction:column;gap:5px;font-size:.88rem;font-weight:600}
input,textarea{font:inherit;font-weight:400;color:var(--texto);background:var(--fondo);border:1px solid var(--linea);border-radius:8px;padding:10px 12px}
input:focus,textarea:focus{outline:2px solid var(--marca);border-color:transparent}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.error{color:var(--error);margin:0;font-size:.9rem}
.boton{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:9px;padding:11px 18px;font:inherit;font-weight:700;background:var(--sel-fondo);color:var(--sel-texto);cursor:pointer;text-decoration:none}
.boton:disabled{opacity:.6;cursor:wait}
.boton.secundario{background:var(--dia);color:var(--texto)}
.boton.peligro{background:var(--error);color:#fff}

/* Confirmación */
.icono-grande{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:1.5rem;font-weight:700;background:var(--dia);margin-bottom:10px}
.icono-grande.ok{background:var(--ok);color:#06210f}
.resumen{display:grid;grid-template-columns:90px 1fr;gap:10px 14px;margin:20px 0;padding:18px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.resumen dt{font-weight:700}
.resumen dd{margin:0}
.resumen dd::first-letter{text-transform:uppercase}
.acciones{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.cancelar{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.cancelar[hidden]{display:none}

@media (max-width:900px){
  .booker{grid-template-columns:1fr}
  .info,.paso-fecha{border-right:0;border-bottom:1px solid var(--linea)}
  .paso-hora{max-height:none}
  .horas{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}
  .paso-form{grid-column:1}
  .centrado{padding-top:16px}
}