/* ═══════════════════════════════════════════════════════════════
   TOKENS DE TEMA · claro por defecto, oscuro con [data-theme=dark]
   Cada color de la hoja pasa por aquí; no hay valores fijos abajo.
   ═══════════════════════════════════════════════════════════════ */
:root{
  --paper:255,255,255;          /* superficies translúcidas, rgba(var(--paper),x) */
  --paper-solid:#ffffff;        /* superficie opaca */
  --rim:rgba(255,255,255,.85);  /* canto de luz dentro de box-shadow */
  --shade:15,23,42;             /* sombras proyectadas */
  --ink:15,23,42;               /* bordes y tintes sutiles, rgba(var(--ink),x) */
  --t-1:#0f172a;--t-2:#334155;--t-3:#475569;--t-4:#64748b;--t-5:#94a3b8;
  --sep:#cbd5e1;
  --av-a:#eef2f7;--av-b:#e2e8f0;
  --aurora-a:#f3f6fb;--aurora-b:#eef2f8;
}
/* ═══════════════════════════════════════════════════════════════
   HotelOS · Panel de administración — acceso
   Mismo material que el panel de recepción (ver LIQUID_GLASS_DESIGN.md),
   con un matiz violeta que distingue este panel del de recepción: entrar
   por la puerta equivocada tiene consecuencias distintas.
   Capa desmontable: quitar el <link> en admin.html restaura el original.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --ag-blur:26px;
  --ag-sat:180%;
  --ag-border:rgba(var(--paper),.72);
  --ag-rim:inset 0 1px 0 var(--rim),inset 0 -1px 0 var(--rim),
           inset 1px 0 0 var(--rim),inset -1px 0 0 var(--rim);
  --ag-shadow:0 24px 64px rgba(var(--shade),.16),0 2px 8px rgba(var(--shade),.06);
  --ag-accent:#6d28d9;
  --ag-accent-2:#4f46e5;
}

/* ── Fondo: el vidrio necesita algo que refractar ─────────────── */
#login-screen{
  overflow:hidden;
  background:
    radial-gradient(ellipse 70% 55% at 10% 0%,rgba(139,92,246,.26) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 10%,rgba(14,165,233,.22) 0%,transparent 60%),
    radial-gradient(ellipse 70% 60% at 85% 100%,rgba(99,102,241,.22) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 25% 100%,rgba(236,72,153,.12) 0%,transparent 60%),
    linear-gradient(180deg,var(--aurora-a) 0%,var(--aurora-b) 100%);
}
#login-screen::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(circle at 22% 28%,rgba(167,139,250,.38) 0,transparent 28%),
    radial-gradient(circle at 78% 22%,rgba(56,189,248,.28) 0,transparent 26%),
    radial-gradient(circle at 70% 82%,rgba(129,140,248,.30) 0,transparent 30%),
    radial-gradient(circle at 24% 84%,rgba(244,114,182,.18) 0,transparent 26%);
  filter:blur(44px);
  animation:agAurora 28s ease-in-out infinite alternate;
}
@keyframes agAurora{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(3%,-4%,0) scale(1.07)}
  100%{transform:translate3d(-3%,3%,0) scale(1.02)}
}
#login-screen>*{position:relative;z-index:1}

/* ── La tarjeta ───────────────────────────────────────────────── */
.lbox{
  max-width:400px;padding:36px 34px 30px;border-radius:28px;
  background:linear-gradient(160deg,rgba(var(--paper),.88) 0%,rgba(var(--paper),.76) 55%,rgba(var(--paper),.66) 100%);
  -webkit-backdrop-filter:blur(var(--ag-blur)) saturate(var(--ag-sat));
  backdrop-filter:blur(var(--ag-blur)) saturate(var(--ag-sat));
  border:1px solid var(--ag-border);
  box-shadow:var(--ag-rim),var(--ag-shadow);
}

/* Marca: el icono señala que esto es administración */
.lbox-icon{
  width:54px;height:54px;border-radius:19px;margin:0 auto 16px;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0) 50%),
             linear-gradient(135deg,#a78bfa,#6d28d9);
  border:1px solid rgba(var(--paper),.75);
  box-shadow:inset 0 1px 0 var(--rim),0 8px 22px rgba(109,40,217,.32);
}
.lbox-icon svg{width:26px;height:26px;color:#fff}
.lbrand{font-size:1.625rem;font-weight:700;letter-spacing:-.045em;margin-bottom:3px}
.lbrand span{
  background:linear-gradient(135deg,#7c3aed 0%,#4f46e5 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
/* El subtítulo deja de gritar en versalitas y dice qué panel es */
.lsub{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;margin-bottom:26px;
}

/* ── Campos ───────────────────────────────────────────────────── */
.lbl{
  font-size:0.8125rem;font-weight:450;color:var(--t-3);
  text-transform:none;letter-spacing:0;margin-bottom:7px;
}
#login-screen .inp{
  border-radius:14px;padding:12px 15px;font-size:0.9375rem;
  background-color:rgba(var(--paper),.72);
  border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
  transition:border-color .15s,box-shadow .15s,background-color .15s;
}
#login-screen .inp:focus{
  background-color:#fff;border-color:var(--ag-accent-2);
  box-shadow:0 0 0 4px rgba(79,70,229,.16),inset 0 1px 0 var(--rim);
}
#login-screen .inp::placeholder{color:var(--t-4)}
#l-eye{border-radius:0 14px 14px 0}
#l-eye:hover{color:var(--ag-accent-2)}

/* Casilla de recordar */
.l-check-label{font-size:0.8438rem;color:var(--t-3);gap:9px}
.l-check-box{
  width:20px;height:20px;border-radius:7px;
  border:1.5px solid rgba(var(--ink),.18);
  background:rgba(var(--paper),.8);
  box-shadow:inset 0 1px 0 var(--rim);
}
.l-check-box.checked{
  background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,0) 50%),
             linear-gradient(135deg,#8b5cf6,#4f46e5);
  border-color:transparent;
  box-shadow:inset 0 1px 0 var(--rim),0 2px 6px rgba(79,70,229,.3);
}
.l-check-icon{color:#fff}

/* ── Botones ──────────────────────────────────────────────────── */
#login-screen .btn-primary,
#login-screen .btn-primary#l-btn{
  border-radius:999px!important;padding:14px!important;min-height:50px!important;
  font-size:0.9375rem!important;font-weight:600!important;letter-spacing:.01em;
  background:linear-gradient(180deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,0) 45%),
             linear-gradient(135deg,#8b5cf6 0%,#4f46e5 100%);
  border:1px solid rgba(var(--paper),.42);
  box-shadow:inset 0 1px 0 var(--rim),0 8px 22px rgba(79,70,229,.32);
  transition:transform .16s,box-shadow .16s,filter .16s;
}
#login-screen .btn-primary:hover{
  transform:translateY(-1px);filter:none;
  box-shadow:inset 0 1px 0 var(--rim),0 12px 28px rgba(79,70,229,.38);
}
#login-screen .btn-primary:active{transform:translateY(0)}
#login-screen .btn-primary:disabled{opacity:.55;transform:none;box-shadow:none}

.l-divider{margin:22px 0;font-size:0.75rem;font-weight:450;color:var(--t-4)}
.l-divider::before,.l-divider::after{background:linear-gradient(90deg,transparent,rgba(var(--ink),.14),transparent)}

.l-social-btn{
  border-radius:999px;padding:13px 16px;min-height:50px;font-size:0.875rem;font-weight:500;
  background:rgba(var(--paper),.68);
  border:1px solid rgba(var(--paper),.85);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 var(--rim),0 2px 8px rgba(var(--shade),.05);
  color:var(--t-1);
}
.l-social-btn:hover{
  background:var(--paper-solid);color:var(--t-1);
  border-color:rgba(79,70,229,.3);transform:translateY(-1px);
  box-shadow:inset 0 1px 0 var(--rim),0 6px 18px rgba(var(--shade),.09);
}

/* ── Errores ──────────────────────────────────────────────────── */
.lerr{
  border-radius:14px;padding:11px 14px;font-size:0.8125rem;font-weight:450;
  background:rgba(254,242,242,.9);border:1px solid rgba(252,165,165,.8);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}

/* ── Código de verificación ───────────────────────────────────── */
.otp-icon-wrap{
  border-radius:19px;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0) 50%),
             linear-gradient(135deg,#a78bfa,#6d28d9);
  border:1px solid rgba(var(--paper),.75);
  box-shadow:inset 0 1px 0 var(--rim),0 8px 22px rgba(109,40,217,.28);
}
.otp-icon-wrap svg{color:#fff!important}
.otp-cell{
  border-radius:14px;
  background-color:rgba(var(--paper),.75);
  border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
}
.otp-cell:focus{
  background-color:#fff;border-color:var(--ag-accent-2);
  box-shadow:0 0 0 4px rgba(79,70,229,.16),inset 0 1px 0 var(--rim);
}
.btn-ghost{font-size:0.8438rem;border-radius:999px}
.btn-ghost:hover{color:var(--ag-accent-2)}

/* ── Accesibilidad ────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  #login-screen::before{animation:none}
  #login-screen .btn-primary,.l-social-btn{transition:none}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
  #login-screen::before{display:none}
  .lbox,.l-social-btn,.lerr,.otp-cell,#login-screen .inp{
    background:var(--paper-solid)!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    border-color:var(--sep)!important;
  }
}
/* Sin backdrop-filter (Safari y Firefox antiguos): más opacidad para no perder legibilidad */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .lbox,.l-social-btn,.lerr{background:rgba(var(--paper),.95)}
}

@media(max-width:420px){
  .lbox{padding:30px 24px 26px;border-radius:24px}
  .lbrand{font-size:1.4375rem}
  .lsub{font-size:0.8125rem;margin-bottom:22px}
}

/* ── La guía va dentro del campo ───────────────────────────────
   La etiqueta se mantiene en el HTML para lectores de pantalla y
   para que el autocompletado del navegador siga entendiendo el
   formulario, pero no se dibuja: repetirla encima del campo que
   ya dice lo mismo es ruido.                                    */
.lbl-sr{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}
#login-screen .inp::placeholder{color:var(--t-4);opacity:1}
/* Los campos ganan aire al quedarse sin etiqueta encima */
#login-screen .fg{margin-bottom:12px}
#login-screen .inp{padding:14px 16px;font-size:0.9688rem}
#l-pass{padding-right:46px!important}

/* ═══════════════════════════════════════════════════════════════
   PANEL DE ADMINISTRACIÓN · navegación
   Mismo lenguaje que el panel de recepción: fondo aurora bajo la
   interfaz, barra lateral de vidrio y elementos en píldora. En
   móvil es un cajón flotante que se abre con el botón de menú.
   ═══════════════════════════════════════════════════════════════ */
