/* Panel Destino CDMX — estilo Liquid Glass */

:root {
  --coral:#ff5a5f;
  --coral-fuerte:#fa3f45;
  --tinta:#334747;
  --texto:#2c3a3a;
  --texto-suave:#6e7a7a;
  --fondo:linear-gradient(155deg,#fdf1f0 0%,#f4f4f7 45%,#eef0f4 100%);
  --vidrio:rgba(255,255,255,0.72);
  --vidrio-fuerte:rgba(255,255,255,0.88);
  --borde-vidrio:rgba(255,255,255,0.75);
  --borde:rgba(90,100,100,0.16);
  --hover:rgba(90,100,100,0.08);
  --sombra:0 10px 34px rgba(45,35,35,0.10);
  --success:#34c759;--warning:#ff9f0a;--warning-fuerte:#e0680a;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-drawer:cubic-bezier(0.32,0.72,0,1);
  /* App de tema claro fijo (el rediseño "Operación Clara" es solo claro).
     Forzar light evita que el modo noche del SO oscurezca solo algunas
     secciones/encabezados y los controles nativos (inputs, selects, fechas). */
  color-scheme:light;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,"Segoe UI",sans-serif;
  color:var(--texto);
  background:var(--fondo) fixed;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* ---- Estructura ---- */
.app{display:flex;min-height:100vh;padding:14px;gap:14px}
.side{
  width:212px;flex-shrink:0;
  display:flex;flex-direction:column;
  padding:1.1rem .65rem;
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  backdrop-filter:blur(24px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:24px;
  position:sticky;top:14px;align-self:flex-start;
  height:calc(100vh - 28px);
  overflow-y:auto;
}
.content{flex:1;min-width:0;padding:1.5rem 1.7rem}
.content h1{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;
  color:var(--tinta);margin-bottom:1.1rem}

/* ---- Marca y navegación ---- */
.menu-toggle{display:none}
.barra-top{display:block}
.side .brand{display:block;padding:.4rem .5rem 1.2rem;text-align:center;text-decoration:none}
.side .brand img{display:block;width:100%;max-width:142px;height:auto;margin:0 auto}
.hamburguesa{display:none}
.menu{display:flex;flex-direction:column;flex:1}
.side a{
  display:block;
  padding:.6rem .85rem;margin:.13rem .2rem;
  color:var(--texto-suave);text-decoration:none;
  font-size:.88rem;font-weight:500;
  border-radius:13px;
  transition:background .15s var(--ease-out),color .15s var(--ease-out);
}
.side a:hover{background:var(--hover);color:var(--texto)}
.side a.on{
  background:linear-gradient(135deg,var(--coral),var(--coral-fuerte));
  color:#fff;font-weight:600;
  box-shadow:0 5px 16px rgba(255,90,95,.42);
}
.side .spacer{flex:1;min-height:1rem}
.side .logout{
  font-size:.76rem;color:var(--texto-suave);
  padding:.7rem .85rem .2rem;margin:.2rem;
  border-top:1px solid var(--borde);
}
.side .logout a{color:var(--coral);text-decoration:none;font-weight:600}

/* ---- Encabezado de sección ---- */
.toprow{display:flex;justify-content:space-between;align-items:center;
  margin-bottom:1.2rem;flex-wrap:wrap;gap:.6rem}

/* ---- Botones ---- */
.btn{
  background:linear-gradient(135deg,var(--coral),var(--coral-fuerte));
  color:#fff;border:none;border-radius:13px;
  padding:.62rem 1.1rem;font-size:.88rem;font-weight:600;font-family:inherit;
  width:100%;cursor:pointer;
  box-shadow:0 5px 16px rgba(255,90,95,.36);
  transition:filter .18s var(--ease-out),box-shadow .2s var(--ease-out),transform .12s var(--ease-out);
}
.btn:hover{filter:brightness(1.06);box-shadow:0 8px 22px rgba(255,90,95,.50)}
.btn:active{transform:scale(.98)}
.btn-inline{width:auto;display:inline-block;text-decoration:none}
/* Variante "proceder con cautela" (ámbar): p.ej. "Crear de todos modos".
   Distinta de .peligro (destructivo: borrar/eliminar), que es otra semántica. */
.btn.advertencia{
  background:linear-gradient(135deg,var(--warning),var(--warning-fuerte));
  box-shadow:0 5px 16px rgba(255,159,10,.34);
}
.btn.advertencia:hover{box-shadow:0 8px 22px rgba(255,159,10,.48)}
.btn-secundario{
  background:var(--vidrio-fuerte);color:var(--texto);
  border:1px solid var(--borde);border-radius:13px;
  padding:.62rem 1.1rem;font-size:.88rem;font-weight:600;font-family:inherit;
  display:inline-block;text-decoration:none;cursor:pointer;
  transition:background .15s var(--ease-out);
}
.btn-secundario:hover{background:var(--hover)}
.btn-secundario:active{transform:scale(.97)}

/* ---- Botones con ícono (acciones de tabla) ---- */
.acciones-tabla{display:flex;gap:.4rem}
.btn-icono{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:9px;
  border:1px solid var(--borde);background:var(--vidrio-fuerte);
  color:var(--texto-suave);text-decoration:none;cursor:pointer;
  transition:background .15s var(--ease-out),color .15s var(--ease-out),border-color .15s var(--ease-out);
}
.btn-icono:hover{background:var(--hover);color:var(--texto)}
.btn-icono.peligro:hover{color:var(--coral-fuerte);border-color:var(--coral)}
.btn-icono:active{transform:scale(.92)}
.btn-icono svg{width:16px;height:16px;display:block}

/* ---- Tarjeta de formulario ---- */
.formulario{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:20px;padding:1.4rem;max-width:540px;
}
.formulario.ancho{max-width:700px}
.formulario.lleno{max-width:none}
/* Variante horizontal para barras de filtros (Calificaciones, etc.) */
.formulario.filtros{
  max-width:none;padding:.9rem 1rem;margin-bottom:1rem;
  display:flex;flex-wrap:wrap;gap:.5rem .9rem;align-items:flex-end;
}
.formulario.filtros .campo{margin-bottom:0;flex:1 1 160px;min-width:0}
.formulario.filtros .acciones{margin:0;display:flex;gap:.5rem;flex:0 0 auto;align-self:flex-end}
@media (max-width:700px){
  .formulario.filtros .campo{flex:1 1 100%}
  .formulario.filtros .acciones{flex:1 1 100%;justify-content:flex-end}
}

/* ---- Campos ---- */
.campo{margin-bottom:.85rem}
.campo label{display:block;font-size:.76rem;font-weight:600;
  color:var(--texto-suave);margin-bottom:.3rem}
.campo input,.campo select,.campo textarea{
  width:100%;padding:.6rem .75rem;
  border:1px solid var(--borde);border-radius:12px;
  background:var(--vidrio-fuerte);color:var(--texto);
  font-size:.9rem;font-family:inherit;
  transition:border-color .15s,box-shadow .15s;
  box-sizing:border-box;
}
.campo textarea{resize:vertical;min-height:4.5em;line-height:1.4}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--coral);
  box-shadow:0 0 0 3px rgba(255,90,95,.16);
}
.campo input[type=date]{-webkit-appearance:none;appearance:none;min-width:0;max-width:100%}
.campo .hint{font-size:.74rem;color:var(--texto-suave);margin-top:.25rem}
.check-inline{display:inline-flex;align-items:center;gap:.4rem;font-size:.9rem;cursor:pointer;margin-right:.8rem}
.check-inline input[type=checkbox]{width:auto;margin:0;flex:0 0 auto}
.acciones{display:flex;gap:.7rem;margin-top:1.2rem;align-items:center;flex-wrap:wrap}

/* ---- Zona de arrastre de archivos ---- */
.zona-drop{
  border:1.5px dashed var(--borde);border-radius:12px;
  padding:.9rem;text-align:center;background:var(--vidrio-fuerte);
  transition:border-color .15s,background .15s;
}
.zona-drop.arrastrando{border-color:var(--coral);background:rgba(255,90,95,.08)}
.zona-drop input[type=file]{display:block;margin:0 auto .4rem;max-width:100%}
.zona-drop-texto{font-size:.78rem;color:var(--texto-suave)}

/* ---- Login ---- */
.login-wrap{display:flex;align-items:center;justify-content:center;
  min-height:100vh;padding:1.5rem}
.login-card{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(30px) saturate(180%);
  backdrop-filter:blur(30px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:26px;padding:2rem 1.8rem;
  width:100%;max-width:362px;text-align:center;
}
.login-card .logo-login{display:block;width:68%;max-width:172px;
  height:auto;margin:0 auto 1.3rem}
.login-card h1{font-size:1.15rem;font-weight:700;color:var(--tinta);margin-bottom:1.3rem}
.login-card .campo{text-align:left}
.login-card .campo-check{display:flex;align-items:center;gap:.5rem;font-size:.85rem;
  color:var(--texto-suave);margin:.4rem 0 .8rem;text-align:left;cursor:pointer;user-select:none}
.login-card .campo-check input{margin:0}

/* ---- Tablas ---- */
table{
  width:100%;border-collapse:separate;border-spacing:0;
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:18px;overflow:hidden;
}
th{text-align:left;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--texto-suave);font-weight:700;
  padding:.72rem .9rem;border-bottom:1px solid var(--borde)}
td{padding:.72rem .9rem;border-bottom:1px solid var(--borde);font-size:.88rem;
  vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--hover)}
