:root {
  --kontrol-marino: #1c2733;
  --kontrol-marino-claro: #2a3a4a;
  --kontrol-rojo: #d0342c;
  --kontrol-rojo-oscuro: #a3271f;
  --kontrol-blanco: #f4f5f7;
  --kontrol-texto: #1c2733;
  --kontrol-texto-suave: #5a6472;
  --kontrol-borde: #dde1e6;
  --kontrol-exito: #1d9e75;
  --kontrol-aviso: #ba7517;
  --radio: 12px;
}

html { width:100%; -webkit-text-size-adjust:100%; text-size-adjust:100%; }

input[type="date"], input[type="month"] { width:100%; padding:12px; border:1px solid var(--kontrol-borde); border-radius:8px; font:inherit; }
.persiana { margin-bottom:12px; border:1px solid var(--kontrol-borde); border-radius:12px; background:white; }
.persiana > summary { padding:18px; font-weight:700; cursor:pointer; }
.persiana > .tarjeta { margin:0; border:0; }
.alumno-listado { padding:16px 0; border-bottom:1px solid var(--kontrol-borde); }
.alumno-listado .enlace-texto { text-align:left; margin:12px 0; }
.bienvenida h1 { font-size:30px; line-height:1.15; }
.bienvenida p { line-height:1.6; }
.opcion-centro { display:flex; align-items:center; gap:8px; }
fieldset { margin:18px 0 0; border:1px solid var(--kontrol-borde); border-radius:8px; padding:12px; }
fieldset legend { font-size:14px; font-weight:600; }
.dialogo-modalidad { width:calc(100% - 24px); max-width:540px; max-height:calc(100dvh - 32px); padding:24px; border:0; border-radius:16px; color:var(--kontrol-texto); overflow-y:auto; box-shadow:0 20px 70px #0005; }
.dialogo-modalidad::backdrop { background:rgb(15 25 35 / 65%); }
.dialogo-cabecera { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.dialogo-cabecera h2 { margin:0; font-size:23px; }
.dialogo-cerrar { border:0; background:var(--kontrol-blanco); color:var(--kontrol-texto); border-radius:8px; min-width:40px; height:40px; font-size:26px; cursor:pointer; }
.dialogo-explicacion { line-height:1.5; color:var(--kontrol-texto-suave); }
@media (max-width:480px) { .dialogo-modalidad { padding:18px; } }

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--kontrol-blanco);
  color: var(--kontrol-texto);
  min-height: 100vh;
}

.cabecera {
  background: var(--kontrol-marino);
  color: white;
  padding: 14px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 10;
}

.marca {
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 1px;
}

.marca-k { color: var(--kontrol-rojo); }

.cabecera-usuario {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
}

.oculto { display: none !important; }

.boton-texto {
  background: none;
  border: none;
  color: white;
  opacity: 0.8;
  text-decoration: underline;
  cursor: pointer;
  font-size: 14px;
  padding: 4px;
}

.boton-contactos { width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 38px; background:transparent; border:0; border-radius:50%; color:white; cursor:pointer; padding:4px; }
.boton-contactos img { display:block; width:30px; height:30px; object-fit:contain; }
.boton-contactos:hover,.boton-contactos:focus-visible { background:rgba(255,255,255,.12); outline:2px solid rgba(255,255,255,.7); outline-offset:1px; }
.miembros-pack { margin:-4px 0 10px; color:var(--kontrol-texto-suave); font-size:13px; }
.detalle-pack-pago { grid-column:1/-1; margin:3px 0; color:var(--kontrol-texto-suave); font-size:13px; text-align:left; }
.contactos-discretos { display:grid; gap:8px; }
.contactos-discretos a { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--kontrol-borde); color:var(--kontrol-texto); text-decoration:none; }

.app {
  max-width: 480px;
  margin: 0 auto;
  padding: 20px 16px 90px;
}

.cargando { text-align: center; color: var(--kontrol-texto-suave); padding: 40px 0; }

.tarjeta {
  background: white;
  border: 1px solid var(--kontrol-borde);
  border-radius: var(--radio);
  padding: 20px;
  margin-bottom: 16px;
}

.titulo-pantalla {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 4px;
}

.subtitulo-pantalla {
  color: var(--kontrol-texto-suave);
  margin: 0 0 24px;
  font-size: 14px;
}

label {
  display: block;
  font-size: 13px;
  color: var(--kontrol-texto-suave);
  margin-bottom: 6px;
  margin-top: 14px;
}

input[type="text"], input[type="tel"], input[type="email"], input[type="number"], select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--kontrol-borde);
  border-radius: 8px;
  font-size: 16px;
  background: white;
  color: var(--kontrol-texto);
}

input:focus, select:focus {
  outline: none;
  border-color: var(--kontrol-marino);
}

.boton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 20px;
  transition: opacity 0.15s;
}