html{height:100%}
body{min-height:100%;background:var(--aurora-b)}
#app{
  height:100dvh!important;min-height:100dvh!important;max-height:100dvh;
  overflow:hidden;position:relative;
  background:
    radial-gradient(ellipse 70% 55% at 6% 0%,rgba(139,92,246,.20) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 8%,rgba(14,165,233,.16) 0%,transparent 60%),
    radial-gradient(ellipse 70% 60% at 92% 100%,rgba(99,102,241,.16) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 20% 100%,rgba(236,72,153,.09) 0%,transparent 60%),
    linear-gradient(180deg,#f6f5fc 0%,var(--aurora-b) 100%);
}
@supports not (height:100dvh){#app{height:100vh!important;min-height:100vh!important}}
/* Solo el area de contenido se apila sobre el fondo. Un `#app>*` generico
   pisaba el position:fixed del cajon lateral en movil y lo dejaba dentro
   del flujo, comiendose el ancho de la pagina. */
#app>.main{position:relative;z-index:1}

/* ── Barra lateral ────────────────────────────────────────────── */
.sidebar{
  width:248px;border-right:1px solid var(--ag-border);border-radius:0;
  background:linear-gradient(180deg,rgba(var(--paper),.78) 0%,rgba(var(--paper),.62) 100%);
  -webkit-backdrop-filter:blur(20px) saturate(175%);backdrop-filter:blur(20px) saturate(175%);
  box-shadow:inset -1px 0 0 var(--rim),12px 0 40px rgba(var(--shade),.05);
  min-height:0;height:100%;
}
.sidebar-logo{padding:20px 16px 16px;border-bottom:1px solid rgba(var(--ink),.06)}
.sidebar-logo div{font-size:1.125rem;font-weight:700;letter-spacing:-.03em;gap:10px}
.sidebar-logo div svg{color:var(--c-violet)}
.sidebar-logo span{
  font-size:0.7812rem;color:var(--t-4);font-weight:450;margin-top:5px;padding-left:28px;
}
/* Hotel y plan: bloque tenue, sin franja gris de borde a borde */
.sidebar-hotel{
  margin:12px;padding:11px 14px;border-radius:14px;
  background:rgba(var(--paper),.66);border:1px solid rgba(var(--paper),.85);
  box-shadow:inset 0 1px 0 var(--rim);
}
.sidebar-hotel strong{font-size:0.875rem;font-weight:600;letter-spacing:-.01em}
.sidebar-hotel span{font-size:0.7812rem;color:var(--t-4)}

.sidebar-nav{padding:4px 10px 12px}
.nav-section{
  padding:14px 8px 6px;font-size:0.6875rem;font-weight:600;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.nav-item{
  gap:11px;padding:9px 12px;margin-right:0;margin-bottom:2px;
  border-left:none;border-radius:12px;
  font-size:0.8438rem;font-weight:450;color:var(--t-2);
  transition:background .15s,color .15s,box-shadow .15s;
}
.nav-item svg{width:19px;height:19px;opacity:.85}
.nav-item:hover{background:rgba(var(--paper),.7);color:var(--c-indigo)}
.nav-item.active{
  background:var(--paper-solid);color:var(--c-indigo);font-weight:550;
  border-left-color:transparent;
  box-shadow:inset 0 1px 0 var(--rim),0 1px 2px rgba(var(--shade),.05),
             0 6px 16px rgba(var(--shade),.06),0 0 0 1px rgba(79,70,229,.12);
}
.nav-item.active svg{opacity:1}
.nav-item:focus-visible{outline:2px solid var(--ag-accent-2);outline-offset:-2px}

.sidebar-footer{
  padding:12px;border-top:1px solid rgba(var(--ink),.06);background:none;
}
.sidebar-footer .btn{border-radius:999px!important;font-size:0.8125rem;min-height:42px}

/* ── Cajón en móvil ───────────────────────────────────────────── */
@media(max-width:899px){
  .sidebar{
    top:max(10px,var(--safe-top));bottom:max(10px,var(--safe-bottom));left:10px;
    /* height:100% de la regla base ganaba a top/bottom: el cajon medía el alto
       completo de la ventana empezando 10px mas abajo, así que su base caía
       fuera de pantalla y la curva inferior no llegaba a verse. */
    height:auto;
    width:min(286px,86vw);min-height:0;
    border:1px solid var(--ag-border);border-radius:22px;
    transform:translateX(calc(-100% - 14px));
    box-shadow:var(--ag-rim),0 24px 60px rgba(var(--shade),.20);
    overflow:hidden;
  }
  body.admin-sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{background:rgba(var(--ink),.20);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
}

/* ── Barra superior ───────────────────────────────────────────── */
.topbar{
  background:linear-gradient(180deg,rgba(var(--paper),.72),rgba(var(--paper),.55));
  -webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);
  border-bottom:1px solid var(--ag-border);
  box-shadow:inset 0 1px 0 var(--rim);
  padding:12px 18px;padding-top:max(12px,var(--safe-top));
}
.topbar-title{font-size:1.25rem;font-weight:700;letter-spacing:-.035em}
.sidebar-toggle,.topbar-refresh{
  border-radius:999px;width:40px;height:40px;
  background:rgba(var(--paper),.72);border:1px solid var(--ag-border);
  box-shadow:inset 0 1px 0 var(--rim);
  transition:background .15s,transform .15s,box-shadow .15s;
}
.sidebar-toggle:hover,.topbar-refresh:hover{
  background:var(--paper-solid);transform:translateY(-1px);
  border-color:rgba(79,70,229,.3);color:var(--ag-accent-2);
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(var(--shade),.08);
}

/* El área de contenido es la que se desplaza, no la página */
.main{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#content-area{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
@media(max-width:899px){
  /* con el cajon fuera del flujo, el contenido ocupa todo el ancho */
  .main{width:100%}
}

@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
  .sidebar,.topbar{
    background:var(--paper-solid)!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    border-color:var(--sep)!important;
  }
  #app{background:#f4f7fb!important}
}

/* Barra de desplazamiento del menú: fina, no la gruesa del sistema */
.sidebar-nav{scrollbar-width:thin;scrollbar-color:rgba(var(--ink),.18) transparent}
.sidebar-nav::-webkit-scrollbar{width:8px}
.sidebar-nav::-webkit-scrollbar-thumb{background:rgba(var(--ink),.16);border:2px solid transparent;background-clip:content-box;border-radius:99px}
.sidebar-nav::-webkit-scrollbar-track{background:transparent}

/* ── Menú compacto: que el final quepa sin desplazar ───────────
   Once elementos, cuatro encabezados, marca, hotel y pie. Con las
   separaciones anteriores no cabía en pantallas cortas.          */
.sidebar-logo{padding:16px 16px 13px}
.sidebar-logo div{font-size:1.0625rem}
.sidebar-logo span{font-size:0.75rem;margin-top:3px}
.sidebar-hotel{margin:10px 10px 4px;padding:9px 13px;border-radius:13px}
.sidebar-hotel strong{font-size:0.8438rem}
.sidebar-hotel span{font-size:0.75rem}

.sidebar-nav{padding:2px 10px 8px}
.nav-section{padding:11px 8px 4px;font-size:0.6562rem}
.nav-section:first-child{padding-top:6px}
.nav-item{padding:7px 12px;margin-bottom:1px;font-size:0.8438rem;gap:10px}
.nav-item svg{width:18px;height:18px}

.sidebar-footer{padding:10px}
.sidebar-footer .btn{min-height:40px;font-size:0.7812rem}

/* En pantallas bajas se aprieta un punto más antes de desplazar */
@media(max-height:760px){
  .sidebar-logo{padding:13px 16px 11px}
  .nav-section{padding:9px 8px 3px}
  .nav-item{padding:6px 12px}
  .sidebar-hotel{margin:8px 10px 2px;padding:8px 12px}
}

/* Pantallas muy bajas (portátiles de 13" con zoom, ventanas a media altura):
   se recorta lo prescindible antes que dejar el menú con desplazamiento. */
@media(max-height:660px){
  .sidebar-logo{padding:11px 16px 9px}
  .sidebar-logo span{display:none}          /* el subtítulo es redundante aquí */
  .sidebar-hotel{margin:7px 10px 0;padding:7px 12px}
  .sidebar-hotel strong{font-size:0.8125rem}
  .nav-section{padding:7px 8px 2px;font-size:0.625rem}
  .nav-item{padding:5px 12px;font-size:0.8125rem}
  .nav-item svg{width:17px;height:17px}
  .sidebar-footer{padding:8px 10px}
  .sidebar-footer .btn{min-height:36px}
}

/* ── El pie del menú cierra igual que la cabecera ──────────────
   El borde de luz del material tenía la cara superior al 95% y la
   inferior al 35%, así que arriba el canto se leía nítido y abajo
   se desvanecía. Con las dos caras iguales, el cajón cierra por
   abajo con el mismo acabado con el que abre por arriba.        */
@media(max-width:899px){
  .sidebar{
    box-shadow:
      inset 0 1px 0 var(--rim),
      inset 0 -1px 0 var(--rim),
      inset 1px 0 0 var(--rim),
      inset -1px 0 0 var(--rim),
      0 24px 60px rgba(var(--shade),.20);
  }
}
/* La separación del pie se dibuja con la misma mano que la de la cabecera */
.sidebar-footer{
  border-top:1px solid rgba(var(--ink),.06);
  background:linear-gradient(180deg,rgba(var(--paper),0),rgba(var(--paper),.45));
}
.sidebar-footer .btn{
  background:rgba(var(--paper),.78);
  border:1px solid rgba(var(--paper),.9);
  box-shadow:inset 0 1px 0 var(--rim),0 1px 3px rgba(var(--shade),.06);
  color:var(--t-2);font-weight:500;
}
.sidebar-footer .btn:hover{
  background:var(--paper-solid);color:var(--c-indigo);
  border-color:rgba(79,70,229,.25);
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(var(--shade),.08);
}

/* ═══════════════════════════════════════════════════════════════
   DASHBOARD · rediseño
   Fuera las versalitas espaciadas y las franjas de color al canto.
   Una cifra manda por bloque, el color va en el dato y las listas
   se agrupan en una sola tarjeta con filas.
   ═══════════════════════════════════════════════════════════════ */
.dash-layout{gap:16px;max-width:1240px}

/* ── Ocupación en vivo ────────────────────────────────────────── */
.dash-hero{
  background:linear-gradient(150deg,rgba(var(--paper),.86),rgba(var(--paper),.68));
  -webkit-backdrop-filter:blur(18px) saturate(175%);backdrop-filter:blur(18px) saturate(175%);
  border:1px solid var(--ag-border);border-radius:22px;
  box-shadow:var(--ag-rim),0 8px 32px rgba(var(--shade),.08);
  padding:20px 22px;
}
.dash-hero-label{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;margin:0 0 2px;
}
.dash-hero-pct{
  font-size:clamp(2.4rem,7vw,3.2rem);font-weight:700;letter-spacing:-.05em;
  color:var(--t-1);line-height:1.02;font-variant-numeric:tabular-nums;
}
.dash-hero-bar{height:10px;border-radius:999px;background:rgba(var(--ink),.07);box-shadow:inset 0 1px 2px rgba(var(--shade),.06)}
.dash-hero-bar>span{border-radius:999px;box-shadow:inset 0 1px 0 var(--rim)}
.dash-hero-meta{font-size:0.8438rem;color:var(--t-4);margin-top:10px}
.dash-hero-meta strong{font-weight:600;color:var(--t-1)}
.dash-hero-side{
  background:rgba(var(--paper),.62);border:1px solid rgba(var(--paper),.85);
  border-radius:18px;box-shadow:inset 0 1px 0 var(--rim);
}
.dash-mm-label{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.dash-mm-val{font-size:2rem;font-weight:700;letter-spacing:-.04em;color:var(--t-1);font-variant-numeric:tabular-nums}

/* ── Indicadores: sin franja lateral, color solo en la cifra ──── */
.dash-bento{gap:12px}
.dash-tile{
  background:linear-gradient(160deg,rgba(var(--paper),.92),rgba(var(--paper),.82))!important;
  border:1px solid var(--ag-border)!important;border-left:1px solid var(--ag-border)!important;
  border-radius:20px;padding:15px 17px;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  transition:transform .15s,box-shadow .15s;
}
.dash-tile:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 var(--rim),0 12px 28px rgba(var(--shade),.09)}
.dash-tile-label{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.dash-tile-val{
  font-size:1.65rem;font-weight:650;letter-spacing:-.035em;margin-top:2px;
  font-variant-numeric:tabular-nums;
}
.dash-tile-hint{font-size:0.7812rem;color:var(--t-4);margin-top:5px;line-height:1.4}
/* un punto de color identifica el indicador sin pintar todo el canto */
.dash-tile-label::before{
  content:'';display:inline-block;width:8px;height:8px;border-radius:999px;
  margin-right:8px;vertical-align:1px;
}
.dash-tile--in .dash-tile-label::before{background:linear-gradient(135deg,#6ee7b7,#059669)}
.dash-tile--sal .dash-tile-label::before{background:linear-gradient(135deg,#fca5a5,#dc2626)}
.dash-tile--adr .dash-tile-label::before{background:linear-gradient(135deg,#c4b5fd,#6d28d9)}
.dash-tile--rev .dash-tile-label::before{background:linear-gradient(135deg,#a5b4fc,#4338ca)}

/* ── Panel del gráfico ────────────────────────────────────────── */
.dash-panel{
  background:linear-gradient(160deg,rgba(var(--paper),.92),rgba(var(--paper),.82));
  border:1px solid var(--ag-border);border-radius:22px;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  padding:16px 18px;
}
.dash-panel-head{font-size:0.9062rem;font-weight:600;letter-spacing:-.01em;margin-bottom:10px}
.dash-panel-sub{
  font-size:0.7812rem;font-weight:400;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}

/* ── Top huéspedes: una tarjeta con filas ─────────────────────── */
.dash-section-head{margin-bottom:0}
.dash-section-head h2{font-size:1.125rem;font-weight:650;letter-spacing:-.025em;margin:0}
.dash-section-head p{font-size:0.8125rem;color:var(--t-4);margin:2px 0 10px}
.dash-rank-list{
  display:flex;flex-direction:column;gap:0;
  background:linear-gradient(160deg,rgba(var(--paper),.94),rgba(var(--paper),.86));
  border:1px solid var(--ag-border);border-radius:20px;overflow:hidden;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
}
.dash-guest{
  background:none!important;border:none!important;border-radius:0!important;
  box-shadow:none!important;margin:0!important;
  padding:12px 15px;gap:12px;position:relative;
  transition:background .14s;
}
.dash-guest+.dash-guest::before{
  content:'';position:absolute;top:0;left:70px;right:0;height:1px;
  background:rgba(var(--ink),.07);
}
.dash-guest:hover{background:rgba(79,70,229,.05)}
.dash-guest:hover::before,.dash-guest:hover+.dash-guest::before{opacity:0}
/* el puesto es un número, no una insignia */
.dash-guest-rank{
  width:20px;min-width:20px;height:auto;background:none!important;
  border-radius:0;font-size:0.8438rem;font-weight:500;color:var(--t-4);
  font-variant-numeric:tabular-nums;text-align:center;
}
.dash-guest-rank.top3{color:var(--c-indigo);font-weight:600}
.dash-guest-av{
  width:36px;height:36px;border-radius:999px;
  background:linear-gradient(160deg,var(--av-a),var(--av-b));
  border:1px solid rgba(var(--paper),.9);box-shadow:inset 0 1px 0 var(--rim);
  font-size:0.8125rem;font-weight:600;color:var(--t-3);
}
.dash-guest-name{font-size:0.9062rem;font-weight:550;color:var(--t-1);letter-spacing:-.01em}
.dash-guest-meta{font-size:0.8125rem;color:var(--t-4);margin-top:1px}
.dash-guest-st-sm{
  font-size:0.75rem;font-weight:400;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.dash-guest-st{font-size:0.8125rem!important;font-weight:550;color:var(--t-1);font-variant-numeric:tabular-nums}

@media(max-width:640px){
  .dash-hero{padding:17px 18px;border-radius:20px}
  .dash-tile{padding:13px 15px;border-radius:18px}
  .dash-tile-val{font-size:1.4rem}
  .dash-guest{padding:11px 13px;gap:10px}
  .dash-guest+.dash-guest::before{left:62px}
}

/* El puesto sigue siendo un número también en el podio: la caja de color
   competía con el nombre, que es lo que se busca en la lista. */
.dash-guest-rank,.dash-guest-rank.top3{
  background:none!important;border:none!important;box-shadow:none!important;
}

/* ── Indicadores: misma altura y jerarquía clara ───────────────
   La cifra manda, la etiqueta la nombra y el pie explica en una
   línea. Las cuatro miden igual aunque el texto varíe.          */
.dash-bento{align-items:stretch}
.dash-tile{
  display:flex;flex-direction:column;height:100%;
  padding:16px 18px 14px;
}
.dash-tile-label{order:1;font-size:0.8438rem;line-height:1.3}
.dash-tile-val{order:2;font-size:1.75rem;margin-top:4px;line-height:1.1}
.dash-tile-hint{
  order:3;margin-top:auto;padding-top:8px;
  font-size:0.7812rem;color:var(--t-4);line-height:1.35;
}
/* La definición completa vive en el title del bloque: quien la
   necesita la ve al pasar por encima, sin ensuciar la tarjeta. */
.dash-tile[title]{cursor:help}

@media(max-width:640px){
  .dash-tile{padding:14px 15px 12px}
  .dash-tile-val{font-size:1.45rem}
}

/* ═══════════════════════════════════════════════════════════════
   HABITACIONES (admin) · rediseño
   El estado se decía tres veces: franja lateral, píldora y color
   del borde. Ahora una sola vez. Y el título deja de repetirse:
   ya está en la barra superior.
   ═══════════════════════════════════════════════════════════════ */
.sec-header--rooms{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:14px;flex-wrap:wrap;
}
.sec-sub{font-size:0.8438rem;color:var(--t-4);margin:0}
.sec-header--rooms .btn-primary{
  border-radius:999px!important;font-size:0.8438rem;min-height:40px;padding:9px 18px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.4);
  box-shadow:inset 0 1px 0 var(--rim),0 6px 16px rgba(79,70,229,.26);
}

/* ── Resumen: una tarjeta con celdas, sin franjas de color ───── */
.hab-kpis{
  gap:0;margin-bottom:16px;
  background:linear-gradient(160deg,rgba(var(--paper),.92),rgba(var(--paper),.82));
  border:1px solid var(--ag-border);border-radius:20px;overflow:hidden;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
}
.hab-kpi{
  background:none!important;border:none!important;border-top:none!important;
  border-radius:0!important;box-shadow:none!important;
  padding:13px 14px;position:relative;
}
.hab-kpi::before,.hab-kpi::after{display:none!important}
.hab-kpi+.hab-kpi{box-shadow:inset 1px 0 0 rgba(var(--shade),.07)!important}
.hab-kpi__v{
  font-size:1.375rem;font-weight:650;letter-spacing:-.035em;color:var(--t-1);
  font-variant-numeric:tabular-nums;line-height:1.1;
}
.hab-kpi__l{
  font-size:0.7812rem;font-weight:400;color:var(--t-4);margin-top:3px;
  text-transform:none;letter-spacing:0;
}
/* el color va en la cifra, no en un canto */
.hab-kpi--accent .hab-kpi__v{color:var(--c-indigo)}
.hab-kpi--ok .hab-kpi__v{color:var(--c-green)}
.hab-kpi--red .hab-kpi__v{color:var(--c-red)}
.hab-kpi--warn .hab-kpi__v{color:var(--c-amber-d)}
.hab-kpi--muted .hab-kpi__v{color:var(--t-4)}

/* ── Tarjetas ─────────────────────────────────────────────────── */
.hab-grid{gap:12px;align-items:start}
.hab-card{
  background:linear-gradient(160deg,rgba(var(--paper),.95),rgba(var(--paper),.88))!important;
  border:1px solid var(--ag-border)!important;
  border-left:1px solid var(--ag-border)!important;
  border-radius:20px;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  transition:transform .15s,box-shadow .15s;
}
.hab-card::before,.hab-card::after{display:none!important}
.hab-card:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 var(--rim),0 12px 30px rgba(var(--shade),.10)}
.hab-card-body{padding:14px 16px}
.hab-card-top{align-items:center;margin-bottom:6px}
.hab-card-num{font-size:1.0312rem;font-weight:650;letter-spacing:-.02em;color:var(--t-1)}

/* Estado: un punto y una palabra */
.hab-estado-chip{
  display:inline-flex;align-items:center;gap:6px;
  background:none!important;padding:0!important;border:none!important;
  border-radius:0!important;font-size:0.8438rem;font-weight:500;
  text-transform:none;letter-spacing:0;
}
.hab-estado-chip::before{
  content:'';width:8px;height:8px;border-radius:999px;flex-shrink:0;
  background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 14%,transparent);
}
.hab-estado-chip.libre{color:var(--c-green)}
.hab-estado-chip.ocupada{color:var(--c-red)}
.hab-estado-chip.limpieza{color:var(--c-amber-d)}
.hab-estado-chip.mantenimiento{color:var(--c-orange)}
.hab-estado-chip.bloqueada{color:var(--t-4)}

.hab-card-info{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hab-card-price{
  font-size:0.9062rem;font-weight:600;color:var(--t-1);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}
/* Metadatos en una línea; lo que no existe no se menciona */
.hab-card-meta{
  font-size:0.8125rem;color:var(--t-4);margin-top:5px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.hab-sep{margin:0 6px;color:var(--sep)}

/* Acciones: discretas hasta que hacen falta */
.hab-card-actions{gap:2px}
.hab-card-actions button{
  width:32px;height:32px;border-radius:999px;
  background:none;border:none;color:var(--t-4);
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
.hab-card-actions button:hover{background:rgba(79,70,229,.1);color:var(--c-indigo)}
.hab-card-actions .hab-btn-del:hover{background:rgba(220,38,38,.1);color:var(--c-red)}
.hab-card-actions button:focus-visible{outline:2px solid var(--ag-accent-2);outline-offset:1px}

.hab-card-footer{
  border-top:1px solid rgba(var(--ink),.07);background:none;
  padding:9px 16px;font-size:0.7812rem;color:var(--t-4);
}

@media(max-width:640px){
  .hab-kpis{grid-template-columns:repeat(3,1fr)}
  .hab-kpi+.hab-kpi{box-shadow:inset 1px 0 0 rgba(var(--shade),.07)!important}
  .hab-kpi:nth-child(3n+1){box-shadow:none!important}
  .hab-kpi:nth-child(n+4){box-shadow:inset 1px 0 0 rgba(var(--shade),.07),inset 0 1px 0 rgba(var(--shade),.07)!important}
  .hab-kpi:nth-child(4){box-shadow:inset 0 1px 0 rgba(var(--shade),.07)!important}
  .hab-kpi__v{font-size:1.1875rem}
  .hab-card-body{padding:13px 14px}
}

/* ═══════════════════════════════════════════════════════════════
   MODALES DE HABITACIÓN · detalle y edición
   Fuera la barra azul delante de cada título y las versalitas.
   Las secciones se separan por espacio y una línea fina, como en
   Ajustes, no con un adorno vertical en cada encabezado.
   ═══════════════════════════════════════════════════════════════ */
.cbl-hab-modal{border-radius:26px;overflow:hidden}
.hab-modal__head{
  padding:20px 22px 16px;
  background:linear-gradient(160deg,rgba(237,233,254,.55),rgba(var(--paper),0) 75%);
  border-bottom:1px solid rgba(var(--ink),.07);
}
.hab-modal__kicker{
  font-size:0.8125rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;margin:0 0 1px;
}
.hab-modal__title{font-size:1.375rem;font-weight:700;letter-spacing:-.035em}
.hab-modal__close{
  width:34px;height:34px;border-radius:999px;
  background:rgba(var(--paper),.8);border:1px solid rgba(var(--paper),.9);
  box-shadow:inset 0 1px 0 var(--rim),0 2px 6px rgba(var(--shade),.06);
  color:var(--t-4);
}
.hab-modal__close:hover{background:var(--paper-solid);color:var(--t-1);border-color:rgba(var(--ink),.12)}
.hab-modal__close svg{width:17px;height:17px}

.hab-modal__sec{padding:16px 22px 14px;border-bottom:1px solid rgba(var(--ink),.07)}
.hab-modal__sec-title{
  font-size:0.8125rem;font-weight:600;color:var(--t-4);
  text-transform:none;letter-spacing:0;margin:0 0 10px;
  display:block;
}
/* el adorno vertical sobraba: el espacio ya separa las secciones */
.hab-modal__sec-title::before{display:none}
.hab-modal__hint{font-size:0.8125rem;color:var(--t-4);line-height:1.45;margin:0 0 12px}

/* Detalle: lista de pares, etiqueta a la izquierda y valor a la derecha */
.hab-detail-dl dt{
  font-size:0.875rem;font-weight:400;color:var(--t-3);
  text-transform:none;letter-spacing:0;
}
.hab-detail-dl dd{font-size:0.875rem;font-weight:550;color:var(--t-1)}

/* Campos del editor */
.hab-modal__fields .form-group label{
  font-size:0.8125rem;font-weight:450;color:var(--t-3);
  text-transform:none;letter-spacing:0;margin-bottom:6px;
}
.hab-modal__fields input,.hab-modal__fields select{
  border-radius:14px;padding:11px 14px;font-size:0.9375rem;
  background-color:rgba(var(--paper),.8);
  border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
}
.hab-modal__fields input:focus,.hab-modal__fields select:focus{
  background-color:#fff;border-color:var(--ag-accent-2);
  box-shadow:0 0 0 4px rgba(79,70,229,.15),inset 0 1px 0 var(--rim);
}

/* Pie: acciones en píldora, la principal en violeta */
.hab-modal__foot{
  padding:14px 22px;
  background:linear-gradient(180deg,rgba(var(--paper),.6),rgba(var(--paper),.9));
  border-top:1px solid rgba(var(--ink),.07);
}
.hab-modal__foot .btn{
  border-radius:999px!important;min-width:120px;min-height:44px;
  padding:11px 22px!important;font-size:0.875rem;font-weight:550;
}
.hab-modal__foot .btn-primary{
  background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.42);
  box-shadow:inset 0 1px 0 var(--rim),0 6px 18px rgba(79,70,229,.28);
}
.hab-modal__foot .btn-secondary{
  background:rgba(var(--ink),.05);color:var(--t-1);
  border:1px solid rgba(var(--paper),.85);box-shadow:inset 0 1px 0 var(--rim);
}
.hab-modal__foot .btn-secondary:hover{background:var(--paper-solid);box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(var(--shade),.08)}

/* Camas: el vacío propone la acción en lugar de describir la carencia */
.hab-empty,.hab-detail-beds-wrap .hab-beds-row:empty::after{
  border-radius:14px;background:rgba(var(--ink),.035);
  border:1px dashed rgba(var(--ink),.12);
  font-size:0.8125rem;color:var(--t-4);
}
.hab-bed-add,.hab-beds-actions button{
  border-radius:14px!important;
  background:rgba(var(--paper),.75);border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);font-size:0.8438rem;font-weight:500;
}
.hab-bed-add:hover,.hab-beds-actions button:hover{
  background:var(--paper-solid);border-color:rgba(79,70,229,.28);
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(var(--shade),.07);
}

@media(max-width:480px){
  .hab-modal__head{padding:17px 18px 14px}
  .hab-modal__sec{padding:14px 18px 12px}
  .hab-modal__foot{padding:12px 18px}
  .hab-modal__foot .btn{min-width:0;flex:1}
}

/* Bloque "Huésped actual": las etiquetas venían en versalitas desde
   estilos en línea del generador; aquí se normalizan al resto. */
#hab-detail-guest-info span[style*="uppercase"]{
  font-size:0.8125rem!important;font-weight:400!important;
  text-transform:none!important;letter-spacing:0!important;
  color:var(--t-4)!important;
}
#hab-detail-guest-info div[style*="font-weight:600"],
#hab-detail-guest-info div[style*="font-weight:700"]{
  font-size:0.875rem!important;font-weight:550!important;color:var(--t-1)!important;
}
#hab-detail-guest-info>div:first-child>div:first-child{border-radius:999px!important}

/* Los pares etiqueta/valor se mantienen en dos columnas también en móvil:
   apilarlos duplicaba el alto sin ganar legibilidad. */
.hab-detail-dl{
  display:grid;grid-template-columns:auto 1fr;gap:9px 16px;align-items:baseline;
}
.hab-detail-dl dd{text-align:right;margin:0}

/* ═══════════════════════════════════════════════════════════════
   RESERVAS (admin) · rediseño
   Tres filas por reserva: quién y dónde, la estadía, el dinero.
   Sin franja lateral, sin versalitas y sin campos vacíos.
   ═══════════════════════════════════════════════════════════════ */
.resv-grid{display:flex;flex-direction:column;gap:8px}
.resv-card{
  background:linear-gradient(160deg,rgba(var(--paper),.95),rgba(var(--paper),.88))!important;
  border:1px solid var(--ag-border)!important;
  border-left:1px solid var(--ag-border)!important;
  border-radius:20px;padding:13px 16px;cursor:pointer;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  transition:transform .15s,box-shadow .15s,background .15s;
}
.resv-card::before,.resv-card::after{display:none!important}
.resv-card:hover{
  background:var(--paper-solid)!important;transform:translateY(-2px);
  box-shadow:inset 0 1px 0 var(--rim),0 12px 30px rgba(var(--shade),.10);
}
.resv-card:focus-visible{outline:2px solid var(--ag-accent-2);outline-offset:2px}

/* fila 1 */
.resv-card-top{
  display:flex;align-items:baseline;gap:8px;margin-bottom:6px;
  border:none;padding:0;
}
.resv-card-room{font-size:0.9688rem;font-weight:650;color:var(--t-1);letter-spacing:-.015em;flex-shrink:0}
.resv-card-guest{
  font-size:0.9062rem;font-weight:400;color:var(--t-3);flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.resv-card-guest::before{content:'\00b7';margin-right:7px;color:var(--sep)}
/* estado: punto y palabra, no píldora en versalitas */
.resv-card-status{
  display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
  background:none!important;border:none!important;padding:0!important;
  border-radius:0!important;font-size:0.8125rem;font-weight:500;color:var(--c-amber-d);
  text-transform:none;letter-spacing:0;
}
.resv-card-status::before{
  content:'';width:8px;height:8px;border-radius:999px;background:currentColor;
  box-shadow:0 0 0 3px color-mix(in srgb,currentColor 14%,transparent);
}

/* fila 2: la estadía de un vistazo */
.resv-stay{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font-size:0.8438rem;color:var(--t-2);margin-bottom:6px;
}
.resv-stay-in{font-weight:500}
.resv-stay-out{font-weight:500;color:var(--t-4)}
.resv-stay-arrow{
  width:15px;height:10px;flex-shrink:0;background:var(--t-4);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8h19M15 2l6 6-6 6'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8h19M15 2l6 6-6 6'/%3E%3C/svg%3E");
}
.resv-extra{font-size:0.8125rem;color:var(--t-4)}
.resv-extra::before{content:'\00b7';margin:0 8px 0 2px;color:var(--sep)}
.resv-sep{margin:0 6px;color:var(--sep)}

/* fila 3: dinero */
.resv-money{
  display:flex;align-items:center;gap:10px;
  padding-top:8px;position:relative;
}
.resv-money::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.07);
}
.resv-total{font-size:0.875rem;font-weight:600;color:var(--t-1);font-variant-numeric:tabular-nums}
.resv-saldo{font-size:0.8125rem;font-weight:500;font-variant-numeric:tabular-nums}
.resv-saldo.warn{color:var(--c-orange)}
.resv-saldo.ok{color:var(--c-green)}
.resv-saldo::before{content:'\00b7';margin-right:8px;color:var(--sep);font-weight:400}
.resv-chevron{
  margin-left:auto;width:7px;height:12px;flex-shrink:0;background:var(--sep);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 13' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1.5 1.5 5 5-5 5'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 13' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1.5 1.5 5 5-5 5'/%3E%3C/svg%3E");
}
.resv-card:hover .resv-chevron{background:var(--ag-accent-2)}

@media(max-width:560px){
  .resv-card{padding:12px 14px;border-radius:18px}
  .resv-card-room{font-size:0.9375rem}
  .resv-card-guest{font-size:0.875rem}
  .resv-stay{font-size:0.8125rem;gap:7px}
  .resv-extra{display:block;width:100%}
  .resv-extra::before{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   DETALLE DE RESERVA · rediseño
   Antes: tres franjas con separadores, nueve etiquetas en
   versalitas y tres campos ocupados por un guion. Ahora: el
   importe manda y debajo una lista de solo lo que existe.
   ═══════════════════════════════════════════════════════════════ */
.modal--rsv{padding:0!important;border-radius:26px!important;overflow:hidden!important;max-width:min(430px,calc(100vw - 28px))!important}
.rsv-modal{display:flex;flex-direction:column}

.rsv-head{
  display:flex;align-items:center;gap:13px;position:relative;
  padding:18px 20px 16px;
  background:linear-gradient(150deg,rgba(254,243,199,.7),rgba(var(--paper),0) 80%);
  border-bottom:1px solid rgba(var(--ink),.07);
}
.rsv-avatar{
  width:46px;height:46px;border-radius:999px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:0.9375rem;font-weight:600;color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#fbbf24,#f59e0b);
  border:1px solid rgba(var(--paper),.7);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(245,158,11,.3);
}
.rsv-head-txt{flex:1;min-width:0}
.rsv-name{
  font-size:1.1875rem;font-weight:700;letter-spacing:-.03em;color:var(--t-1);margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.rsv-sub{font-size:0.8438rem;color:var(--t-4);margin:2px 0 0;display:flex;align-items:center;gap:7px}
.rsv-estado{display:inline-flex;align-items:center;gap:6px;color:var(--c-amber-d);font-weight:500}
.rsv-estado::before{
  content:'';width:7px;height:7px;border-radius:999px;background:currentColor;
  box-shadow:0 0 0 3px rgba(180,83,9,.14);
}
.rsv-close{
  position:absolute;top:14px;right:14px;
  width:32px;height:32px;border-radius:999px;cursor:pointer;
  background:rgba(var(--paper),.82);border:1px solid rgba(var(--paper),.9);
  box-shadow:inset 0 1px 0 var(--rim),0 2px 6px rgba(var(--shade),.07);
  color:var(--t-4);display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
.rsv-close:hover{background:var(--paper-solid);color:var(--t-1)}

/* El importe es el dato que se consulta primero */
.rsv-importe{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px 14px;border-bottom:1px solid rgba(var(--ink),.07);
}
.rsv-importe-lbl{font-size:0.8125rem;color:var(--t-4);margin:0 0 1px}
.rsv-importe-val{
  font-size:1.75rem;font-weight:700;letter-spacing:-.04em;color:var(--t-1);margin:0;
  font-variant-numeric:tabular-nums;line-height:1.05;
}
.rsv-saldo-chip{
  flex-shrink:0;font-size:0.8125rem;font-weight:550;border-radius:999px;padding:6px 13px;
  font-variant-numeric:tabular-nums;
}
.rsv-saldo-chip.warn{background:rgba(234,88,12,.12);color:var(--c-orange-d)}
.rsv-saldo-chip.ok{background:rgba(5,150,105,.12);color:var(--c-green-d)}

/* Lista de datos: solo filas con contenido */
.rsv-datos{margin:0;padding:6px 20px 10px}
.rsv-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:9px 0;position:relative;
}
.rsv-row+.rsv-row::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.06);
}
.rsv-row dt{font-size:0.875rem;font-weight:400;color:var(--t-3);margin:0}
.rsv-row dd{
  font-size:0.875rem;font-weight:550;color:var(--t-1);margin:0;text-align:right;
  font-variant-numeric:tabular-nums;
}
.rsv-notas{
  margin:0 20px 12px;padding:11px 14px;border-radius:14px;
  background:rgba(var(--ink),.04);font-size:0.8125rem;color:var(--t-3);line-height:1.45;
}
.rsv-foot{
  padding:12px 20px;
  background:linear-gradient(180deg,rgba(var(--paper),.6),rgba(var(--paper),.9));
  border-top:1px solid rgba(var(--ink),.07);
}
.rsv-foot .btn{
  width:100%;border-radius:999px!important;min-height:46px;
  font-size:0.875rem;font-weight:550;
  background:rgba(var(--ink),.05);color:var(--t-1);
  border:1px solid rgba(var(--paper),.85);box-shadow:inset 0 1px 0 var(--rim);
}
.rsv-foot .btn:hover{background:var(--paper-solid);box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(var(--shade),.08)}

@media(max-width:420px){
  .rsv-head{padding:16px 17px 14px}
  .rsv-importe,.rsv-datos,.rsv-foot{padding-left:17px;padding-right:17px}
  .rsv-importe-val{font-size:1.5625rem}
}

/* ── Cerrar siempre en rojo ────────────────────────────────────
   Convención del proyecto: tanto la X de la esquina como el botón
   de cerrar se leen en rojo, para que salir sea reconocible de un
   vistazo en cualquier modal.
   ══════════════════════════════════════════════════════════════ */
.rsv-close,.hab-modal__close,.modal-close{
  color:var(--c-red)!important;
  background:rgba(220,38,38,.09)!important;
  border:1px solid rgba(220,38,38,.18)!important;
  box-shadow:inset 0 1px 0 var(--rim)!important;
}
.rsv-close:hover,.hab-modal__close:hover,.modal-close:hover{
  color:#fff!important;
  background:linear-gradient(135deg,#f87171,#dc2626)!important;
  border-color:rgba(220,38,38,.4)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(220,38,38,.28)!important;
}
.rsv-close:focus-visible,.hab-modal__close:focus-visible,.modal-close:focus-visible{
  outline:2px solid #dc2626;outline-offset:2px;
}

/* El botón "Cerrar" del pie sigue el mismo código de color */
.rsv-foot .btn,
.hab-modal__foot .btn-cerrar,
.rsv-foot .btn-cerrar,
.btn-cerrar{
  background:rgba(220,38,38,.08)!important;
  color:var(--c-red-d)!important;
  border:1px solid rgba(220,38,38,.18)!important;
  box-shadow:inset 0 1px 0 var(--rim)!important;
  font-weight:550;
}
.rsv-foot .btn:hover,
.btn-cerrar:hover{
  background:rgba(220,38,38,.14)!important;
  color:var(--c-red-dd)!important;
  border-color:rgba(220,38,38,.3)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(220,38,38,.14)!important;
}

/* ── Actualizar · icono y giro ─────────────────────────────────
   Arco abierto con punta, como arrow.clockwise. El icono gira
   mientras la sección recarga, con la curva de entrada y salida
   de las animaciones del sistema, y siempre completa una vuelta.
   ══════════════════════════════════════════════════════════════ */
.topbar-refresh svg{
  width:19px;height:19px;
  transition:transform .2s cubic-bezier(.4,0,.2,1);
}
.topbar-refresh:active svg{transform:rotate(-18deg) scale(.94)}
.topbar-refresh.is-spinning{pointer-events:none}
.topbar-refresh.is-spinning svg{
  animation:girarActualizar .62s cubic-bezier(.45,.05,.25,1) infinite;
  transition:none;
}
@keyframes girarActualizar{
  from{transform:rotate(0)}
  to{transform:rotate(360deg)}
}
/* Mientras gira, el botón se tiñe del acento para que el estado se lea */
.topbar-refresh.is-spinning{
  color:var(--ag-accent-2);
  background:rgba(79,70,229,.09);
  border-color:rgba(79,70,229,.22);
}
/* Con movimiento reducido no se gira: se funde. Un fundido de opacidad
   no es desplazamiento, así que sigue comunicando "trabajando" sin
   incumplir la preferencia, y se nota más que bajar la opacidad y ya. */
@media(prefers-reduced-motion:reduce){
  .topbar-refresh.is-spinning svg{
    animation:fundirActualizar 1s ease-in-out infinite;
    transform:none;
  }
  .topbar-refresh:active svg{transform:none}
}
@keyframes fundirActualizar{
  0%,100%{opacity:1}
  50%{opacity:.35}
}

/* ── Rejilla de habitaciones: filas parejas ────────────────────
   Una habitación con dos camas parte la línea de metadatos en dos
   y su tarjeta crecía. Con las filas igualadas, la rejilla no
   baila aunque el texto varíe.
   ══════════════════════════════════════════════════════════════ */
.hab-grid{grid-auto-rows:1fr;align-items:stretch}
.hab-grid>.hab-card{height:100%}
.hab-card-body{display:flex;flex-direction:column;height:100%}
.hab-card-meta{margin-top:auto;padding-top:5px}

/* ═══════════════════════════════════════════════════════════════
   DETALLE DE HUÉSPED (dashboard) · rediseño
   La tabla de cuatro columnas con cabecera en versalitas pasa a
   lista de estancias. El total acumulado manda, como el importe
   en el detalle de reserva.
   ═══════════════════════════════════════════════════════════════ */
.modal--gd{
  padding:0!important;border-radius:26px!important;overflow:hidden!important;
  max-width:min(460px,calc(100vw - 28px))!important;
  display:flex!important;flex-direction:column!important;
  max-height:min(88dvh,780px)!important;
}
.gd-modal{display:flex;flex-direction:column;min-height:0;flex:1}

.gd-head{
  display:flex;align-items:center;gap:13px;position:relative;flex-shrink:0;
  padding:18px 20px 16px;
  background:linear-gradient(150deg,rgba(237,233,254,.6),rgba(var(--paper),0) 80%);
  border-bottom:1px solid rgba(var(--ink),.07);
}
.gd-avatar{
  width:46px;height:46px;border-radius:999px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:0.9375rem;font-weight:600;color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#a78bfa,#6d28d9);
  border:1px solid rgba(var(--paper),.7);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(109,40,217,.28);
}
.gd-head-txt{flex:1;min-width:0}
.gd-name{
  font-size:1.1875rem;font-weight:700;letter-spacing:-.03em;color:var(--t-1);margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.gd-sub{font-size:0.8438rem;color:var(--t-4);margin:2px 0 0}
.gd-close{
  position:absolute;top:14px;right:14px;
  width:32px;height:32px;border-radius:999px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:var(--c-red);background:rgba(220,38,38,.09);
  border:1px solid rgba(220,38,38,.18);
  box-shadow:inset 0 1px 0 var(--rim);
  transition:background .15s,color .15s;
}
.gd-close:hover{
  color:#fff;background:linear-gradient(135deg,#f87171,#dc2626);
  border-color:rgba(220,38,38,.4);
  box-shadow:inset 0 1px 0 var(--rim),0 4px 12px rgba(220,38,38,.28);
}
.gd-close:focus-visible{outline:2px solid #dc2626;outline-offset:2px}

.gd-importe{
  padding:15px 20px 13px;flex-shrink:0;
  border-bottom:1px solid rgba(var(--ink),.07);
}
.gd-importe-lbl{font-size:0.8125rem;color:var(--t-4);margin:0 0 1px}
.gd-importe-val{
  font-size:1.6875rem;font-weight:700;letter-spacing:-.04em;color:var(--t-1);margin:0;
  font-variant-numeric:tabular-nums;line-height:1.05;
}

.gd-datos{margin:0;padding:5px 20px 8px;flex-shrink:0}
.gd-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:9px 0;position:relative;
}
.gd-row+.gd-row::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.06);
}
.gd-row dt{font-size:0.875rem;font-weight:400;color:var(--t-3);margin:0}
.gd-row dd{
  font-size:0.875rem;font-weight:550;color:var(--t-1);margin:0;text-align:right;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* Estancias: filas, no tabla con cabecera gris */
.gd-sec{padding:6px 20px 4px;min-height:0;display:flex;flex-direction:column;flex:1}
.gd-sec-title{
  font-size:0.8125rem;font-weight:600;color:var(--t-4);margin:6px 0 6px;
  text-transform:none;letter-spacing:0;
}
.gd-estancias{
  min-height:0;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:rgba(var(--ink),.2) transparent;
}
.gd-estancias::-webkit-scrollbar{width:8px}
.gd-estancias::-webkit-scrollbar-thumb{background:rgba(var(--ink),.16);border:2px solid transparent;background-clip:content-box;border-radius:99px}
.gd-estancia{
  display:flex;align-items:center;gap:10px;
  padding:10px 0;position:relative;
}
.gd-estancia+.gd-estancia::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.06);
}
.gd-est-main{flex:1;min-width:0}
.gd-est-hab{display:block;font-size:0.875rem;font-weight:550;color:var(--t-1)}
.gd-est-fecha{display:block;font-size:0.7812rem;color:var(--t-4);margin-top:1px}
.gd-est-monto{
  font-size:0.875rem;font-weight:550;color:var(--t-1);flex-shrink:0;
  font-variant-numeric:tabular-nums;
}
.gd-est-estado{
  flex-shrink:0;font-size:0.75rem;font-weight:500;border-radius:999px;padding:3px 10px;
  background:rgba(var(--ink),.06);color:var(--t-4);
}
.gd-est-estado--activa{background:rgba(5,150,105,.13);color:var(--c-green-d)}
.gd-est-estado--reservada{background:rgba(37,99,235,.13);color:var(--c-blue-d)}
.gd-est-estado--cancelada{background:rgba(220,38,38,.12);color:var(--c-red-d)}
.gd-vacio{font-size:0.8438rem;color:var(--t-4);padding:14px 0;margin:0;text-align:center}

.gd-foot{
  display:flex;gap:10px;padding:13px 20px;flex-shrink:0;
  background:linear-gradient(180deg,rgba(var(--paper),.6),rgba(var(--paper),.92));
  border-top:1px solid rgba(var(--ink),.07);
}
.gd-foot .btn{flex:1;border-radius:999px!important;min-height:46px;font-size:0.875rem;font-weight:550}
.gd-foot .btn-primary{
  background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5)!important;
  border:1px solid rgba(var(--paper),.42)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 18px rgba(79,70,229,.28)!important;
  color:#fff!important;
}
.gd-foot .gd-cerrar{
  background:rgba(220,38,38,.08)!important;color:var(--c-red-d)!important;
  border:1px solid rgba(220,38,38,.18)!important;
  box-shadow:inset 0 1px 0 var(--rim)!important;
}
.gd-foot .gd-cerrar:hover{background:rgba(220,38,38,.14)!important;color:var(--c-red-dd)!important}

@media(max-width:420px){
  .gd-head{padding:16px 17px 14px}
  .gd-importe,.gd-datos,.gd-sec,.gd-foot{padding-left:17px;padding-right:17px}
  .gd-importe-val{font-size:1.5rem}
}

/* ═══════════════════════════════════════════════════════════════
   TURNOS · rediseño
   Once etiquetas en versalitas, seis franjas de color y una barra
   verde decorativa en cada tarjeta. Se queda el dato, se va el
   adorno.
   ═══════════════════════════════════════════════════════════════ */

/* ── Caja de hoy ──────────────────────────────────────────────── */
.turnos-live{
  background:linear-gradient(160deg,rgba(var(--paper),.92),rgba(var(--paper),.82));
  border:1px solid var(--ag-border);border-radius:22px;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  padding:16px 18px 14px;
}
.turnos-live-title h2{font-size:1rem;font-weight:650;letter-spacing:-.025em}
.turnos-live-badge{
  font-size:0.75rem;font-weight:500;border-radius:999px;padding:3px 11px;
  text-transform:none;letter-spacing:0;
  background:rgba(5,150,105,.13);color:var(--c-green-d);border:none;
  display:inline-flex;align-items:center;gap:6px;
}
.turnos-live-badge::before{
  content:'';width:7px;height:7px;border-radius:999px;background:currentColor;
  animation:latidoVivo 2s ease-in-out infinite;
}
@keyframes latidoVivo{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.turnos-live-badge::before{animation:none}}

/* Celdas: una tarjeta con separadores, sin franja de color arriba */
.turnos-live-grid{
  gap:0;margin-top:12px;border-radius:16px;overflow:hidden;
  background:rgba(var(--ink),.028);
}
.turnos-live-cell{
  background:none!important;border:none!important;border-radius:0!important;
  box-shadow:inset 1px 0 0 rgba(var(--shade),.06)!important;
  padding:12px 13px;
}
.turnos-live-cell:first-child{box-shadow:none!important}
.turnos-live-cell::before{display:none!important}
.turnos-live-v{font-size:1.0625rem;font-weight:650;letter-spacing:-.03em}
.turnos-live-k{
  font-size:0.7812rem;font-weight:400;color:var(--t-4);margin-top:3px;
  text-transform:none;letter-spacing:0;
}
.turnos-live-foot{font-size:0.7812rem;color:var(--t-4);margin-top:10px;line-height:1.45}
.turnos-live-foot strong{font-weight:550;color:var(--t-3)}
.turnos-live-refresh{
  width:36px;height:36px;border-radius:999px;
  background:rgba(var(--paper),.75);border:1px solid var(--ag-border);
  box-shadow:inset 0 1px 0 var(--rim);
}
.turnos-live-refresh:hover{background:var(--paper-solid);color:var(--ag-accent-2);border-color:rgba(79,70,229,.28)}

/* ── Barra de listado ─────────────────────────────────────────── */
.turnos-toolbar span{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.turnos-seg{
  border-radius:999px;padding:3px;
  background:rgba(var(--ink),.05);border:1px solid rgba(var(--paper),.8);
  box-shadow:inset 0 1px 0 var(--rim);
}
.turnos-seg button{border-radius:999px;font-size:0.8125rem;font-weight:450;padding:6px 15px}
.turnos-seg button.is-on{
  background:var(--paper-solid);color:var(--ag-accent-2);font-weight:550;
  box-shadow:inset 0 1px 0 var(--rim),0 1px 3px rgba(var(--shade),.10),0 3px 10px rgba(var(--shade),.06);
}

/* ── Tarjeta de turno ─────────────────────────────────────────── */
.turnos-card.turnos-card--v2{
  background:linear-gradient(160deg,rgba(var(--paper),.95),rgba(var(--paper),.88))!important;
  border:1px solid var(--ag-border)!important;border-radius:20px;
  box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  padding:15px 17px;
}
.turnos-card.turnos-card--v2:hover{
  border-color:rgba(79,70,229,.28)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 12px 30px rgba(var(--shade),.10);
}
/* la barra verde no decía nada: fuera */
.turnos-card__strip{display:none!important}
.turnos-card__who{font-size:0.9688rem;font-weight:650;letter-spacing:-.02em}
.turnos-card__who::first-letter{text-transform:uppercase}
.turnos-card__meta{font-size:0.8125rem;color:var(--t-4);margin-top:3px}

.turno-pay-section-label,.turno-pay-section-label--card{
  font-size:0.8125rem!important;font-weight:450;color:var(--t-4);
  text-transform:none!important;letter-spacing:0!important;margin:2px 0 8px!important;
}
.turno-pay-stack--card .turno-pay-row{margin-bottom:9px}
.turno-pay-row__name{font-size:0.8438rem!important;font-weight:400;color:var(--t-2)}
.turno-pay-row__money{font-size:0.8438rem!important;font-weight:550;font-variant-numeric:tabular-nums}
.turno-pay-row__pct{font-size:0.7812rem;color:var(--t-4);font-variant-numeric:tabular-nums}
.turno-pay-bar{height:5px!important;border-radius:999px;background:rgba(var(--ink),.06)}
.turno-pay-bar__fill{border-radius:999px;box-shadow:inset 0 1px 0 var(--rim)}

.turnos-card__eg-row{
  padding-top:10px;margin-top:4px;position:relative;border:none;
}
.turnos-card__eg-row::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.07);
}
.turnos-card__eg-row .turnos-card__hint{
  font-size:0.8438rem!important;font-weight:400!important;color:var(--t-3)!important;
  text-transform:none!important;letter-spacing:0!important;
}
.turnos-card__eg-row .turnos-card__amt--r{font-size:0.8438rem!important;font-weight:550!important}

/* Neto: la cifra manda, sin caja ámbar */
.turnos-card__neto{
  background:none!important;border:none!important;border-radius:0!important;
  padding:10px 0 0!important;margin-top:2px;position:relative;
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
}
.turnos-card__neto::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.07);
}
.turnos-card__neto-label{
  font-size:0.875rem;font-weight:450;color:var(--t-1);
  text-transform:none;letter-spacing:0;
}
.turnos-card__neto-val{
  font-size:1.3125rem;font-weight:700;letter-spacing:-.035em;color:var(--t-1)!important;
  font-variant-numeric:tabular-nums;
}
.turnos-card__actions .btn{
  border-radius:999px!important;font-size:0.7812rem;font-weight:500;
  padding:7px 15px!important;min-height:34px;
  background:rgba(var(--paper),.8);border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);color:var(--t-2);
}
.turnos-card__actions .btn:hover{background:var(--paper-solid);color:var(--ag-accent-2);border-color:rgba(79,70,229,.25)}

@media(max-width:640px){
  .turnos-live-grid{grid-template-columns:repeat(3,1fr)}
  .turnos-live-cell:nth-child(3n+1){box-shadow:none!important}
  .turnos-live-cell:nth-child(n+4){box-shadow:inset 1px 0 0 rgba(var(--shade),.06),inset 0 1px 0 rgba(var(--shade),.06)!important}
  .turnos-live-cell:nth-child(4){box-shadow:inset 0 1px 0 rgba(var(--shade),.06)!important}
  .turnos-live-v{font-size:0.9375rem}
  .turnos-card.turnos-card--v2{padding:14px 15px}
}

/* ═══════════════════════════════════════════════════════════════
   CORRECCIONES DE LA AUDITORÍA HIG (2026-09-14)
   ═══════════════════════════════════════════════════════════════ */

/* 1 · Objetivos táctiles: 44x44 en móvil, 28x28 mínimo en escritorio */
@media(pointer:coarse),(max-width:899px){
  .nav-item{min-height:44px}
  .sidebar-toggle,.topbar-refresh,.turnos-live-refresh{width:44px;height:44px}
  .hab-card-actions button{width:44px;height:44px}
  .turnos-seg button{min-height:40px}
  .gd-close,.rsv-close,.hab-modal__close{width:40px;height:40px}
}
@media(pointer:fine){
  /* mínimo de escritorio: 28x28 */
  .hab-card-actions button{min-width:32px;min-height:32px}
}

/* 2 · Vidrio solo en la capa funcional (barra lateral y barra superior).
   Paneles, tarjetas y tablas son contenido: llevan superficie opaca. */
.turnos-live,.dash-hero,.dash-tile,.dash-panel,.dash-rank-list,
.hab-kpis,.hab-card,.resv-card,.guest-list,.gd-modal,.rsv-modal{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* 3 · Tamaño mínimo de texto: nada informativo por debajo de 11px */
.turnos-live-k,.hab-kpi__l,.dash-tile-label,.gd-est-estado,
.resv-card-status,.hab-estado-chip,.badge{font-size:0.75rem}

/* ═══════════════════════════════════════════════════════════════
   CONTABILIDAD · rediseño
   Los cinco importes salían dos veces: en tarjetas con franja de
   color y otra vez en barras. Se quedan las barras, que además
   muestran la proporción. Once etiquetas en versalitas, fuera.
   ═══════════════════════════════════════════════════════════════ */

/* ── Barra de período ─────────────────────────────────────────── */
.cbl-toolbar{
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:18px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
  padding:11px 14px;margin-bottom:14px;
}
.cbl-period-label{
  font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.cbl-date-input{
  border-radius:12px;padding:8px 12px;font-size:0.875rem;
  background-color:rgba(var(--paper),.9);border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
}
.cbl-date-input:focus{background-color:#fff;border-color:var(--ag-accent-2);box-shadow:0 0 0 4px rgba(79,70,229,.15)}
.cbl-preset{
  border-radius:999px;padding:7px 15px;font-size:0.8125rem;font-weight:450;
  background:rgba(var(--ink),.05);border:1px solid rgba(var(--paper),.8);
  color:var(--t-2);box-shadow:inset 0 1px 0 var(--rim);
}
.cbl-preset:hover{background:var(--paper-solid);color:var(--ag-accent-2)}
.cbl-apply-btn{
  border-radius:999px!important;padding:8px 20px!important;font-size:0.8438rem;font-weight:550;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.4);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(79,70,229,.26);
  color:#fff;
}

/* ── Resultado neto: titular, sin caja verde saturada ─────────── */
.cbl-neto{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:22px;box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  padding:18px 20px;margin-bottom:14px;
}
.cbl-neto-lbl{font-size:0.8438rem;color:var(--t-4);margin:0 0 1px}
.cbl-neto-val{
  font-size:2.25rem;font-weight:700;letter-spacing:-.045em;color:var(--t-1);margin:0;
  font-variant-numeric:tabular-nums;line-height:1.03;
}
.cbl-neto-val.is-neg{color:var(--c-red)}
.cbl-neto-sub{font-size:0.8125rem;color:var(--t-4);margin:4px 0 0}
.cbl-neto-side{display:flex;gap:26px;margin:0}
.cbl-neto-side dt{font-size:0.8125rem;color:var(--t-4);margin:0}
.cbl-neto-side dd{
  font-size:1rem;font-weight:600;margin:2px 0 0;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.cbl-neto-side .is-in{color:var(--c-green-d)}
.cbl-neto-side .is-out{color:var(--c-red-d)}

/* ── Paneles de barras ────────────────────────────────────────── */
.cbl-bars-card,.cbl-panel{
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:20px;box-shadow:inset 0 1px 0 var(--rim),0 6px 20px rgba(var(--shade),.05);
  padding:18px 20px 14px;
}
.cbl-bars-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  margin-bottom:6px;padding-bottom:10px;
  border-bottom:1px solid rgba(var(--ink),.07);
}
.cbl-bars-title{
  font-size:0.9062rem;font-weight:600;color:var(--t-1);margin:0;
  text-transform:none;letter-spacing:-.01em;
}
.cbl-bars-total{
  font-size:0.875rem;font-weight:600;color:var(--c-green-d);
  font-variant-numeric:tabular-nums;
}
.cbl-bars-total.is-out{color:var(--c-red-d)}
.cbl-bar-row{
  display:grid;grid-template-columns:minmax(96px,auto) minmax(64px,1fr) auto 38px;
  align-items:center;gap:18px;padding:11px 0;
}
.cbl-bar-name{font-size:0.8438rem;color:var(--t-2);font-weight:400}
.cbl-bar-track{height:6px;border-radius:999px;background:rgba(var(--ink),.07);min-width:56px}
.cbl-bar-fill{height:100%;border-radius:999px;box-shadow:inset 0 1px 0 var(--rim);transition:width .5s cubic-bezier(.4,0,.2,1)}
.cbl-bar-amount{
  font-size:0.8438rem;font-weight:550;color:var(--t-1)!important;
  font-variant-numeric:tabular-nums;text-align:right;min-width:92px;
}
.cbl-bar-pct{font-size:0.7812rem;color:var(--t-4);font-variant-numeric:tabular-nums;min-width:34px;text-align:right}

/* ── Paneles de detalle ───────────────────────────────────────── */
.cbl-panel-hd{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:0 0 10px;margin-bottom:4px;border-bottom:1px solid rgba(var(--ink),.07);
}
.cbl-panel-hd-title{
  font-size:0.9062rem;font-weight:600;color:var(--t-1);
  text-transform:none;letter-spacing:-.01em;
}
.cbl-panel-hd-count{font-size:0.8125rem;color:var(--t-4);text-transform:none;letter-spacing:0}
.cbl-panel-body{padding:4px 0 0}
.cbl-ph-row{
  display:grid;grid-template-columns:minmax(76px,auto) minmax(56px,1fr) auto;
  align-items:center;gap:18px;padding:11px 0;border-radius:10px;
}
.cbl-ph-row[onclick]{cursor:pointer;transition:background .14s;margin:0 -8px;padding-left:8px;padding-right:8px}
.cbl-ph-row[onclick]:hover{background:rgba(79,70,229,.06)}
.cbl-ph-label{font-size:0.8438rem;color:var(--t-2);min-width:76px}
.cbl-empty{font-size:0.8438rem;color:var(--t-4);padding:18px 0;text-align:center}

@media(max-width:820px){
  .cbl-neto{align-items:flex-start;flex-direction:column;gap:12px}
  .cbl-neto-val{font-size:1.9375rem}
  .cbl-bar-row,.cbl-ph-row{gap:12px}
  .cbl-bar-name,.cbl-ph-label{font-size:0.8125rem}
  .cbl-bar-amount{min-width:80px;font-size:0.8125rem}
}

/* ── Barra de período: ordenada a cualquier ancho ──────────────
   El problema no era solo el móvil: entre 700 y 900px las fechas
   también se separaban y el guion quedaba suelto. La clave es que
   el par de fechas nunca se parta, y que los grupos envuelvan
   como bloques enteros.
   ══════════════════════════════════════════════════════════════ */
.cbl-toolbar-row{
  display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;
}
/* el rango es una unidad: etiqueta, fecha, guion, fecha */
.cbl-period-group{
  display:flex;align-items:center;gap:8px;flex-wrap:nowrap;
  flex:1 1 320px;min-width:0;
}
.cbl-period-label{flex-shrink:0}
.cbl-date-input{flex:1 1 0;min-width:0;max-width:170px}
.cbl-period-sep{flex-shrink:0;color:var(--t-5)}
/* atajos y acción viajan juntos y se van a la derecha si hay sitio */
.cbl-presets{display:flex;gap:7px;flex-wrap:nowrap;flex-shrink:0}
.cbl-apply-btn{flex-shrink:0}

@media(max-width:820px){
  .cbl-toolbar-row{gap:10px}
  .cbl-period-group{flex:1 1 100%}
  .cbl-presets{flex:1 1 auto}
  .cbl-presets .cbl-preset{flex:1;min-height:42px;white-space:nowrap}
  .cbl-apply-btn{flex:0 0 auto;min-height:42px;padding:9px 24px!important}
}
@media(max-width:420px){
  /* a esta anchura el par de fechas ya no entra con su etiqueta delante */
  .cbl-period-group{flex-wrap:wrap}
  .cbl-period-label{flex:1 1 100%;margin-bottom:-2px}
  .cbl-date-input{max-width:none}
  .cbl-apply-btn{flex:1 1 100%}
}

/* Separación entre paneles y dentro de ellos: las filas iban muy juntas
   y la barra quedaba pegada al nombre y al importe. */
.cbl-cols{display:grid;gap:14px;margin-bottom:14px}
@media(min-width:900px){.cbl-cols{grid-template-columns:1fr 1fr}}
.cbl-bar-row+.cbl-bar-row,.cbl-ph-row+.cbl-ph-row{position:relative}
.cbl-bar-row+.cbl-bar-row::before,.cbl-ph-row+.cbl-ph-row::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:rgba(var(--ink),.05);
}
.cbl-panel-body{padding-top:2px}

/* Los mínimos de las columnas sumaban más que el ancho de media rejilla
   y la página se desplazaba en horizontal. Las celdas pueden encogerse. */
.cbl-cols>*{min-width:0}
.cbl-bar-row{
  grid-template-columns:minmax(0,auto) minmax(40px,1fr) minmax(0,auto) 36px;
  gap:14px;
}
.cbl-ph-row{
  grid-template-columns:minmax(0,auto) minmax(40px,1fr) minmax(0,auto);
  gap:14px;
}
.cbl-bar-name,.cbl-ph-label{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.cbl-bar-amount{min-width:0;white-space:nowrap}
.cbl-bar-track{min-width:40px}
/* nada de esta vista debe provocar desplazamiento lateral */
#content-area{overflow-x:hidden}
.cbl-wrap{max-width:100%;min-width:0}

/* Encabezados de panel: todos iguales. Dos llevaban franja gris de borde
   a borde y los otros dos no, así que parecían componentes distintos. */
.cbl-panel-hd{
  background:none!important;
  padding:0 0 10px!important;margin-bottom:4px;
  border-bottom:1px solid rgba(var(--ink),.07)!important;
}
.cbl-panel-body{padding:4px 0 0!important;gap:0!important}
.cbl-ph-label{text-align:left!important;font-weight:400!important;color:var(--t-2)!important}
.cbl-bar-amount,.cbl-ph-row .cbl-bar-amount{text-align:right}

/* ═══════════════════════════════════════════════════════════════
   MOVIMIENTOS · HISTORIAL · HUÉSPEDES · PERSONAL · DESCANSOS
   CONFIGURACIÓN
   Los mismos patrones en seis pantallas: versalitas en cabeceras
   de tabla y contadores, franjas de color y píldoras gritando.
   ═══════════════════════════════════════════════════════════════ */

/* ── Barras de filtro (comunes) ───────────────────────────────── */
.mv-toolbar,.hr-toolbar,.gst-toolbar,.toolbar{
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:18px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
}
.mv-search,.hr-search,.gst-search,
input[type="search"],input[placeholder^="Buscar"]{
  border-radius:14px;padding:11px 15px;font-size:0.9062rem;
  background-color:rgba(var(--paper),.9);border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
}

/* ── Tiras de contadores: sin versalitas, con separadores finos ─ */
.mv-stats-row,.hr-stats-row,.gst-stats-row{
  background:rgba(var(--paper),.92)!important;
  border:1px solid var(--ag-border);border-radius:16px;
  box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
  padding:12px 16px!important;gap:0!important;
}
.mv-stat,.hr-stat,.gst-stat{padding:0 18px;gap:2px!important}
.mv-stat:first-child,.hr-stat:first-child,.gst-stat:first-child{padding-left:0}
.mv-stat-label,.hr-stat-label,.gst-stat-label{
  font-size:0.7812rem!important;font-weight:400!important;color:var(--t-4)!important;
  text-transform:none!important;letter-spacing:0!important;
}
.mv-stat-val,.hr-stat-val,.gst-stat-val{
  font-size:1.0625rem!important;font-weight:650!important;letter-spacing:-.03em;
}
.mv-stat-sep,.hr-stat-sep,.gst-stat-sep{background:rgba(var(--ink),.09);height:30px}

/* ── Tablas ───────────────────────────────────────────────────── */
.table-wrap{
  background:rgba(var(--paper),.94);border:1px solid var(--ag-border);
  border-radius:20px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
}
table{font-size:0.875rem}
th{
  font-size:0.7812rem!important;font-weight:500!important;color:var(--t-4)!important;
  text-transform:none!important;letter-spacing:0!important;
  padding:13px 16px!important;
  border-bottom:1px solid rgba(var(--ink),.09)!important;
  background:none!important;
}
td{
  padding:13px 16px!important;
  border-bottom:1px solid rgba(var(--ink),.055)!important;
  color:var(--t-1);
}
tbody tr:last-child td{border-bottom:none!important}
tbody tr{transition:background .14s}
tbody tr:hover td{background:rgba(79,70,229,.045)}

/* ── Insignias de estado ──────────────────────────────────────── */
.badge{
  font-size:0.75rem;font-weight:500;padding:3px 10px;border-radius:999px;
  text-transform:none;letter-spacing:0;
}
.badge-green{background:rgba(5,150,105,.13);color:var(--c-green-d)}
.badge-red{background:rgba(220,38,38,.12);color:var(--c-red-d)}
.badge-gold{background:rgba(202,138,4,.15);color:var(--c-amber-dd)}
.badge-blue{background:rgba(37,99,235,.13);color:var(--c-blue-d)}
.badge-purple{background:rgba(124,58,237,.13);color:var(--c-violet)}
.badge-muted{background:rgba(var(--ink),.06);color:var(--t-4)}

/* ── Personal ─────────────────────────────────────────────────── */
.staff-hero{
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:20px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
}
.staff-hero-title{font-size:1.1875rem;font-weight:650;letter-spacing:-.03em}
.staff-hero-desc{font-size:0.8438rem;color:var(--t-4);max-width:48ch}
.staff-hero-actions .btn{
  border-radius:999px!important;font-size:0.8438rem;min-height:42px;padding:10px 20px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.4);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(79,70,229,.26);
}
.staff-kpi::before{display:none!important}
.staff-kpi{
  background:rgba(var(--paper),.92)!important;border:1px solid var(--ag-border)!important;
  border-radius:18px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);padding:14px 16px;
}
.staff-kpi-label{
  font-size:0.8125rem!important;font-weight:400!important;color:var(--t-4)!important;
  text-transform:none!important;letter-spacing:0!important;
}
.staff-kpi-val{font-size:1.5rem;font-weight:650}
.staff-kpi-hint{font-size:0.7812rem;color:var(--t-4)}
/* la franja lateral se va: el rol ya se dice con la etiqueta */
.staff-card-v2::before{display:none!important}
.staff-card-v2{
  background:rgba(var(--paper),.94)!important;border:1px solid var(--ag-border)!important;
  border-radius:20px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
}
.staff-card-v2:hover{box-shadow:inset 0 1px 0 var(--rim),0 12px 30px rgba(var(--shade),.10)}
.staff-card-v2__role,.staff-role-badge{
  font-size:0.75rem!important;font-weight:500!important;border-radius:999px;padding:3px 10px;
  text-transform:none!important;letter-spacing:0!important;
}
.staff-card-v2 .btn{border-radius:999px!important;font-size:0.8125rem;min-height:36px}

/* ── Descansos (admin) ────────────────────────────────────────── */
.adesc-day.adesc-taken{
  background:color-mix(in srgb,var(--ad-color) 15%,transparent)!important;
  color:inherit!important;position:relative;
}
.adesc-day.adesc-taken::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ad-color);
}
.adesc-day.adesc-taken .adesc-day-num{
  color:color-mix(in srgb,var(--ad-color) 78%,var(--t-1))!important;font-weight:650!important;
}
.adesc-day .adesc-chip{
  background:none!important;font-size:0.6562rem!important;font-weight:550!important;
  color:color-mix(in srgb,var(--ad-chip,var(--t-4)) 80%,var(--t-1))!important;
  display:flex;align-items:center;gap:5px;
}
.adesc-day .adesc-chip::before{
  content:'';width:6px;height:6px;border-radius:999px;flex-shrink:0;background:var(--ad-chip,var(--t-4));
}
.adesc-cal-head span,.adesc-head span{
  font-size:0.7188rem!important;font-weight:500!important;color:var(--t-4)!important;
  text-transform:none!important;letter-spacing:0!important;
}