td a{color:var(--coral);text-decoration:none;font-weight:600}

/* ---- Estado vacío ---- */
.vacio{
  color:var(--texto-suave);font-size:.92rem;padding:1.4rem;
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  backdrop-filter:blur(16px) saturate(180%);
  border:1px solid var(--borde-vidrio);box-shadow:var(--sombra);
  border-radius:16px;
}

/* ---- Avisos ---- */
.aviso-error{
  background:rgba(255,90,95,.13);border:1px solid rgba(255,90,95,.42);
  color:var(--coral-fuerte);border-radius:13px;
  padding:.6rem .85rem;font-size:.84rem;margin-bottom:.9rem;font-weight:500;
}
.aviso-advertencia{
  background:rgba(255,159,10,.13);border:1px solid rgba(255,159,10,.42);
  color:#c47d00;border-radius:13px;
  padding:.6rem .85rem;font-size:.84rem;margin-bottom:.9rem;font-weight:500;
}

/* ---- Formulario de cierre ---- */
.seccion-form{margin:1.5rem 0 .6rem;font-size:.72rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--texto-suave);font-weight:700}
.banner-leido{
  background:rgba(52,199,89,.13);border:1px solid rgba(52,199,89,.4);
  border-radius:14px;padding:.7rem .9rem;font-size:.8rem;margin-bottom:1rem;
}
.total-destacado{
  background:linear-gradient(135deg,rgba(255,90,95,.16),rgba(250,63,69,.07));
  border:1px solid rgba(255,90,95,.32);
  border-radius:18px;padding:1rem 1.2rem;margin-bottom:1.1rem;
}
.total-destacado .et{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--texto-suave);font-weight:700}
.total-destacado .monto{font-size:1.7rem;font-weight:800;letter-spacing:-.02em;
  color:var(--coral-fuerte)}
.total-destacado .dir{font-size:.84rem;margin-top:.15rem;color:var(--texto)}
.cifras-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.dato-fijo{font-size:.9rem;margin-bottom:.8rem}
.dato-fijo .et{font-size:.72rem;color:var(--texto-suave);display:block;
  font-weight:600;text-transform:uppercase;letter-spacing:.04em}