.boton:active { opacity: 0.85; }
.boton:disabled { opacity: 0.5; cursor: not-allowed; }
.boton-pago-resumen:disabled { background:#aeb3b8; color:#fff; opacity:1; cursor:not-allowed; box-shadow:none; }

.boton-primario { background: var(--kontrol-rojo); color: white; }
.boton-secundario { background: var(--kontrol-marino); color: white; }
.boton-borde { background: white; color: var(--kontrol-marino); border: 1px solid var(--kontrol-marino); }

.boton-pequeno {
  width: auto;
  padding: 8px 14px;
  font-size: 13px;
  margin-top: 0;
}

/* Teclado de PIN */
.pin-visor {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 24px 0;
}

.pin-punto {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid var(--kontrol-marino);
  background: transparent;
}

.pin-punto.lleno { background: var(--kontrol-marino); }

.teclado {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 280px;
  margin: 0 auto;
}

.tecla {
  padding: 18px 0;
  font-size: 22px;
  border: 1px solid var(--kontrol-borde);
  border-radius: 12px;
  background: white;
  cursor: pointer;
}

.tecla:active { background: var(--kontrol-blanco); }
.tecla-vacia { visibility: hidden; }

.mensaje-error {
  color: var(--kontrol-rojo);
  font-size: 14px;
  text-align: center;
  margin-top: 12px;
  min-height: 18px;
}

.mensaje-exito {
  color: var(--kontrol-exito);
  font-size: 14px;
  text-align: center;
  margin-top: 12px;
}

.pin-destacado {
  font-size: 42px;
  font-weight: 700;
  letter-spacing: 8px;
  text-align: center;
  color: var(--kontrol-marino);
  background: var(--kontrol-blanco);
  border-radius: var(--radio);
  padding: 24px;
  margin: 20px 0;
}

.aviso-caja {
  background: #fdf3ea;
  border: 1px solid var(--kontrol-aviso);
  color: #7a4a0d;
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 13px;
  margin-top: 16px;
}

/* Estados de pago */
.estado-chip {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

.estado-pagado { background: #e1f5ee; color: #085041; }
.estado-en_revision { background: #fdf3ea; color: #7a4a0d; }
.estado-pendiente { background: #fff1b8; color: #664d03; }
.estado-vencido { background: #faece7; color: #712b13; }
.estado-parcial { background: #fff0d5; color: #7a4a0d; }
.estado-sin_generar { background: var(--kontrol-blanco); color: var(--kontrol-texto-suave); }
.estado-no_aplica { background:#eceeef; color:var(--kontrol-texto-suave); }
.estado-incluido { background:#e8eef5; color:#35506b; }
.estado-proximo { background:#eef2f6; color:#486174; }

.fila-pago {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid var(--kontrol-borde);
}

.fila-pago:last-child { border-bottom: none; }

.fila-pago-info p { margin: 0; }
.fila-pago-info .nombre { font-weight: 600; }
.fila-pago-info .detalle { font-size: 13px; color: var(--kontrol-texto-suave); }

.importe-grande {
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  margin: 8px 0 4px;
}
.resumen-importe-pago { margin:16px 0; padding:14px 16px; border:2px solid var(--kontrol-marino); border-radius:10px; background:#f7f9fa; }
.resumen-importe-pago>div { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:5px 0; }
.resumen-importe-pago span { min-width:0; }
.resumen-importe-pago strong { flex:0 0 auto; white-space:nowrap; text-align:right; }
.resumen-importe-pago .total-pago { margin-top:7px; padding-top:12px; border-top:1px solid var(--kontrol-borde); font-size:19px; }

.periodo-texto {
  text-align: center;
  color: var(--kontrol-texto-suave);
  font-size: 14px;
  margin-bottom: 20px;
}

/* Navegación inferior (monitor/director) */
.nav-inferior {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  border-top: 1px solid var(--kontrol-borde);
  display: flex;
  z-index: 10;
}

.nav-item {
  flex: 1;
  text-align: center;
  padding: 12px 4px 10px;
  font-size: 12px;
  color: var(--kontrol-texto-suave);
  background: none;
  border: none;
  cursor: pointer;
}

.nav-item.activo { color: var(--kontrol-rojo); font-weight: 600; }

.enlace-texto {
  background: none;
  border: none;
  color: var(--kontrol-marino);
  text-decoration: underline;
  font-size: 14px;
  cursor: pointer;
  padding: 0;
  margin-top: 16px;
  display: block;
  text-align: center;
  width: 100%;
}

.input-archivo-envoltorio {
  border: 1px dashed var(--kontrol-borde);
  border-radius: 8px;
  padding: 16px;
  text-align: center;
  margin-top: 14px;
  font-size: 13px;
  color: var(--kontrol-texto-suave);
}

.tabla-simple { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabla-simple th, .tabla-simple td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--kontrol-borde); }
.tabla-simple th { color: var(--kontrol-texto-suave); font-weight: 600; font-size: 12px; }
.tabla-simple small { display:block; margin-top:4px; color:var(--kontrol-texto-suave); }
.tabla-scroll { overflow-x:auto; }
.resumen-doble,.resumen-listado-dinero { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--kontrol-borde); border-radius:10px; overflow:hidden; margin:16px 0; }
.resumen-doble > div,.resumen-listado-dinero > div { background:white; padding:14px 10px; text-align:center; }
.resumen-doble span,.resumen-doble small,.resumen-listado-dinero span,.resumen-listado-dinero small { display:block; color:var(--kontrol-texto-suave); font-size:12px; }
.resumen-doble strong,.resumen-listado-dinero strong,.resumen-monitor strong { display:block; font-size:24px; }
.resumen-listado-dinero { grid-template-columns:repeat(3,minmax(0,1fr)); }
.resumen-listado-dinero strong { font-size:18px; }
.resumen-monitor { display:flex; justify-content:space-between; align-items:center; }
.acciones-contacto,.pestanas-disciplinas { display:flex; flex-wrap:wrap; gap:8px; }
.acciones-contacto .boton,.pestanas-disciplinas .boton { width:auto; flex:1 1 140px; margin:0; }
.boton-whatsapp { background:#1fa855; color:white; text-decoration:none; text-align:center; }
.filtro-fijo { margin:10px 0; }
.resumen-alumno details { margin-bottom:14px; }
input[type="search"],input[type="month"] { width:100%; border:1px solid var(--kontrol-borde); border-radius:8px; padding:12px 14px; font-size:16px; }

/* Listados: reproduce el panel horizontal aprobado */
.app.app-listados { max-width:1180px; padding:22px 18px 90px; }
.barra-filtros-listados { display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)); gap:12px; align-items:end; margin-bottom:14px; }
.barra-filtros-listados label { margin:0; color:var(--kontrol-texto); }
.barra-filtros-listados select,.barra-filtros-listados input { margin-top:5px; height:46px; background:white; }
.filtro-unico { margin:0; min-height:46px; padding:5px 0; align-self:end; }
.filtro-unico span { display:block; font-size:13px; }
.filtro-unico strong { display:block; margin-top:7px; }
.resumen-listados { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:white; border:1px solid var(--kontrol-borde); border-radius:10px; margin-bottom:20px; overflow:hidden; }
.resumen-listados > div { position:relative; padding:12px 16px; text-align:center; }
.resumen-listados > div+div::before { content:""; position:absolute; left:0; top:12px; bottom:12px; width:1px; background:var(--kontrol-borde); }
.resumen-listados span,.resumen-listados small { display:block; font-size:13px; }
.resumen-listados strong { display:block; font-size:23px; }
.resumen-listados .resumen-monitor { grid-column:1/-1; justify-content:center; gap:22px; }
.cabecera-listados { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:12px; }
.cabecera-listados h1 { margin:0; font-size:25px; }
.cabecera-listados input { width:min(290px,42%); background:white; }
.acciones-listados { display:flex; gap:12px; margin-bottom:12px; }
.acciones-listados button { min-height:42px; padding:8px 16px; border:1px solid var(--kontrol-borde); border-radius:8px; background:#e9eaec; color:var(--kontrol-texto); font:inherit; cursor:pointer; }
.acciones-listados button:last-child { margin-left:auto; }
.acciones-listados button:disabled { opacity:.48; cursor:not-allowed; }
.tabla-listados-contenedor { background:white; border:1px solid #9da4ab; border-radius:10px; overflow:hidden; }
.tabla-listados-scroll { overflow-x:auto; }
.tabla-listados { width:100%; min-width:670px; border-collapse:collapse; table-layout:fixed; }
.tabla-listados .col-check { width:42px; }
.tabla-listados .col-alumno { width:230px; }
.tabla-listados .col-mes { width:92px; }
.tabla-listados .col-menu { width:48px; }
.tabla-listados thead { background:var(--kontrol-marino); color:white; }
.tabla-listados thead th { padding:8px 6px; border-right:1px solid #65717c; text-align:center; font-size:14px; }
.tabla-listados .cabecera-meses > th:nth-child(2) { text-align:left; }
.tabla-listados thead small { display:block; font-weight:400; opacity:.8; }
.tabla-listados .cabecera-meses th { height:36px; padding-block:4px; }
.tabla-listados .cabecera-meses th[rowspan] { height:86px; }
.tabla-listados .cabecera-meses th[colspan] { padding:0; }
.tabla-listados .cabecera-meses span { display:inline-block; min-width:160px; }
.tabla-listados .cabecera-meses button { width:40px; min-height:34px; border:0; background:transparent; color:white; font-size:28px; cursor:pointer; }
.tabla-listados .cabecera-meses button:disabled { opacity:.25; cursor:not-allowed; }
.tabla-listados thead tr:nth-child(2) th { height:50px; }
.tabla-listados tbody td,.tabla-listados tbody th { border-right:1px solid #c9cdd1; border-bottom:1px solid #c9cdd1; padding:10px 6px; text-align:center; }
.tabla-listados .fila-alumno>th { text-align:left; }
.tabla-listados .fila-alumno>th strong,.tabla-listados .fila-alumno>th small { display:block; }
.tabla-listados .fila-alumno>th small { color:var(--kontrol-texto-suave); margin-top:3px; }
.tabla-listados .fila-grupo th { background:#eef0f2; text-align:left; padding:9px 10px; font-size:16px; }
.tabla-listados .fila-grupo span { font-weight:400; }
.tabla-listados tbody .fila-pack-familiar>td,.tabla-listados tbody .fila-pack-familiar>th { background:#eef7f3; }
.tabla-listados tbody .fila-pack-familiar>td:first-child { border-left:4px solid #3d8b70; }
.tabla-listados .detalle-pack-familiar td { background:#f6fbf8; }
.tabla-listados .pie-pack-familiar th { padding:7px 12px; border-bottom:2px solid #3d8b70; background:#dbeee6; color:#245b48; text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.tabla-listados .estado-chip { display:inline-flex; box-sizing:border-box; align-items:center; justify-content:center; width:80px; min-height:38px; padding:1px 2px; border-radius:7px; color:white; line-height:1.05; white-space:normal; }
.tabla-listados .estado-pagado { background:#20a653; }
.tabla-listados .estado-pendiente { background:#e9b619; color:#2e2a18; }
.tabla-listados .estado-vencido { background:#e52f2f; }
.tabla-listados .estado-parcial { background:#f2a31b; }
.tabla-listados .estado-en_revision { background:#5b76a8; }
.tabla-listados .estado-no_aplica { background:#92979d; }
.tabla-listados .estado-incluido { background:#607d9a; }
.tabla-listados .estado-proximo { background:#71879a; }
.menu-fila { border:0; background:transparent; font-size:27px; cursor:pointer; }
.detalle-fila td { text-align:left!important; background:#f7f8f9; padding:12px!important; }
.sin-resultados { padding:24px; text-align:center; }
#enlaces-avisos .boton { margin-top:8px; }

@media (max-width:760px) {
  .app.app-listados { padding-inline:10px; }
  .barra-filtros-listados { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cabecera-listados { align-items:stretch; flex-direction:column; }
  .cabecera-listados input { width:100%; }
  .acciones-listados { flex-wrap:wrap; gap:7px; }
  .acciones-listados button { flex:1 1 150px; padding-inline:8px; }
  .acciones-listados button:last-child { margin-left:0; }
  .resumen-listados { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .resumen-listados > div:nth-child(3)::before { display:none; }
  .tabla-listados { min-width:550px; }
  .tabla-listados .col-check { width:34px; }
  .tabla-listados .col-alumno { width:170px; }
  .tabla-listados .col-mes { width:75px; }
  .tabla-listados .col-menu { width:40px; }
  .tabla-listados .estado-chip { width:60px; font-size:11px; }
  .tabla-listados tbody td,.tabla-listados tbody th { padding-inline:4px; }
}

@media (max-width:420px) {
  .barra-filtros-listados { grid-template-columns:1fr; }
  .cabecera-listados h1 { font-size:21px; }
}

.boton-alta-ficha { width:36px; height:36px; border:0; border-radius:50%; background:var(--primario, #263b48); color:white; font-size:26px; cursor:pointer; display:block; margin-left:auto; }

/* Gestión de fichas */
.app.app-admin { max-width:900px; }
.gestion-fichas .boton-alta-ficha { width:44px; height:44px; margin:0 0 14px auto; line-height:40px; }
.filtros-gestion-fichas { display:grid; grid-template-columns:minmax(210px,1.5fr) minmax(120px,.8fr) minmax(170px,1fr); gap:14px; align-items:end; padding-bottom:16px; border-bottom:1px solid var(--kontrol-borde); }
.filtros-gestion-fichas label { margin:0; }
.filtros-gestion-fichas input,.filtros-gestion-fichas select { height:46px; margin-top:5px; background:white; }
.solo-lectores { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.cabecera-lista-fichas { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:18px 0 12px; }
.cabecera-lista-fichas h3 { margin:0 0 10px; font-size:19px; }
.cabecera-lista-fichas>p { margin:2px 0 0; color:var(--kontrol-texto-suave); font-size:12px; text-align:right; }
.leyenda-fichas { display:flex; flex-wrap:wrap; gap:8px 16px; color:var(--kontrol-texto-suave); font-size:12px; }
.leyenda-fichas span { display:inline-flex; align-items:center; gap:6px; }
.punto-ficha { display:inline-block; width:16px; height:16px; flex:0 0 16px; border-radius:50%; background:#aeb3b8; box-shadow:inset 0 0 0 1px #0001; }
.punto-ficha.estado-al_dia { background:#25ad5a; }
.punto-ficha.estado-atrasado { background:#e53838; }
.punto-ficha.estado-pendiente { background:#e5a323; }
.punto-ficha.estado-cuenta { background:#3578b8; }
.punto-ficha.estado-inactivo { background:#aeb3b8; }
.tabla-fichas-scroll { overflow-x:auto; border-top:1px solid var(--kontrol-borde); }
.tabla-fichas { width:100%; min-width:700px; border-collapse:collapse; table-layout:fixed; font-size:13px; }
.tabla-fichas th,.tabla-fichas td { padding:10px 7px; border-bottom:1px solid var(--kontrol-borde); text-align:left; vertical-align:middle; }
.tabla-fichas thead th { color:var(--kontrol-texto-suave); font-weight:600; }
.tabla-fichas thead th:first-child,.tabla-fichas tbody td:first-child { width:30px; text-align:center; }
.tabla-fichas thead th:nth-child(2) { width:190px; }
.tabla-fichas thead th:nth-child(3) { width:80px; }
.tabla-fichas thead th:nth-child(4) { width:125px; }
.tabla-fichas thead th:last-child { width:134px; text-align:center; }
.tabla-fichas tbody tr:nth-child(odd) { background:#fafafa; }
.tabla-fichas tbody .fila-pack-familiar>td,.tabla-fichas tbody .fila-pack-familiar>th { background:#eef7f3; }
.tabla-fichas tbody .fila-pack-familiar>td:first-child { border-left:4px solid #3d8b70; }
.tabla-fichas .pie-pack-familiar th { padding:7px 12px; border-bottom:2px solid #3d8b70; background:#dbeee6; color:#245b48; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.tabla-fichas tbody th strong,.tabla-fichas tbody th small { display:block; }
.tabla-fichas tbody th small { margin-top:3px; color:var(--kontrol-texto-suave); font-weight:400; }
.nombre-ficha { display:block; max-width:100%; padding:0; border:0; background:none; color:var(--kontrol-marino); font:inherit; font-weight:700; text-align:left; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; cursor:pointer; }
.nombre-ficha:disabled { color:inherit; text-decoration:none; cursor:not-allowed; }
.etiquetas-disciplinas { display:flex; flex-wrap:wrap; gap:4px; }
.etiquetas-disciplinas span { padding:3px 8px; border-radius:12px; background:#e5e7ea; white-space:nowrap; }
.acciones-ficha { display:flex; justify-content:center; gap:7px; }
.acciones-ficha button { width:36px; height:36px; border:1px solid var(--kontrol-marino); border-radius:7px; background:white; color:var(--kontrol-marino); font-size:20px; font-weight:700; cursor:pointer; }
.acciones-ficha .borrar-ficha { border-color:#b42318; color:#b42318; }
.acciones-ficha button:disabled { opacity:.35; cursor:not-allowed; }
.asignaciones-monitor { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:10px; }
.asignaciones-monitor>div { padding:12px; border:1px solid var(--kontrol-borde); border-radius:8px; }
.asignaciones-monitor strong { display:block; margin-bottom:8px; }
.asignaciones-monitor .opcion-centro { margin:6px 0; }
@media (max-width:650px) {
 .filtros-gestion-fichas { grid-template-columns:1fr 1fr; }
 .filtros-gestion-fichas label:first-child { grid-column:1/-1; }
 .cabecera-lista-fichas { flex-direction:column; }
 .cabecera-lista-fichas>p { text-align:left; }
 .asignaciones-monitor { grid-template-columns:1fr; }
}



/* Resumen visual de pagos e iconos reutilizables */
.cabecera-plan-resumen { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cabecera-plan-resumen h1 { margin:0; }
.estado-plan-resumen { display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; padding:7px 10px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; }
.estado-plan-al-dia { background:#dff5e7; color:#13733b; }
.estado-plan-pendiente { background:#fde8e8; color:#a21f1f; }
.resumen-al-dia { border:1px solid #b9dec5; box-shadow:0 0 0 2px rgba(32,166,83,.06); }
.resumen-con-deuda { border:1px solid #efb7b7; }
.mensaje-al-dia { color:#168044 !important; font-weight:700; }
.icono-ui,.icono-estado { width:18px; height:18px; display:inline-block; vertical-align:middle; flex:0 0 auto; }
.icono-boton-pago { width:23px; height:18px; display:inline-block; flex:0 0 auto; }
.icono-estado:not(.icono-estado-pagado) { display:none; }
.estado-chip { display:inline-flex; align-items:center; justify-content:center; gap:5px; }
@media (max-width:420px) {
  .cabecera-plan-resumen { align-items:flex-start; }
  .estado-plan-resumen { font-size:11px; padding:6px 8px; }
}
/* Declaración de pagos sin archivos */
.metodos-pago{border:0;padding:0;margin:20px 0 12px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.metodos-pago legend{font-weight:700;margin-bottom:10px}
.opcion-metodo{display:flex;align-items:center;gap:10px;min-height:70px;margin:0;padding:12px;border:2px solid var(--kontrol-borde);border-radius:10px;background:#fff;cursor:pointer}
.opcion-metodo.seleccionada{border-color:var(--kontrol-marino);background:#f2f6f8;box-shadow:0 0 0 1px var(--kontrol-marino)}
.opcion-metodo input{width:20px;height:20px;margin:0;flex:0 0 auto}
.opcion-metodo span{display:flex;flex-direction:column;gap:3px}
.opcion-metodo small{color:var(--kontrol-texto-suave);line-height:1.25}
.datos-transferencia{margin:12px 0 18px;padding:14px;border:1px solid #9bc6aa;border-radius:10px;background:#f1faf4}
.datos-transferencia[hidden]{display:none}
.datos-transferencia .ayuda-campo{margin:8px 0 0;color:#27623b;font-size:13px;line-height:1.4}
.metodo-transferencia{margin-top:6px!important;padding:8px 10px;border-radius:7px;background:#f1faf4;color:#27623b!important}
.metodo-efectivo{margin-top:6px!important;font-weight:600;color:#364b5b!important}
.acciones-cobro{display:flex;gap:7px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.estado-rechazado{background:#fde7e7;color:#9b1c1c}
.estado-anulado{background:#eceff2;color:#4f5963;text-decoration:line-through}
.aviso-error{border-color:#d88;background:#fff4f4;color:#8a1f1f}
@media(max-width:560px){.metodos-pago{grid-template-columns:1fr}.fila-pago{align-items:flex-start}.acciones-cobro{width:100%;justify-content:stretch}.acciones-cobro .boton{flex:1 1 auto}}

/* Cambio de plan desde el pago */
.boton-cambiar-plan-pago{margin:0 0 6px;width:100%;font-weight:700;border-width:2px}
.ayuda-cambio-plan{margin:0 0 18px;color:var(--kontrol-texto-suave);font-size:13px;line-height:1.4}
.introduccion-cambio-plan p{margin-bottom:0}
.plan-actual{display:flex;flex-direction:column;gap:4px;margin:12px 0 16px;padding:14px;border-radius:10px;background:#f2f6f8;border-left:5px solid var(--kontrol-marino)}
.plan-actual span,.plan-actual small{color:var(--kontrol-texto-suave)}
.plan-actual strong{font-size:18px}
.detalle-plan-actual{margin-top:-7px;color:var(--kontrol-texto-suave)}
.selector-miembros-plan{margin:16px 0;padding:14px;border:1px solid var(--kontrol-borde);border-radius:10px}
.selector-miembros-plan legend{font-weight:700;padding:0 5px}
.selector-miembros-plan .opcion-centro{min-height:46px;margin:5px 0}
.opcion-planes-separados{margin:16px 0!important;padding:12px;border:1px solid var(--kontrol-borde);border-radius:10px}
[data-asignaciones]{margin:10px 0 16px;padding:14px;border-radius:10px;background:#f7f9fa}

.asistente-plan{margin-top:18px}
.progreso-asistente{margin-bottom:12px;color:var(--kontrol-rojo);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.paso-asistente>h3{margin:0 0 6px;font-size:22px}
.paso-asistente>p{margin-top:0;color:var(--kontrol-texto-suave);line-height:1.45}
.acciones-asistente{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.acciones-asistente .boton{margin:0}
.opciones-modo-plan{display:grid;gap:10px;margin:16px 0}
.opcion-modo{display:flex;align-items:flex-start;gap:12px;padding:15px;border:2px solid var(--kontrol-borde);border-radius:12px;cursor:pointer}
.opcion-modo:has(input:checked){border-color:var(--kontrol-marino);background:#f2f6f8}
.opcion-modo input{margin-top:4px;flex:0 0 auto}
.opcion-modo span{display:flex;flex-direction:column;gap:4px}
.opcion-modo small{color:var(--kontrol-texto-suave);line-height:1.35}
.tarifas-por-persona{display:grid;gap:8px;margin-top:14px}
.tarifas-por-persona label{margin-top:8px;font-weight:700}
.resumen-cambio-plan{display:grid;gap:0;border:2px solid var(--kontrol-marino);border-radius:12px;overflow:hidden}
.resumen-cambio-plan>div{display:flex;justify-content:space-between;gap:16px;padding:13px 14px;border-bottom:1px solid var(--kontrol-borde)}
.resumen-cambio-plan>div:last-child{border-bottom:0}
.resumen-cambio-plan span{color:var(--kontrol-texto-suave)}
.resumen-cambio-plan strong{text-align:right}
.resumen-cambio-plan .total-resumen-plan{background:#f2f6f8;font-size:18px}
@media(max-width:520px){.acciones-asistente{grid-template-columns:1fr}.acciones-asistente .boton-primario{order:-1}.resumen-cambio-plan>div{flex-direction:column;gap:4px}.resumen-cambio-plan strong{text-align:left}}
.opcion-modo-fija{cursor:default;background:#f2f6f8;border-color:#aebbc4}
.grupos-familiares-creados,.constructor-grupo,.personas-restantes{margin:14px 0;padding:14px;border:1px solid var(--kontrol-borde);border-radius:12px}
.grupos-familiares-creados{background:#f7f9fa}
.constructor-grupo{border-width:2px}
.grupos-familiares-creados h4,.constructor-grupo h4,.personas-restantes h4{margin:0 0 10px}
.grupo-familiar-creado{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--kontrol-borde)}
.grupo-familiar-creado:last-child{border-bottom:0}
.grupo-familiar-creado span{display:flex;flex-direction:column;gap:3px}
.grupo-familiar-creado small{color:var(--kontrol-texto-suave)}
.miembros-grupo-opciones{margin:12px 0;padding:10px;border:0;background:#f7f9fa;border-radius:9px}
.miembros-grupo-opciones legend{font-weight:700}
.personas-restantes{background:#fff}
@media(max-width:520px){.grupo-familiar-creado{align-items:flex-start}.grupo-familiar-creado .boton{width:auto;flex:0 0 auto}}
/* Instalación de Kontrol en el dispositivo */
.tarjeta-instalacion{display:grid;grid-template-columns:58px 1fr;gap:4px 14px;align-items:center}
.tarjeta-instalacion[hidden]{display:none}
.tarjeta-instalacion>img{grid-row:1/4;width:58px;height:58px;border-radius:13px}
.tarjeta-instalacion h2{margin:0;font-size:19px}
.tarjeta-instalacion>p{margin:0;color:var(--kontrol-texto-suave);font-size:13px;line-height:1.4}
.tarjeta-instalacion .boton{grid-column:1/-1;margin:12px 0 0}
.tarjeta-instalacion .ayuda-instalacion{grid-column:1/-1;margin-top:10px;padding:10px 12px;border-radius:8px;background:#eef5f9;color:var(--kontrol-marino);font-weight:600}
.tarjeta-instalacion .ayuda-instalacion[hidden]{display:none}
.panel-pagos-familia>p{margin-top:-.35rem;color:#66717c}
.lista-pagos-familia{display:grid;gap:1rem;margin:1.25rem 0}
.ficha-pagos-familia{border:1px solid #d8dee4;border-radius:14px;overflow:hidden;background:#fff}
.cabecera-ficha-familia{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem;background:#f3f5f7}
.cabecera-ficha-familia>strong{font-size:1.05rem;color:#1c2733}
.disciplinas-ficha-familia{display:grid}
.fila-disciplina-familia{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border-top:1px solid #e4e8eb}
.fila-disciplina-familia:first-child{border-top:0}
.fila-disciplina-familia span{display:grid;gap:.2rem}
.fila-disciplina-familia small{color:#66717c}
.estado-accion-familia{border:0;border-radius:10px;padding:.8rem 1rem;min-width:8.5rem;font:inherit;font-weight:700;color:#fff;cursor:pointer}
.estado-pagar{background:#df302d}
.estado-pagado{background:#18a653}
.estado-en_revision{background:#c17a00}
.estado-elegir-plan{background:#d66b18}
.estado-proximo{background:#748b9b}
.acciones-panel-familia{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
@media(max-width:600px){.cabecera-ficha-familia,.fila-disciplina-familia{align-items:stretch;flex-direction:column}.cabecera-ficha-familia .boton,.estado-accion-familia{width:100%}.acciones-panel-familia{grid-template-columns:1fr}}
.calendario-familia>p{color:var(--kontrol-texto-suave);margin-top:-.3rem}
.tabla-meses-familia{margin-top:1.25rem;border:1px solid #d8dee4;border-radius:14px;overflow-x:auto;background:#fff}
.cabecera-meses-familia,.fila-meses-familia{display:grid;grid-template-columns:minmax(190px,1.65fr) repeat(4,minmax(105px,1fr));min-width:610px}
.cabecera-meses-familia{background:var(--kontrol-marino);color:#fff;font-weight:700}
.cabecera-meses-familia>span{display:grid;place-content:center;text-align:center;min-height:58px;padding:.55rem;border-left:1px solid rgba(255,255,255,.18)}
.cabecera-meses-familia>span:first-child{place-content:center start;text-align:left;border-left:0;padding-left:1rem}
.cabecera-meses-familia small{display:block;font-weight:400;font-size:.72rem}
.fila-meses-familia{border-top:1px solid #dfe4e8}
.fila-meses-familia>div{display:grid;place-items:center;padding:.65rem;border-left:1px solid #e2e6e9}
.nombre-ficha-calendario{display:grid;gap:.18rem;text-align:left;border:0;background:#fff;padding:.85rem 1rem;color:var(--kontrol-marino);cursor:pointer}
.nombre-ficha-calendario strong{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.nombre-ficha-calendario small{color:#66717c}
.mes-ficha{width:100%;min-height:42px;border:0;border-radius:9px;padding:.55rem .4rem;color:#fff;font:inherit;font-size:.82rem;font-weight:700;cursor:pointer}
.mes-pagar{background:#df302d}.mes-pagado{background:#18a653}.mes-revision{background:#c17a00}.mes-configurar{background:#d66b18}.mes-proximo{background:#748b9b}
.anadir-ficha-calendario{display:block;margin:1.1rem auto 0}
.cabecera-detalle-ficha>h1{margin:.75rem 0 .2rem}.cabecera-detalle-ficha>p{color:#66717c}.acciones-detalle-ficha{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}.acciones-detalle-ficha .boton{width:auto;margin:0}
@media(max-width:600px){.calendario-familia{padding:1rem}.tabla-meses-familia{margin-left:0;margin-right:0}.cabecera-detalle-ficha .acciones-detalle-ficha{display:grid}.acciones-detalle-ficha .boton{width:100%}}

.boton-nombre-listado{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:.2rem 0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}
.boton-nombre-listado strong{font-size:calc(1em - 1px);font-weight:400;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.boton-nombre-listado small{display:block;margin-top:.18rem;text-decoration:none}
.dialogo-detalle-pagos{width:min(94vw,620px);max-height:88vh;overflow:auto}
.detalle-pago-listado{margin:.75rem 0;padding:.85rem 1rem;border:1px solid #d8dde2;border-left:5px solid #1c2733;border-radius:.65rem;background:#fff}
.detalle-pago-listado h3,.detalle-pago-listado p{margin:.2rem 0}

/* Gestión directa de cada persona y mes */
.ayuda-meses-listado{flex:1 1 100%;margin:0;color:#394452;font-size:.92rem}
.boton-estado-mes{border:0;cursor:pointer;font:inherit;min-width:0;transition:transform .12s ease,box-shadow .12s ease}
.boton-estado-mes:hover,.boton-estado-mes:focus-visible{transform:translateY(-1px);box-shadow:0 0 0 3px rgba(211,48,42,.18);outline:none}
.acciones-pago-dialogo{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}
.acciones-pago-dialogo .boton{width:auto;flex:1 1 190px;margin:0}
.boton-peligro{background:#fff;color:#b42318;border:1px solid #b42318}
.boton-peligro:hover{background:#fff1f0}
.linea-tiempo-pago{list-style:none;margin:1rem 0;padding:0;border-left:2px solid #d7dde3}
.linea-tiempo-pago li{display:flex;justify-content:space-between;gap:1rem;padding:.3rem 0 .3rem 1rem;position:relative}
.linea-tiempo-pago li::before{content:'';position:absolute;left:-6px;top:.65rem;width:10px;height:10px;border-radius:50%;background:#64748b}
.linea-tiempo-pago li strong{font-size:.88rem}.linea-tiempo-pago li span{color:#55606d;text-align:right;font-size:.85rem}
.linea-tiempo-pago .evento-retirado::before{background:#b42318}
.detalle-pago-listado.cobertura-retirada{border-color:#d7a5a1;background:#fff8f7;opacity:.94}
.resumen-mes-dialogo{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0;border-top:1px solid #e1e5e9;border-bottom:1px solid #e1e5e9;margin-bottom:1rem}
.boton-marcar-mes{margin-top:1rem}
@media(max-width:700px){.acciones-pago-dialogo{display:grid}.acciones-pago-dialogo .boton{width:100%}.linea-tiempo-pago li{display:block}.linea-tiempo-pago li span{display:block;text-align:left;margin-top:.15rem}}

/* Identificación visual de los packs familiares en Listados */
.tabla-listados .fila-cabecera-pack-listado th{padding:8px 12px;background:#dbeee6;color:#245b48;border-top:2px solid #3d8b70;border-bottom:1px solid #3d8b70;text-align:left;font-size:12px;font-weight:800;letter-spacing:.04em}
.tabla-listados .fila-cabecera-pack-listado span{font-weight:600;letter-spacing:0;text-transform:none;margin-left:.35rem}
.tabla-listados .fila-miembro-pack-listado>th,.tabla-listados .fila-miembro-pack-listado>td{background:#f7fbf9}

/* Cobro manual desde el detalle de un mes */
.formulario-pago-mes{display:grid;gap:.8rem;margin-top:1rem;padding:1rem;border:1px solid #d7dde3;border-radius:12px;background:#f5f8fa}
.formulario-pago-mes h3{margin:0;color:var(--kontrol-marino)}
.formulario-pago-mes label{display:grid;gap:.35rem;margin:0;font-weight:700}
.formulario-pago-mes select,.formulario-pago-mes input{width:100%;min-height:44px;padding:.65rem .75rem;border:1px solid #aeb8c2;border-radius:8px;background:#fff;color:var(--kontrol-marino);font:inherit}
.formulario-pago-mes .ayuda-campo{margin:0;color:var(--kontrol-texto-suave);font-size:.88rem;line-height:1.4}
.formulario-pago-mes .mensaje-error{margin:0}
.formulario-pago-mes .boton{width:100%;margin:0}
.tabla-listados .fila-centro-listado th{padding:10px 12px;background:var(--kontrol-marino);color:#fff;border-top:4px solid #fff;text-align:left;font-size:13px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.tabla-listados .fila-centro-listado span{font-weight:500;opacity:.82}

/* Miembros y resumen del pack familiar en el cobro mensual */
.resumen-pack-dialogo{display:grid;gap:.3rem;margin:.8rem 0 1rem;padding:.85rem 1rem;border:1px solid #7bb39e;border-left:5px solid #3d8b70;border-radius:10px;background:#eef8f4;color:#245b48}
.resumen-pack-dialogo strong{font-size:.95rem;text-transform:uppercase;letter-spacing:.03em}
.resumen-pack-dialogo span{font-weight:700}
.selector-miembros-cobro{display:grid;gap:.55rem;margin:0;padding:.8rem 1rem;border:1px solid #aeb8c2;border-radius:9px;background:#fff}
.selector-miembros-cobro[hidden]{display:none}
.selector-miembros-cobro legend{padding:0 .35rem;font-weight:800}
.selector-miembros-cobro label{display:flex;align-items:center;gap:.55rem;font-weight:600}
.selector-miembros-cobro label[hidden]{display:none}
.selector-miembros-cobro input{width:auto;min-height:0;margin:0}

/* UX 079: gestión de fichas */
.tabla-fichas tbody .fila-pack-familiar { background:#eef7f3; }
.tabla-fichas tbody .fila-pack-familiar > * { background:#eef7f3; }
.rol-ficha-movil,.disciplina-texto-adaptada { display:none; }
.tabla-fichas thead th:last-child { width:136px; }
.acciones-ficha { gap:6px; }
.acciones-ficha button { display:inline-flex; align-items:center; justify-content:center; flex:0 0 36px; padding:0; line-height:1; }
.acciones-ficha button img { display:block; width:18px; height:18px; object-fit:contain; }

@media (max-width:760px) {
  .tabla-fichas { min-width:600px; }
  .tabla-fichas .col-disciplinas { display:none; }
  .tabla-fichas thead th:nth-child(2) { width:185px; }
  .tabla-fichas thead th:nth-child(3) { width:70px; }
  .tabla-fichas thead th:nth-child(4) { width:120px; }
  .disciplina-texto-adaptada { display:inline; }
}

@media (max-width:560px) {
  .tabla-fichas-scroll { overflow-x:auto; }
  .tabla-fichas { display:block; width:100%; min-width:410px; }
  .tabla-fichas thead { display:none; }
  .tabla-fichas tbody { display:block; }
  .tabla-fichas tbody tr:not(.pie-pack-familiar) {
    display:grid;
    grid-template-columns:30px minmax(0,1fr) 120px 108px;
    align-items:center;
    width:100%;
    border-bottom:1px solid var(--kontrol-borde);
  }
  .tabla-fichas tbody tr:not(.pie-pack-familiar)>td,
  .tabla-fichas tbody tr:not(.pie-pack-familiar)>th { min-width:0; border-bottom:0; }
  .tabla-fichas tbody td:first-child { grid-column:1; grid-row:1; width:auto; padding:9px 3px; }
  .tabla-fichas tbody th:not(.pie-pack-familiar th) { grid-column:2; grid-row:1; padding:9px 5px; }
  .tabla-fichas .col-rol,.tabla-fichas .col-disciplinas { display:none; }
  .tabla-fichas .col-acciones { display:block; grid-column:3; grid-row:1; width:auto; padding:9px 0; }
  .tabla-fichas .col-centros { display:block; grid-column:4; grid-row:1; width:auto; padding:9px 4px; font-size:12px; line-height:1.25; }
  .tabla-fichas .pie-pack-familiar { display:grid; grid-template-columns:1fr; width:100%; }
  .tabla-fichas .pie-pack-familiar th { grid-column:1/-1; width:auto; }
  .punto-ficha:has(.rol-ficha-movil) { width:22px; height:22px; }
  .rol-ficha-movil { display:flex; width:100%; height:100%; align-items:center; justify-content:center; color:#fff; font-size:11px; line-height:1; text-shadow:0 1px 1px #0008; }
  .estado-pendiente .rol-ficha-movil { color:#24313a; text-shadow:none; }
  .datos-secundarios-ficha { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .acciones-ficha { justify-content:center; gap:6px; }
  .acciones-ficha button { width:36px; height:36px; flex-basis:36px; border-radius:7px; font-size:20px; }
  .acciones-ficha button img { width:18px; height:18px; }
}