/* ── Configuración ────────────────────────────────────────────── */
.cfg-section{
  background:rgba(var(--paper),.92);border:1px solid var(--ag-border);
  border-radius:20px;box-shadow:inset 0 1px 0 var(--rim),var(--shadow-card);
}
.cfg-section-head{
  background:none!important;padding:15px 18px 13px;
  border-bottom:1px solid rgba(var(--ink),.07);
}
.cfg-section-title{
  font-size:0.9062rem!important;font-weight:600!important;color:var(--t-1)!important;
  text-transform:none!important;letter-spacing:-.01em!important;
}
.cfg-section-title svg{color:var(--t-5)}
.cfg-grid label,.cfg-section-body label{
  font-size:0.8125rem;font-weight:450;color:var(--t-3);
  text-transform:none;letter-spacing:0;
}
.cfg-section-body .btn-primary{
  border-radius:999px!important;min-height:42px;font-size:0.8438rem;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.4);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(79,70,229,.26);
}
.cfg-section-head .btn{border-radius:999px!important;font-size:0.8125rem;min-height:36px}

@media(max-width:640px){
  .mv-stat,.hr-stat,.gst-stat{padding:0 12px}
  th,td{padding:11px 12px!important;font-size:0.8125rem}
  .staff-kpi-val{font-size:1.3rem}
}