/* ---- Calendario de limpiezas: tarjeta por día ---- */
.dia-bloque{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(18px) saturate(180%);
  backdrop-filter:blur(18px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:16px;padding:.85rem 1.1rem;margin-bottom:.7rem;
}
.dia-bloque .dia-titulo{
  font-size:.95rem;font-weight:700;color:var(--coral);
  margin:0 0 .5rem;letter-spacing:-.01em;
}
.dia-bloque.hoy{border:1.5px solid var(--coral);box-shadow:0 6px 18px rgba(255,90,95,.18)}
.dia-bloque.hoy .dia-titulo{color:var(--coral-fuerte)}
.dia-bloque .dia-titulo .hoy-tag{font-size:.68rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:#fff;background:var(--coral);padding:.15rem .55rem;
  border-radius:999px;margin-left:.4rem;vertical-align:.1em}
.dia-bloque ul{list-style:none;padding:0;margin:0}
.dia-bloque li{padding:.4rem 0;border-bottom:1px solid var(--borde);font-size:.92rem;
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .7rem}
.dia-bloque li:last-child{border-bottom:none}
.dia-bloque li .slot-info{flex:1 1 240px;min-width:0}
.dia-bloque li form{margin:0;display:inline}

/* ---- Selector estilo "vidrio" (mismo lenguaje que .btn-secundario) ---- */
.selector-vidrio{
  background:var(--vidrio-fuerte);color:var(--texto);
  border:1px solid var(--borde);border-radius:11px;
  padding:.4rem .65rem;font-size:.82rem;font-weight:500;font-family:inherit;
  cursor:pointer;max-width:100%;
  transition:background .15s var(--ease-out),border-color .15s var(--ease-out),box-shadow .15s var(--ease-out);
}
.selector-vidrio:hover{background:var(--hover)}
.selector-vidrio:active{transform:scale(.97)}
.selector-vidrio:focus{outline:none;border-color:var(--coral);
  box-shadow:0 0 0 3px rgba(255,90,95,.16)}
.selector-vidrio.sin-asignar{border-color:var(--coral)}

/* Versión pequeña del btn-secundario para acciones en línea (✓ Marcar hecha, deshacer) */
.btn-secundario.chico{padding:.4rem .7rem;font-size:.78rem}
.btn-secundario.chico.icono{padding:.3rem .5rem;font-size:.95rem;line-height:1}
.dia-bloque .vacio-dia{color:var(--texto-suave);font-size:.85rem;font-style:italic}

/* Filas dentro del slot:
   - fila-controles: display:contents en desktop (selector + badge + botón hecha caben inline con slot-info).
   - fila-evidencias: SIEMPRE su propia línea, alineada a la derecha (los botones de subir foto/video
     no deben mezclarse con los controles ni con la info — quedan abajo). */
.dia-bloque li .fila-controles{display:contents}
.dia-bloque li .fila-evidencias{
  display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;
  width:100%;margin-top:.3rem;
}
/* fila-estado-limpiador: estado de la limpieza + botón Marcar hecha/Reabrir (vista del limpiador). */
.dia-bloque li .fila-estado-limpiador{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.5rem;width:100%;margin-top:.4rem;
}
.dia-bloque li .fila-estado-limpiador .ev-form{flex:0 0 auto}
/* Aviso de que falta evidencia para poder marcar la limpieza como hecha. */
.hint-evidencia{
  display:block;width:100%;margin:.3rem 0 0;
  font-size:.8rem;color:var(--coral);font-weight:600;
}
/* Botón deshabilitado (p. ej. Marcar hecha sin evidencia). */
button:disabled{opacity:.45;cursor:not-allowed}

/* ---- Recuadro de resumen del cierre ---- */
.resumen-cierre{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:18px;padding:1rem 1.2rem;margin-bottom:1.1rem;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:.6rem 1.2rem;
}
.resumen-cierre .item{font-size:.92rem}
.resumen-cierre .et{display:block;font-size:.7rem;color:var(--texto-suave);
  text-transform:uppercase;letter-spacing:.04em;font-weight:700;margin-bottom:.15rem}
.resumen-cierre .ancho-total{grid-column:1/-1;font-size:.85rem}
.resumen-cierre .ancho-total a{color:var(--coral);text-decoration:none;font-weight:600}

/* ---- Disclosure para editar las cifras ---- */
details.editor-cifras{margin-bottom:.4rem}
details.editor-cifras > summary{
  display:inline-block;cursor:pointer;list-style:none;
  background:var(--vidrio-fuerte);color:var(--texto);
  border:1px solid var(--borde);border-radius:13px;
  padding:.5rem .95rem;font-size:.85rem;font-weight:600;
  margin-bottom:.6rem;user-select:none;
  transition:background .15s var(--ease-out),color .15s var(--ease-out),border-color .15s var(--ease-out);
}
details.editor-cifras > summary::-webkit-details-marker{display:none}
details.editor-cifras > summary::marker{content:""}
details.editor-cifras > summary:hover{background:var(--hover)}
details.editor-cifras > summary:active{transform:scale(.98)}
details.editor-cifras[open] > summary{background:var(--coral);color:#fff;border-color:transparent}

/* ---- Insignias ---- */
.badge{font-size:.7rem;font-weight:700;padding:.22rem .62rem;
  border-radius:999px;white-space:nowrap}
.badge-ok{background:rgba(52,199,89,.18);color:#1f9d4d}
.badge-espera{background:rgba(255,159,10,.20);color:#c47d00}
.badge-info{background:rgba(120,120,130,.18);color:var(--texto-suave)}
.celda-vacia{color:var(--texto-suave);font-weight:600}

/* ---- Huéspedes (CRM): barra de filtros, tarjeta y badges ---- */
.filtros{
  display:flex;flex-wrap:wrap;gap:.5rem .7rem;align-items:center;
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);box-shadow:var(--sombra);
  border-radius:16px;padding:.85rem 1rem;margin-bottom:1rem;
}
.filtros input[type=search],.filtros select{
  padding:.55rem .7rem;border:1px solid var(--borde);border-radius:12px;
  background:var(--vidrio-fuerte);color:var(--texto);
  font-size:.88rem;font-family:inherit;
  transition:border-color .15s,box-shadow .15s;
  box-sizing:border-box;
}
.filtros input[type=search]{flex:1 1 220px;min-width:0}
.filtros input[type=search]:focus,.filtros select:focus{
  outline:none;border-color:var(--coral);
  box-shadow:0 0 0 3px rgba(255,90,95,.16);
}
.filtros label{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.85rem;color:var(--texto-suave);cursor:pointer;white-space:nowrap;
}
.filtros label input[type=checkbox]{width:auto;margin:0;flex:0 0 auto;accent-color:var(--coral)}
@media (max-width:700px){
  .filtros input[type=search]{flex:1 1 100%}
  .filtros .btn{flex:1 1 100%}
}

.badge-incidencia{
  display:inline-flex;align-items:center;gap:.25rem;
  font-size:.72rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;
  background:rgba(255,90,95,.16);color:var(--coral-fuerte);white-space:nowrap;
}

.tarjeta{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);box-shadow:var(--sombra);
  border-radius:18px;padding:1.2rem 1.4rem;margin-bottom:1.3rem;
}
.tarjeta p{margin:.35rem 0;font-size:.92rem}
.tarjeta p.badge-incidencia{display:inline-flex;margin-top:.6rem}

tr.fila-incidencia td{background:rgba(255,90,95,.07)}
@media (hover:hover){
  tr.fila-incidencia:hover td{background:rgba(255,90,95,.12)}
}

/* ---- KPIs ---- */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);
  gap:.9rem;margin-bottom:1.3rem}
@media (max-width:1100px){
  .kpis{grid-template-columns:1fr 1fr}
}
.kpi{background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);box-shadow:var(--sombra);
  border-radius:18px;padding:1rem 1.1rem;display:block}
a.kpi{text-decoration:none;color:inherit;cursor:pointer;
  transition:transform .15s var(--ease-out),box-shadow .15s var(--ease-out),border-color .15s var(--ease-out)}
a.kpi:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.10);
  border-color:rgba(255,90,95,0.35)}
.kpi .lbl{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--texto-suave);font-weight:700}
.kpi .cifra{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin:.25rem 0 .1rem}
.kpi .cifra.cobrar{color:#1f9d4d}
.kpi .cifra.pagar{color:var(--coral-fuerte)}
.kpi .cifra.neutro{color:var(--tinta)}
.kpi .cifra.alerta{color:#f59e0b}
.kpi .sub{font-size:.74rem;color:var(--texto-suave)}

/* ---- Selector de mes ---- */
.selector-mes{display:flex;gap:.5rem;align-items:center;margin-bottom:1.2rem;flex-wrap:wrap}
.selector-mes label{font-size:.8rem;color:var(--texto-suave);font-weight:600}
.selector-mes select{padding:.5rem .7rem;border:1px solid var(--borde);border-radius:11px;
  background:var(--vidrio-fuerte);color:var(--texto);font-size:.88rem;font-family:inherit}
.buscar-cierres{
  width:100%;max-width:420px;margin-bottom:.9rem;
  padding:.55rem .8rem;border:1px solid var(--borde);border-radius:12px;
  background:var(--vidrio-fuerte);color:var(--texto);
  font-size:.9rem;font-family:inherit;
}
.buscar-cierres:focus{outline:none;border-color:var(--coral);
  box-shadow:0 0 0 3px rgba(255,90,95,.16)}

/* ---- Responsivo: teléfono ---- */
@media(max-width:680px){
  .app{flex-direction:column;padding:0;gap:0}
  .side{
    position:fixed;top:0;left:0;right:0;z-index:50;
    width:auto;height:auto;align-self:stretch;
    border-radius:0;border-width:0 0 1px 0;
    padding:.5rem .8rem;overflow:visible;
  }
  .barra-top{display:flex;align-items:center;justify-content:space-between}
  .side .brand{padding:0;text-align:left;width:auto}
  .side .brand img{max-width:none;max-height:38px;width:auto}
  .hamburguesa{display:block;font-size:1.5rem;line-height:1;cursor:pointer;
    color:var(--texto);padding:.25rem .55rem;border-radius:9px}
  .hamburguesa:hover{background:var(--hover)}
  .menu{display:none;padding-top:.5rem}
  #menu-toggle:checked ~ .menu{display:flex}
  .side .spacer{display:none}
  .side .logout{margin-top:.3rem}
  .content{padding:66px .7rem 1.2rem}
  .content h1{font-size:1.3rem}
  .cifras-grid{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr 1fr}
  .formulario{padding:1.1rem}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* Slot de limpieza en móvil: 3 renglones bien definidos
     1) info del slot (propiedad + Sale + Entra)
     2) selector + estado + acción (hecha/deshacer)
     3) botones de evidencia (siempre los dos juntos en la última línea) */
  .dia-bloque li .slot-info{flex:1 1 100%}
  .dia-bloque li .fila-controles{
    display:flex;flex-wrap:wrap;align-items:center;
    gap:.4rem .55rem;width:100%;
  }
  .dia-bloque li .fila-controles form{flex:0 0 auto}
  .dia-bloque li .fila-evidencias{
    display:flex;gap:.5rem;width:100%;
  }
  .dia-bloque li .fila-evidencias .ev-form{flex:1 1 0;min-width:0}
  .dia-bloque li .fila-evidencias .ev-boton{
    display:block;width:100%;text-align:center;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
}

/* ---- Resumen semanal por limpiador (tarjetas en flex-wrap) ---- */
.resumen-limpiadores{margin:0 0 1.1rem 0}
.resumen-limpiadores > .titulo{
  font-size:.7rem;color:var(--texto-suave);
  text-transform:uppercase;letter-spacing:.04em;font-weight:700;
  margin:0 0 .5rem .25rem;
}
.tarjetas-limpiadores{
  display:flex;flex-wrap:wrap;gap:.7rem;
}
.tarjeta-limpiador{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:16px;padding:.75rem .9rem;
  flex:1 1 200px;
}
.tarjeta-limpiador .nombre{
  font-weight:700;font-size:.95rem;margin-bottom:.5rem;color:var(--texto);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px;
}
.tarjeta-limpiador.sin-asignar .nombre{color:var(--coral)}
.tarjeta-limpiador .stats{display:flex;gap:1rem}
.tarjeta-limpiador .stat{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
.tarjeta-limpiador .stat .num{font-size:1.35rem;font-weight:700}
.tarjeta-limpiador .stat .et{
  font-size:.65rem;color:var(--texto-suave);
  text-transform:uppercase;letter-spacing:.04em;font-weight:700;margin-top:.1rem;
}
.tarjeta-limpiador .stat.hechas .num{color:#1f9d55}
.tarjeta-limpiador .stat.pendientes .num{color:var(--coral)}
.tarjeta-limpiador .stat.evidencias .num{color:#3b6dd5}
@media (max-width:700px){
  .tarjeta-limpiador{min-width:0;flex:1 1 100%}
}

/* ---- Evidencias de limpieza ---- */
.evidencias-galeria{
  display:flex;flex-wrap:wrap;gap:.4rem;margin:.4rem 0;width:100%;
}
.ev-thumb{
  position:relative;display:inline-block;width:64px;height:64px;
  border-radius:10px;overflow:hidden;border:1px solid var(--borde);
  background:var(--vidrio);text-decoration:none;
}
.ev-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ev-thumb.ev-video{display:flex;align-items:center;justify-content:center;color:var(--coral);font-size:1.4rem}
.ev-cap{
  position:absolute;left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.55);color:#fff;font-size:.6rem;
  text-align:center;padding:1px 0;letter-spacing:.02em;
}
.ev-play{font-size:1.6rem;color:var(--coral)}
/* Placeholder de "Ahorro de datos": ocupa el recuadro sin bajar la imagen. */
.ev-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;height:100%;background:var(--vidrio);color:var(--texto-suave)}
.ev-ph__ic{font-size:1.3rem;line-height:1}
.ev-ph__t{font-size:.58rem;font-weight:600;letter-spacing:.02em}
.ev-form{margin:0;display:inline-block}
.ev-boton{
  display:inline-block;cursor:pointer;font-size:.78rem;font-weight:600;
  padding:.35rem .6rem;border-radius:10px;border:1px dashed var(--coral);
  color:var(--coral);background:transparent;
}
.ev-boton input[type=file]{display:none}
.ev-boton:hover{background:rgba(255,90,95,0.08)}
.ev-boton:active{transform:scale(.97)}
.ev-boton.chico{padding:.2rem .5rem;font-size:.7rem;border-style:solid;border-color:var(--borde);color:var(--texto-suave)}
.ev-boton.chico:hover{background:var(--hover);color:var(--texto)}

/* Wrapper alrededor de cada thumb para superponer el botón de borrar */
.ev-wrap{position:relative;display:inline-block}
.ev-borrar-form{position:absolute;top:2px;right:2px;margin:0}
.ev-borrar{
  display:flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;
  background:rgba(0,0,0,0.55);color:#fff;border:none;
  font-size:.7rem;font-weight:700;cursor:pointer;padding:0;line-height:1;
  opacity:.8;transition:opacity .15s,background .15s;
}
.ev-borrar:hover{opacity:1;background:var(--coral-fuerte)}

/* ============================================================
   Visor de evidencias (lightbox in-page)
   Sustituye al <a target="_blank"> que atrapaba a la PWA.
   ============================================================ */

.visor-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
  opacity: 0;
  transition: opacity .2s var(--ease-drawer);
}
.visor-overlay[data-abierto] { opacity: 1; }
.visor-overlay[hidden] { display: none; }

.visor-media {
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: scale(.96);
  transition: transform .24s var(--ease-drawer);
}
.visor-overlay[data-abierto] .visor-media { transform: scale(1); }
.visor-media img,
.visor-media video {
  max-width: 100%;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 8px;
}