/* ── Remates de las seis secciones ─────────────────────────────── */
/* Etiqueta de rol del personal: era la clase .staff-role-pill */
.staff-role-pill{
  font-size:0.75rem!important;font-weight:500!important;
  border-radius:999px;padding:3px 10px;
  text-transform:none!important;letter-spacing:0!important;
}
.staff-card-v2__name{font-size:0.9688rem;font-weight:650;letter-spacing:-.02em}
.staff-card-v2__email{font-size:0.8125rem;color:var(--t-4)}
.staff-card-v2__secure{
  font-size:0.75rem;border-radius:999px;padding:3px 10px;
  text-transform:none;letter-spacing:0;
}
.staff-card-v2__actions .btn{border-radius:999px!important;font-size:0.8125rem;min-height:36px}

/* Importe del listado de huéspedes: no debe partirse en dos líneas */
.gst-cell-monto{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}
.gst-row{grid-template-columns:1fr 130px 150px 90px 78px 110px!important;gap:10px}
.gst-list-hd{grid-template-columns:1fr 130px 150px 90px 78px 110px!important;gap:10px}
.gst-list-hd>*{
  font-size:0.7812rem!important;font-weight:500!important;color:var(--t-4)!important;
  text-transform:none!important;letter-spacing:0!important;
}
.gst-estancias-badge{
  font-size:0.7812rem;font-weight:550;border-radius:999px;padding:2px 9px;
  background:rgba(79,70,229,.12);color:var(--c-indigo-d);
}
.gst-name{font-size:0.9062rem;font-weight:600}
.gst-doc{font-size:0.7812rem;color:var(--t-4)}