.visor-cerrar,
.visor-prev,
.visor-next,
.visor-descargar {
  position: absolute;
  /* z-index encima de .visor-media — sin esto la <video> (que aparece después en el DOM)
     queda por encima y bloquea los clicks/taps a los botones del visor. */
  z-index: 2;
  min-width: 44px;
  min-height: 44px;
  padding: 0 12px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  border-radius: 14px;
  font-size: 22px;
  cursor: pointer;
  user-select: none;
}
/* Safe-area-inset-top empuja los botones debajo de la dynamic island / notch del iPhone.
   max() asegura un mínimo de 56px aunque env() reporte 0 (status bar de iOS mide ~47px,
   60px da margen seguro tanto para iPhone con dynamic island como sin notch). */
.visor-cerrar    { top: max(56px, calc(env(safe-area-inset-top, 0px) + 16px)); right: 16px; }
.visor-descargar { top: max(56px, calc(env(safe-area-inset-top, 0px) + 16px)); left: 16px; }
.visor-prev      { left: 16px; top: 50%; transform: translateY(-50%); }
.visor-next      { right: 16px; top: 50%; transform: translateY(-50%); }

.visor-contador {
  position: absolute;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 60px);
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  opacity: 0.8;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.4);
  padding: 4px 10px;
  border-radius: 12px;
}
.visor-cap {
  position: absolute;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 24px);
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 14px;
  text-align: center;
}

.visor-error {
  color: #fff;
  text-align: center;
  padding: 24px;
}
.visor-error p { margin-bottom: 12px; }

@media (max-width: 600px) {
  .visor-prev,
  .visor-next { visibility: hidden; }  /* swipe los reemplaza */
}

/* ---- Banner de activación de push (Fase 5) ---- */
.banner-push[hidden]{display:none}
.banner-push{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:18px;
  padding:1rem 1.1rem;
  display:flex;
  gap:1rem;
  align-items:center;
  justify-content:space-between;
  margin-bottom:1.3rem;
}
.banner-push__texto{flex:1;min-width:0}
.banner-push__texto strong{display:block;font-size:.95rem;margin-bottom:.15rem}
.banner-push__texto p{margin:0;font-size:.82rem;color:var(--texto-suave)}
.banner-push__acciones{flex-shrink:0}
.banner-push[data-tipo="ios"]{display:block}
.banner-push[data-tipo="ios"] p{margin-top:.2rem}
.banner-push[data-tipo="ios"] em{font-weight:600;color:var(--texto);font-style:normal}
@media (max-width: 520px){
  .banner-push{flex-direction:column;align-items:stretch}
  .banner-push__acciones{display:flex}
  .banner-push__acciones .btn{width:100%}
}