/* Acción principal en violeta también en configuración y descansos */
.cfg-section-body .btn-primary,
.adesc-sol-card-actions .btn-next-solid,
.adesc-sol-card-actions .btn-primary{
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#34d399,#059669)!important;
  border:1px solid rgba(var(--paper),.4)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(5,150,105,.24)!important;
  color:#fff!important;
}
.cfg-section-body .btn-primary{
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5)!important;
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(79,70,229,.26)!important;
}
/* Rechazar no compite: texto rojo */
.adesc-sol-card-actions .btn-danger{
  background:none!important;border:none!important;box-shadow:none!important;
  color:var(--c-red)!important;padding:7px 6px!important;font-weight:500;
}
.adesc-sol-card-actions .btn-danger:hover{color:var(--c-red-dd)!important;text-decoration:underline}
.adesc-sol-card-actions{gap:14px;align-items:center}
.adesc-sol-card-actions .btn{border-radius:999px!important;min-height:36px;font-size:0.8125rem}
.adesc-month{text-transform:lowercase}
.adesc-month::first-letter{text-transform:uppercase}
.adesc-sol-card-name .adesc-chip,.adesc-legend-item{
  font-size:0.7812rem;font-weight:500;text-transform:none;letter-spacing:0;
}


/* ── Barras de período de movimientos e historial ──────────────
   Mismo tratamiento que en contabilidad: el par de fechas es una
   unidad y los grupos envuelven como bloques enteros.           */