.badge-admin         { background:#ff5a5f; color:#fff; }
.badge-supervisor    { background:#3870e0; color:#fff; }
.badge-limpieza      { background:#26a269; color:#fff; }
.badge-mantenimiento { background:#e08c1e; color:#fff; }
.badge-ligera        { background:rgba(135,206,235,.28); color:#2271b5; }
.badge-profunda      { background:rgba(217,83,79,.22); color:#c0392b; }
.badge-mini{display:inline-block;background:var(--coral-fuerte);color:#fff;font-size:.65rem;font-weight:700;padding:.1rem .4rem;border-radius:8px;margin-left:.3rem;vertical-align:middle}

/* ---- Menú lateral: items top-level (links + grupos) tienen mismo look ---- */
.side .menu > a,
.side details.menu-grupo > summary {
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 700;
  color: var(--texto-suave);
}
.side .menu > a.on { color: var(--texto); }

/* ---- Menú lateral: grupos colapsables (admin/supervisor) ---- */
.side details.menu-grupo {
  border:none; margin:0; padding:0;
}
.side details.menu-grupo > summary {
  list-style: none;
  cursor: pointer;
  display: flex; align-items: center; justify-content: space-between;
  padding: .55rem .8rem;
  border-radius: 11px;
  user-select: none;
}
.side details.menu-grupo > summary::-webkit-details-marker { display: none; }
.side details.menu-grupo > summary:hover { background: var(--hover); }
.side details.menu-grupo > summary .flecha {
  font-size: .75rem;
  transition: transform .18s var(--ease-out);
}
.side details.menu-grupo[open] > summary .flecha {
  transform: rotate(90deg);
}
.side details.menu-grupo > .menu-sub {
  display: flex; flex-direction: column;
  padding: .1rem 0 .3rem .5rem;
  border-left: 1px solid var(--borde);
  margin-left: 1rem;
}
.side details.menu-grupo > .menu-sub a {
  padding: .45rem .8rem;
  font-size: .88rem;
}

/* Manual de propiedades */
.seccion-titulo {
  font-size: .92rem;
  color: var(--coral);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 700;
  margin: 1.6rem 0 .6rem;
}

/* Manual: vista de consulta (solo lectura) */
.ver-campo { margin: 0 0 .7rem; }
.ver-etiqueta {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  color: var(--texto-suave);
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-bottom: .15rem;
}
.ver-valor {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.45;
}
.perm-modulo { border:1px solid var(--borde); border-radius:12px; padding:.6rem .8rem; margin:.5rem 0; }
.perm-modulo legend { font-weight:700; font-size:.85rem; padding:0 .3rem; }
.perm-modulo .check-inline { display:block; margin:.2rem 0; }

/* ---- Movimiento en pantallas táctiles ---- */
/* En la PWA iOS (sin hover real) el :hover se queda "pegado" tras tocar.
   En táctil anulamos los efectos de movimiento/realce que se sienten mal. */
@media (hover: none) {
  a.kpi:hover { transform: none; box-shadow: var(--sombra); border-color: var(--borde-vidrio); }
  tr:hover td { background: transparent; }
  .side a:not(.on):hover { background: transparent; color: var(--texto-suave); }
  .btn:hover { filter: none; box-shadow: 0 5px 16px rgba(255,90,95,.36); }
  .btn.advertencia:hover { box-shadow: 0 5px 16px rgba(255,159,10,.34); }
  .btn-secundario:hover { background: var(--vidrio-fuerte); }
  .btn-icono:hover { background: var(--vidrio-fuerte); color: var(--texto-suave); }
  .btn-icono.peligro:hover { color: var(--texto-suave); border-color: var(--borde); }
  .selector-vidrio:hover { background: var(--vidrio-fuerte); }
  details.editor-cifras > summary:hover { background: var(--vidrio-fuerte); }
  .side details.menu-grupo > summary:hover { background: transparent; }
  .ev-boton:hover { background: transparent; }
  .ev-boton.chico:hover { background: transparent; color: var(--texto-suave); }
  .ev-borrar:hover { opacity: .8; background: rgba(0,0,0,0.55); }
  .hamburguesa:hover { background: transparent; }
}

/* ---- Overlay "Subiendo evidencia…" mientras se sube foto/video ---- */
.subiendo-overlay{
  position:fixed;inset:0;z-index:9000;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,0.32);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;transition:opacity .18s var(--ease-out);
}
.subiendo-overlay.visible{opacity:1}
.subiendo-card{
  display:flex;flex-direction:column;align-items:center;gap:.8rem;
  background:var(--vidrio-fuerte);border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);border-radius:18px;padding:1.4rem 1.8rem;
  color:var(--texto);font-weight:600;font-size:.95rem;
}
.subiendo-spinner{
  width:34px;height:34px;border-radius:50%;
  border:3px solid var(--borde);border-top-color:var(--coral);
  animation:subiendo-girar .7s linear infinite;
}
@keyframes subiendo-girar{to{transform:rotate(360deg)}}
/* Barra de progreso real durante la subida de evidencia. */
.subiendo-card{min-width:min(320px,80vw)}
.subiendo-barra{
  width:100%;height:8px;background:var(--borde);
  border-radius:4px;overflow:hidden;
}
.subiendo-barra-rel{
  height:100%;width:0%;background:var(--coral);
  transition:width .2s var(--ease-out);
}
.subiendo-pct{
  font-size:.85rem;color:var(--texto-suave);font-weight:600;
}

/* ---- Respeto a "reducir movimiento" del sistema ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  a.kpi:hover { transform: none; }
}

/* Barra de aviso cuando un admin está viendo como otro usuario (impersonación). */
.aviso-impersonacion{
  display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;
  background:var(--coral);color:#fff;font-weight:600;font-size:.9rem;
  padding:.5rem .9rem;border-radius:12px;margin-bottom:1rem;
}
.aviso-impersonacion .btn-secundario{
  margin-left:auto;background:#fff;color:var(--coral);border:none;
}

/* === Vista colapsada de slots de limpieza === */
/* Filosofía: clic en .slot-info expande/colapsa el resto del slot. La mecánica
   es simple — cuando el <li> tiene .slot-colapsado, ocultamos todo lo que no
   sea .slot-info. Cuando está .slot-expandido, no aplicamos nada extra y los
   hijos del <li> (fila-controles con display:contents, etc.) usan el layout
   flex original — quedando idénticos a como se veían antes del colapso.
   Selectores gateados a .slot-colapsado/.slot-expandido para no afectar a
   otras pantallas (mi-dia.php) que reusan .dia-bloque sin esta estructura. */

.dia-bloque li.slot-colapsado > :not(.slot-info) {
    /* !important para ganarle a estilos inline (ej. el form de mover-fecha
       trae style="display:flex" inline, que sin !important pisa esta regla). */
    display: none !important;
}

.dia-bloque li.slot-colapsado .slot-info,
.dia-bloque li.slot-expandido .slot-info {
    cursor: pointer;
    user-select: none;
}

.dia-bloque li.slot-colapsado .slot-info .chevron,
.dia-bloque li.slot-expandido .slot-info .chevron {
    display: inline-block;
    transition: transform 160ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
    transform: rotate(0deg);
    font-size: .85em;
    color: var(--texto-suave);
}

.dia-bloque li.slot-expandido .slot-info .chevron {
    transform: rotate(90deg);
}

.dia-bloque li.slot-colapsado .slot-info:active,
.dia-bloque li.slot-expandido .slot-info:active {
    transform: scale(.99);
}

.dia-bloque li.slot-colapsado .slot-info:focus-visible,
.dia-bloque li.slot-expandido .slot-info:focus-visible {
    outline: 2px solid var(--coral);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Pip de estado de la limpieza, a la izquierda del nombre. Colores tomados
   del system: rojo para pendiente, naranja para iniciada, verde para hecha. */
.dia-bloque li.slot-colapsado .slot-info .pip-estado,
.dia-bloque li.slot-expandido .slot-info .pip-estado {
    display: inline-block;
    width: .7rem;
    height: .7rem;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: .1rem;
}
.dia-bloque li.slot-colapsado .slot-info .pip-pendiente,
.dia-bloque li.slot-expandido .slot-info .pip-pendiente { background: #ff453a; }
.dia-bloque li.slot-colapsado .slot-info .pip-iniciada,
.dia-bloque li.slot-expandido .slot-info .pip-iniciada  { background: #ff9f0a; }
.dia-bloque li.slot-colapsado .slot-info .pip-hecha,
.dia-bloque li.slot-expandido .slot-info .pip-hecha     { background: #34c759; }

/* Notas de limpieza manual: hijo directo del <li> (oculto cuando colapsado
   gracias a la regla :not(.slot-info) de arriba). Toma toda la línea cuando
   visible. */
.dia-bloque li .slot-notas {
    width: 100%;
    margin-top: .2rem;
}

@media (prefers-reduced-motion: reduce) {
    .dia-bloque li.slot-colapsado .slot-info .chevron,
    .dia-bloque li.slot-expandido .slot-info .chevron {
        transition: none;
    }
}

/* Disparador de notificación en Adeudos */
.botones-envio { display:flex; gap:.4rem; flex-wrap:wrap; align-items:center; }
.form-envio-canal { display:inline; margin:0; }

/* Control de envío masivo por mes en Cierres */
.envio-mes { margin:.2rem 0 .7rem; font-size:.85rem; color:var(--texto-suave); display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }

/* ── Historial de evidencias por depto ─────────────────────────────── */
.form-buscador-evidencias{
  display:flex;gap:.6rem;align-items:flex-end;margin:.8rem 0 1.2rem;
  flex-wrap:wrap;
}
.campo-buscador-evidencias{flex:1 1 240px;min-width:240px;margin:0}
.campo-buscador-evidencias label{display:block;font-size:.78rem;color:var(--texto-suave);margin-bottom:.25rem}

.lista-eventos-evidencia{list-style:none;padding:0;margin:1rem 0}
.lista-eventos-evidencia > li{margin:0 0 .55rem 0}

.evento-evidencia{margin:0}
.evento-evidencia > summary{
  display:flex;gap:.5rem;align-items:baseline;flex-wrap:wrap;
  cursor:pointer;user-select:none;list-style:none;
  background:var(--vidrio-fuerte);color:var(--texto);
  border:1px solid var(--borde);border-radius:13px;
  padding:.7rem .95rem;font-size:.9rem;
  transition:background .15s var(--ease-out),border-color .15s var(--ease-out),transform .15s var(--ease-out);
}
.evento-evidencia > summary::-webkit-details-marker{display:none}
.evento-evidencia > summary::marker{content:""}
.evento-evidencia > summary::before{
  content:"▸";font-size:.7rem;color:var(--texto-suave);
  transition:transform .2s var(--ease-out);display:inline-block;
}
.evento-evidencia[open] > summary::before{transform:rotate(90deg)}
.evento-evidencia > summary:active{transform:scale(.98)}
@media (hover:hover){
  .evento-evidencia > summary:hover{background:var(--hover)}
}
.evento-evidencia[open] > summary{
  border-color:transparent;background:var(--coral);color:#fff;
}
.evento-evidencia[open] > summary .evento-fecha,
.evento-evidencia[open] > summary .evento-sub,
.evento-evidencia[open] > summary::before{color:rgba(255,255,255,.85)}

.evento-tipo{font-weight:700}
.evento-fecha{color:var(--texto-suave)}
.evento-sub{color:var(--texto-suave)}

.evento-contenido{
  padding:.85rem 1rem .95rem;
  background:var(--vidrio);
  border:1px solid var(--borde);border-top:none;
  border-radius:0 0 13px 13px;
  margin-top:-1px;
}
.evento-contenido h4{
  margin:.6rem 0 .4rem;font-size:.78rem;
  color:var(--texto-suave);text-transform:uppercase;letter-spacing:.04em;
}
.evento-contenido h4:first-child{margin-top:0}

.galeria-evidencias{display:flex;gap:.45rem;flex-wrap:wrap}
.galeria-evidencias a{
  display:block;border-radius:10px;overflow:hidden;
  transition:transform .15s var(--ease-out);
}
.galeria-evidencias a:active{transform:scale(.96)}
.ev-thumb{
  width:84px;height:84px;object-fit:cover;border-radius:10px;
  display:block;background:var(--vidrio);
}
.ev-thumb-video{
  display:inline-flex;align-items:center;justify-content:center;
  width:84px;height:84px;border-radius:10px;
  background:linear-gradient(135deg,#3a3a3a,#1f1f1f);
  color:#fff;font-size:.78rem;gap:.2rem;
}

.acciones-evidencias{text-align:center;margin:1.4rem 0 .6rem}

/* Color accent por tipo en el modo cerrado (raya izquierda discreta) */
.evento-limpieza:not([open]) > summary{box-shadow:inset 3px 0 0 0 #3b6dd5}
.evento-mantenimiento:not([open]) > summary{box-shadow:inset 3px 0 0 0 var(--warning)}

@media (prefers-reduced-motion: reduce){
  .evento-evidencia > summary,
  .evento-evidencia > summary::before,
  .galeria-evidencias a{transition:none}
  .evento-evidencia > summary:active,
  .galeria-evidencias a:active{transform:none}
}

/* ── Manual de propiedad: vista de consulta (overrides scopeados) ──── */
/* Solo quita uppercase y sube tamaño/peso para que se lean como negritas reales;
   colores originales (coral en sección, texto-suave en campo) se conservan. */
.manual-ver .seccion-titulo{
  font-size:1.05rem;
  text-transform:none;letter-spacing:0;
  font-weight:800;margin:1.6rem 0 .6rem;
}
.manual-ver .ver-etiqueta{
  font-size:.85rem;
  text-transform:none;letter-spacing:0;
  font-weight:700;margin-bottom:.2rem;
}

/* Botón "copiar liga" — discreto, solo el ícono de dos cuadritos en color suave. */
.btn-copiar-liga{
  display:inline-flex;align-items:center;justify-content:center;
  margin-left:.3rem;padding:.15rem;
  background:transparent;border:0;
  color:var(--texto-suave);cursor:pointer;user-select:none;
  vertical-align:middle;line-height:0;
  transition:color .15s var(--ease-out),transform .15s var(--ease-out);
}
.btn-copiar-liga:active{transform:scale(.85)}
@media (hover:hover){
  .btn-copiar-liga:hover{color:var(--texto)}
}
.btn-copiar-liga.copiado{color:var(--success)}
@media (prefers-reduced-motion: reduce){
  .btn-copiar-liga{transition:none}
  .btn-copiar-liga:active{transform:none}
}

/* ---- Acordeón de abonos por cierre (adeudos.php) ---- */
.cierre-acordeon{cursor:pointer}
.cierre-acordeon td:first-child{font-weight:600}
.cierre-chevron{display:inline-block;color:var(--texto-suave);font-weight:700;
  margin-right:.5rem;transition:transform .22s var(--ease-out),color .22s var(--ease-out)}
.cierre-acordeon.abierto .cierre-chevron{transform:rotate(90deg);color:var(--coral)}
.cierre-acordeon:active{transform:scale(.994)}
@media (hover:hover){.cierre-acordeon:hover .cierre-chevron{color:var(--coral)}}

/* La fila de detalle es un cajón inset dentro de la card de vidrio, no otra card */
.abonos-detalle td{padding:0;background:rgba(90,100,100,.05)}
.abonos-inner{padding:.55rem .9rem .85rem}
@media (prefers-reduced-motion:no-preference){
  .abonos-detalle:not([hidden]) .abonos-inner{animation:abonos-revelar .24s var(--ease-drawer) both}
}
@keyframes abonos-revelar{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* mini-tabla de abonos: sin la estética de card de la tabla padre */
.tabla-abonos{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
  border:none;box-shadow:none;border-radius:0;margin:0}
.tabla-abonos th{padding:.4rem .6rem;font-size:.62rem}
.tabla-abonos td{padding:.48rem .6rem;border-bottom:1px solid var(--borde);font-size:.82rem}
.tabla-abonos tr:last-child td{border-bottom:none}
.tabla-abonos tr:hover td{background:transparent}
.abonos-vacio{padding:.45rem .2rem;color:var(--texto-suave);font-style:italic;font-size:.85rem;margin:0}

.abono-comprobante{display:inline-block;line-height:0}
.abono-comprobante img{width:42px;height:42px;object-fit:cover;border-radius:10px;
  border:1px solid var(--borde);transition:transform .12s var(--ease-out)}
.abono-comp-pdf{display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:10px;border:1px solid var(--borde);
  font-size:.62rem;font-weight:800;letter-spacing:.04em;color:var(--coral);background:var(--hover)}
.abono-comprobante:active img,.abono-comprobante:active .abono-comp-pdf{transform:scale(.94)}
.abono-sin-comp{color:var(--texto-suave);opacity:.6}

/* PDF dentro del visor in-page */
.visor-pdf{width:min(92vw,900px);height:86vh;border:0;border-radius:12px;
  background:#fff;box-shadow:var(--sombra)}

/* ---- Portal huésped (público, pre check-in) ---- */
.portal{
  max-width:560px;margin:0 auto;
  padding:1.4rem 1rem calc(2.4rem + env(safe-area-inset-bottom,0px));
  display:flex;flex-direction:column;gap:1.1rem;
}
.portal-logo{display:block;height:44px;width:auto;margin:.4rem auto .6rem}
.portal-card{
  background:var(--vidrio);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--borde-vidrio);
  box-shadow:var(--sombra);
  border-radius:20px;padding:1.4rem;
  display:flex;flex-direction:column;gap:.85rem;
}
.portal-foto{
  display:block;width:100%;aspect-ratio:16/9;
  object-fit:cover;border-radius:14px;
  margin-bottom:.15rem;
}
.portal-card h1,.portal-card h2{font-size:1.05rem;font-weight:700;color:var(--texto);margin:0}
.portal-card h1{font-size:1.2rem}
.portal-card p{margin:0;color:var(--texto);font-size:.92rem}
.portal-card label{
  display:flex;flex-direction:column;gap:.3rem;
  font-size:.76rem;font-weight:600;color:var(--texto-suave);
}
.portal-card input,.portal-card select{
  width:100%;padding:.6rem .75rem;
  border:1px solid var(--borde);border-radius:12px;
  background:var(--vidrio-fuerte);color:var(--texto);
  font-size:.9rem;font-family:inherit;
  transition:border-color .15s var(--ease-out),box-shadow .15s var(--ease-out);
}
.portal-card input:focus,.portal-card select:focus{
  outline:none;border-color:var(--coral);
  box-shadow:0 0 0 3px rgba(255,90,95,.16);
}
/* El botón "subir foto" usa .btn con un input file oculto dentro */
.portal-card label.btn{
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  color:#fff;font-weight:600;cursor:pointer;
}
.portal-card label.btn input[type=file]{
  position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;
}
.portal-ok{color:var(--success);font-weight:600;font-size:.92rem}
.portal-check{
  flex-direction:row !important;align-items:flex-start;gap:.55rem;
  font-size:.9rem;font-weight:500;color:var(--texto);cursor:pointer;
}
.portal-check input[type=checkbox]{width:auto;flex:0 0 auto;margin-top:.15rem}
.portal-aviso-hora{
  margin:-.25rem 0 .25rem;font-size:.8rem;line-height:1.45;
  color:var(--coral);font-weight:500;
}
.portal-aviso-id{
  font-size:.85rem;line-height:1.5;color:var(--texto-suave);
  background:var(--vidrio-fuerte);border:1px solid var(--borde-vidrio);
  border-radius:12px;padding:.7rem .85rem;margin:0;
}
.portal-confirmar{width:100%;font-size:1.05rem;padding:.95rem;margin-top:.25rem}
.portal-aviso{font-size:.85rem;color:var(--texto-suave)}
.portal-aviso summary{cursor:pointer;font-weight:600}
.portal-aviso pre{
  white-space:pre-wrap;word-wrap:break-word;
  margin:.5rem 0 0;font-family:inherit;font-size:.82rem;
  color:var(--texto-suave);line-height:1.5;
}
@media (prefers-reduced-motion:reduce){
  .portal-card input,.portal-card select{transition:none}
}

/* ---- Modal genérico (popups del panel) ---- */
.modal-ov{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  padding:1rem;background:rgba(20,16,14,.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.modal-ov[hidden]{display:none}
.modal-card{background:var(--tarjeta,#fff);border-radius:16px;padding:1.2rem 1.3rem 1.3rem;
  max-width:460px;width:100%;max-height:86vh;overflow:auto;box-shadow:0 24px 60px -18px rgba(0,0,0,.45)}
.modal-card__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.9rem}
.modal-card__head h3{margin:0;font-size:1.05rem}
.modal-x{border:none;background:none;cursor:pointer;font-size:1.4rem;line-height:1;color:var(--texto-suave);padding:.1rem .3rem}
.modal-resena{white-space:pre-wrap;line-height:1.55;margin:0}
.modal-resena .priv{display:block;margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--borde)}

/* Contenedor de tabla: limita el ancho al del contenido (= ancho de las tarjetas) */
.tabla-wrap{width:100%;overflow-x:auto;margin-bottom:1.3rem}
.tabla-wrap table{display:table;margin:0}

/* Indicador de estado de estancia: barra de color al borde izquierdo de la fila */
tr.est-curso  td:first-child{box-shadow:inset 4px 0 0 var(--success)}
tr.est-futura td:first-child{box-shadow:inset 4px 0 0 var(--warning)}
.leyenda-estancias{display:flex;gap:1.1rem;flex-wrap:wrap;align-items:center;margin:.1rem 0 .55rem;
  font-size:.78rem;color:var(--texto-suave)}
.leyenda-estancias span{display:inline-flex;align-items:center;gap:.4rem}
.leyenda-estancias .bar{width:4px;height:14px;border-radius:2px;display:inline-block}
.leyenda-estancias .bar--curso{background:var(--success)}
.leyenda-estancias .bar--futura{background:var(--warning)}

/* Indicador de pre check-in (Llegadas): barra de color al borde izquierdo de la fila */
tr.pc-completo    td:first-child{box-shadow:inset 4px 0 0 var(--success)}
tr.pc-parcial     td:first-child{box-shadow:inset 4px 0 0 var(--warning)}
tr.pc-pendiente   td:first-child{box-shadow:inset 4px 0 0 var(--coral)}
tr.fila-cancelada td:first-child{box-shadow:inset 4px 0 0 var(--texto-suave)}
tr.fila-cancelada td{color:var(--texto-suave)}
.leyenda-estancias .bar--completo{background:var(--success)}
.leyenda-estancias .bar--parcial{background:var(--warning)}
.leyenda-estancias .bar--pendiente{background:var(--coral)}
.leyenda-estancias .bar--cancelada{background:var(--texto-suave)}

/* Columna de fecha: angosta, discreta y en una sola línea */
.col-fecha{font-size:.8rem;color:var(--texto-suave);white-space:nowrap}

/* Lista de huéspedes: correo más chico para angostar la columna Contacto */
.col-contacto .contacto-email{font-size:.76rem;color:var(--texto-suave);line-height:1.3;
  margin-top:.1rem;word-break:break-word}

/* Miniatura de foto en la tabla de Hallazgos */
.hallazgo-thumb {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--borde);
    cursor: pointer;
    display: block;
}

/* Badges de estado (Hallazgos) — usan la base .badge existente */
.badge-coral { background:rgba(255,90,95,.14); color:var(--coral); }
.badge-amber { background:rgba(255,159,10,.16); color:var(--warning); }
.badge-green { background:rgba(52,199,89,.16); color:var(--success); }

/* Tabla responsive: en móvil se conserva el formato de tabla/lista (como en pantalla
   ancha), solo más compacta —menos padding y tipografía— para caber mejor. El
   contenedor .tabla-wrap mantiene overflow-x:auto como último recurso. */
@media (max-width:600px){
  .tabla-wrap table.tabla-responsive th,
  .tabla-wrap table.tabla-responsive td { padding:.5rem .55rem; font-size:.82rem }
  .tabla-wrap table.tabla-responsive th { font-size:.6rem }
  .tabla-wrap table.tabla-responsive .col-fecha { font-size:.74rem }
  /* Columnas secundarias: se ocultan en pantallas chicas para que la tabla
     quepa sin scroll horizontal (siguen visibles en pantalla ancha y en el detalle). */
  .tabla-wrap table.tabla-responsive .col-movil-oculta { display:none }
}