.mv-toolbar-row,.hr-toolbar-row{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap}
.mv-period-group,.hr-period-group{
  display:flex;align-items:center;gap:8px;flex-wrap:nowrap;
  flex:1 1 320px;min-width:0;
}
.mv-period-label,.hr-period-label{
  flex-shrink:0;font-size:0.8438rem;font-weight:450;color:var(--t-4);
  text-transform:none;letter-spacing:0;
}
.mv-date-input,.hr-date-input{
  flex:1 1 0;min-width:0;max-width:170px;
  border-radius:12px;padding:8px 12px;font-size:0.875rem;
  background-color:rgba(var(--paper),.9);border:1px solid rgba(var(--ink),.10);
  box-shadow:inset 0 1px 0 var(--rim);
}
.mv-period-sep,.hr-period-sep{flex-shrink:0;color:var(--t-5)}
.mv-presets,.hr-presets{display:flex;gap:7px;flex-wrap:nowrap;flex-shrink:0}
.mv-preset,.hr-preset{
  border-radius:999px;padding:7px 15px;font-size:0.8125rem;font-weight:450;
  background:rgba(var(--ink),.05);border:1px solid rgba(var(--paper),.8);
  color:var(--t-2);box-shadow:inset 0 1px 0 var(--rim);
}
.mv-apply-btn,.hr-apply-btn{
  border-radius:999px!important;padding:8px 20px!important;font-size:0.8438rem;font-weight:550;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(135deg,#8b5cf6,#4f46e5);
  border:1px solid rgba(var(--paper),.4);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(79,70,229,.26);
  color:#fff;flex-shrink:0;
}
@media(max-width:820px){
  .mv-period-group,.hr-period-group{flex:1 1 100%}
  .mv-presets,.hr-presets{flex:1 1 auto}
  .mv-preset,.hr-preset{flex:1;min-height:42px;white-space:nowrap}
  .mv-apply-btn,.hr-apply-btn{min-height:42px}
}
@media(max-width:430px){
  .mv-period-group,.hr-period-group{flex-wrap:wrap}
  .mv-period-label,.hr-period-label{flex:1 1 100%;margin-bottom:-2px}
  .mv-date-input,.hr-date-input{max-width:none}
  .mv-apply-btn,.hr-apply-btn{flex:1 1 100%}
}

/* ── Acción destructiva discreta ───────────────────────────────
   Una clase propia para "rechazar", "cancelar" y "cerrar": texto
   rojo sin recuadro. Antes el color venía en el atributo style del
   botón y la hoja no podía gobernarlo sin `!important`; ahora el
   generador solo pone la clase y el estilo vive aquí.            */
.btn-ghost-danger{
  background:none;border:none;box-shadow:none;
  color:var(--c-red);font-weight:500;font-size:0.8125rem;
  padding:7px 10px;border-radius:999px;cursor:pointer;
  font-family:inherit;transition:color .15s,background .15s;
}
.btn-ghost-danger:hover{color:var(--c-red-dd);background:rgba(220,38,38,.07)}
.btn-ghost-danger:focus-visible{outline:2px solid #dc2626;outline-offset:2px}
@media(pointer:coarse){.btn-ghost-danger{min-height:44px;padding:10px 14px}}

/* Avatares de rol: mismo material que el resto de iconos del panel */
.staff-card-v2__avatar{
  border-radius:16px;
  border:1px solid rgba(var(--paper),.7);
  box-shadow:inset 0 1px 0 var(--rim),0 5px 14px rgba(var(--shade),.14);
}
.staff-card-v2--admin .staff-card-v2__avatar{
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#a78bfa,#6d28d9)!important;
}
.staff-card-v2--recepcion .staff-card-v2__avatar{
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#38bdf8,#0284c7)!important;
}
.staff-card-v2--limpieza .staff-card-v2__avatar{
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#34d399,#047857)!important;
}
.staff-card-v2--mantenimiento .staff-card-v2__avatar{
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,#fb923c,#ea580c)!important;
}
.staff-card-v2--otro .staff-card-v2__avatar{
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%),linear-gradient(135deg,var(--sep),var(--t-4))!important;
}

:root[data-theme="dark"]{
  --paper:24,33,52;
  --paper-solid:#182134;
  --rim:rgba(255,255,255,.06);
  --shade:0,0,0;
  --ink:148,163,184;
  --t-1:#f1f5f9;--t-2:#e2e8f0;--t-3:#cbd5e1;--t-4:#94a3b8;--t-5:#64748b;
  --sep:#334155;
  --av-a:#2b3850;--av-b:#1f2a3f;
  --aurora-a:#0b1220;--aurora-b:#0e1628;
  /* tokens del CSS original de cada panel, redefinidos para que sus
     componentes sin rediseñar también pasen a oscuro */
  --bg:#0b1220;--bg2:#111a2e;--bg3:#182134;--card:#151f33;
  --border:#243049;--border2:#334155;
  --text:#f1f5f9;--muted:#94a3b8;--muted2:#64748b;
  --accent-soft:rgba(14,165,233,.16);
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --shadow-md:0 8px 28px rgba(0,0,0,.45);
  --shadow-card:0 1px 2px rgba(0,0,0,.25),0 6px 20px rgba(0,0,0,.3);
  --lg-border:rgba(255,255,255,.08);
  --ag-border:rgba(255,255,255,.08);
  color-scheme:dark;
}

/* Ajustes oscuros del panel de administración */
:root[data-theme="dark"] body{background:#0b1220}
:root[data-theme="dark"] #app{
  background:
    radial-gradient(ellipse 70% 55% at 6% 0%,rgba(139,92,246,.14) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 8%,rgba(14,165,233,.10) 0%,transparent 60%),
    linear-gradient(180deg,var(--aurora-a) 0%,var(--aurora-b) 100%);
}
:root[data-theme="dark"] #login-screen{
  background:
    radial-gradient(ellipse 70% 55% at 10% 0%,rgba(139,92,246,.18) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 10%,rgba(14,165,233,.14) 0%,transparent 60%),
    linear-gradient(180deg,var(--aurora-a) 0%,var(--aurora-b) 100%);
}
:root[data-theme="dark"] #login-screen::before{opacity:.5}
:root[data-theme="dark"] .sidebar{background:linear-gradient(180deg,rgba(var(--paper),.86),rgba(var(--paper),.74))}
:root[data-theme="dark"] .topbar{background:linear-gradient(180deg,rgba(var(--paper),.82),rgba(var(--paper),.7))}
:root[data-theme="dark"] .nav-item{color:var(--t-2)}
:root[data-theme="dark"] .nav-item.active,:root[data-theme="dark"] .turnos-seg button.is-on,
:root[data-theme="dark"] .sidebar-hotel,:root[data-theme="dark"] .sidebar-footer .btn{background:rgba(var(--paper),1);color:#a5b4fc}
:root[data-theme="dark"] .sidebar-footer .btn{color:var(--t-2)}
:root[data-theme="dark"] .dash-hero,:root[data-theme="dark"] .dash-tile,:root[data-theme="dark"] .dash-panel,:root[data-theme="dark"] .dash-rank-list,
:root[data-theme="dark"] .hab-kpis,:root[data-theme="dark"] .hab-card,:root[data-theme="dark"] .resv-card,
:root[data-theme="dark"] .turnos-live,:root[data-theme="dark"] .turnos-card.turnos-card--v2,
:root[data-theme="dark"] .cbl-toolbar,:root[data-theme="dark"] .cbl-neto,:root[data-theme="dark"] .cbl-bars-card,:root[data-theme="dark"] .cbl-panel,
:root[data-theme="dark"] .mv-toolbar,:root[data-theme="dark"] .hr-toolbar,:root[data-theme="dark"] .gst-toolbar,
:root[data-theme="dark"] .mv-stats-row,:root[data-theme="dark"] .hr-stats-row,:root[data-theme="dark"] .gst-stats-row,
:root[data-theme="dark"] .table-wrap,:root[data-theme="dark"] .staff-hero,:root[data-theme="dark"] .staff-kpi,:root[data-theme="dark"] .staff-card-v2,
:root[data-theme="dark"] .cfg-section,:root[data-theme="dark"] .adesc-cal,:root[data-theme="dark"] .adesc-sol-card,
:root[data-theme="dark"] .modal,:root[data-theme="dark"] .cbl-hab-modal,:root[data-theme="dark"] .gst-list,:root[data-theme="dark"] .mv-list{
  background:rgba(var(--paper),.9)!important;
}
:root[data-theme="dark"] .hab-card:hover,:root[data-theme="dark"] .resv-card:hover,:root[data-theme="dark"] .dash-tile:hover{background:rgba(var(--paper),1)!important}
:root[data-theme="dark"] .hab-kpi+.hab-kpi{box-shadow:inset 1px 0 0 rgba(var(--ink),.18)!important}
:root[data-theme="dark"] .turnos-live-grid{background:rgba(var(--ink),.08)}
:root[data-theme="dark"] .turnos-live-cell{box-shadow:inset 1px 0 0 rgba(var(--ink),.18)!important}
:root[data-theme="dark"] .hab-modal__head,:root[data-theme="dark"] .rsv-head,:root[data-theme="dark"] .gd-head{
  background:linear-gradient(160deg,rgba(139,92,246,.18),rgba(var(--paper),0) 75%);
}
:root[data-theme="dark"] .rm-header.libre .rm-header-bg{background:linear-gradient(160deg,rgba(5,150,105,.25),transparent 70%)}
:root[data-theme="dark"] .rm-header.ocupada .rm-header-bg{background:linear-gradient(160deg,rgba(220,38,38,.25),transparent 70%)}
:root[data-theme="dark"] .rm-header.limpieza .rm-header-bg{background:linear-gradient(160deg,rgba(202,138,4,.25),transparent 70%)}
:root[data-theme="dark"] .rm-header.mantenimiento .rm-header-bg{background:linear-gradient(160deg,rgba(234,88,12,.25),transparent 70%)}
:root[data-theme="dark"] .hab-modal__foot,:root[data-theme="dark"] .rsv-foot,:root[data-theme="dark"] .gd-foot,:root[data-theme="dark"] .rm-footer{
  background:linear-gradient(180deg,rgba(var(--paper),.6),rgba(var(--paper),.95));
}
:root[data-theme="dark"] .hab-info-strip .rm-info-item,:root[data-theme="dark"] .rm-info-item,:root[data-theme="dark"] .rsv-notas,
:root[data-theme="dark"] .hab-detail-beds-wrap .hab-beds-row,:root[data-theme="dark"] .hab-bed-summary,:root[data-theme="dark"] .hab-empty,
:root[data-theme="dark"] .cbl-preset,:root[data-theme="dark"] .turnos-seg,:root[data-theme="dark"] .mv-preset,:root[data-theme="dark"] .hr-preset,
:root[data-theme="dark"] .rsv-foot .btn,:root[data-theme="dark"] .hab-modal__foot .btn-secondary,:root[data-theme="dark"] .gd-est-estado{
  background:rgba(var(--ink),.14)!important;color:var(--t-1);
}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .cbl-date-input,:root[data-theme="dark"] .mv-date-input,:root[data-theme="dark"] .hr-date-input,
:root[data-theme="dark"] #login-screen .inp,:root[data-theme="dark"] .hab-modal__fields input,:root[data-theme="dark"] .hab-modal__fields select{
  background-color:rgba(var(--paper),.9)!important;color:var(--t-1)!important;border-color:rgba(var(--ink),.22)!important;
}
:root[data-theme="dark"] input::placeholder{color:var(--t-4)}
:root[data-theme="dark"] ::picker(select){background:rgba(var(--paper),.96)}
:root[data-theme="dark"] option{color:var(--t-1)}
:root[data-theme="dark"] th{color:var(--t-4)!important}
:root[data-theme="dark"] td{color:var(--t-1)}
:root[data-theme="dark"] tbody tr:hover td{background:rgba(139,92,246,.08)}
:root[data-theme="dark"] .badge-muted,:root[data-theme="dark"] .gc-est-estado{background:rgba(var(--ink),.16);color:var(--t-3)}
:root[data-theme="dark"] .dash-guest-av,:root[data-theme="dark"] .gc-avatar{color:var(--t-2)}
:root[data-theme="dark"] .dash-hero-bar,:root[data-theme="dark"] .turno-pay-bar,:root[data-theme="dark"] .cbl-bar-track{background:rgba(var(--ink),.16)}
:root[data-theme="dark"] .cbl-neto-side .is-in,:root[data-theme="dark"] .cbl-bars-total,:root[data-theme="dark"] .hab-kpi--ok .hab-kpi__v,
:root[data-theme="dark"] .dash-tile--in .dash-tile-val,:root[data-theme="dark"] .hab-estado-chip.libre,:root[data-theme="dark"] .resv-saldo.ok{color:#34d399}
:root[data-theme="dark"] .cbl-neto-side .is-out,:root[data-theme="dark"] .cbl-bars-total.is-out,:root[data-theme="dark"] .hab-kpi--red .hab-kpi__v,
:root[data-theme="dark"] .dash-tile--sal .dash-tile-val,:root[data-theme="dark"] .hab-estado-chip.ocupada{color:#f87171}
:root[data-theme="dark"] .dash-tile--adr .dash-tile-val{color:#c4b5fd}
:root[data-theme="dark"] .dash-tile--rev .dash-tile-val,:root[data-theme="dark"] .hab-kpi--accent .hab-kpi__v{color:#a5b4fc}
:root[data-theme="dark"] .hab-estado-chip.limpieza,:root[data-theme="dark"] .hab-kpi--warn .hab-kpi__v{color:#fbbf24}
:root[data-theme="dark"] .hab-estado-chip.mantenimiento,:root[data-theme="dark"] .resv-card-status,:root[data-theme="dark"] .resv-saldo.warn,:root[data-theme="dark"] .rsv-estado{color:#fb923c}
:root[data-theme="dark"] .adesc-day.adesc-taken .adesc-day-num{color:color-mix(in srgb,var(--ad-color) 70%,#fff)!important}
:root[data-theme="dark"] .adesc-day .adesc-chip{color:color-mix(in srgb,var(--ad-chip,#94a3b8) 70%,#fff)!important}
:root[data-theme="dark"] .lbox{background:linear-gradient(160deg,rgba(var(--paper),.92),rgba(var(--paper),.8))}
:root[data-theme="dark"] .l-social-btn{background:rgba(var(--paper),.8);color:var(--t-1)}
:root[data-theme="dark"] .lbrand span{-webkit-text-fill-color:transparent}
:root[data-theme="dark"] .topbar-refresh,:root[data-theme="dark"] .sidebar-toggle,:root[data-theme="dark"] .turnos-live-refresh{color:var(--t-2)}


/* Colores semánticos de texto: más luminosos en oscuro para mantener 4.5:1 sobre tintas */
:root{--c-red:#dc2626;--c-red-d:#b91c1c;--c-red-dd:#991b1b;--c-green:#059669;--c-green-d:#047857;--c-amber-d:#b45309;--c-amber-dd:#854d0e;--c-orange:#ea580c;--c-orange-d:#c2410c;--c-blue-d:#1d4ed8;--c-indigo:#4f46e5;--c-indigo-d:#4338ca;--c-violet:#6d28d9;--tint-amber:rgba(254,243,199,.9);--tint-green:rgba(209,250,229,.85);--tint-sky:#e0f2fe}
:root[data-theme="dark"]{--c-red:#f87171;--c-red-d:#fca5a5;--c-red-dd:#fecaca;--c-green:#34d399;--c-green-d:#6ee7b7;--c-amber-d:#fcd34d;--c-amber-dd:#fde68a;--c-orange:#fb923c;--c-orange-d:#fdba74;--c-blue-d:#93c5fd;--c-indigo:#a5b4fc;--c-indigo-d:#c7d2fe;--c-violet:#c4b5fd;--tint-amber:rgba(251,191,36,.18);--tint-green:rgba(52,211,153,.18);--tint-sky:rgba(56,189,248,.18)}

/* Oscuro · modal de habitación (cabecera lavanda y fichas de camas del CSS original) */
:root[data-theme="dark"] .hab-modal__head{background:linear-gradient(160deg,rgba(139,92,246,.16),rgba(var(--paper),0) 75%)}
:root[data-theme="dark"] .hab-bed-card,:root[data-theme="dark"] .hab-add-tile{
  background:rgba(var(--ink),.10)!important;border-color:rgba(var(--ink),.18)!important;box-shadow:none!important;color:var(--t-1);
}
:root[data-theme="dark"] .hab-add-tile:hover{background:rgba(var(--ink),.18)!important}
:root[data-theme="dark"] .hab-bed-card__ico,:root[data-theme="dark"] .hab-bed-card--double .hab-bed-card__ico{
  background:rgba(var(--paper),.9)!important;border-color:rgba(var(--ink),.16)!important;
}
:root[data-theme="dark"] .hab-bed-card__kind{color:#7dd3fc}
:root[data-theme="dark"] .hab-bed-card--double .hab-bed-card__kind{color:#c4b5fd}
:root[data-theme="dark"] .hab-bed-plaza-badge{background:rgba(56,189,248,.18);color:#7dd3fc}
:root[data-theme="dark"] .hab-detail-beds-wrap .hab-beds-row .hab-bed-summary{background:transparent!important}
:root[data-theme="dark"] .hab-bed-summary img,:root[data-theme="dark"] .hab-bed-card__ico img,:root[data-theme="dark"] .hab-add-tile img{
  filter:brightness(1.1) contrast(.95);
}
/* Listado de huéspedes: en anchos medios la columna del nombre no se
   recorta; la lista desplaza en horizontal antes que romper el nombre. */
.gst-row,.gst-list-hd{grid-template-columns:minmax(160px,1fr) 130px 150px 90px 78px 110px!important}
@media(max-width:900px){
  .gst-list{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .gst-row,.gst-list-hd{min-width:740px}
}

/* ── Modo oscuro · fila con switch en el menú lateral ─────────────
   Interruptor tipo iOS: pista 51×31, botón 27, verde del sistema al
   activar. El icono cambia sol/luna con el tema.                  */
.theme-row{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:8px;border-radius:14px;background:rgba(var(--ink),.045)}
.theme-row-ico{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;color:var(--t-3);flex-shrink:0}
.theme-row-ico svg{width:19px;height:19px}
.theme-row-ico .ico-moon{display:none}
:root[data-theme="dark"] .theme-row-ico .ico-sun{display:none}
:root[data-theme="dark"] .theme-row-ico .ico-moon{display:block;color:#fbbf24}
.theme-row-txt{flex:1;font-size:0.875rem;font-weight:500;color:var(--t-2);white-space:nowrap}
.theme-switch{position:relative;width:51px;height:31px;flex-shrink:0;border-radius:999px;padding:0;border:0;cursor:pointer;
  background:rgba(var(--ink),.22);box-shadow:inset 0 0 0 1px rgba(var(--ink),.06);transition:background .25s cubic-bezier(.2,.8,.2,1)}
.theme-switch-knob{position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,.28),0 1px 1px rgba(0,0,0,.12);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.theme-switch[aria-checked="true"]{background:#34c759}
.theme-switch[aria-checked="true"] .theme-switch-knob{transform:translateX(20px)}
.theme-switch:focus-visible{outline:2px solid var(--accent,#0ea5e9);outline-offset:2px}
.theme-switch:active .theme-switch-knob{width:31px}
.theme-switch[aria-checked="true"]:active .theme-switch-knob{transform:translateX(16px)}
@media(prefers-reduced-motion:reduce){.theme-switch,.theme-switch-knob{transition:none}}

/* ═══ Oscuro · más vidrio (admin) ═══════════════════════════════ */
:root[data-theme="dark"]{--rim:rgba(255,255,255,.14)}
:root[data-theme="dark"] #app{
  background:
    radial-gradient(ellipse 60% 50% at 6% 4%,rgba(139,92,246,.42) 0%,transparent 60%),
    radial-gradient(ellipse 55% 45% at 96% 10%,rgba(14,165,233,.34) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 88% 96%,rgba(16,185,129,.26) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 20% 90%,rgba(236,72,153,.18) 0%,transparent 60%),
    linear-gradient(180deg,#0b1220 0%,#0e1628 100%);
}
:root[data-theme="dark"] #login-screen{
  background:
    radial-gradient(ellipse 60% 50% at 10% 0%,rgba(139,92,246,.45) 0%,transparent 60%),
    radial-gradient(ellipse 55% 45% at 100% 10%,rgba(14,165,233,.36) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 80% 100%,rgba(16,185,129,.24) 0%,transparent 60%),
    linear-gradient(180deg,#0b1220 0%,#0e1628 100%);
}
:root[data-theme="dark"] #login-screen::before{opacity:.9}
:root[data-theme="dark"] .sidebar,:root[data-theme="dark"] .topbar{
  background:rgba(var(--paper),.55)!important;backdrop-filter:blur(28px) saturate(1.6);-webkit-backdrop-filter:blur(28px) saturate(1.6);
  border-color:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 var(--rim),0 10px 40px rgba(0,0,0,.35);
}
:root[data-theme="dark"] .modal,:root[data-theme="dark"] .cbl-hab-modal{background:rgba(var(--paper),.74)!important;backdrop-filter:blur(34px) saturate(1.6);-webkit-backdrop-filter:blur(34px) saturate(1.6);
  border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 var(--rim),0 30px 80px rgba(0,0,0,.55)}
:root[data-theme="dark"] .modal-bg{background:rgba(5,9,18,.55)}
:root[data-theme="dark"] .dash-hero,:root[data-theme="dark"] .dash-tile,:root[data-theme="dark"] .dash-panel,:root[data-theme="dark"] .dash-rank-list,
:root[data-theme="dark"] .hab-kpis,:root[data-theme="dark"] .hab-card,:root[data-theme="dark"] .resv-card,:root[data-theme="dark"] .turnos-live,:root[data-theme="dark"] .turnos-card.turnos-card--v2,
:root[data-theme="dark"] .cbl-toolbar,:root[data-theme="dark"] .cbl-neto,:root[data-theme="dark"] .cbl-bars-card,:root[data-theme="dark"] .cbl-panel,
:root[data-theme="dark"] .mv-toolbar,:root[data-theme="dark"] .hr-toolbar,:root[data-theme="dark"] .gst-toolbar,:root[data-theme="dark"] .mv-stats-row,:root[data-theme="dark"] .hr-stats-row,:root[data-theme="dark"] .gst-stats-row,
:root[data-theme="dark"] .table-wrap,:root[data-theme="dark"] .staff-hero,:root[data-theme="dark"] .staff-kpi,:root[data-theme="dark"] .staff-card-v2,:root[data-theme="dark"] .cfg-section,
:root[data-theme="dark"] .adesc-cal,:root[data-theme="dark"] .adesc-sol-card,:root[data-theme="dark"] .gst-list,:root[data-theme="dark"] .mv-list,:root[data-theme="dark"] .rep-card,:root[data-theme="dark"] .tar-card,:root[data-theme="dark"] .hk-card{
  background:rgba(var(--paper),.62)!important;border-color:rgba(255,255,255,.09);box-shadow:inset 0 1px 0 var(--rim),0 8px 24px rgba(0,0,0,.22);
}
:root[data-theme="dark"] .hab-card:hover,:root[data-theme="dark"] .resv-card:hover,:root[data-theme="dark"] .dash-tile:hover{background:rgba(var(--paper),.82)!important}
:root[data-theme="dark"] .lbox{background:linear-gradient(160deg,rgba(var(--paper),.7),rgba(var(--paper),.55));border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(30px) saturate(1.5);-webkit-backdrop-filter:blur(30px) saturate(1.5)}
:root[data-theme="dark"] .nav-item.active{background:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 var(--rim)}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea,:root[data-theme="dark"] #login-screen .inp{background-color:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important}
@media(prefers-reduced-transparency:reduce){
  :root[data-theme="dark"] .sidebar,:root[data-theme="dark"] .topbar,:root[data-theme="dark"] .modal{background:rgba(var(--paper),.96)!important;backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* ═══ Funciones 2026-09 · tarifas, reportes, limpieza, alertas, idioma ═══ */
.tar-wrap,.rep-wrap{display:flex;flex-direction:column;gap:14px}
.tar-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px;border-radius:20px;background:rgba(var(--paper),.78);border:1px solid var(--ag-border);box-shadow:inset 0 1px 0 var(--rim)}
.tar-hero h2{margin:0 0 4px;font-size:1.125rem;font-weight:700;letter-spacing:-.02em;color:var(--t-1)}
.tar-hero p{margin:0;font-size:.8438rem;color:var(--t-4);line-height:1.5;max-width:60ch}
.tar-hero .btn{white-space:nowrap;border-radius:999px}
.tar-grid,.hk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.tar-card{background:rgba(var(--paper),.82);border:1px solid var(--ag-border);border-radius:18px;padding:14px 16px;box-shadow:inset 0 1px 0 var(--rim);display:flex;flex-direction:column;gap:10px}
.tar-card.is-off{opacity:.62}
.tar-card header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tar-card h3{margin:0;font-size:.9375rem;font-weight:700;color:var(--t-1)}
.tar-val{font-weight:700;font-size:.875rem;padding:4px 10px;border-radius:999px;background:rgba(var(--ink),.08);color:var(--t-2)}
.tar-val.up{background:rgba(5,150,105,.12);color:var(--c-green)}.tar-val.down{background:rgba(220,38,38,.12);color:var(--c-red)}.tar-val.fijo{background:rgba(79,70,229,.12);color:var(--c-indigo)}
.tar-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.8125rem;color:var(--t-4)}
.tar-days{display:flex;gap:4px}
.tar-days span,.tar-days button{flex:1;text-align:center;font-size:.6875rem;font-weight:600;padding:5px 0;border-radius:8px;background:rgba(var(--ink),.06);color:var(--t-5);border:0}
.tar-days span.on,.tar-days button.on{background:rgba(79,70,229,.14);color:var(--c-indigo)}
.tar-days--pick button{cursor:pointer;min-height:36px;font:inherit;font-size:.75rem}
.tar-card footer{display:flex;gap:8px;align-items:center;margin-top:auto}
.tar-card footer .btn{min-height:36px;padding:6px 14px;border-radius:999px;font-size:.8125rem}
.tar-card footer .badge{margin-right:auto}
.tar-empty{padding:34px 20px;text-align:center;border-radius:18px;border:1px dashed rgba(var(--ink),.18);color:var(--t-4);font-size:.875rem}
.tar-empty p{margin:0 0 6px}
.tar-form{display:flex;flex-direction:column;gap:12px}
.tar-check{display:flex;align-items:center;gap:8px;font-size:.875rem;color:var(--t-2);min-height:40px}
.tar-check input{width:18px;height:18px;accent-color:#4f46e5}
.rep-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.rep-year{display:flex;align-items:center;gap:8px}
.rep-year strong{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;min-width:64px;text-align:center;color:var(--t-1)}
.rep-year .btn{width:40px;min-height:40px;padding:0;border-radius:999px;font-size:1.125rem}
.rep-actions{display:flex;gap:8px;flex-wrap:wrap}
.rep-actions .btn{border-radius:999px}
.rep-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.rep-summary>div{background:rgba(var(--paper),.78);border:1px solid var(--ag-border);border-radius:16px;padding:12px 14px;box-shadow:inset 0 1px 0 var(--rim)}
.rep-summary span{display:block;font-size:.75rem;color:var(--t-4);margin-bottom:2px}
.rep-summary strong{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;color:var(--t-1);font-variant-numeric:tabular-nums}
.rep-card{background:rgba(var(--paper),.82);border:1px solid var(--ag-border);border-radius:20px;padding:16px 18px;box-shadow:inset 0 1px 0 var(--rim)}
.rep-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.rep-card-head h3{margin:0;font-size:.9375rem;font-weight:700;color:var(--t-1)}
.rep-card-head span{font-size:.75rem;color:var(--t-4)}
.rep-bars{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;height:170px}
.rep-bar{display:flex;flex-direction:column;align-items:center;gap:4px;height:100%}
.rep-bar-track{flex:1;width:100%;display:flex;align-items:flex-end;border-radius:8px;background:rgba(var(--ink),.05)}
.rep-bar-track div{width:100%;border-radius:8px;background:linear-gradient(180deg,#a5b4fc,#4f46e5);min-height:3px;transition:height .3s}
.rep-bar-v{font-size:.6875rem;font-weight:600;color:var(--t-3);font-variant-numeric:tabular-nums}
.rep-bar-l{font-size:.6875rem;color:var(--t-4)}
.rep-table{width:100%;border-collapse:collapse;font-size:.8125rem}
.rep-table th{text-align:left;font-weight:500;color:var(--t-4);padding:8px 10px;border-bottom:1px solid rgba(var(--ink),.1);white-space:nowrap}
.rep-table td{padding:8px 10px;border-bottom:1px solid rgba(var(--ink),.06);color:var(--t-1);font-variant-numeric:tabular-nums;white-space:nowrap}
.rep-mini{display:inline-block;vertical-align:middle;width:56px;height:5px;border-radius:999px;background:rgba(var(--ink),.08);margin-right:8px;overflow:hidden}
.rep-mini i{display:block;height:100%;background:linear-gradient(90deg,#a5b4fc,#4f46e5)}
.rep-rank{display:flex;flex-direction:column}
.rep-rank-row{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(var(--ink),.06)}
.rep-rank-row:last-child{border-bottom:0}
.rep-rank-n{width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;background:rgba(var(--ink),.08);color:var(--t-3);flex-shrink:0}
.rep-rank-body{flex:1;min-width:0}
.rep-rank-top{display:flex;align-items:baseline;gap:10px;font-size:.8125rem;margin-bottom:5px}
.rep-rank-top strong{color:var(--t-1)}.rep-rank-top span{color:var(--t-4);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rep-rank-top b{color:var(--t-1);font-variant-numeric:tabular-nums}
.rep-rank .rep-mini{width:100%;margin:0}
.rep-empty{color:var(--t-4);font-size:.875rem;margin:0}
.hk-card{background:rgba(var(--paper),.82);border:1px solid var(--ag-border);border-radius:18px;padding:14px 16px;box-shadow:inset 0 1px 0 var(--rim)}
.hk-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.hk-room{font-weight:700;font-size:1rem;color:var(--t-1)}.hk-meta{font-size:.75rem;color:var(--t-4)}
.hk-prog{width:92px;height:6px;border-radius:999px;background:rgba(var(--ink),.1);overflow:hidden}
.hk-prog span{display:block;height:100%;background:linear-gradient(90deg,#34d399,#059669)}
.hk-list{list-style:none;margin:0 0 12px;padding:0}
.hk-item label{display:flex;align-items:center;gap:10px;min-height:36px;font-size:.875rem;color:var(--t-2)}
.hk-item input{width:18px;height:18px;accent-color:#059669;flex-shrink:0}
.hk-item.is-done span{text-decoration:line-through;color:var(--t-4)}
.hk-item small{color:var(--t-5);text-decoration:none;font-size:.75rem}
.hk-actions{display:flex;gap:8px}.hk-actions .btn{flex:1;min-height:40px;border-radius:12px}
#dash-alertas{margin-bottom:4px}
.dash-alert-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.dash-alert{border-radius:16px;padding:12px 14px;background:rgba(var(--paper),.78);border:1px solid var(--ag-border);box-shadow:inset 0 1px 0 var(--rim)}
.dash-alert[role="button"]{cursor:pointer}
.dash-alert strong{display:inline-block;font-size:1.375rem;font-weight:700;letter-spacing:-.02em;margin-right:8px;color:var(--t-1)}
.dash-alert span{font-size:.8125rem;color:var(--t-3)}
.dash-alert ul{list-style:none;margin:8px 0 0;padding:0;font-size:.75rem;color:var(--t-4)}
.dash-alert li{padding:2px 0}
.dash-alert.al-sky strong{color:var(--c-sky,#0284c7)}.dash-alert.al-red strong{color:var(--c-red)}.dash-alert.al-amber strong{color:var(--c-amber,#d97706)}.dash-alert.al-violet strong{color:var(--c-violet,#6d28d9)}
.dash-alert--ok{display:flex;align-items:center;gap:10px}.dash-alert--ok strong{font-size:.9375rem;color:var(--c-green)}
.lang-row{display:flex;gap:6px;padding:0 0 8px}
.lang-btn{flex:1;min-height:32px;border-radius:999px;border:1px solid var(--ag-border);background:rgba(var(--paper),.5);font:inherit;font-size:.75rem;font-weight:600;color:var(--t-3);cursor:pointer}
.lang-btn.is-on{background:var(--paper-solid);color:var(--ag-accent-2);box-shadow:inset 0 1px 0 var(--rim)}
@media(max-width:640px){.rep-bars{height:130px;gap:3px}.rep-bar-v{display:none}.tar-hero{flex-direction:column}}

/* ═══ Novedades (campana) ═══════════════════════════════════════ */
.news-bell{position:relative;width:40px;height:40px;border-radius:999px;margin-right:8px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(var(--paper),.62);border:1px solid var(--lg-border,var(--ag-border));box-shadow:inset 0 1px 0 var(--rim);color:var(--t-2);cursor:pointer;transition:background .15s,transform .15s,color .15s}
.news-bell:hover{background:var(--paper-solid);transform:translateY(-1px);color:var(--accent2,var(--ag-accent-2))}
.news-bell svg{width:19px;height:19px}
.news-bell-dot{position:absolute;top:7px;right:8px;width:9px;height:9px;border-radius:999px;background:#dc2626;box-shadow:0 0 0 2px var(--paper-solid)}
.news-bell-dot[hidden]{display:none}
@media(pointer:coarse){.news-bell{width:44px;height:44px}}
.modal--news{max-width:560px;padding:0!important;overflow:hidden}
.news-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 22px 14px;background:linear-gradient(160deg,rgba(14,165,233,.14),rgba(var(--paper),0) 75%)}
.news-kicker{margin:0 0 2px;font-size:.8125rem;color:var(--t-4)}
.news-title{margin:0;font-size:1.25rem;font-weight:700;letter-spacing:-.02em;color:var(--t-1)}
.news-close{width:34px;height:34px;border-radius:999px;border:0;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background:rgba(220,38,38,.12);color:var(--c-red);cursor:pointer}
.news-body{padding:4px 22px 8px;max-height:min(60vh,520px);overflow-y:auto}
.news-intro{font-size:.875rem;color:var(--t-3);line-height:1.55;margin:0 0 14px}
.news-group{margin-bottom:14px}
.news-group h3{margin:0 0 6px;font-size:.8125rem;font-weight:600;color:var(--t-4)}
.news-group ul{margin:0;padding-left:18px;font-size:.875rem;color:var(--t-2);line-height:1.5}
.news-group li{margin:3px 0}
.news-foot{padding:12px 22px 18px;display:flex;justify-content:flex-end}
.news-foot .btn{min-width:140px;border-radius:999px}
:root[data-theme="dark"] .modal--news{background:rgba(var(--paper),.9)!important}
:root[data-theme="dark"] .main{background:transparent}
:root[data-theme="dark"] .period-strip{background:rgba(var(--paper),.5);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}