@font-face {
  font-family: "Montserrat";
  src: url("/static/brand/fonts/Montserrat-variable.woff2") format("woff2"), url("/static/brand/fonts/Montserrat-variable.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --coral: #1D1D1F;
  --coral-osc: #000000;
  --coral-suave: #F0F0F2;
  --grafito: #1D1D1F;
  --grafito-2: #2C2C2E;
  --marfil: #F5F5F7;
  --bruma: #E8E8ED;
  --bruma-osc: #C7C7CC;
  --blanco: #FFFFFF;
  --texto: #1D1D1F;
  --texto-2: #6E6E73;
  --borde: #E3E3E8;
  --ok: #2E7D5B;
  --ok-suave: #E1F2EA;
  --alerta: #B7791F;
  --alerta-suave: #FBF0DC;
  --radio: 10px;
  --sombra: 0 1px 2px rgba(37, 43, 49, .06), 0 4px 14px rgba(37, 43, 49, .05);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 14px;
  color: var(--texto);
  background: var(--marfil);
  line-height: 1.45;
}
a { color: var(--coral-osc); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 22px; font-weight: 700; margin: 0; letter-spacing: -.01em; }
h2 { font-size: 15px; font-weight: 700; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); }

/* ---------- Estructura ---------- */
.layout { display: grid; grid-template-columns: 236px 1fr; min-height: 100vh; }
.sidebar {
  background: var(--grafito);
  color: #C9CED3;
  padding: 22px 14px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
  display: flex; flex-direction: column;
}
.sidebar .logo { display: block; padding: 4px 10px 22px; }
.sidebar .logo img { width: 100%; max-width: 190px; display: block; }
.nav-group { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #7E8790; padding: 16px 10px 6px; }
.nav a {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 8px;
  color: #DDE1E4; font-weight: 500;
}
.nav a:hover { background: var(--grafito-2); text-decoration: none; }
.nav a.activo { background: var(--coral); color: var(--blanco); font-weight: 600; }
/* WhatsApp resalta en el menú con su verde */
.nav a.nav-wa { color: #25D366; font-weight: 700; }
.nav a.nav-wa.activo { background: #00A884; color: #fff; }
.nav a.nav-wa .nav-badge.wa-nav { background: #fff; color: #008069; }
.ico {
  width: 18px; height: 18px; flex: none; display: inline-block;
  background: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
.sidebar .pie { margin-top: auto; padding: 18px 10px 0; font-size: 12px; border-top: 1px solid var(--grafito-2); }
.sidebar .pie a { color: #DDE1E4; }
.sidebar .pie button { background: none; border: 0; color: #DDE1E4; padding: 0; font: inherit; cursor: pointer; }

.main { padding: 26px 32px 60px; min-width: 0; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.topbar .acciones { display: flex; gap: 8px; flex-wrap: wrap; }
.menu-movil { display: none; }

/* ---------- Componentes ---------- */
.card { background: var(--blanco); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); padding: 18px 20px; }
.card + .card { margin-top: 18px; }
.grid { display: grid; gap: 18px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 18px; }
.kpi { background: var(--blanco); border: 1px solid var(--borde); border-radius: var(--radio); padding: 16px 18px; box-shadow: var(--sombra); }
.kpi .lbl { font-size: 12px; font-weight: 600; color: var(--texto-2); }
.kpi .val { font-size: 22px; font-weight: 700; margin-top: 4px; font-variant-numeric: tabular-nums; }
.kpi .sub { font-size: 12px; color: var(--texto-2); margin-top: 2px; }
.kpi.destacado { background: var(--grafito); color: var(--blanco); border-color: var(--grafito); }
.kpi.destacado .lbl, .kpi.destacado .sub { color: #AEB5BC; }
.pos { color: var(--ok); }
.neg { color: var(--coral-osc); }

.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px; border: 1px solid var(--borde);
  background: var(--blanco); color: var(--texto); font: inherit; font-weight: 600; cursor: pointer;
  white-space: nowrap;
}
.btn:hover { text-decoration: none; border-color: var(--bruma-osc); background: #FBFAF8; }
.btn.primario { background: var(--coral); border-color: var(--coral); color: var(--blanco); }
.btn.primario:hover { background: var(--coral-osc); border-color: var(--coral-osc); }
.btn.peligro { color: var(--coral-osc); }
.btn.chico { padding: 5px 10px; font-size: 12.5px; }

.flash { padding: 11px 14px; border-radius: 8px; margin-bottom: 16px; font-weight: 500; }
.flash.ok { background: var(--ok-suave); color: var(--ok); }
.flash.error { background: var(--coral-suave); color: var(--coral-osc); }

/* ---------- Tablas ---------- */
.tabla-wrap { overflow-x: auto; background: var(--blanco); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 9px 12px; text-align: left; border-bottom: 1px solid #EFEBE5; white-space: nowrap; }
th { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); background: #FAF8F5; }
tbody tr:hover { background: #FCFBF9; }
tbody tr:last-child td { border-bottom: 0; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tfoot td { font-weight: 700; background: #FAF8F5; border-top: 1px solid var(--borde); border-bottom: 0; }
tr.clic { cursor: pointer; }
.vacio { padding: 36px; text-align: center; color: var(--texto-2); }
.tabla-simple td, .tabla-simple th { padding: 7px 4px; background: none; }

.chip { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 12px; font-weight: 600; background: var(--bruma); color: var(--grafito); }
.chip.confirmada { background: var(--bruma); }
.chip.pendiente { background: var(--alerta-suave); color: var(--alerta); }
.chip.en-curso { background: var(--coral); color: var(--blanco); }
.chip.finalizada { background: #ECEAE6; color: var(--texto-2); }
.chip.cancelada { background: #ECEAE6; color: #9AA1A8; text-decoration: line-through; }
.chip.pagada { background: var(--ok-suave); color: var(--ok); }

/* ---------- Filtros y formularios ---------- */
.filtros { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.filtros input, .filtros select { width: auto; min-width: 140px; }
input, select, textarea {
  width: 100%; padding: 8px 10px; border: 1px solid var(--borde); border-radius: 8px;
  font: inherit; color: var(--texto); background: var(--blanco);
}
/* Casillas y círculos: su tamaño propio (si no, ocupan todo el ancho y quedan lejos de su texto) */
input[type=checkbox], input[type=radio] { width: auto; padding: 0; flex: 0 0 auto; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--coral); outline-offset: -1px; border-color: transparent; }
textarea { min-height: 80px; resize: vertical; }
.form { max-width: 760px; }
.campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.campo label { display: block; font-size: 12.5px; font-weight: 600; margin-bottom: 5px; }
.campo .ayuda { font-size: 11.5px; color: var(--texto-2); margin-top: 4px; }
.campo.ancho { grid-column: 1 / -1; }
.campo.check label { display: flex; align-items: center; gap: 8px; margin-top: 26px; font-size: 14px; }
.campo.check input { width: auto; }
.req { color: var(--coral); }
.form-acciones { display: flex; gap: 8px; margin-top: 20px; justify-content: space-between; flex-wrap: wrap; }
.paginas { display: flex; gap: 6px; margin-top: 14px; align-items: center; color: var(--texto-2); }

/* ---------- Detalle ---------- */
.dl { display: grid; grid-template-columns: 140px 1fr; gap: 8px 14px; margin: 0; }
.dl dt { color: var(--texto-2); font-weight: 600; font-size: 12.5px; }
.dl dd { margin: 0; }

/* ---------- Calendario ---------- */
.cal { border-collapse: separate; border-spacing: 0; }
.cal th, .cal td { padding: 0; border-bottom: 1px solid #EFEBE5; border-right: 1px solid #F3F0EB; }
.cal th.dia { width: 34px; min-width: 34px; text-align: center; padding: 6px 0; font-size: 11px; }
.cal th.dia.finde { background: #F3EFE9; }
.cal th.dia.hoy { background: var(--coral); color: var(--blanco); }
.cal td.hab, .cal th.hab { position: sticky; left: 0; background: var(--blanco); padding: 8px 12px; font-weight: 600; z-index: 1; min-width: 140px; }
.cal td.libre { height: 38px; }
.cal td.ocup { padding: 3px 2px; }
.cal .bloque {
  display: block; height: 30px; line-height: 30px; padding: 0 8px; border-radius: 6px;
  background: var(--bruma); color: var(--grafito); font-size: 12px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal .bloque:hover { text-decoration: none; filter: brightness(.96); }
.cal .bloque.pendiente { background: var(--alerta-suave); color: var(--alerta); }
.cal .bloque.en-curso { background: var(--coral); color: var(--blanco); }
.cal .bloque.finalizada { background: #ECEAE6; color: var(--texto-2); }
.leyenda { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 12px; font-size: 12px; color: var(--texto-2); }

/* ---------- Login ---------- */
.login-pagina {
  min-height: 100vh; display: grid; place-items: center; padding: 20px;
  background: var(--marfil) none;
}
.login-caja { width: 100%; max-width: 380px; background: var(--blanco); border-radius: 14px; box-shadow: 0 10px 40px rgba(37, 43, 49, .12); padding: 34px 30px; }
.login-caja img { width: 150px; display: block; margin: 0 auto 22px; }
.login-caja .campo { margin-bottom: 14px; }
.login-caja .btn { width: 100%; justify-content: center; padding: 11px; margin-top: 6px; }
.login-caja p.lema { text-align: center; font-size: 11px; letter-spacing: .3em; color: var(--texto-2); margin: 22px 0 0; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: 250px; z-index: 50; transform: translateX(-100%); transition: transform .2s; }
  .layout.abierto .sidebar { transform: none; box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .35); }
  .main { padding: 16px 16px 50px; }
  .menu-movil { display: inline-flex; }
  .grid-2, .grid-3, .campos { grid-template-columns: 1fr; }
  .campo.check label { margin-top: 0; }
  .dl { grid-template-columns: 110px 1fr; }
}

@media print {
  .sidebar, .topbar .acciones, .filtros, .form-acciones, .menu-movil { display: none !important; }
  .layout { display: block; }
  body { background: #fff; }
}

/* Ajustes */
.btn.menu-movil { display: none; }
@media (max-width: 900px) { .btn.menu-movil { display: inline-flex; } }
.grid > .card { margin-top: 0; }
.login-pagina { background: #F5F5F7; }

/* Calendario: canales, bloqueos y reservas a completar */
.cal .bloque.canal-airbnb, .chip.canal-airbnb { background: #FBE1E6; color: #A3253D; }
.cal .bloque.canal-booking, .chip.canal-booking { background: #DCE6F5; color: #1F3F73; }
.cal .bloque.en-curso { background: var(--coral); color: var(--blanco); }
.cal .bloque.finalizada { background: #ECEAE6; color: var(--texto-2); }
.cal .bloque.bloqueado, .chip.bloqueado {
  background: repeating-linear-gradient(-45deg, #EEEBE6, #EEEBE6 5px, #E4E0D9 5px, #E4E0D9 10px);
  color: var(--texto-2); font-weight: 500; cursor: default;
}
.cal .bloque.incompleta, .chip.incompleta { outline: 2px dashed var(--alerta); outline-offset: -2px; }
.card.aviso { border-left: 4px solid var(--alerta); }
.cal { table-layout: fixed; width: max-content; }
.cal th.hab, .cal td.hab { width: 160px; min-width: 160px; max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.cal td.ocup { max-width: 0; }
.tabla-simple td { white-space: normal; }
.tabla-simple td.num { white-space: nowrap; }

/* Ficha de unidad */
.unidad-titulo { font-size: 17px; font-weight: 600; margin: -10px 0 2px; }
.unidad-sub { color: var(--texto-2); margin: 0 0 16px; }
.galeria { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 170px 170px; gap: 8px; border-radius: 14px; overflow: hidden; }
.galeria a { display: block; overflow: hidden; background: var(--bruma); }
.galeria img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.galeria a:hover img { transform: scale(1.03); }
.galeria .g0 { grid-row: 1 / 3; }
.todas-fotos { margin-top: 10px; }
.todas-fotos summary { list-style: none; }
.todas-fotos summary::-webkit-details-marker { display: none; }
.fotos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; margin-top: 12px; }
.fotos-grid a { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 8px; background: var(--bruma); }
.fotos-grid img { width: 100%; height: 100%; object-fit: cover; }
.fotos-grid span { position: absolute; left: 6px; bottom: 6px; background: rgba(37, 43, 49, .75); color: #fff; font-size: 11px; padding: 2px 7px; border-radius: 99px; }
.destacado { padding: 8px 0; }
.destacado + .destacado { border-top: 1px solid #EFEBE5; }
.destacado div { color: var(--texto-2); font-size: 13px; }
.descripcion { line-height: 1.6; }
.servicios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 20px; }
.servicios h3 { font-size: 13px; margin: 10px 0 4px; }
.servicios ul, .lista { margin: 0; padding-left: 18px; }
.servicios li, .lista li { margin: 2px 0; }
.dormitorios { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.dormitorios div { border: 1px solid var(--borde); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.dormitorios span { color: var(--texto-2); font-size: 13px; }
@media (max-width: 900px) {
  .galeria { grid-template-columns: 1fr 1fr; grid-template-rows: 200px 110px 110px; }
  .galeria .g0 { grid-column: 1 / 3; grid-row: auto; }
  .servicios { grid-template-columns: 1fr; }
}
.kpi .val.val-multi { font-size: 18px; line-height: 1.3; }

/* Pagos de Airbnb */
.chip.payoneer { background: #FFF1D6; color: #8A5A00; }
.chip.banco { background: #DCE6F5; color: #1F3F73; }
.mini { font-size: 12.5px; color: var(--texto-2); }
.meses-tabla td.num, .meses-tabla th.num { white-space: nowrap; }
.meses-tabla { width: 100%; }
.meses-tabla tr.activo td { background: var(--bruma); font-weight: 600; }
.huespedes { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dia-sep td { background: #F6F4F1; font-weight: 600; font-size: 12.5px; color: var(--texto-2); padding-top: 6px !important; padding-bottom: 6px !important; }
.grid-pagos { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
@media (max-width: 900px) { .grid-pagos { grid-template-columns: 1fr; } .huespedes { max-width: 200px; } }
/* Las tarjetas KPI destacadas no deben heredar el estilo de los "destacados" de la ficha de la unidad */
.kpi.destacado { padding: 16px 18px; }
.kpi.destacado .val { color: var(--blanco); }
@media (max-width: 600px) {
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi { padding: 12px 14px; }
  .kpi .val { font-size: 17px; }
  .huespedes { max-width: 120px; }
  .grid-pagos .chip { font-size: 11px; padding: 2px 7px; }
}
.grid-pagos td.medio { white-space: nowrap; }
@media (max-width: 600px) { .grid-pagos td.medio { white-space: normal; width: 90px; } .grid-pagos td, .grid-pagos th { padding-left: 8px !important; padding-right: 8px !important; } }
.chip { white-space: nowrap; }
.tablero-movs td.num { white-space: nowrap; vertical-align: middle; }
.tablero-movs td strong { font-weight: 600; }

/* Tablero de tareas */
.tareas-grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
@media (max-width: 900px) { .tareas-grid { grid-template-columns: 1fr; } }
.tareas-titulo { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); margin: 4px 0 10px; }
.tareas-titulo.prio-alta { color: var(--coral); }
a.card.tarea { display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; padding: 14px 16px; margin-bottom: 10px; border-left: 4px solid var(--borde); transition: transform .08s, box-shadow .08s; }
a.card.tarea + a.card.tarea { margin-top: 0; }
a.card.tarea:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
a.card.tarea.prio-alta { border-left-color: var(--coral); }
a.card.tarea.prio-media { border-left-color: var(--alerta); }
a.card.tarea.prio-baja { border-left-color: #B8C2CC; }
.tarea-nueva label input { width: auto; margin: 0; }
.tarea-nueva input[type=date] { flex: 1; min-width: 140px; }
.tarea-area { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); width: 92px; flex-shrink: 0; }
.tarea-cuerpo { flex: 1; min-width: 0; }
.tarea-titulo { font-weight: 600; margin-bottom: 2px; }
.tarea-ok { border-left: 4px solid var(--ok); }
.tarea-manual { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid #EFEBE5; }
.tarea-manual form { margin: 0; }
.tarea-manual .check { width: 20px; height: 20px; border-radius: 50%; border: 2px solid #B8C2CC; background: #fff; cursor: pointer; padding: 0; margin-top: 1px; font-size: 11px; line-height: 16px; color: #fff; }
.tarea-manual .check:hover { border-color: var(--ok); }
.tarea-manual .check.marcado { background: var(--ok); border-color: var(--ok); }
.tarea-manual.hecha div { color: var(--texto-2); text-decoration: line-through; }
.tarea-manual .borrar { border: 0; background: none; color: #B8C2CC; font-size: 18px; cursor: pointer; line-height: 1; }
.tarea-manual .borrar:hover { color: var(--coral); }
.tarea-nueva { display: grid; gap: 8px; margin-top: 12px; }
.tarea-nueva input[name=titulo] { width: 100%; }
@media (max-width: 600px) { a.card.tarea { flex-wrap: wrap; gap: 4px 12px; } .tarea-area, a.card.tarea .tarea-area { width: 100% !important; } .tarea-cuerpo { flex: 1 1 0; } }

/* Operación */
.filtros-op { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.tabs a { padding: 7px 14px; border-radius: 99px; background: var(--blanco); border: 1px solid var(--borde); color: var(--texto); text-decoration: none; font-size: 14px; font-weight: 600; }
.tabs a.activo { background: var(--grafito); border-color: var(--grafito); color: var(--blanco); }
.filtros-op .filtros { display: flex; gap: 8px; flex-wrap: wrap; }
.filtros-op .filtros select, .filtros-op .filtros input { width: auto; min-width: 150px; }
a.card.tarea.estado-hecha, a.card.tarea.estado-cancelada { opacity: .6; }
a.card.tarea .tarea-area { width: 120px; }
.nota { padding: 10px 12px; border-radius: 10px; background: #F6F4F1; margin-bottom: 8px; }
.nota.sistema { background: none; padding: 4px 12px; font-size: 13px; color: var(--texto-2); }
.permisos-grid { width: 100%; border-collapse: collapse; }
.permisos-grid td, .permisos-grid th { padding: 7px 8px; border-bottom: 1px solid #EFEBE5; text-align: left; vertical-align: top; }
.permisos-grid label { display: inline-flex; gap: 5px; align-items: center; margin: 0 12px 4px 0; font-size: 13.5px; white-space: nowrap; }
.permisos-grid input { width: auto; margin: 0; }
@media print {
  .sidebar, .topbar .acciones, .no-print, .menu-movil, .flash { display: none !important; }
  .main { margin: 0 !important; padding: 0 !important; }
  .layout { display: block !important; }
  .card { box-shadow: none !important; border: 0 !important; }
}
.tarea-mia { display: flex; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid #EFEBE5; color: inherit; text-decoration: none; }
.tarea-mia:hover strong { color: var(--coral); }
.permisos-grid label { white-space: normal; }
.permisos-grid td:first-child { width: 34%; }

/* Housekeeping del día: grilla tipo planilla (mismos colores que la planilla del equipo) */
.hk-resumen { margin: 0 0 14px; color: var(--texto-2); }
.hk-resumen strong { color: var(--texto); }
.hk-print-titulo { display: none; }
/* Arriba de la planilla: qué unidades tienen check in, check out o las dos cosas (nombres internos completos) */
.hk-mov { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.hk-mov-g { border: 1px solid #C9C3BB; background: #fff; border-radius: 8px; overflow: hidden; }
.hk-mov-t { font-weight: 700; font-size: 12px; padding: 4px 8px; color: #000; }
.hk-mov-t span { font-weight: 600; }
.hk-mov-l { padding: 6px 8px; font-size: 13px; line-height: 1.45; }
.hk-mov-n { white-space: nowrap; }
.hk-mov-check_in .hk-mov-t { background: #FF9900; }
.hk-mov-check_out .hk-mov-t { background: #EA9999; }
.hk-mov-out_in .hk-mov-t { background: #FF0000; color: #fff; }
.hk-sale { font-size: 12px; color: #555; white-space: nowrap; }
.hk-sale input { font-size: 13px; padding: 1px 4px; width: auto; min-width: 0; }
.hk-sale-f { display: none; }
.hk-hora { white-space: nowrap; }
.hk-llega, .hk-habitual { color: #555; white-space: nowrap; font-size: 12px; }
.solo-print { display: none; }
[data-fila].guardado { background: #DFF3E6; border-radius: 4px; }
[data-fila].error-fila { background: #FDE2E2; border-radius: 4px; }
@media (max-width: 700px) { .hk-mov { grid-template-columns: 1fr; } }
.hk-cols { columns: 2 400px; column-gap: 16px; }
.hk-col { display: contents; }
.hk-hoja { width: 100%; border-collapse: collapse; background: #fff; margin: 0 0 12px; break-inside: avoid; font-size: 12.5px; table-layout: fixed; }
.hk-hoja col.w-u { width: 74px; } .hk-hoja col.w-e { width: 36%; } .hk-hoja col.w-h { width: 52px; } .hk-hoja col.w-c { width: 34px; }
.hk-hoja tr.hk-cab th { background: #FCE5CD; font-size: 10.5px; height: 20px; }
.hk-col { min-width: 0; }
.hk-hoja th, .hk-hoja td { border: 1px solid #C9C3BB; padding: 0 5px; height: 25px; text-align: left; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hk-hoja thead th { background: #FCE5CD; font-size: 11px; font-weight: 700; color: #3a3a3a; text-transform: uppercase; white-space: nowrap; }
.hk-hoja th.hk-complejo-titulo { font-size: 12px; color: #000; background: #F6B26B; text-align: left; padding: 3px 6px; }
.hk-hoja .c { text-align: center; padding: 0; }
.hk-unidad { font-weight: 700; background: #FCE5CD; }
.hk-unidad a { color: inherit; text-decoration: none; }
/* Plataforma de la reserva: color del nombre de la unidad */
.c-airbnb, .hk-unidad a.c-airbnb { color: #D0103A; }
.c-booking, .hk-unidad a.c-booking { color: #0A3D91; }
.c-expedia, .hk-unidad a.c-expedia { color: #7A2FB0; }
.c-directa, .hk-unidad a.c-directa { color: #0E6B33; }
.c-hospital, .hk-unidad a.c-hospital { color: #B35C00; }
.hk-mov-n [class^="c-"], .hk-unidad a[class^="c-"] { font-weight: 800; }
.hk-leyenda { font-size: 13px; margin: -6px 0 10px; color: #555; }
.hk-canales span { font-weight: 800; }
.hk-print-titulo .hk-canales { float: right; font-size: 9px; }
.hk-huesp { background: #FFE599; }
.hk-obs-celda { background: #F4CCCC; }
.hk-hoja .hk-sel-estado, .hk-hoja .hk-obs, .hk-hoja .hk-num { width: 100%; min-width: 0; border: 0; border-radius: 0; background: transparent; padding: 2px 0; font-size: 12.5px; height: 24px; color: inherit; font-weight: inherit; box-shadow: none; }
.hk-hoja .hk-sel-estado { -webkit-appearance: none; appearance: none; }
.hk-hoja .hk-num { text-align: center; }
.hk-hoja .hk-sel-estado { cursor: pointer; }
.hk-hoja input:focus, .hk-hoja select:focus { outline: 2px solid #E69138; background: #FFFDF2; }
.hk-check { display: flex; align-items: center; justify-content: center; margin: 0; cursor: pointer; }
.hk-check input { width: 17px; height: 17px; margin: 0; accent-color: var(--ok); cursor: pointer; }
/* Colores del estado (como la planilla) */
.hk-fila td.hk-estado { background: #fff; }
.hk-fila.hk-libre td.hk-estado { background: #00FFFF; }
.hk-fila.hk-check_in td.hk-estado { background: #FF9900; }
.hk-fila.hk-check_out td.hk-estado { background: #EA9999; }
.hk-fila.hk-out_in td.hk-estado { background: #FF0000; color: #fff; font-weight: 600; }
.hk-fila.hk-en_curso td.hk-estado { background: #D9EAD3; }
.hk-fila.hk-recambio td.hk-estado { background: #B4A7D6; }
.hk-fila.hk-mantenimiento td.hk-estado { background: #999999; color: #fff; }
.hk-fila.hk-listo td.hk-unidad { background: #B6D7A8; }
.hk-fila.hk-listo .hk-unidad a:first-child::after { content: ' ✓'; }
.hk-fila.guardado td.hk-obs-celda { box-shadow: inset 0 0 0 9999px rgba(46, 160, 90, .18); }
@media (max-width: 700px) { .hk-cols { columns: 1; } .hk-hoja { font-size: 12px; } }
@media print {
  @page { size: A4 portrait; margin: 6mm; }
  html, body { background: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .layout { display: block !important; }
  .main { padding: 0 !important; margin: 0 !important; max-width: none !important; }
  .topbar, .hk-resumen, .no-print, .sidebar { display: none !important; }
  .hk-print-titulo { display: block; font-size: 10px; font-weight: 700; margin: 0 0 2mm; }
  .hk-mov { gap: 2mm; margin: 0 0 2.5mm; }
  .solo-print { display: inline !important; }
  .hk-hora { font-weight: 800; }
  .hk-hora.hk-hab { font-weight: 600; }
  .hk-mov-g { border-radius: 0; break-inside: avoid; }
  .hk-mov-t { font-size: 8px; padding: 0.6mm 1.5mm; }
  .hk-mov-l { font-size: 8.5px; padding: 1mm 1.5mm; line-height: 1.35; font-weight: 600; }
  .hk-cols { display: flex !important; columns: auto !important; gap: 2.5mm; align-items: flex-start; }
  .hk-col { display: block !important; flex: 1 1 0; min-width: 0; }
  .hk-hoja tr.hk-cab th { font-size: 6px; height: auto; }
  .hk-hoja { font-size: 8px; margin: 0 0 2.5mm; table-layout: fixed; width: 100%; page-break-inside: avoid; break-inside: avoid; }
  .hk-hoja col.w-u { width: 17%; } .hk-hoja col.w-e { width: 38%; } .hk-hoja col.w-h { width: 8%; } .hk-hoja col.w-o { width: 37%; }
  /* El tilde de "listo" se marca desde el celular: en la hoja impresa no va. */
  .hk-hoja col.w-c, .hk-hoja .hk-tilde { display: none; }
  .hk-hoja td.hk-unidad { white-space: normal; }
  .hk-check input { width: 7px; height: 7px; }
  .hk-hoja th, .hk-hoja td { height: auto; padding: 0.5mm 1mm; line-height: 1.3; }
  .hk-hoja thead th { font-size: 5.5px; white-space: normal; }
  .hk-hoja thead th.hk-complejo-titulo { font-size: 7px; }
  .hk-hoja th.hk-complejo-titulo { font-size: 8.5px; }
  .hk-hoja .hk-sel-estado, .hk-hoja .hk-obs, .hk-hoja .hk-num { font-size: 8px; height: auto; padding: 0; line-height: 1.25; -webkit-appearance: none; appearance: none; background: transparent; }
  .hk-unidad { width: auto; }
}
.cotizacion-form { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.cotizacion-form input[name=cotizacion] { width: 130px; }
.liq-h { font-size: 16px; margin: 22px 0 6px; color: var(--grafito); }
/* Sueldos: blanco / negro */
.tabla-sueldos th.grupo { text-align: center; border-bottom: 1px solid var(--borde, #e5e0d8); }
.tabla-sueldos td.acciones-sueldo { white-space: normal; min-width: 170px; }
.tabla-sueldos td.acciones-sueldo .btn { margin: 2px 2px 2px 0; }
.tabla-sueldos td.num { white-space: nowrap; }
/* Usuarios: lista + formulario; la grilla de permisos se acomoda en filas con "chips" */
.usuarios-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 18px; align-items: start; }
@media (max-width: 1100px) { .usuarios-layout { grid-template-columns: minmax(0, 1fr); } }
.usuarios-layout > * { min-width: 0; }
.permisos-lista { border-top: 1px solid #EFEBE5; }
.perm-fila { padding: 10px 0; border-bottom: 1px solid #EFEBE5; }
.perm-sec { font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.perm-acc { display: flex; flex-wrap: wrap; gap: 6px; }
.perm-chip { display: inline-flex !important; align-items: center; gap: 6px; margin: 0 !important; padding: 5px 10px; border: 1px solid var(--borde); border-radius: 999px; font-size: 13px; cursor: pointer; background: #fff; }
.perm-chip input { width: auto; margin: 0; accent-color: var(--coral); }
.perm-chip:has(input:checked) { background: #FCEBEE; border-color: #F2B8C3; }
.perm-chip:has(input:disabled) { cursor: default; opacity: .75; }
/* Claves de acceso: hoja imprimible con el mismo estilo que la planilla del equipo */
.claves-titulo { font-weight: 700; letter-spacing: .04em; margin-bottom: 10px; font-size: 13px; color: var(--texto-2); }
.claves-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; max-width: 900px; }
@media (max-width: 700px) { .claves-cols { grid-template-columns: minmax(0, 1fr); } }
.claves-tabla { width: 100%; border-collapse: collapse; background: #fff; border: 2px solid #222; }
.claves-tabla th { background: #D9EAD3; font-weight: 700; text-align: center; padding: 6px 8px; border: 1px solid #222; font-size: 14px; }
.claves-tabla td { padding: 5px 8px; border: 1px solid #222; font-size: 14px; }
.claves-tabla tbody tr:nth-child(odd) td { background: #9FC5E8; }
.claves-tabla td.clave { font-size: 17px; font-variant-numeric: tabular-nums; width: 90px; text-align: right; }
@media print {
  .claves-hoja { padding: 4mm; }
  .claves-cols { max-width: none; gap: 10px; }
  .claves-tabla th, .claves-tabla td { -webkit-print-color-adjust: exact; print-color-adjust: exact; font-size: 11.5px; padding: 3px 6px; }
  .claves-tabla td.clave { font-size: 13px; }
  .claves-titulo { color: #000; }
}
/* Claves de acceso: grilla editable */
.claves-barra { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.claves-barra input[type=search] { max-width: 320px; }
.claves-editables td { padding: 4px 6px; vertical-align: middle; }
.claves-editables input, .claves-editables select { padding: 6px 8px; font-size: 14px; border-color: transparent; background: transparent; }
.claves-editables input:hover, .claves-editables select:hover { border-color: var(--borde); }
.claves-editables input:focus, .claves-editables select:focus { border-color: var(--coral); background: #fff; }
.claves-editables .input-clave { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; width: 90px; }
.claves-editables tr.guardado td { background: #E6F4EA; transition: background .2s; }
.claves-editables tr.error-fila td { background: #FCEBEE; }
.claves-editables .fila-nueva td { background: #FAF8F5; border-top: 2px solid var(--borde); }
.claves-editables .fila-nueva input, .claves-editables .fila-nueva select { border-color: var(--borde); background: #fff; }
.nowrap { white-space: nowrap; }
/* Calendario: línea de tiempo por unidad */
.cal-barra { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.cal-barra select, .cal-barra input[type=month] { width: auto; }
.tl-wrap { overflow-x: auto; background: var(--blanco); border: 1px solid var(--borde); border-radius: 14px; }
.tl { width: max-content; min-width: 100%; font-size: 12.5px; }
.tl-head, .tl-fila, .tl-grupo { display: flex; }
.tl-u { position: sticky; left: 0; z-index: 3; flex: 0 0 130px; width: 130px; background: var(--blanco); padding: 0 10px; display: flex; align-items: center; border-right: 1px solid var(--borde); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-u a { color: var(--texto); font-weight: 600; }
.tl-head { position: sticky; top: 0; z-index: 4; border-bottom: 1px solid var(--borde); background: var(--blanco); }
.tl-dias { display: flex; }
.tl-dia { position: relative; width: var(--w); flex: 0 0 var(--w); text-align: center; padding: 16px 0 5px; font-size: 11px; font-weight: 600; color: var(--texto-2); line-height: 1.25; border-right: 1px solid #F3F0EB; }
.tl-dia .dow { display: block; font-weight: 400; font-size: 10px; }
.tl-dia .tl-mes { position: absolute; top: 2px; left: 3px; font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--coral); white-space: nowrap; }
.tl-dia.finde, .tl-celda.finde { background: #F7F4EF; }
.tl-dia.hoy { background: var(--coral); color: #fff; }
.tl-dia.hoy .tl-mes, .tl-dia.hoy .dow { color: #fff; }
.tl-grupo { background: #F3EFE9; border-bottom: 1px solid var(--borde); }
.tl-grupo .tl-u { background: #F3EFE9; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; padding-top: 5px; padding-bottom: 5px; color: var(--texto-2); }
.tl-fila { border-bottom: 1px solid #F0ECE6; }
.tl-fila.inactiva .tl-u a { color: var(--alerta); font-style: italic; }
.tl-track { position: relative; display: flex; height: 34px; min-height: 34px; }
.tl-celda { width: var(--w); flex: 0 0 var(--w); height: 100%; border-right: 1px solid #F3F0EB; display: block; }
a.tl-celda:hover { background: #FCEBEE; }
.tl-celda.hoy { background: #FDF0F2; }
.tl-barra { position: absolute; top: 5px; height: 24px; margin-left: 1px; border-radius: 7px; padding: 0 7px; font-size: 11.5px; font-weight: 600; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; z-index: 1;
  background: #E3E0DA; color: #4A4640; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); text-decoration: none; }
.tl-barra:hover { text-decoration: none; filter: brightness(.95); z-index: 2; }
.tl-barra.canal-airbnb, .chip.canal-airbnb { background: #FBE1E6; color: #A3253D; }
.tl-barra.canal-booking, .chip.canal-booking { background: #DCE6F5; color: #1F3F73; }
.tl-barra.canal-directo, .chip.canal-directo { background: #DDF0E2; color: #1F6B3A; }
.tl-barra.canal-otro, .chip.canal-otro { background: #EDE7F6; color: #5B3F8C; }
.tl-barra.canal-expedia, .chip.canal-expedia, .cal .bloque.canal-expedia { background: #FFF1B8; color: #1B2552; }
.tl-barra.canal-despegar, .chip.canal-despegar, .cal .bloque.canal-despegar { background: #E3F4F4; color: #1D5E63; }
.tl-barra.en-curso, .chip.tl-chip-encurso { box-shadow: inset 0 0 0 2px currentColor; }
.tl-barra.finalizada { opacity: .55; }
.tl-barra.corta-izq { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; }
.tl-barra.corta-der { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.tl-barra.choca { outline: 2px solid #C62828; outline-offset: -2px; }
.tl-fila.sola .tl-u a { font-weight: 700; }
.tl-fila.inactiva .tl-track { background: repeating-linear-gradient(-45deg, transparent 0 6px, #FBF3E6 6px 12px); }
.tl-barra.incompleta { outline: 2px dashed var(--alerta); outline-offset: -2px; }
.tl-alerta { display: inline-block; background: #C62828; color: #fff; border-radius: 50%; width: 14px; height: 14px; line-height: 14px; text-align: center; font-size: 9.5px; margin-right: 4px; vertical-align: 1px; }
@media (max-width: 700px) { .tl-u { flex-basis: 74px; width: 74px; padding: 0 6px; } }
.tl-ayuda { margin: 0 0 10px; font-size: 13px; color: var(--texto-2); }
.tl[data-arrastrar] .tl-barra { cursor: grab; touch-action: pan-x pan-y; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.tl-barra.arrastrando { cursor: grabbing; z-index: 10; opacity: .92; box-shadow: 0 6px 18px rgba(0,0,0,.22); transition: none; }
.tl-barra.guardando { opacity: .5; }
.tl-fila.tl-destino .tl-celda { background: #FCEBEE; }
.tl-fila.tl-destino { outline: 2px solid var(--coral); outline-offset: -2px; position: relative; z-index: 2; }
.tl-fila.tl-destino .tl-u { color: var(--coral); }
body.tl-moviendo, body.tl-moviendo * { cursor: grabbing !important; -webkit-user-select: none; user-select: none; }
.tl-etiqueta { display: none; position: fixed; z-index: 50; background: var(--grafito, #252B31); color: #fff; font-size: 12px; font-weight: 600; padding: 5px 9px; border-radius: 8px; pointer-events: none; white-space: nowrap; box-shadow: 0 4px 12px rgba(0,0,0,.2); }
/* Ingreso con Google */
.btn-google { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 11px; border: 1px solid #DADCE0; border-radius: 10px; background: #fff; color: #3C4043; font-weight: 600; font-size: 15px; text-decoration: none; }
.btn-google:hover { background: #F8F9FA; text-decoration: none; box-shadow: 0 1px 3px rgba(60,64,67,.2); }
.login-clave { margin-top: 18px; border-top: 1px solid var(--borde); padding-top: 12px; }
.login-clave summary { cursor: pointer; font-size: 13px; color: var(--texto-2); text-align: center; list-style: none; }
.login-clave summary::-webkit-details-marker { display: none; }
.login-clave[open] summary { margin-bottom: 12px; }
.google-config code { background: #F3EFE9; padding: 2px 6px; border-radius: 5px; font-size: 12.5px; word-break: break-all; }
/* Ayuda dentro del sistema */
.ayuda-movil { display: none; font-weight: 800; }
.ayuda-flotante { position: fixed; right: 20px; bottom: 20px; z-index: 40; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px 9px 10px; border: 0; border-radius: 999px;
  background: var(--grafito); color: #fff; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; box-shadow: 0 6px 20px rgba(37,43,49,.25); }
.ayuda-flotante span { display: inline-flex; width: 24px; height: 24px; border-radius: 50%; background: var(--coral); align-items: center; justify-content: center; font-weight: 800; }
.ayuda-flotante:hover { background: #343B43; }
body.ayuda-abierta .ayuda-flotante { display: none; }
.main { padding-bottom: 70px; }
@media (max-width: 900px) { .ayuda-flotante { display: none; } .ayuda-movil { display: inline-flex; } }
.ayuda-capa { position: fixed; inset: 0; z-index: 60; background: rgba(37,43,49,.25); }
@media (min-width: 1200px) { .ayuda-capa { background: transparent; pointer-events: none; } .ayuda-capa .ayuda-panel { pointer-events: auto; } }
.ayuda-panel { position: absolute; top: 0; right: 0; bottom: 0; width: 100%; max-width: 440px; background: #fff; box-shadow: -8px 0 30px rgba(37,43,49,.18); display: flex; flex-direction: column; }
.ayuda-cab { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px 10px; border-bottom: 1px solid var(--borde); }
.ayuda-cab strong { font-size: 17px; }
.ayuda-seccion { color: var(--texto-2); font-size: 13.5px; }
.ayuda-cerrar { border: 0; background: none; font-size: 18px; cursor: pointer; color: var(--texto-2); padding: 4px 8px; }
.ayuda-buscar { margin: 10px 16px 4px; width: auto; }
.ayuda-cuerpo { flex: 1; overflow-y: auto; padding: 6px 16px 16px; }
.ayuda-pie { border-top: 1px solid var(--borde); padding: 10px 16px; font-size: 13.5px; font-weight: 600; }
.ayuda-grupo { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); margin: 14px 0 8px; }
.ayuda-vacio { color: var(--texto-2); font-size: 14px; }
.ayuda-todos, .ayuda-volver { margin: 12px 0 4px; }
.ayuda-tema { border: 1px solid var(--borde); border-radius: 10px; margin-bottom: 8px; background: #fff; }
.ayuda-tema summary { cursor: pointer; padding: 10px 12px; font-weight: 700; font-size: 14.5px; list-style: none; display: flex; justify-content: space-between; gap: 10px; }
.ayuda-tema summary::-webkit-details-marker { display: none; }
.ayuda-tema summary::after { content: "+"; color: var(--coral); font-weight: 800; }
.ayuda-tema[open] summary::after { content: "–"; }
.ayuda-tema[open] summary { border-bottom: 1px solid var(--borde); }
.ayuda-contenido { padding: 10px 12px 4px; font-size: 14px; line-height: 1.55; }
.ayuda-contenido p, .ayuda-contenido ul, .ayuda-contenido ol { margin: 0 0 10px; }
.ayuda-contenido ul, .ayuda-contenido ol { padding-left: 20px; }
.ayuda-contenido h3, .ayuda-contenido h4 { font-size: 14.5px; margin: 14px 0 6px; }
.ayuda-contenido table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 0 0 10px; table-layout: fixed; }
.ayuda-contenido th, .ayuda-contenido td { overflow-wrap: anywhere; white-space: normal !important; }
.ayuda-contenido th { background: var(--grafito); color: #fff; text-align: left; padding: 5px 7px; font-weight: 600; }
.ayuda-contenido td { padding: 5px 7px; border-bottom: 1px solid var(--borde); vertical-align: top; }
.ayuda-contenido code { background: var(--marfil); padding: 0 4px; border-radius: 4px; font-size: .92em; }
.ayuda-contenido .recuadro { border-left: 4px solid; border-radius: 8px; padding: 8px 10px 2px 12px; margin: 10px 0; }
.ayuda-contenido .recuadro-titulo { font-weight: 700; margin-bottom: 4px !important; }
.ayuda-contenido .recuadro.paso { background: var(--coral-suave); border-color: var(--coral); }
.ayuda-contenido .recuadro.atencion { background: var(--alerta-suave); border-color: var(--alerta); }
.ayuda-contenido .recuadro.consejo { background: var(--ok-suave); border-color: var(--ok); }
.ayuda-contenido .recuadro.saber { background: #E9F1F1; border-color: #6E9494; }
.ayuda-contenido input[type=checkbox] { width: auto; margin-right: 6px; }
@media print { .ayuda-flotante, .ayuda-capa { display: none !important; } }
/* Anotador */
.nav-badge { margin-left: auto; background: var(--coral); color: #fff; border-radius: 999px; font-size: 11px; font-weight: 700; padding: 1px 7px; line-height: 1.5; }
.anot-vivo { color: var(--ok); font-weight: 600; }
.anot-nueva textarea { width: 100%; resize: vertical; min-height: 70px; }
.anot-nueva-pie { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.anot-nueva-pie select { width: auto; }
.anot-filtros { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0; }
#anot-lista { display: grid; gap: 10px; max-width: 900px; }
.anot-nota { background: #fff; border: 1px solid var(--borde); border-radius: 12px; padding: 12px 14px; box-shadow: var(--sombra); }
.anot-nota.fijada { border-color: var(--coral); box-shadow: 0 0 0 1px var(--coral) inset, var(--sombra); }
.anot-nota.resuelta { opacity: .7; }
.anot-nota header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.anot-texto { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 15px; line-height: 1.45; }
.anot-nota textarea { width: 100%; }
.anot-acciones { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.anot-etiqueta { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 8px; border-radius: 999px; background: #EFEBE5; color: var(--texto-2); }
.anot-etiqueta.et-reservas { background: #DCE6F5; color: #1F3F73; }
.anot-etiqueta.et-housekeeping { background: #DDF0E2; color: #1F6B3A; }
.anot-etiqueta.et-mantenimiento { background: var(--alerta-suave); color: var(--alerta); }
.anot-etiqueta.et-administracion { background: #EDE7F6; color: #5B3F8C; }
.anot-etiqueta.et-pase-de-turno { background: var(--coral-suave); color: var(--coral-osc); }
.anot-pin { margin-left: auto; }
.anot-vacio { padding: 20px; }
/* Horarios y checklist de turno */
.turnos-grilla td, .turnos-grilla th { vertical-align: top; min-width: 112px; }
.turnos-grilla th.hoy, .turnos-grilla td.hoy { background: #FDF0F2; }
.turnos-grilla td.libre input, .turnos-grilla td.libre span { color: var(--texto-2); }
.turno-celda { padding: 5px 7px; font-size: 13.5px; }
.turno-celda.ok { border-color: var(--ok); background: var(--ok-suave); }
.turno-celda.error { border-color: #C62828; background: #FCEBEE; }
.turno-chk { display: block; font-size: 12px; margin-top: 4px; color: var(--texto-2); }
.turno-persona { display: flex; gap: 8px; align-items: center; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--borde); }
.turno-persona select { width: auto; }
.turnos-panel tr.turno-ahora td { background: #FFFBEF; }
.turnos-panel tr.turno-libre td { color: var(--texto-2); }
.turnos-texto { white-space: pre-wrap; max-width: 300px; min-width: 200px; }
.chip.chk-finalizado { background: var(--ok-suave); color: var(--ok); }
.chip.chk-en_curso { background: var(--alerta-suave); color: var(--alerta); }
.chk-barra { height: 8px; background: #EFEBE5; border-radius: 99px; overflow: hidden; min-width: 90px; }
.chk-barra > div { height: 100%; background: var(--coral); width: 0; transition: width .2s; }
.chk { max-width: 860px; }
.chk-cab { background: var(--grafito); color: #fff; border-radius: 14px; padding: 16px 20px; margin-bottom: 14px; }
.chk-cab h2 { color: #fff; margin: 4px 0; font-size: 21px; text-transform: none; letter-spacing: 0; }
.chk-cab .mini { color: #CDD3D8; }
.chk-marca { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--coral); font-weight: 700; }
.chk-pase { margin-bottom: 14px; border-left: 4px solid var(--coral); }
.chk-pase summary { font-weight: 700; cursor: pointer; }
.chk-pase h4 { margin: 10px 0 4px; font-size: 13px; text-transform: uppercase; color: var(--texto-2); }
.chk-progreso { position: sticky; top: 6px; z-index: 5; background: #fff; border: 1px solid var(--borde); border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; box-shadow: var(--sombra); }
.chk-progreso-top { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; margin-bottom: 6px; }
.chk-guardado { color: var(--texto-2); } .chk-guardado.ok { color: var(--ok); } .chk-guardado.error { color: #C62828; }
.chk-seccion { margin-bottom: 14px; padding: 0; overflow: hidden; }
.chk-seccion h3 { margin: 0; padding: 11px 16px; background: var(--marfil); font-size: 13px; letter-spacing: .04em; }
.chk-tarea { padding: 12px 16px; border-top: 1px solid var(--borde); }
.chk-texto { font-size: 15px; line-height: 1.35; margin-bottom: 9px; }
.chk-opciones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.chk-op { border: 1px solid var(--borde); background: #fff; border-radius: 8px; padding: 9px 4px; font: inherit; font-size: 13px; cursor: pointer; color: var(--texto-2); }
.chk-op:disabled { cursor: default; }
.chk-op.activa[data-valor="Cumplido"] { background: var(--ok-suave); border-color: var(--ok); color: var(--ok); font-weight: 700; }
.chk-op.activa[data-valor="No cumplido"] { background: #FCEBEE; border-color: #C62828; color: #9B1C1C; font-weight: 700; }
.chk-op.activa[data-valor="No aplica"] { background: #EFEBE5; border-color: #9A948B; color: #4A4640; font-weight: 700; }
.chk-campos { padding: 14px 16px; }
.chk-hk { display: flex; gap: 8px; } .chk-hk input { max-width: 140px; }
.chk-pie { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 6px 0 30px; }
/* Anotador flotante */
.anf { position: fixed; z-index: 45; background: #fff; border: 1px solid var(--borde); border-radius: 14px; box-shadow: 0 10px 30px rgba(37,43,49,.22);
  display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.anf.abierto { resize: both; min-width: 240px; min-height: 180px; max-width: 95vw; max-height: 90vh; }
.anf-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 8px 7px 12px; background: var(--grafito); color: #fff;
  cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.anf-cab:active { cursor: grabbing; }
.anf:not(.abierto) { border-radius: 999px; }
.anf:not(.abierto) .anf-cab { padding: 8px 10px 8px 14px; }
.anf:not(.abierto) .anf-cuerpo { display: none; }
.anf.con-nuevas:not(.abierto) .anf-cab { background: var(--coral); }
.anf-titulo { font-weight: 700; font-size: 13.5px; white-space: nowrap; }
.anf-badge { display: inline-block; background: #fff; color: var(--coral); border-radius: 999px; font-size: 11px; font-weight: 800; padding: 0 6px; margin-left: 4px; }
.anf-botones { display: flex; gap: 2px; }
.anf-btn { background: transparent; border: 0; color: #fff; font: inherit; font-weight: 700; font-size: 15px; width: 26px; height: 24px; border-radius: 6px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.anf-btn:hover { background: rgba(255,255,255,.15); text-decoration: none; }
.anf-cuerpo { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.anf-lista { flex: 1; overflow-y: auto; padding: 8px; display: grid; gap: 6px; align-content: start; background: var(--marfil); }
.anf-lista .anot-nota { padding: 8px 10px; border-radius: 10px; box-shadow: none; }
.anf-lista .anot-nota header { margin-bottom: 3px; gap: 6px; font-size: 12.5px; }
.anf-lista .anot-etiqueta { font-size: 9.5px; padding: 1px 6px; }
.anf-lista .anot-texto { font-size: 13.5px; }
.anf-lista .anot-texto.largo:not(.expandido) { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.anf-lista .anot-texto.largo:not(.expandido)::after { content: ''; }
.anf-lista .anot-acciones { margin-top: 5px; }
.anf-lista .anot-acciones .btn { padding: 2px 8px; font-size: 12px; }
.anf-lista .anot-vacio { padding: 10px; font-size: 13px; }
.anf-nueva { border-top: 1px solid var(--borde); padding: 8px; background: #fff; }
.anf-nueva textarea { width: 100%; resize: none; font-size: 13.5px; padding: 6px 8px; }
.anf-nueva-pie { display: flex; gap: 6px; justify-content: flex-end; margin-top: 6px; }
.anf-nueva-pie select { width: auto; font-size: 12.5px; padding: 4px 6px; }
@media (max-width: 700px) { .anf.abierto { max-width: calc(100vw - 16px); } }
@media print { .anf { display: none !important; } }
.anf-badge[hidden] { display: none; }
.anf:not(.abierto) .anf-btn[href] { display: none; }
.cb-clave { margin-bottom: 14px; }
.cb-cab { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.cb-nombre { display: flex; gap: 6px; align-items: center; flex: 1; }
.cb-nombre input { font-weight: 700; max-width: 280px; }
.link-mp-monto { font-size: 24px; font-weight: 800; margin: 0 0 4px; }
.link-mp-url { font-size: 13px; margin-bottom: 8px; }
.link-mp-botones { display: flex; gap: 6px; flex-wrap: wrap; }
/* Hoja de mantenimiento (mismo estilo que la planilla de housekeeping) */
.mt-hoja { max-width: 1100px; }
.mt-hoja col.m-u { width: 70px; } .mt-hoja col.m-e { width: 110px; } .mt-hoja col.m-t { width: auto; } .mt-hoja col.m-p { width: 62px; } .mt-hoja col.m-d { width: 24%; } .mt-hoja col.m-o { width: 18%; }
.mt-hoja td.mt-tarea, .mt-hoja td.mt-disp { white-space: normal; line-height: 1.3; padding-top: 3px; padding-bottom: 3px; height: auto; }
.mt-hoja .mt-desc { color: #555; }
.mt-hoja .mt-espera { color: #8a5a00; font-style: italic; }
.mt-hoja td.mt-prio { font-size: 10.5px; font-weight: 800; }
.mt-hoja tr.prio-urgente td.mt-prio { background: #FF0000; color: #fff; }
.mt-hoja tr.prio-alta td.mt-prio { background: #FFD966; }
.mt-hoja td.mt-disp { font-size: 11.5px; }
@media print {
  .mt-hoja { max-width: none; font-size: 9px; margin-bottom: 2.5mm; page-break-inside: auto; break-inside: auto; }
  .mt-hoja tr { break-inside: avoid; }
  .mt-hoja th, .mt-hoja td { padding: 0.6mm 1.2mm; height: auto; line-height: 1.25; }
  .mt-hoja thead th { font-size: 7px; }
  .mt-hoja thead th.hk-complejo-titulo { font-size: 9px; }
  .mt-hoja td.mt-disp { font-size: 8px; }
  .mt-hoja col.m-o { width: 20%; }
}
/* Panel de inicio */
.panel-aviso { display: block; background: var(--coral); color: #fff; font-weight: 700; padding: 11px 16px; border-radius: 12px; margin-bottom: 14px; text-decoration: none; }
.panel-aviso:hover { text-decoration: none; filter: brightness(.96); }
.panel-kpis { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.panel-kpis a.kpi { color: inherit; text-decoration: none; }
.panel-kpis a.kpi:hover { box-shadow: 0 0 0 2px var(--coral) inset, var(--sombra); }
.kpi-chico { font-size: 13px; font-weight: 600; color: var(--texto-2); }
.kpi.kpi-alerta { box-shadow: 0 0 0 2px #E57373 inset, var(--sombra); }
.panel-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 18px; align-items: start; margin-top: 18px; }
@media (max-width: 1000px) { .panel-grid { grid-template-columns: minmax(0, 1fr); } }
.panel-grid.panel-una { grid-template-columns: minmax(0, 760px); }
.panel-linea { display: block; }
.panel-monto { flex: 0 0 auto; white-space: nowrap; }
.panel-col > .card { margin-bottom: 18px; }
.panel-sub { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); margin: 12px 0 4px; }
.panel-fila { display: flex; align-items: center; gap: 8px; padding: 7px 4px; border-bottom: 1px solid #F0ECE6; color: inherit; text-decoration: none; font-size: 14px; flex-wrap: wrap; }
a.panel-fila:hover { background: #FBF8F4; text-decoration: none; }
.panel-fila.panel-ahora { background: #FFFBEF; }
.panel-u { flex: 0 0 auto; min-width: 92px; font-weight: 700; font-size: 13px; }
.panel-t { flex: 1 1 160px; min-width: 0; }
.chip.prio-urgente { background: #FF0000; color: #fff; }
.chip.prio-alta { background: #FFD966; color: #5a4300; }
.hk-chip { display: inline-block; font-size: 11.5px; padding: 2px 8px; border-radius: 6px; white-space: nowrap; }
.hk-chip.hk-libre { background: #00FFFF; } .hk-chip.hk-check_in { background: #FF9900; } .hk-chip.hk-check_out { background: #EA9999; }
.hk-chip.hk-out_in { background: #FF0000; color: #fff; } .hk-chip.hk-en_curso { background: #D9EAD3; } .hk-chip.hk-recambio { background: #B4A7D6; } .hk-chip.hk-mantenimiento { background: #999; color: #fff; }
.panel-hk { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 9px 4px; border-bottom: 1px solid #F0ECE6; color: inherit; text-decoration: none; }
.panel-hk:hover { background: #FBF8F4; text-decoration: none; }
.panel-hk strong { min-width: 62px; }
.panel-progreso { flex: 1 1 100%; height: 7px; background: #EFEBE5; border-radius: 99px; overflow: hidden; margin-top: 4px; }
.panel-progreso > span { display: block; height: 100%; background: var(--ok); }
.ocu-barras { display: grid; grid-template-columns: repeat(14, 1fr); gap: 4px; align-items: end; }
.ocu-dia { display: flex; flex-direction: column; align-items: center; gap: 3px; color: inherit; text-decoration: none; font-size: 11px; }
.ocu-dia:hover { text-decoration: none; }
.ocu-pct { font-size: 10.5px; color: var(--texto-2); }
.ocu-barra { width: 100%; height: 80px; background: #F3EFE9; border-radius: 6px; display: flex; align-items: flex-end; overflow: hidden; }
.ocu-barra > span { display: block; width: 100%; background: var(--coral); border-radius: 6px 6px 0 0; }
.ocu-dia.finde .ocu-barra { background: #EDE6DC; }
.ocu-lbl { text-align: center; line-height: 1.15; color: var(--texto-2); }
.panel-nota { display: block; overflow-wrap: anywhere; padding: 7px 4px; border-bottom: 1px solid #F0ECE6; color: inherit; text-decoration: none; font-size: 13.5px; }
.panel-nota:hover { background: #FBF8F4; text-decoration: none; }
.panel-pend { display: flex; flex-direction: column; gap: 4px; color: inherit; text-decoration: none; border-left: 4px solid var(--alerta); }
.panel-pend:hover { text-decoration: none; box-shadow: 0 0 0 2px var(--alerta) inset; }

/* ---------- Reseñas ---------- */
.res-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; align-items: start; }
/* En tablets y pantallas chicas: una sola columna, con el resumen por unidad arriba de las reseñas */
@media (max-width: 1350px) { .res-grid { grid-template-columns: minmax(0, 1fr); } .res-grid > .res-lista { order: 2; } }
.res-unidades-wrap { overflow-x: auto; margin: 0 -4px; }
.res-unidades { width: 100%; }
.res-unidades th, .res-unidades td.num { white-space: nowrap; }
.res-filtros input[type="search"] { flex: 1 1 150px; }
@media (min-width: 601px) { .res-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); } }
@media (max-width: 600px) { .res-unidades td, .res-unidades th { padding: 6px 4px; } .res-unidades th { white-space: normal; font-size: 10px; } .res-unidades td.num .mini { display: none; } }
.res-bien { color: var(--ok); }
.res-medio { color: #B7791F; }
.res-mal { color: var(--coral-osc); }
.res-dist { margin-bottom: 14px; display: flex; flex-direction: column; gap: 5px; }
.res-barra { display: grid; grid-template-columns: 34px 1fr 44px; gap: 8px; align-items: center; color: inherit; text-decoration: none; font-size: 13px; }
.res-barra:hover { text-decoration: none; color: var(--coral); }
.res-barra-fondo { height: 8px; background: #EFEBE5; border-radius: 99px; overflow: hidden; }
.res-barra-fondo > span { display: block; height: 100%; background: #E8B931; }
.res-item { margin-bottom: 12px; }
.res-item-media { border-left: 4px solid #E8B931; }
.res-item-mala { border-left: 4px solid var(--coral); }
.res-cab { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.res-cab .mini { margin-left: auto; }
.res-estrellas { color: #E0A800; letter-spacing: 1px; font-size: 15px; white-space: nowrap; }
.res-quien { margin: 3px 0 6px; }
.res-texto { margin: 6px 0; white-space: pre-line; line-height: 1.5; }
.res-respuesta { background: #FBF8F4; border-radius: 8px; padding: 8px 12px; margin: 8px 0 6px; }
.res-respuesta p { margin: 4px 0 0; white-space: pre-line; font-size: 13.5px; }
.res-unidades td, .res-unidades th { padding: 6px 6px; }
.res-unidades tr.res-sel td { background: #FFF6F7; }
.panel-res { display: block; padding: 7px 4px; border-bottom: 1px solid #F0ECE6; color: inherit; text-decoration: none; font-size: 13.5px; }
.panel-res:hover { background: #FBF8F4; text-decoration: none; }
.panel-res .res-estrellas { font-size: 13px; }

/* Anotador: parpadeo mientras haya notas nuevas sin leer */
@keyframes anf-parpadeo {
  0%, 100% { background: var(--coral); color: #fff; }
  50% { background: #FFD43B; color: var(--grafito); }
}
@keyframes anf-latido {
  0%, 100% { transform: scale(1); box-shadow: 0 10px 30px rgba(37,43,49,.22), 0 0 0 0 rgba(223,70,97,.75); }
  50% { transform: scale(1.12); box-shadow: 0 10px 30px rgba(37,43,49,.22), 0 0 0 14px rgba(223,70,97,0); }
}
.anf.alerta:not(.abierto) { animation: anf-latido .7s ease-in-out infinite; }
.anf.alerta:not(.abierto) .anf-cab, .anf.destello .anf-cab { animation: anf-parpadeo .7s steps(1, end) infinite; }
.nav-badge.alerta { animation: anf-parpadeo .7s steps(1, end) infinite; }
@media (prefers-reduced-motion: reduce) { .anf.alerta:not(.abierto) { animation: none; } }

/* ---------- Seguridad ---------- */
.seg-tabs { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: -4px 0 16px; }
.seg-tabs > a:not(.chip) { padding: 7px 14px; border-radius: 999px; background: var(--blanco); border: 1px solid var(--borde); color: var(--grafito); font-weight: 600; font-size: 13.5px; text-decoration: none; }
.seg-tabs > a.activo { background: var(--grafito); color: #fff; border-color: var(--grafito); }
.seg-sep { width: 1px; height: 22px; background: var(--borde); margin: 0 4px; }
.seg-kpis { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.seg-punto { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 3px; vertical-align: 1px; }
.seg-ok { background: var(--ok); }
.seg-med { background: #E0A800; }
.seg-mal { background: var(--coral); box-shadow: 0 0 0 3px rgba(223,70,97,.2); }
.seg-sin { border-left: 4px solid var(--coral); }
.seg-alertas { border-left: 4px solid #E0A800; margin-bottom: 18px; }
.seg-alertas ul { margin: 6px 0 0; padding-left: 20px; }
.seg-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.seg-grid > div > .card { margin-bottom: 18px; }
@media (max-width: 1000px) { .seg-grid { grid-template-columns: minmax(0, 1fr); } }
.seg-datos { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px 14px; margin-bottom: 8px; }
.seg-datos span { display: block; font-size: 11.5px; color: var(--texto-2); }
.seg-datos b { font-size: 15px; font-variant-numeric: tabular-nums; }
.seg-graf-tit { font-size: 12.5px; font-weight: 600; color: var(--texto-2); margin: 12px 0 4px; }
.seg-graf { width: 100%; height: 64px; display: block; background: #FBF8F4; border-radius: 8px; }
.seg-graf .l1 { fill: none; stroke: var(--coral); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.seg-graf .l2 { fill: none; stroke: #B7791F; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.seg-graf .a1 { fill: rgba(223,70,97,.12); }
.seg-graf .a2 { fill: rgba(224,168,0,.15); }
.seg-graf .a4 { fill: rgba(46,125,91,.22); }
.seg-ref { display: inline-block; width: 10px; height: 3px; vertical-align: 3px; }
.seg-ref.r1 { background: var(--coral); }
.seg-ref.r4 { background: rgba(46,125,91,.5); }
.seg-tabla td, .seg-tabla th { padding: 6px; }
.seg-apagada td { color: var(--texto-2); }
.seg-alerta-h { padding: 6px 0; border-bottom: 1px solid #F0ECE6; font-size: 13.5px; }
.seg-chip-ok { background: var(--ok-suave); color: var(--ok); }
.seg-chip-mal { background: var(--coral-suave); color: var(--coral-osc); }
.cam-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.cam { background: #111; border-radius: var(--radio); overflow: hidden; box-shadow: var(--sombra); display: flex; flex-direction: column; }
.cam.grande { grid-column: 1 / -1; order: -1; }
.cam-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px 6px 12px; background: var(--grafito); color: #fff; font-size: 13.5px; }
.cam-cab .mini { color: #B9BEC4; }
.cam-btns { display: flex; gap: 4px; }
.cam-btns .btn { background: rgba(255,255,255,.1); border-color: transparent; color: #fff; }
.cam-btns .btn:hover { background: rgba(255,255,255,.2); }
.cam-video { position: relative; aspect-ratio: 16 / 9; background: #000; cursor: zoom-in; }
.cam.grande .cam-video { cursor: zoom-out; }
.cam-video camara-video { display: block; width: 100%; height: 100%; position: relative; }
.cam-video video { object-fit: contain; background: #000; }
.cam-estado { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 16px; color: #C9CDD2; font-size: 13.5px; pointer-events: none; }
.cam-estado[hidden] { display: none; }
.cam:fullscreen { border-radius: 0; }
.cam:fullscreen .cam-video { aspect-ratio: auto; flex: 1; }
.grab-card .cam-video { cursor: default; }
.grab-player { margin-bottom: 10px; }
.grab-reloj { font-variant-numeric: tabular-nums; color: #fff !important; font-weight: 600; }
.grab-saltos { display: flex; gap: 4px; flex-wrap: wrap; }
.grab-form input[type="date"], .grab-form input[type="time"] { min-width: 0; }
.seg-fw { font-size: 12px !important; word-break: break-all; }
.ico-completa { display: block; }

/* ---------- Actividad del equipo ---------- */
.act-resumen { margin: -4px 0 8px; }
.act-fila { display: flex; gap: 10px; align-items: flex-start; padding: 8px 2px; border-bottom: 1px solid #F0ECE6; }
.act-quien { flex: 1; min-width: 0; font-size: 14px; }
.act-punto { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; margin-top: 5px; background: #C9CDD2; }
.act-resumen .act-punto { margin-top: 0; vertical-align: -1px; }
.act-punto.act-activo { background: var(--ok); box-shadow: 0 0 0 3px rgba(46,125,91,.18); }
.act-punto.act-ausente { background: #E0A800; }
.act-desconectado .act-quien strong { color: var(--texto-2); }
.act-turno { background: #FFF6DB; color: #8A6100; font-size: 11px; padding: 1px 7px; }
.act-aviso { margin: 8px 0 0; color: #8A6100; }
.act-tabla td, .act-tabla th { padding: 6px; white-space: nowrap; }

/* ---------- Luces del equipo (barra lateral del administrador) ---------- */
.equipo { position: sticky; top: -22px; z-index: 2; background: var(--grafito); margin: -6px -4px 4px; padding: 6px 4px 10px; border-bottom: 1px solid var(--grafito-2); }
.equipo-tit { display: flex; justify-content: space-between; align-items: baseline; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #7E8790; padding: 0 6px 6px; text-decoration: none; }
.equipo-tit span { letter-spacing: 0; text-transform: none; font-weight: 600; color: #8FD3B2; font-size: 11.5px; }
.equipo-tit:hover { text-decoration: none; color: #C9CED3; }
.equipo-lista { display: grid; grid-template-columns: 1fr; gap: 1px; }
.eq { display: flex; align-items: center; gap: 6px; padding: 2px 6px; border-radius: 7px; color: #DDE1E4; font-size: 12.5px; text-decoration: none; white-space: nowrap; overflow: hidden; }
.eq .eq-n { flex: 0 0 auto; }
.eq small { margin-left: auto; color: #8F99A3; font-size: 11px; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.eq-fuera small { color: #F0A35E; }
.eq:hover { background: rgba(255,255,255,.07); text-decoration: none; }
.eq i, .equipo-movil i { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; display: inline-block; }
.eq-activo i, .equipo-movil i.eq-activo { background: #2ECC71; box-shadow: 0 0 6px #2ECC71; }
.eq-ausente i, .equipo-movil i.eq-ausente { background: #F5B700; }
.eq-desconectado i, .equipo-movil i.eq-desconectado { background: #E5484D; }
.eq-desconectado { color: #9AA3AB; }
.eq-turno { box-shadow: inset 0 0 0 1px rgba(245,183,0,.55); }
.equipo-movil { display: none; gap: 3px; align-items: center; padding: 6px 8px; }
@media (max-width: 900px) { .btn.equipo-movil { display: inline-flex; } }
@media print { .equipo-movil { display: none !important; } }
.act-nombre { color: inherit; }
.act-fuera { color: #B5651D; font-weight: 600; }
/* Línea de tiempo del día */
.act-tl { position: relative; height: 22px; background: #F4F0EA; border-radius: 6px; overflow: hidden; margin: 4px 0 2px; }
.act-tl span { position: absolute; top: 0; bottom: 0; min-width: 1px; }
.act-tl-horas { display: flex; justify-content: space-between; font-size: 10.5px; color: var(--texto-2); }
.act-tl-ley { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; margin-top: 8px; }
.act-tl-ley i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
.act-dia { padding: 10px 0; border-bottom: 1px solid #F0ECE6; }
.act-dia-cab { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.act-sitios { display: grid; gap: 4px; }
.act-sitio { display: grid; grid-template-columns: minmax(120px, 210px) 1fr 70px; gap: 10px; align-items: center; font-size: 13.5px; }
.act-sitio .barra { height: 9px; background: #F4F0EA; border-radius: 99px; overflow: hidden; }
.act-sitio .barra > span { display: block; height: 100%; border-radius: 99px; }
.ext-form { background: #FBF8F4; border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; }
.ext-sw { font-size: 15px; display: flex; gap: 8px; align-items: center; }
.ext-grupo { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; margin-bottom: 10px; font-size: 14px; }
.ext-grupo .mini { flex-basis: 100%; }
.ext-grupo label { display: inline-flex; gap: 5px; align-items: center; }
.ext-form input[type="checkbox"] { width: auto; min-width: 0; margin: 0; flex: 0 0 auto; }
.ext-sw { justify-content: flex-start; }

/* ---------- App instalable (PWA) ---------- */
.pwa-cartel { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 60; display: flex; gap: 10px; align-items: center; background: var(--grafito); color: #fff; border-radius: 14px; padding: 12px 40px 12px 14px; font-size: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.pwa-cartel .pwa-x { position: absolute; top: 6px; right: 8px; background: none; border: 0; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
.pwa-ico { display: inline-block; border: 1px solid rgba(255,255,255,.6); border-radius: 4px; padding: 0 4px; font-size: 12px; }
html.es-app .main { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
.notif-op { display: flex; gap: 8px; align-items: center; margin: 6px 0; font-size: 14px; }
.notif-op input { width: auto; margin: 0; }
.codigo-grande { font-size: 40px; font-weight: 800; letter-spacing: .12em; text-align: center; padding: 10px 0; font-variant-numeric: tabular-nums; color: var(--coral-osc); }
.login-codigo { margin-top: 14px; }
.btn[hidden], [data-push-activar][hidden], [data-push-probar][hidden], [data-push-desactivar][hidden] { display: none !important; }
.pwa-ico svg { display: inline-block; vertical-align: -2px; }
.pwa-ico { border: 0; padding: 0; }
.act-clientes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.act-clientes .chip { font-weight: 500; font-size: 12px; }

/* ---------- Gastos y proveedores ---------- */
.chip.parcial { background: #FFF1D6; color: #9A6200; }
.gst-lista { display: flex; flex-direction: column; }
.gst-fila { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 2px; border-bottom: 1px solid #F0ECE6; font-size: 14px; }
.gst-fila:last-child { border-bottom: 0; }
.gst-fila .mini { line-height: 1.5; }
.gst-acc { display: flex; align-items: center; gap: 8px; flex-shrink: 0; white-space: nowrap; }
.gst-acc input { width: 130px; min-width: 0; }
.gst-vencida { background: linear-gradient(90deg, #FDECEF 0, transparent 70%); }
.gst-confirmar { border-left: 4px solid #E8B931; }
.prov-saldo { font-size: 24px; font-weight: 800; margin: 2px 0 10px; }
.prov-movs td { vertical-align: top; }
.prov-movs .chip { font-size: 11px; padding: 1px 7px; margin-left: 4px; }
.prov-pago td { background: #F7FBF8; }
.prov-cbu { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; word-break: break-all; }
@media (max-width: 600px) {
  .gst-fila { flex-direction: column; align-items: stretch; gap: 6px; }
  .gst-acc { justify-content: space-between; }
  .gst-acc input { flex: 1; }
}

/* ---------- Documentación de los huéspedes ---------- */
.doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 14px; }
.doc-grid-chica { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
.doc { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.doc-vista { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; background: #F4F0EA; border: 1px solid var(--borde); }
.doc-vista img { width: 100%; height: 100%; object-fit: cover; }
.doc-ico { font-weight: 800; font-size: 18px; color: var(--texto-2); letter-spacing: .05em; }
.doc-info { line-height: 1.35; }
.doc-acc summary { cursor: pointer; }
.doc-acc form { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.doc-acc select, .doc-acc input { width: 100%; min-width: 0; font-size: 13px; }
.doc-subir { border: 2px dashed var(--borde); border-radius: 12px; padding: 12px; background: #FBF8F4; }
.doc-subir.subiendo { opacity: .6; pointer-events: none; }
.doc-campos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 8px; margin-bottom: 10px; }
.doc-botones { display: flex; gap: 8px; flex-wrap: wrap; }
.doc-botones .btn { position: relative; overflow: hidden; cursor: pointer; }
.doc-input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; font-size: 0; }
@media (min-width: 901px) { .doc-camara { display: none; } }
@media (max-width: 600px) { .doc-campos { grid-template-columns: 1fr; } }

/* ---------- WhatsApp en la reserva ---------- */
.wa-texto { display: flex; gap: 8px; align-items: flex-end; margin-bottom: 12px; }
.wa-texto textarea { flex: 1; min-height: 44px; }
.wa-hilo { display: flex; flex-direction: column; gap: 6px; max-height: 360px; overflow-y: auto; padding: 4px 2px; }
.wa-msj { max-width: 85%; padding: 7px 10px; border-radius: 10px; font-size: 14px; }
.wa-msj > div { white-space: pre-line; }
.wa-msj.entrante { align-self: flex-start; background: #F1EFEC; }
.wa-msj.saliente { align-self: flex-end; background: #DCF8C6; }
.wa-msj .mini { display: block; margin-top: 2px; }

/* ---------- Bandeja de WhatsApp (al estilo del celular) ---------- */
.main:has(> .wz) { padding: 14px 16px !important; }
.wz { --wz-verde: #00A884; --wz-verde-osc: #008069; --wz-gris: #F0F2F5; --wz-linea: #E9EDEF; --wz-texto: #111B21; --wz-texto-2: #667781; --wz-salida: #D9FDD3; --wz-fondo: #EFEAE2;
  display: grid; grid-template-columns: minmax(300px, 400px) minmax(0, 1fr); height: calc(100dvh - 28px); min-height: 480px; background: #fff; border: 1px solid var(--borde);
  border-radius: 14px; overflow: hidden; box-shadow: var(--sombra); color: var(--wz-texto); }
.wz-ico { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; border: 0; background: transparent; color: #54656F; cursor: pointer; flex: 0 0 auto; text-decoration: none; position: relative; }
.wz-ico:hover { background: rgba(0,0,0,.06); text-decoration: none; }
/* Lista */
.wz-lista { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--wz-linea); background: #fff; }
.wz-lista-cab { display: flex; align-items: center; gap: 6px; padding: 10px 10px 6px 16px; }
.wz-lista-cab h1 { font-size: 21px; margin: 0; flex: 1; letter-spacing: -.01em; }
.wz-lista-cab .menu-movil { display: none; }
.wz-iconos { display: flex; gap: 2px; }
.wz-buscar { margin: 4px 12px 8px; display: flex; align-items: center; gap: 10px; background: var(--wz-gris); border-radius: 10px; padding: 0 12px; color: #54656F; }
.wz-buscar input { border: 0; background: transparent; padding: 9px 0; font-size: 14.5px; width: 100%; box-shadow: none; outline: none; }
.wz-filtros { display: flex; gap: 8px; padding: 0 12px 8px; overflow-x: auto; scrollbar-width: none; }
.wz-filtros::-webkit-scrollbar { display: none; }
.wz-filtros button { flex: 0 0 auto; }
.wz-filtros button { border: 0; background: var(--wz-gris); color: #54656F; border-radius: 99px; padding: 6px 13px; font: inherit; font-size: 13.5px; font-weight: 500; cursor: pointer; }
.wz-filtros button.activo { background: #E7FCE3; color: var(--wz-verde-osc); font-weight: 600; }
.wz-filtros [data-wz-nl]:not(:empty)::before { content: '· '; }
.wz-items { flex: 1; overflow-y: auto; overscroll-behavior: contain; }
.wz-item { display: flex; gap: 12px; align-items: center; padding: 0 14px 0 12px; color: inherit; text-decoration: none; cursor: pointer; }
.wz-item:hover { background: #F5F6F6; text-decoration: none; }
.wz-item.activo { background: var(--wz-gris); }
.wz-item-c { flex: 1; min-width: 0; padding: 11px 0; border-bottom: 1px solid var(--wz-linea); }
.wz-item:last-child .wz-item-c { border-bottom: 0; }
.wz-item-l1, .wz-item-l2 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.wz-item-l1 b { flex: 1; min-width: 0; font-weight: 500; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wz-item-l1 time { font-size: 12px; color: var(--wz-texto-2); flex: 0 0 auto; }
.wz-item.sin-leer .wz-item-l1 time { color: #1DAA61; font-weight: 600; }
.wz-item-l2 { margin-top: 2px; }
.wz-prev { flex: 1; min-width: 0; font-size: 14px; color: var(--wz-texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wz-prev .wz-tk { vertical-align: -1px; margin-right: 3px; }
.wz-item.sin-leer .wz-prev { color: var(--wz-texto); font-weight: 500; }
.wz-nl { flex: 0 0 auto; min-width: 20px; height: 20px; border-radius: 99px; background: #25D366; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }
.wz-item-r { margin-top: 3px; font-size: 12px; color: #8696A0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wz-item-r.en-casa { color: var(--wz-verde-osc); font-weight: 600; }
.wz-item-r.web { color: #3B6FB6; display: flex; align-items: center; gap: 4px; }
.wz-item-r.web b { color: #00A884; }
.wz-av.web { background: #E3ECF8; color: #3B6FB6; }
.wz-cab-info svg { vertical-align: -2px; }
.wz-sec { padding: 14px 16px 6px; font-size: 13px; font-weight: 600; color: var(--wz-verde-osc); }
.wz-nada, .wz-cargando { text-align: center; color: var(--wz-texto-2); padding: 26px 16px; font-size: 14px; margin: 0; }
.wz-av { --h: 160; flex: 0 0 auto; width: 49px; height: 49px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 17px;
  background: hsl(var(--h) 45% 88%); color: hsl(var(--h) 45% 32%); letter-spacing: .02em; }
.wz-av.chico { width: 36px; height: 36px; font-size: 14px; }
/* Conversación */
.wz-chat { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--wz-fondo); position: relative; }
.wz-chat::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(0,0,0,.035) 1.2px, transparent 1.3px), radial-gradient(rgba(0,0,0,.025) 1px, transparent 1.1px); background-size: 22px 22px, 34px 34px; background-position: 0 0, 11px 17px; }
.wz-chat > * { position: relative; }
.wz-vacio { margin: auto; max-width: 440px; text-align: center; padding: 30px; color: var(--wz-texto-2); }
.wz-vacio h2 { color: var(--wz-texto); font-weight: 400; font-size: 26px; margin: 14px 0 10px; text-transform: none; letter-spacing: 0; }
.wz-vacio-ico { color: #25D366; }
.wz-cab { display: flex; align-items: center; gap: 12px; padding: 8px 12px 8px 16px; background: var(--wz-gris); border-bottom: 1px solid var(--wz-linea); min-height: 60px; }
.wz-cab .wz-av { width: 40px; height: 40px; font-size: 15px; }
.wz-cab-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.wz-cab-info b { font-weight: 500; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wz-cab-info span { font-size: 13px; color: var(--wz-texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wz-cab-info a { color: var(--wz-verde-osc); }
.wz-cab-acc { display: flex; gap: 2px; }
.wz-volver { display: none; }
.wz-msjs { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 12px 6% 10px; display: flex; flex-direction: column; }
.wz-dia { text-align: center; margin: 12px 0 8px; position: sticky; top: 0; z-index: 2; }
.wz-dia span, .wz-sistema span { display: inline-block; background: #fff; color: #54656F; font-size: 12.5px; padding: 5px 12px; border-radius: 8px; box-shadow: 0 1px .5px rgba(11,20,26,.13); }
.wz-sistema { text-align: center; margin: 16px 0; }
.wz-sistema span { background: #FFEECD; color: #54656F; max-width: 460px; }
.wz-anteriores { text-align: center; margin: 4px 0 8px; }
.wz-anteriores button { border: 0; background: #fff; color: var(--wz-verde-osc); border-radius: 99px; padding: 6px 14px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; box-shadow: 0 1px .5px rgba(11,20,26,.13); }
.wz-m { display: flex; flex-direction: column; margin-top: 2px; max-width: min(78%, 620px); }
.wz-m.primera { margin-top: 10px; }
.wz-m.in { align-self: flex-start; align-items: flex-start; }
.wz-m.out { align-self: flex-end; align-items: flex-end; }
.wz-b { position: relative; background: #fff; border-radius: 8px; padding: 6px 7px 8px 9px; box-shadow: 0 1px .5px rgba(11,20,26,.13); font-size: 14.2px; line-height: 1.38; overflow-wrap: anywhere; min-width: 70px; }
.wz-m.out .wz-b { background: var(--wz-salida); }
.wz-m.in.primera .wz-b { border-top-left-radius: 0; }
.wz-m.out.primera .wz-b { border-top-right-radius: 0; }
.wz-m.in.primera .wz-b::before, .wz-m.out.primera .wz-b::before { content: ''; position: absolute; top: 0; width: 8px; height: 13px; }
.wz-m.in.primera .wz-b::before { left: -8px; background: linear-gradient(to bottom left, #fff 50%, transparent 50%); }
.wz-m.out.primera .wz-b::before { right: -8px; background: linear-gradient(to bottom right, var(--wz-salida) 50%, transparent 50%); }
.wz-txt { white-space: normal; padding-right: 2px; }
.wz-txt a { color: #027EB5; }
.wz-txt.jumbo { font-size: 38px; line-height: 1.15; }
.wz-esp { visibility: hidden; display: inline-flex; align-items: center; gap: 3px; font-size: 11px; line-height: 11px; height: 11px; margin-left: 12px; vertical-align: baseline; white-space: nowrap; }
.wz-txt.jumbo .wz-esp { font-size: 11px; }
.wz-b:has(.wz-nota), .wz-b:has(> .wz-doc:last-of-type) { padding-bottom: 20px; }
.wz-meta { position: absolute; right: 7px; bottom: 3px; font-size: 11px; color: var(--wz-texto-2); display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.wz-quien { font-weight: 600; color: #6B7C85; }
.wz-quien::after { content: ' ·'; font-weight: 400; }
.wz-tk { color: #8696A0; flex: 0 0 auto; }
.wz-tk.leido { color: #53BDEB; }
.wz-tk.mal { color: #D93025; font-weight: 800; font-style: normal; padding: 0 2px; }
.wz-b:not(:has(.wz-txt)) { padding-bottom: 22px; }
.wz-b.solo-media { padding: 3px 3px 3px; }
.wz-b.solo-media .wz-meta { right: 9px; bottom: 7px; color: #fff; background: rgba(0,0,0,.35); border-radius: 8px; padding: 1px 6px; }
.wz-b.solo-media .wz-tk { color: #fff; }
.wz-img { display: block; border: 0; padding: 0; background: none; cursor: zoom-in; border-radius: 6px; overflow: hidden; margin-bottom: 3px; }
.wz-img img { display: block; max-width: min(330px, 62vw); max-height: 340px; object-fit: cover; border-radius: 6px; }
.wz-img.sticker img { max-width: 150px; background: transparent; }
.wz-b audio { display: block; width: 270px; max-width: 62vw; margin-bottom: 2px; }
.wz-b video { display: block; max-width: min(330px, 62vw); border-radius: 6px; margin-bottom: 3px; }
.wz-doc { display: flex; align-items: center; gap: 10px; background: rgba(0,0,0,.05); border-radius: 6px; padding: 10px 12px; color: inherit; text-decoration: none; margin-bottom: 3px; min-width: 220px; }
.wz-doc:hover { background: rgba(0,0,0,.08); text-decoration: none; }
.wz-doc-ico { flex: 0 0 auto; width: 32px; height: 38px; border-radius: 4px; background: #E3533F; color: #fff; font-size: 10px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.wz-doc-n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; }
.wz-pl { font-size: 11.5px; color: var(--wz-texto-2); margin-bottom: 2px; }
.wz-nota { font-size: 12px; color: var(--wz-verde-osc); margin-top: 2px; }
.wz-sinarchivo { font-size: 13.5px; color: var(--wz-texto-2); font-style: italic; }
.wz-err { font-size: 12px; color: #B42318; margin: 3px 4px 0; max-width: 420px; }
.wz-err button { border: 0; background: none; color: var(--wz-verde-osc); font: inherit; font-weight: 600; padding: 0; cursor: pointer; text-decoration: underline; }
/* Escribir */
.wz-escribir { display: flex; align-items: flex-end; gap: 4px; padding: 8px 12px; background: var(--wz-gris); }
.wz-escribir[hidden], .wz-cerrada[hidden] { display: none !important; }
.wz-caja { flex: 1; min-width: 0; background: #fff; border-radius: 10px; padding: 3px 12px; }
.wz-caja textarea { width: 100%; border: 0; outline: none; box-shadow: none; resize: none; padding: 7px 0; font: inherit; font-size: 15px; line-height: 1.35; max-height: 140px; background: transparent; display: block; min-height: 0; }
.wz-enviar { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--wz-verde); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.wz-enviar:hover { background: var(--wz-verde-osc); }
.wz-escribir .wz-ico { margin-bottom: 2px; }
/* Micrófono: aparece en lugar de enviar cuando no hay texto; mientras graba, la barra roja reemplaza a todo */
.wz-escribir .wz-mic { display: none; }
.wz-escribir.vacio .wz-mic { display: inline-flex; }
.wz-escribir.vacio [data-wz-enviar] { display: none; }
.wz-escribir.grabando > :not(.wz-grabando) { display: none !important; }
.wz-grabando { flex: 1; display: flex; align-items: center; gap: 10px; min-height: 46px; }
.wz-grabando[hidden] { display: none; }
.wz-rec { width: 11px; height: 11px; border-radius: 50%; background: #E53935; animation: wz-rec 1s ease-in-out infinite; margin-left: 4px; }
@keyframes wz-rec { 50% { opacity: .25; } }
.wz-rec-t { font-variant-numeric: tabular-nums; font-size: 16px; color: var(--wz-texto); min-width: 42px; }
.wz-rec-ayuda { flex: 1; color: var(--wz-texto-2); font-size: 14px; }
.wz-cerrada { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: #FFF6E0; border-top: 1px solid #F3E2B3; font-size: 13.5px; color: #5E4B1F; }
.wz-cerrada span { flex: 1; }
.wz-sololectura { padding: 12px 16px; background: var(--wz-gris); color: var(--wz-texto-2); font-size: 13.5px; text-align: center; }
/* Elegir plantilla */
.wz-modal-fondo { position: fixed; inset: 0; z-index: 90; background: rgba(11,20,26,.45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.wz-modal { background: #fff; border-radius: 14px; width: min(560px, 100%); max-height: min(720px, calc(100dvh - 32px)); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.wz-modal header { display: flex; align-items: center; gap: 8px; padding: 12px 10px 4px 18px; }
.wz-modal header h3 { flex: 1; margin: 0; font-size: 17px; }
.wz-modal > p { margin: 0 18px 8px; }
.wz-modal footer { padding: 10px 18px 14px; border-top: 1px solid var(--wz-linea, #E9EDEF); font-size: 14px; }
.wz-pls { overflow-y: auto; padding: 4px 14px 14px; display: grid; gap: 10px; background: #EFEAE2; }
.wz-pl-op { text-align: left; border: 2px solid transparent; background: #fff; border-radius: 10px; padding: 10px 12px; font: inherit; cursor: pointer; display: flex; flex-direction: column; gap: 4px; box-shadow: 0 1px .5px rgba(11,20,26,.13); }
.wz-pl-op:hover:not(:disabled) { border-color: #00A884; }
.wz-pl-op:disabled { opacity: .55; cursor: not-allowed; }
.wz-pl-op.enviando { opacity: 1; border-color: #00A884; }
.wz-pl-op-n { font-weight: 700; font-size: 13px; color: #008069; }
.wz-pl-op-t { font-size: 14px; line-height: 1.4; color: #111B21; }
.wz-pl-op-f { font-size: 12px; color: #B42318; }
/* Foto en grande y avisos */
.wz-visor { position: fixed; inset: 0; z-index: 95; background: rgba(11,20,26,.92); display: flex; align-items: center; justify-content: center; padding: 50px 16px 16px; cursor: zoom-out; }
.wz-visor img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; }
.wz-visor-acc { position: fixed; top: 10px; right: 12px; display: flex; gap: 10px; align-items: center; }
.wz-visor-acc a, .wz-visor-acc button { color: #fff; background: rgba(255,255,255,.12); border: 0; border-radius: 99px; padding: 7px 14px; font: inherit; font-size: 14px; cursor: pointer; text-decoration: none; }
.wz-toast { position: fixed; left: 50%; bottom: 30px; transform: translateX(-50%); z-index: 96; background: #111B21; color: #fff; padding: 10px 16px; border-radius: 10px; font-size: 14px; max-width: calc(100vw - 32px); box-shadow: 0 10px 30px rgba(0,0,0,.3); }
/* Emojis */
.emoji-panel { position: fixed; z-index: 92; background: #fff; border-radius: 12px; box-shadow: 0 12px 40px rgba(11,20,26,.28); display: flex; flex-direction: column; height: 320px; overflow: hidden; border: 1px solid #E9EDEF; }
.emoji-panel[hidden] { display: none; }
.emoji-tabs { display: flex; border-bottom: 1px solid #E9EDEF; padding: 4px 6px 0; gap: 2px; flex: 0 0 auto; }
.emoji-tabs button { flex: 1; border: 0; background: none; font-size: 19px; padding: 6px 0 7px; cursor: pointer; border-bottom: 3px solid transparent; filter: grayscale(.6); }
.emoji-tabs button.activo { border-bottom-color: #00A884; filter: none; }
.emoji-grilla { flex: 1; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); padding: 6px; align-content: start; }
.emoji-grilla button { border: 0; background: none; font-size: 25px; line-height: 1; padding: 6px 0; border-radius: 8px; cursor: pointer; }
.emoji-grilla button:hover { background: #F0F2F5; }
/* Anotador y Ayuda en la bandeja: el Anotador se corre arriba a la derecha (no tapa el botón de enviar) */
@media (min-width: 901px) {
  /* Mensajes y ayuda: un círculo 💬 arriba a la derecha; el Anotador, a su izquierda */
  body:has(.wz) .ayuda-flotante { top: 24px; right: 30px; bottom: auto; padding: 0; width: 44px; height: 44px; justify-content: center; font-size: 0; gap: 0; }
  body:has(.wz) .ayuda-flotante > span:first-child { width: 44px; height: 44px; font-size: 20px; background: transparent; }
  body:has(.wz) .ayuda-flotante .ayuda-badge { position: absolute; top: -4px; right: -4px; font-size: 11px; margin: 0; }
  body:has(.wz) .anf:not(.abierto) { top: 25px !important; right: 84px !important; left: auto !important; bottom: auto !important; }
  body:has(.wz.con-chat) .wz-cab { padding-right: 250px; }
}
/* Celular: una sola columna (la lista o el chat), a pantalla completa */
@media (max-width: 900px) {
  .main:has(> .wz) { padding: 0 !important; }
  .wz { grid-template-columns: 1fr; height: 100dvh; border: 0; border-radius: 0; box-shadow: none; min-height: 0; }
  html.es-app .wz { height: calc(100dvh - env(safe-area-inset-bottom)); }
  .wz.con-chat .wz-lista { display: none; }
  .wz:not(.con-chat) .wz-chat { display: none; }
  .wz-lista-cab { padding: 8px 8px 4px 6px; }
  .wz-lista-cab .menu-movil { display: inline-flex; }
  .wz-volver { display: inline-flex; margin-left: -8px; }
  .wz-cab { padding: 6px 6px 6px 10px; gap: 8px; }
  .wz-msjs { padding: 10px 10px 8px; }
  .wz-m { max-width: 86%; }
  .wz-escribir { padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); }
  .wz-escribir .wz-ico { width: 38px; height: 40px; }
  body:has(.wz) .anf, body:has(.wz) .ayuda-flotante, body:has(.wz) [data-ayuda-abrir].flotante, body:has(.wz) .pwa-cartel { display: none !important; }
  .wz-lista-cab .ayuda-en-lista { display: inline-flex !important; }
  .wz-cerrada { flex-direction: column; align-items: stretch; text-align: left; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
}
.nav-badge.wa-nav { background: #25A35A; }

/* WhatsApp en la ficha del huésped */
.wa-ficha { margin-top: 18px; }
.wa-ficha-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.wa-ficha-ico { width: 40px; height: 40px; border-radius: 50%; background: #25D366; color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.wa-ficha-tit { flex: 1; min-width: 200px; }
.wa-ficha-tit h2 { margin: 0; }
.btn.wa-ficha-abrir { background: #00A884; border-color: #00A884; color: #fff; }
.btn.wa-ficha-abrir:hover { background: #008069; border-color: #008069; }
.wa-ficha-cuerpo { margin-top: 14px; align-items: start; }
.wa-ficha-sub { font-size: 14px; margin: 0 0 8px; }
.wa-ficha-pls { border-radius: 10px; padding: 10px; max-height: 420px; }

/* ---------- Configurar WhatsApp y plantillas ---------- */
.wa-estado { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-bottom: 18px; }
.wa-estado-item { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--borde); border-radius: var(--radio); padding: 14px 16px; box-shadow: var(--sombra); color: inherit; text-decoration: none; }
a.wa-estado-item:hover { border-color: #00A884; text-decoration: none; }
.wa-estado-item b { display: block; font-size: 13px; color: var(--texto-2); font-weight: 600; }
.wa-estado-item span:not(.wa-estado-ico) { display: block; font-size: 15px; font-weight: 600; }
.wa-estado-ico { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; background: #ECEAE6; color: var(--texto-2); }
.wa-estado-ico.ok { background: #DCF5E6; color: #008069; }
.wa-estado-ico.mal { background: var(--coral-suave); color: var(--coral-osc); }
.wa-estado-ico.alerta { background: #25D366; color: #fff; }
.wa-opcion { display: flex; gap: 10px; align-items: flex-start; border: 2px solid var(--borde); border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; cursor: pointer; font-weight: 400; }
.wa-opcion.elegida, .wa-opcion:has(input:checked) { border-color: #00A884; background: #F2FBF7; }
.wa-opcion input { width: auto; margin-top: 3px; }
.wa-opcion:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.wa-mini-burbuja { margin: 8px 0 10px; background: #D9FDD3; border-radius: 8px; padding: 8px 10px; font-size: 13px; line-height: 1.4; white-space: pre-line; max-height: 140px; overflow: auto; box-shadow: 0 1px .5px rgba(11,20,26,.13); }
.wa-detalles { margin: 10px 0; }
.wa-detalles summary { cursor: pointer; font-weight: 600; font-size: 14px; color: var(--texto-2); }
.wa-pl-filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 16px; }
.wa-pl-filtros button { border: 1px solid var(--borde); background: #fff; border-radius: 99px; padding: 6px 13px; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; color: var(--grafito); }
.wa-pl-filtros button span { color: var(--texto-2); font-weight: 500; margin-left: 2px; }
.wa-pl-filtros button.activo { background: var(--grafito); color: #fff; border-color: var(--grafito); }
.wa-pl-filtros button.activo span { color: #C9CED3; }
.wa-pl-filtros input { width: auto; flex: 1; min-width: 160px; max-width: 280px; margin-left: auto; }
.wa-pl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; align-items: start; }
.wa-pl-card { background: #fff; border: 1px solid var(--borde); border-radius: 14px; overflow: hidden; box-shadow: var(--sombra); display: flex; flex-direction: column; }
.wa-pl-card[hidden] { display: none; }
.wa-pl-card header { padding: 14px 16px 10px; }
.wa-pl-nombre { font-weight: 700; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13.5px; word-break: break-all; margin-bottom: 6px; }
.wa-pl-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.wa-pl-estado { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 12px; font-weight: 700; background: #ECEAE6; color: var(--texto-2); }
.wa-pl-estado.ok { background: #DCF5E6; color: #008069; }
.wa-pl-estado.espera { background: var(--alerta-suave); color: var(--alerta); }
.wa-pl-estado.mal { background: var(--coral-suave); color: var(--coral-osc); }
.wa-pl-vista { background: #EFEAE2; padding: 14px 16px 16px; flex: 1; }
.wa-burbuja-pl { background: #fff; border-radius: 8px; border-top-left-radius: 0; padding: 4px 4px 6px; box-shadow: 0 1px .5px rgba(11,20,26,.13); max-width: 330px; font-size: 13.5px; line-height: 1.4; position: relative; overflow-wrap: anywhere; }
.wa-burbuja-pl.grande { max-width: none; font-size: 14.2px; }
.wa-burbuja-pl img { display: block; width: 100%; max-height: 180px; object-fit: cover; border-radius: 6px; margin-bottom: 4px; }
.wa-burbuja-pl img[hidden] { display: none; }
.wa-pl-titulo { font-weight: 700; padding: 2px 6px; }
.wa-pl-cuerpo { padding: 2px 6px; }
.wa-pl-pie { font-size: 12px; color: #667781; padding: 4px 6px 0; }
.wa-pl-hora { font-size: 11px; color: #667781; text-align: right; padding: 0 6px; }
.wa-pl-titulo[hidden], .wa-pl-pie[hidden] { display: none; }
.wa-pl-boton { background: #fff; color: #027EB5; text-align: center; font-size: 14px; font-weight: 500; border-radius: 8px; padding: 8px; margin-top: 3px; max-width: 330px; box-shadow: 0 1px .5px rgba(11,20,26,.13); }
.wa-var { display: inline-block; background: #E7F1FF; color: #1F4FA8; border-radius: 6px; padding: 0 5px; font-size: .92em; font-weight: 600; }
.wa-var.mal { background: var(--coral-suave); color: var(--coral-osc); }
.wa-var-ej { background: #FFF3C4; border-radius: 4px; padding: 0 2px; }
.wa-pl-card footer { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 10px 14px; border-top: 1px solid var(--borde); }
.wa-pl-usar { margin-left: auto; }
.wa-pl-usar select { width: auto; font-size: 13px; padding: 5px 8px; }
/* Editor de plantillas */
.wa-pf { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 20px; align-items: start; }
.wa-pf-sec { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--borde); }
.wa-pf-sec h3 { margin: 0 0 10px; font-size: 15px; }
.wa-pf-sec h3 .mini { font-weight: 400; }
.wa-seg { display: inline-flex; border: 1px solid var(--borde); border-radius: 10px; overflow: hidden; margin-bottom: 10px; }
.wa-seg button { border: 0; background: #fff; padding: 7px 14px; font: inherit; font-size: 13.5px; cursor: pointer; color: var(--texto); }
.wa-seg button + button { border-left: 1px solid var(--borde); }
.wa-seg button.activo { background: var(--grafito); color: #fff; }
.wa-opcion-chica { display: flex; gap: 8px; align-items: center; font-weight: 400; margin: 4px 0; }
.wa-opcion-chica input { width: auto; margin: 0; }
.wa-pf-barra { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-bottom: 8px; }
.wa-pf-herr { border: 1px solid var(--borde); background: #fff; border-radius: 8px; width: 34px; height: 32px; font-size: 16px; cursor: pointer; }
.wa-pf-sep { width: 1px; height: 22px; background: var(--borde); margin: 0 4px; }
.wa-pf-var { border: 1px solid #C9DCF7; background: #E7F1FF; color: #1F4FA8; border-radius: 99px; padding: 4px 10px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.wa-pf-var:hover { background: #D6E7FF; }
.wa-pf-pie-texto { display: flex; justify-content: space-between; gap: 10px; margin-top: 4px; }
.wa-pf-boton { display: grid; grid-template-columns: 170px 1fr 1fr auto; gap: 6px; margin-bottom: 8px; align-items: center; }
.wa-pf-boton:has(> :nth-child(3):last-child) { grid-template-columns: 170px 1fr auto; }
.wa-pf-vista { position: sticky; top: 16px; }
.wa-tel { background: #EFEAE2; border-radius: 22px; overflow: hidden; border: 8px solid #111B21; box-shadow: 0 16px 40px rgba(0,0,0,.18); }
.wa-tel-cab { display: flex; align-items: center; gap: 10px; background: #008069; color: #fff; padding: 10px 12px; }
.wa-tel-cab .wa-av { width: 34px; height: 34px; border-radius: 50%; background: #fff; color: var(--coral); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
.wa-tel-cab div { display: flex; flex-direction: column; font-size: 14px; }
.wa-tel-cab span { font-size: 11.5px; opacity: .85; }
.wa-tel-fondo { padding: 16px 14px 22px; min-height: 380px; }
.wa-pf-ejemplo { display: flex; gap: 6px; align-items: center; justify-content: center; margin-top: 10px; font-weight: 400; }
.wa-pf-ejemplo input { width: auto; margin: 0; }
@media (max-width: 1100px) { .wa-pf { grid-template-columns: 1fr; } .wa-pf-vista { position: static; max-width: 420px; } }
@media (max-width: 600px) { .wa-pf-boton, .wa-pf-boton:has(> :nth-child(3):last-child) { grid-template-columns: 1fr auto; } .wa-pf-boton select { grid-column: 1 / -1; } }

/* Aviso de mensaje nuevo de WhatsApp (arriba, en cualquier pantalla) */
.wa-aviso { position: fixed; top: 14px; left: 50%; transform: translateX(-50%); z-index: 80; display: flex; align-items: center; gap: 6px; max-width: min(460px, calc(100vw - 24px));
  background: #1F7A3A; color: #fff; border-radius: 14px; padding: 10px 8px 10px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.3); animation: wa-entra .25s ease-out, anf-parpadeo 1s steps(1, end) 6; }
.wa-aviso[hidden] { display: none; }
.wa-aviso a { display: flex; gap: 10px; align-items: center; color: #fff; text-decoration: none; min-width: 0; }
.wa-aviso-ico { font-size: 22px; }
.wa-aviso-txt { font-size: 13px; opacity: .9; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wa-aviso-x { background: none; border: 0; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; padding: 0 6px; align-self: flex-start; }
@keyframes wa-entra { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translate(-50%, 0); } }
.nav-badge.wa-nav.alerta { animation: anf-parpadeo .7s steps(1, end) infinite; }
@keyframes wa-parpadeo { 0%, 100% { background: #25A35A; color: #fff; } 50% { background: #FFD43B; color: var(--grafito); } }
.nav-badge.wa-nav.alerta { animation: wa-parpadeo .7s steps(1, end) infinite; }
.wa-aviso { animation: wa-entra .25s ease-out, wa-parpadeo 1s steps(1, end) 6; }
.filtros input.buscar-ancho { flex: 1 1 320px; }

/* Página pública de política de privacidad */
.legal { max-width: 760px; margin: 0 auto; padding: 32px 20px 60px; line-height: 1.6; }
.legal-logo { width: 220px; max-width: 70%; display: block; margin: 0 0 24px; }
.legal h1 { font-size: 1.7rem; margin: 0 0 4px; }
.legal h2 { font-size: 1.15rem; margin: 28px 0 8px; }
.legal ul, .legal ol { padding-left: 22px; }
.legal li { margin-bottom: 4px; }
.legal hr { border: 0; border-top: 1px solid var(--borde); margin: 36px 0 0; }

/* ---------- Check-in online y mensajes automáticos ---------- */
.auto-regla { border: 1px solid var(--linea, #ECE6DD); border-radius: 14px; padding: 12px 14px; margin-bottom: 10px; background: #fff; }
.auto-regla.activa { border-color: #BFE0CD; background: #F6FBF8; }
.auto-cab { display: flex; gap: 12px; align-items: flex-start; }
.auto-pie { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-top: 8px; padding-left: 52px; }
.auto-cuando { font-size: 13px; color: var(--texto-2); display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.auto-cuando input[type=number] { width: 64px; padding: 4px 6px; }
.auto-cuando input[type=time] { width: auto; padding: 4px 6px; }
.auto-texto { white-space: pre-wrap; background: var(--marfil, #F7F4EF); border-radius: 10px; padding: 10px 12px; margin-top: 6px; color: var(--grafito); }
.auto-regla details { margin: 8px 0 0 52px; }
.auto-switch { position: relative; width: 40px; height: 24px; flex: none; margin-top: 2px; }
.auto-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.auto-switch span { position: absolute; inset: 0; background: #CFC8BE; border-radius: 99px; cursor: pointer; transition: background .15s; }
.auto-switch span::after { content: ''; position: absolute; width: 18px; height: 18px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.auto-switch input:checked + span { background: #2E7D5B; }
.auto-switch input:checked + span::after { transform: translateX(16px); }
.auto-switch input:disabled + span { cursor: default; opacity: .6; }
.auto-switch input:focus-visible + span { outline: 3px solid var(--coral); outline-offset: 2px; }
.guias-faltan { display: flex; flex-wrap: wrap; gap: 6px; }
.guias-faltan .chip { text-decoration: none; }
.form-guia label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 10px; color: var(--grafito); }
.form-guia label input, .form-guia label textarea { display: block; width: 100%; margin-top: 4px; font-weight: 400; }
.form-guia label.check { display: flex; gap: 8px; align-items: center; font-weight: 400; }
.form-guia label.check input { width: auto; margin: 0; }
td.centro { text-align: center; }
.lista-scroll { max-height: 520px; overflow-y: auto; margin: 0 -4px; padding: 0 4px; }
.wz-pedidos { background: #FFF8E6; border-bottom: 1px solid #F0E2B6; padding: 8px 14px; display: flex; flex-direction: column; gap: 6px; }
.wz-pedido { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13.5px; }
.wz-pedido > span { flex: 1; min-width: 200px; }
.wz-pedido form { display: inline; margin: 0; }
/* Agente de IA de la web: estado y respuesta sugerida */
.wz-agente { background: #EEF3FB; border-bottom: 1px solid #D5E0F2; padding: 8px 14px; display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.wz-agente-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.wz-agente-sug { background: #fff; border: 1px solid #D5E0F2; border-radius: 8px; padding: 8px 10px; }
.wz-agente-txt { max-height: 160px; overflow: auto; line-height: 1.4; margin-bottom: 8px; }
.wz-agente-acc { display: flex; gap: 6px; flex-wrap: wrap; }
.wz-libre { color: #2E7D5B; font-weight: 600; }
.wz-ocupado { color: #C2364F; font-weight: 600; }
.ck-claves-staff { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: var(--marfil, #F7F4EF); border-radius: 12px; padding: 10px 12px; margin-top: 12px; font-size: 13.5px; }
.ck-claves-staff span { flex: 1; min-width: 200px; }
.ck-claves-staff form { display: inline; margin: 0; }

/* ---------- Adjuntos: facturas, comprobantes y fotos de tareas ---------- */
.campo-adjuntos { margin: 6px 0 4px; padding: 12px 14px; border: 1.5px dashed #D9D3CA; border-radius: 12px; background: var(--marfil, #F7F4EF); }
.campo-adjuntos label { display: block; font-weight: 600; font-size: 13.5px; margin-bottom: 6px; }
.adjuntos-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; }
.adjunto { position: relative; border: 1px solid #ECE6DD; border-radius: 12px; overflow: hidden; background: #fff; }
.adjunto a { display: block; color: inherit; text-decoration: none; }
.adjunto img { display: block; width: 100%; height: 96px; object-fit: cover; background: #F7F4EF; }
.adjunto-pdf { display: grid; place-items: center; height: 96px; background: #FBE7EA; color: #C2364F; font-weight: 800; font-size: 20px; letter-spacing: .05em; }
.adjunto-nombre { display: block; font-size: 11.5px; padding: 5px 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--texto-2); }
.adjunto form { position: absolute; top: 5px; right: 5px; margin: 0; }
.adjunto-x { width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(37,43,49,.75); color: #fff; font-size: 15px; line-height: 1; cursor: pointer; }
.adjunto-x:hover { background: #C2364F; }
/* Panel de housekeeping (lo primero que ve quien limpia) */
.panel-hkdia { margin-bottom: 18px; border-top: 4px solid #FF9900; }
.panel-hkdia-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.panel-hkdia-cab h2 { margin: 0; flex: 1; }
.panel-progreso.grande { display: block; height: 10px; margin: 0 0 12px; }
.hkdia-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(330px, 100%), 1fr)); gap: 8px; }
.hkdia-fila { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #ECE6DD; border-radius: 12px; background: #fff; }
.hkdia-fila.listo { background: #EAF5EF; border-color: #BFE0CD; }
.hkdia-fila.listo .hkdia-unidad { text-decoration: line-through; color: var(--texto-2); }
.hkdia-unidad { font-weight: 700; font-size: 15px; min-width: 120px; }
.hkdia-info { flex: 1; font-size: 13px; color: var(--texto-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hkdia-listo { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; cursor: pointer; white-space: nowrap; }
.hkdia-listo input { width: 22px; height: 22px; accent-color: #2E7D5B; }

/* Facturación */
.fac-items input, .fac-items select { width: 100%; min-width: 0; }
.fac-totales { margin: 10px 0 16px auto; max-width: 340px; font-variant-numeric: tabular-nums; }
.fac-totales div { display: flex; justify-content: space-between; padding: 3px 0; }
.fac-totales .fac-total { border-top: 1px solid var(--borde); margin-top: 4px; padding-top: 6px; font-weight: 800; font-size: 17px; }
.fac-hoja { background: #fff; border: 1px solid var(--borde); border-radius: var(--radio); padding: 24px; max-width: 900px; color: #111; position: relative; }
.fac-prueba { text-align: center; font-weight: 800; color: #B3261E; letter-spacing: .06em; border: 2px dashed #B3261E; padding: 6px; margin-bottom: 14px; }
.fac-cab { display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px; border-bottom: 2px solid #111; padding-bottom: 14px; }
.fac-logo { height: 34px; margin-bottom: 6px; }
.fac-emisor p, .fac-datos p { margin: 4px 0; font-size: 13.5px; line-height: 1.45; }
.fac-letra { width: 64px; height: 70px; border: 2px solid #111; display: flex; flex-direction: column; align-items: center; justify-content: center; align-self: start; }
.fac-letra b { font-size: 38px; line-height: 1; }
.fac-letra span { font-size: 10px; }
.fac-datos h1 { font-size: 20px; margin: 0 0 6px; }
.fac-bloque { border-bottom: 1px solid #ccc; padding: 12px 0; }
.fac-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px 18px; font-size: 13.5px; }
.fac-grid span, .fac-obs span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #666; }
.fac-tabla { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 13.5px; table-layout: auto; }
.fac-tabla td:first-child { white-space: normal; overflow-wrap: anywhere; width: 100%; }
.fac-tabla th { text-align: left; font-size: 11px; text-transform: uppercase; color: #555; border-bottom: 1px solid #111; padding: 6px; }
.fac-tabla td { border-bottom: 1px solid #e5e5e5; padding: 7px 6px; vertical-align: top; }
.fac-tabla .num { text-align: right; white-space: nowrap; }
.fac-pie { display: grid; grid-template-columns: 1fr 340px; gap: 20px; }
.fac-obs p { margin: 4px 0; font-size: 13px; }
.fac-suma div { display: flex; justify-content: space-between; gap: 10px; padding: 3px 0; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.fac-suma .fac-total { border-top: 2px solid #111; margin-top: 4px; padding-top: 6px; font-weight: 800; font-size: 18px; }
.fac-suma .mini { font-size: 11.5px; color: #444; }
.fac-cae { display: flex; gap: 16px; align-items: center; border-top: 1px solid #ccc; margin-top: 16px; padding-top: 14px; font-size: 13px; }
@media (max-width: 700px) { .fac-cab, .fac-pie { grid-template-columns: 1fr; } .fac-letra { order: -1; } }
@media print { .fac-hoja { border: 0; padding: 0; max-width: none; } }
.pasos-cert li { margin: 8px 0; line-height: 1.5; }

.hk-difiere { font-size: 11px; color: #8A1F33; background: #FDECEE; border-radius: 4px; padding: 1px 4px; margin-top: 2px; white-space: normal; }

/* Bloqueos de Cloudbeds en el calendario (estadías cargadas allá como bloqueo) */
.tl-barra.tl-bloqueo { background: repeating-linear-gradient(135deg, #D9D4CC, #D9D4CC 6px, #E6E1D9 6px, #E6E1D9 12px); color: #3D4349; cursor: default; }

.auditor-banda { background: #252B31; color: #fff; padding: 8px 14px; border-radius: 10px; margin-bottom: 14px; font-size: 14px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.auditor-banda .btn { background: #fff; }

/* ---------- Pestañas en la misma página (ficha de la reserva) ---------- */
.tab-panel[hidden] { display: none; }
.pila { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.pila > .card, .pila > .card + .card { margin-top: 0 !important; }
.sub-h { font-size: 12.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); margin: 20px 0 6px; }
@media print { .tab-panel[hidden] { display: block; } }
.wa-estado.tira-5 { grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); }
.wa-estado.tira-5 .wa-estado-item { padding: 12px 14px; gap: 10px; }
.wa-estado.tira-5 .wa-estado-ico { width: 32px; height: 32px; }
.wa-estado.tira-5 .wa-estado-item span:not(.wa-estado-ico) { font-size: 14px; }

/* Listados: los textos largos se cortan (se ven enteros al pasar el mouse) para que la tabla entre en la pantalla */
td.txt-corto { max-width: 190px; overflow: hidden; text-overflow: ellipsis; }
.tabla-wrap th, .tabla-wrap td { padding-left: 10px; padding-right: 10px; }
.tabla-wrap th { white-space: normal; letter-spacing: .03em; vertical-align: bottom; line-height: 1.3; }
.devolver-mp summary { cursor: pointer; color: var(--coral-osc); }
.devolver-form { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; margin-top: 8px; }
.devolver-form label { display: flex; flex-direction: column; gap: 3px; }
.devolver-form input { width: 160px; }
.limpieza-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.limpieza-form select { width: auto; }
.importes-form { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.importes-form label { display: flex; flex-direction: column; gap: 3px; }
.importes-form input { width: 120px; }
.importes-mas { font-size: 18px; font-weight: 700; color: var(--texto-2); padding-bottom: 8px; }
.importes-total { display: flex; flex-direction: column; gap: 3px; padding-bottom: 6px; min-width: 110px; }
.importes-total b { font-size: 16px; }

/* ---------- Asistente IA en el panel de Ayuda ---------- */
.ayuda-modos { display: flex; gap: 6px; padding: 0 16px 10px; }
.ayuda-modos button { flex: 1; padding: 7px 10px; border-radius: 99px; border: 1px solid var(--borde); background: var(--blanco); font: inherit; font-weight: 600; font-size: 13.5px; cursor: pointer; }
.ayuda-modos button.activo { background: var(--grafito); border-color: var(--grafito); color: #fff; }
.asis { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 0 16px 12px; gap: 8px; }
.asis[hidden] { display: none; }
.asis-msgs { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; }
.asis-msg { padding: 9px 12px; border-radius: 12px; font-size: 14px; line-height: 1.5; max-width: 92%; }
.asis-msg p { margin: 0 0 6px; } .asis-msg p:last-child { margin-bottom: 0; }
.asis-msg ul { margin: 4px 0; padding-left: 18px; }
.asis-msg.user { align-self: flex-end; background: var(--grafito); color: #fff; white-space: pre-wrap; }
.asis-msg.assistant { align-self: flex-start; background: #F3F0EB; }
.asis-msg.esperando { color: var(--texto-2); font-style: italic; }
.asis-msg.error { align-self: flex-start; background: var(--coral-suave); color: var(--coral-osc); }
.asis-arch { display: block; font-size: 12.5px; opacity: .85; margin-bottom: 4px; }
.asis-clip { display: flex; align-items: center; justify-content: center; font-size: 20px; cursor: pointer; padding: 0 4px; user-select: none; }
.asis-adjunto { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: #F3F0EB; border-radius: 8px; padding: 6px 10px; font-size: 13px; margin-bottom: 6px; }
.asis-adjunto button { border: 0; background: none; cursor: pointer; font-size: 14px; }
.asis-form { display: flex; gap: 6px; align-items: flex-end; }
.asis-form textarea { flex: 1; resize: none; font: inherit; font-size: 14px; }
.asis-form.esperando button { opacity: .5; pointer-events: none; }
.asis-pie { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; color: var(--texto-2); }
.ayuda-cuerpo[hidden], .ayuda-buscar[hidden], .ayuda-modos button[hidden] { display: none; }

/* ---------- Visor de fotos, PDF, videos y audios ---------- */
.visor { position: fixed; inset: 0; z-index: 2000; background: rgba(20, 24, 28, .94); display: flex; align-items: center; justify-content: center; }
.visor[hidden] { display: none; }
body.visor-abierto { overflow: hidden; }
.visor-barra { position: absolute; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; color: #fff; font-size: 14px; background: linear-gradient(rgba(0,0,0,.45), transparent); }
.visor-titulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.visor-acc { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }
.visor-acc a, .visor-cerrar { color: #fff; background: rgba(255,255,255,.14); border: 0; border-radius: 99px; padding: 7px 12px; font: inherit; font-size: 13px; text-decoration: none; cursor: pointer; }
.visor-acc a:hover, .visor-cerrar:hover { background: rgba(255,255,255,.26); }
.visor-cont { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 56px 64px 24px; box-sizing: border-box; }
.visor-cont img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; box-shadow: 0 10px 40px rgba(0,0,0,.4); }
.visor-cont iframe { width: min(1000px, 100%); height: 100%; border: 0; border-radius: 6px; background: #fff; }
.visor-cont video { max-width: 100%; max-height: 100%; }
.visor-cargando, .visor-nada { color: #ddd; text-align: center; line-height: 1.6; }
.visor-nada a { color: #fff; }
.visor-flecha { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; border: 0; background: rgba(255,255,255,.14); color: #fff; font-size: 28px; line-height: 1; cursor: pointer; }
.visor-flecha:hover { background: rgba(255,255,255,.26); }
.visor-flecha.ant { left: 10px; } .visor-flecha.sig { right: 10px; }
.visor-flecha[hidden] { display: none; }
@media (max-width: 700px) { .visor-cont { padding: 52px 8px 12px; } .visor-flecha { top: auto; bottom: 14px; transform: none; } .visor-acc .visor-nueva { display: none; } }
.fotos-sel-botones { display: flex; gap: 8px; flex-wrap: wrap; }
.fotos-sel-botones .btn { cursor: pointer; }
.fotos-sel-lista { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.fotos-sel-lista:empty { display: none; }
.fotos-sel-item { position: relative; width: 72px; height: 72px; border-radius: 8px; overflow: hidden; background: #ECEAE6; display: flex; align-items: center; justify-content: center; }
.fotos-sel-item img { width: 100%; height: 100%; object-fit: cover; }
.fotos-sel-item button { position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(0,0,0,.6); color: #fff; font-size: 12px; cursor: pointer; line-height: 1; }

/* Accesos a plataformas */
.plat-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.plat-dato { font-size: 14px; background: var(--fondo-2, #F3EFE8); padding: 2px 8px; border-radius: 6px; word-break: break-all; }
.seccion-tit { font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2, #6B7279); margin: 18px 0 10px; }

/* Cerraduras: qué abre cada una */
.cer-dev { border-top: 1px solid var(--linea, #ECE6DD); padding: 10px 0; }
.cer-dev summary { cursor: pointer; }
.cer-unidades { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; }
.cer-unidades .check { font-size: 13.5px; }
.cer-grupo { flex-basis: 100%; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2, #6B7279); margin-top: 6px; }

/* Mensajero interno (usa el diseño de la bandeja de WhatsApp) */
.msj-autor { font-size: 12.5px; font-weight: 600; margin-bottom: 2px; }
.msj-tick { font-size: 11px; color: #8696A0; } .msj-tick.leido { color: #53BDEB; }
.msj-personas { display: flex; flex-direction: column; gap: 4px; max-height: 50vh; overflow: auto; margin: 10px 0; }
.msj-persona { display: flex; gap: 8px; align-items: center; text-align: left; padding: 9px 12px; border: 1px solid var(--borde, #E3E0DA); border-radius: 8px; background: #fff; cursor: pointer; font: inherit; }
.msj-persona:hover { background: #F5F6F6; }

/* Mensajes dentro del panel de ayuda */
.ayuda-flotante .ayuda-badge, .ayuda-movil .ayuda-badge { position: static; margin-left: 4px; }
.ayuda-modos .pmsj-badge { margin-left: 4px; }
.pmsj { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.pmsj-lista { flex: 1; overflow-y: auto; padding: 4px 0; }
.pmsj-item { display: flex; gap: 10px; align-items: center; width: 100%; text-align: left; border: 0; background: none; padding: 9px 14px; cursor: pointer; font: inherit; border-bottom: 1px solid #F0EEEA; }
.pmsj-item:hover { background: #F7F5F2; }
.pmsj-item.sin-leer b { font-weight: 800; }
.pmsj-av { flex: none; width: 36px; height: 36px; border-radius: 50%; background: #E9E4DC; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }
.pmsj-item-c { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pmsj-item-c small { color: var(--texto-2, #6B7280); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pmsj-item-r { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; color: var(--texto-2, #6B7280); }
.pmsj-chat { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.pmsj-cab { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid #EEE; }
.pmsj-cab b { flex: 1; }
.pmsj-volver { border: 0; background: none; font-size: 22px; cursor: pointer; line-height: 1; }
.pmsj-full { text-decoration: none; font-size: 16px; }
.pmsj-msjs { flex: 1; overflow-y: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; background: #EFEAE2; }
.pmsj-m { max-width: 85%; padding: 6px 9px 4px; border-radius: 10px; font-size: 14px; line-height: 1.4; display: flex; flex-direction: column; box-shadow: 0 1px 1px rgba(0,0,0,.06); word-wrap: break-word; }
.pmsj-m.in { align-self: flex-start; background: #fff; }
.pmsj-m.out { align-self: flex-end; background: #D9FDD3; }
.pmsj-m small { align-self: flex-end; font-size: 11px; color: #667781; }
.pmsj-m img { max-width: 100%; border-radius: 6px; margin-bottom: 3px; }
.pmsj-autor { font-size: 12px; color: #1F7A5A; }
.pmsj-form { display: flex; gap: 6px; align-items: flex-end; padding: 8px 10px; border-top: 1px solid #EEE; }
.pmsj-form textarea { flex: 1; resize: none; min-height: 38px; max-height: 120px; }
.pmsj-pie { padding: 10px 14px; border-top: 1px solid #EEE; font-size: 13px; }

/* Los contadores ocultos no se muestran aunque el estilo les dé otro display */
.nav-badge[hidden] { display: none !important; }

/* Mensajes y ayuda en la cabecera de la lista de chats (solo en el celular) */
.ayuda-en-lista { display: none !important; position: relative; font-size: 20px; }
.ayuda-en-lista .ayuda-badge { position: absolute; top: 0; right: -2px; font-size: 10px; }
/* Sonido de las alertas (Mi cuenta) */
.sonidos-sub { font-size: 14px; margin: 14px 0 6px; }
.sonidos-grilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.sonidos-grilla label { display: flex; flex-direction: column; gap: 3px; }
.sonidos-personas { margin-top: 12px; }
.sonidos-personas summary { cursor: pointer; margin-bottom: 6px; }
.sonidos-tabla select { max-width: 150px; font-size: 13px; }
#sonidos { min-width: 0; max-width: 100%; }
.grid > div:has(> #sonidos) { min-width: 0; }
#sonidos .lista-scroll { overflow-x: auto; max-width: 100%; }
#sonidos .sonidos-grilla select { width: 100%; min-width: 0; }
@media (max-width: 700px) { .sonidos-tabla select { max-width: 120px; } }
tr.gris td { color: #7d848b; }
/* Precios (grilla por día) */
.precios-wrap { overflow-x: auto; }
table.precios { border-collapse: collapse; font-size: 12px; min-width: max-content; }
table.precios th, table.precios td { padding: 4px 3px; text-align: center; border-bottom: 1px solid var(--borde, #e4e1db); min-width: 36px; white-space: nowrap; }
table.precios thead th { font-weight: 500; vertical-align: bottom; }
table.precios thead th span { display: block; font-size: 10px; color: var(--coral, #e0475e); text-transform: capitalize; min-height: 12px; }
table.precios thead th b { display: block; font-size: 13px; }
table.precios thead th small { display: block; font-size: 10px; color: #8a9097; }
table.precios .pr-u { position: sticky; left: 0; background: var(--fondo-card, #fff); text-align: left; padding-right: 10px; min-width: 110px; z-index: 1; font-weight: 600; }
table.precios .pr-fin { background: #f5f2ec; }
table.precios .pr-mes { border-left: 2px solid #c9c3b8; }
table.precios td i { display: block; font-style: normal; font-size: 9px; color: #b06a00; }
.pr-ocu { background: #fde3e5 !important; color: #a33; }
.pr-blq { background: #e8e8e8 !important; color: #777; }
.pr-sin { color: #bbb; }
.pr-ley { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: middle; }
.pr-unid { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; }
.pr-unid label { display: flex; align-items: center; gap: 4px; font-weight: 400; }
.pr-unid input { width: auto; }
.pr-aj { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0; }
.pr-aj label { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 400; margin: 0; }
.pr-aj input { width: 64px; padding: 4px 6px; }
.pr-ajt input { width: 70px; padding: 4px 6px; }
.pr-ajt th { font-size: 11px; font-weight: 500; text-align: left; }
.pr-ajt form { display: none; }
table.precios td[data-room] { cursor: cell; user-select: none; }
table.precios th[data-fila], table.precios th[data-col] { cursor: pointer; user-select: none; }
table.precios td.pr-sel { background: #2f6fde !important; color: #fff !important; }
table.precios td.pr-sel i { color: #fff; }
.pr-barra { position: sticky; bottom: 12px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: var(--fondo-card, #fff); border: 1px solid #c9d7f3; box-shadow: 0 6px 20px rgba(0,0,0,.12); border-radius: 14px; padding: 10px 14px; margin: 10px 0; }
.pr-barra[hidden] { display: none; }
.pr-barra select, .pr-barra input { width: auto; max-width: 160px; padding: 6px 8px; }
.pr-ajt tr.pr-todas td { background: #f5f2ec; }

/* Bloqueos: elegir unidades agrupadas por complejo */
.bq-unidades { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px 18px; }
.bq-grupo { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bq-grupo b { font-size: 14px; margin-bottom: 2px; }
.campo .bq-grupo label { display: flex; align-items: center; gap: 8px; font-weight: 400; font-size: 14px; margin: 0; padding: 3px 0; cursor: pointer; }
.bq-grupo input { margin: 0; width: 17px; height: 17px; accent-color: var(--coral); }
a.tl-barra.tl-bloqueo { cursor: pointer; text-decoration: none; }
.chip.tl-bloqueo { background: repeating-linear-gradient(135deg, #D9D4CC, #D9D4CC 6px, #E6E1D9 6px, #E6E1D9 12px); color: #3D4349; }

/* Bandeja: de qué canal es cada conversación (mismo color en la lista, la cabecera y los filtros) */
:root { --cn-whatsapp: #1DAA61; --cn-web: #252B31; --cn-airbnb: #FF385C; --cn-booking: #003B95; --cn-expedia: #F5B800; }
.cn { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 99px; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #fff; line-height: 17px; vertical-align: middle; white-space: nowrap; }
.cn-whatsapp { background: var(--cn-whatsapp); } .cn-web { background: var(--cn-web); } .cn-airbnb { background: var(--cn-airbnb); }
.cn-booking { background: var(--cn-booking); } .cn.cn-expedia { background: var(--cn-expedia); color: #1A2B49; }
.wz-item-r .wz-ahora { color: #00A884; font-weight: 600; margin-left: 4px; }
.wz-av-cn { position: relative; flex: 0 0 auto; display: inline-flex; }
.cn-punto { position: absolute; right: -1px; bottom: -1px; width: 15px; height: 15px; border-radius: 50%; border: 2px solid #fff; }
.cn-punto.cn-whatsapp { background: var(--cn-whatsapp); } .cn-punto.cn-web { background: var(--cn-web); } .cn-punto.cn-airbnb { background: var(--cn-airbnb); }
.cn-punto.cn-booking { background: var(--cn-booking); } .cn-punto.cn-expedia { background: var(--cn-expedia); }
.wz-filtros button.f-cn { background: #fff; box-shadow: inset 0 0 0 1.5px currentColor; }
.wz-filtros button.f-cn.cn-whatsapp { color: var(--cn-whatsapp); } .wz-filtros button.f-cn.cn-web { color: var(--cn-web); } .wz-filtros button.f-cn.cn-airbnb { color: var(--cn-airbnb); }
.wz-filtros button.f-cn.cn-booking { color: var(--cn-booking); } .wz-filtros button.f-cn.cn-expedia { color: #9A7300; }
.wz-filtros button.f-cn.activo { color: #fff; box-shadow: none; }
.wz-filtros button.f-cn.activo.cn-whatsapp { background: var(--cn-whatsapp); } .wz-filtros button.f-cn.activo.cn-web { background: var(--cn-web); } .wz-filtros button.f-cn.activo.cn-airbnb { background: var(--cn-airbnb); }
.wz-filtros button.f-cn.activo.cn-booking { background: var(--cn-booking); } .wz-filtros button.f-cn.activo.cn-expedia { background: var(--cn-expedia); color: #1A2B49; }
.wz-cab-info b .cn { margin-left: 6px; color: #fff; font-size: 11px; } .wz-cab-info b .cn.cn-expedia { color: #1A2B49; } /* (el «span» gris del encabezado la dejaba ilegible) */
.wz-idioma { font-size: 11.5px; font-weight: 500; color: #54656F; margin-left: 4px; }
/* Traductor */
.wz-trad { margin-top: 6px; padding: 6px 8px; border-radius: 6px; background: rgba(0, 0, 0, .045); border-left: 3px solid #53BDEB; font-size: .97em; }
.wz-trad-t { display: block; font-size: 11px; font-weight: 600; color: #3B6FB6; margin-bottom: 2px; }
.wz-trad-btn { font-size: 19px; line-height: 1; filter: grayscale(1); opacity: .65; }
.wz-trad-btn.prendido { filter: none; opacity: 1; }
.wz-trad-barra { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 14px; background: #E7F3FB; color: #1D4F7A; font-size: 13px; }
.wz-trad-barra[hidden] { display: none; }
.wz-trad-barra button { border: 0; background: none; color: #1D4F7A; font-weight: 700; cursor: pointer; text-decoration: underline; font: inherit; }

/* Bandeja: quién escribió cada mensaje de la empresa */
.wz-autor { font-size: 12px; font-weight: 700; color: #00795C; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.wz-autor span { font-weight: 500; color: #667781; }
.wz-autor.ia { color: #6B4FBB; }
.wz-autor.auto { color: #667781; }
.wz-autor.fuera { color: #B5651D; }

/* App en el celular: barra de pestañas abajo (como una app de mensajería). En la computadora no se ve. */
.tabbar { display: none; }
@media (max-width: 760px) {
  .tabbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 48; background: #fff; border-top: 1px solid var(--borde);
    padding: 4px 4px env(safe-area-inset-bottom); box-shadow: 0 -4px 18px rgba(37, 43, 49, .07); }
  .tabbar a, .tabbar button { flex: 1; min-width: 0; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    height: 54px; border: 0; background: none; color: #667781; font: inherit; font-size: 11px; font-weight: 600; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .tabbar .ico { width: 24px; height: 24px; }
  .tabbar a.activo { color: var(--coral); }
  .tabbar a.activo .ico { transform: scale(1.06); }
  .tabbar .tab-mas-grande .ico { width: 26px; height: 26px; background: #fff; }
  .tabbar .tab-mas-grande { color: var(--coral); }
  .tabbar .tab-mas-grande::before { content: ''; position: absolute; top: 2px; width: 40px; height: 32px; border-radius: 12px; background: var(--coral); z-index: -1; }
  .tabbar .tab-mas-grande { isolation: isolate; }
  .tab-badge { position: absolute; top: 3px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--coral);
    color: #fff; font-size: 11px; line-height: 18px; text-align: center; }
  .tab-badge.wa { background: #1DAA61; }
  .main { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  /* El Anotador flotante tapa la pantalla en el celular: queda en «Más → Anotador» (con su número en la pestaña) */
  .anf { display: none !important; }
  .pwa-cartel { bottom: calc(70px + env(safe-area-inset-bottom)); }
  /* Bandeja: con la lista se ve la barra; adentro de una conversación, pantalla completa (como WhatsApp) */
  .wz { height: calc(100dvh - 62px - env(safe-area-inset-bottom)); }
  html.es-app .wz { height: calc(100dvh - 62px - env(safe-area-inset-bottom)); }
  body:has(.wz.con-chat) .tabbar { display: none; }
  body:has(.wz.con-chat) .wz { height: 100dvh; }
  html.es-app body:has(.wz.con-chat) .wz { height: calc(100dvh - env(safe-area-inset-bottom)); }
  body:has(.wz) .main { padding-bottom: 0; }
}
@media (max-width: 420px) { .hkdia-fila { gap: 8px; padding: 10px; } .hkdia-unidad { min-width: 0; flex: 0 1 auto; max-width: 48%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .hkdia-info { flex: 1 1 0; } }
/* Celular angosto: los formularios de dos columnas (con columnas puestas en la página) pasan a una, y nada empuja el ancho */
@media (max-width: 520px) {
  .campos[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .grid { grid-template-columns: minmax(0, 1fr) !important; }
  .card { min-width: 0; }
  input, select, textarea { max-width: 100%; }
}
/* Reservas: llega hoy (verde) y se va hoy (naranja), para verlas de un vistazo */
.chip.entra-hoy { background: #1E8E5A; color: #fff; }
.chip.sale-hoy { background: #E8892B; color: #fff; }
/* Precios: multiplicadores por canal */
.multis { display: grid; gap: 10px; }
.multi { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--borde); border-radius: 10px; }
.multi .cn { min-width: 70px; justify-content: center; }
.multi input { width: 80px; }
.multi-pend { flex-basis: 100%; font-size: 13px; background: var(--alerta-suave); color: var(--alerta); padding: 8px 10px; border-radius: 8px; }
.wz-item-r.consulta { color: #B5651D; font-weight: 600; }
.bq-cambiar > summary { cursor: pointer; color: var(--coral); font-weight: 600; margin-bottom: 8px; }

/* ===== Módulo Reservas (Calendario · Lista · Bloqueos) ===== */
.rv-modulo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: -4px 0 16px; }
.rv-tabs { display: inline-flex; background: #EFEAE3; border-radius: 12px; padding: 4px; gap: 2px; }
.rv-tabs a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 9px; color: var(--texto-2); font-weight: 600; font-size: 14px; text-decoration: none; }
.rv-tabs a .ico { width: 17px; height: 17px; }
.rv-tabs a:hover { color: var(--texto); text-decoration: none; }
.rv-tabs a.activo { background: #fff; color: var(--grafito); box-shadow: 0 1px 3px rgba(37, 43, 49, .12); }
.rv-acciones { display: flex; gap: 8px; }
.rv-barra { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; margin-bottom: 12px; }
.rv-nav { display: flex; align-items: center; gap: 6px; }
.rv-mes { font-size: 17px; margin-left: 6px; text-transform: capitalize; }
.rv-filtros { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.rv-filtros select, .rv-filtros input[type=month] { width: auto; padding: 6px 10px; font-size: 13.5px; }
.rv-seg { display: inline-flex; border: 1px solid var(--borde); border-radius: 9px; overflow: hidden; background: #fff; }
.rv-seg a { padding: 6px 12px; font-size: 13px; font-weight: 600; color: var(--texto-2); text-decoration: none; border-right: 1px solid var(--borde); }
.rv-seg a:last-child { border-right: 0; }
.rv-seg a.activo { background: var(--grafito); color: #fff; }
.rv-kpis { display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.rv-kpi { background: #fff; border: 1px solid var(--borde); border-radius: 99px; padding: 4px 12px; font-size: 13px; color: var(--texto-2); }
.rv-kpi b { color: var(--texto); font-size: 14px; margin-right: 2px; }
.rv-kpi.entra b { color: #1E8E5A; } .rv-kpi.sale b { color: #C46A12; }
/* Línea de tiempo más limpia */
.rv-wrap { border-radius: 16px; box-shadow: 0 1px 2px rgba(37, 43, 49, .04), 0 6px 24px rgba(37, 43, 49, .05); }
.rv-tl .tl-u { flex-basis: 140px; width: 140px; font-size: 13px; }
.rv-tl .tl-grupo .tl-u { font-size: 11px; }
.rv-tl .tl-dia.hoy { background: var(--coral); border-radius: 0 0 8px 8px; }
.rv-tl .tl-celda { cursor: cell; }
.rv-tl .tl-fila.inactiva .tl-celda, .rv-tl .tl-fila[data-libre="0"] .tl-celda { cursor: default; }
.rv-tl .tl-celda.rv-sel { background: rgba(223, 70, 97, .16); box-shadow: inset 0 0 0 1px rgba(223, 70, 97, .45); }
.rv-hoy { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--coral); opacity: .55; pointer-events: none; z-index: 1; }
.rv-tl .tl-barra { top: 5px; height: 26px; line-height: 26px; border-radius: 8px; font-size: 12px; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); border-left: 3px solid currentColor; transition: transform .12s, box-shadow .12s; }
.rv-tl .tl-barra:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0, 0, 0, .12); filter: none; }
.rv-tl .tl-barra.corta-izq { border-left-width: 0; }
.rv-tl .tl-barra.entra-hoy { box-shadow: 0 0 0 2px #1E8E5A; }
.rv-tl .tl-barra.sale-hoy { box-shadow: 0 0 0 2px #E8892B; }
.rv-tl a.tl-barra.tl-bloqueo { border-left-color: #8C8C8C; cursor: pointer; }
.chip.rv-chip-entra { background: #fff; box-shadow: inset 0 0 0 2px #1E8E5A; color: #1E8E5A; }
.chip.rv-chip-sale { background: #fff; box-shadow: inset 0 0 0 2px #E8892B; color: #C46A12; }
/* Panel lateral */
.rv-velo { position: fixed; inset: 0; background: rgba(37, 43, 49, .18); z-index: 70; }
.rv-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); background: #fff; z-index: 71; box-shadow: -12px 0 40px rgba(37, 43, 49, .18);
  display: flex; flex-direction: column; transform: translateX(100%); transition: transform .18s ease-out; }
.rv-panel.abierto { transform: none; }
.rv-panel-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 18px; border-bottom: 1px solid var(--borde); font-size: 17px; }
.rv-x { border: 0; background: #F3EFE9; width: 34px; height: 34px; border-radius: 50%; font-size: 22px; line-height: 1; cursor: pointer; color: var(--texto); }
.rv-panel-cuerpo { padding: 16px 18px 28px; overflow-y: auto; flex: 1; }
.rv-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.rv-fechas { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; background: #F8F5F0; border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; }
.rv-fechas span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); font-weight: 700; }
.rv-fechas b { font-size: 17px; text-transform: capitalize; }
.rv-fechas small { display: block; font-size: 11.5px; color: var(--texto-2); }
.rv-fechas .rv-flecha { text-align: center; font-size: 18px; color: var(--texto-2); }
.rv-fechas.edit input { padding: 6px 8px; font-size: 14px; }
.rv-datos { display: grid; gap: 0; margin-bottom: 12px; }
.rv-dato { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #F0ECE6; font-size: 14px; }
.rv-dato span { color: var(--texto-2); }
.rv-dato b { font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.rv-notas { background: #FFFBEF; border: 1px solid #F3E6BF; border-radius: 10px; padding: 10px 12px; font-size: 13px; margin-bottom: 12px; }
.rv-botones { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 6px; }
.rv-bloquear { border: 1px solid var(--borde); border-radius: 12px; padding: 12px; margin: 16px 0 0; display: grid; gap: 8px; }
.rv-bloquear legend { font-weight: 700; padding: 0 6px; }
@media (max-width: 760px) {
  .rv-modulo { flex-direction: column; align-items: stretch; }
  .rv-tabs { width: 100%; overflow-x: auto; scrollbar-width: none; } .rv-tabs a { flex: 1 0 auto; justify-content: center; padding: 8px 8px; }
  .rv-acciones { justify-content: flex-end; }
  .rv-kpis { margin-left: 0; }
  .rv-tl .tl-u { flex-basis: 96px; width: 96px; font-size: 12px; }
  .rv-panel { width: 100vw; top: auto; height: 82dvh; border-radius: 18px 18px 0 0; transform: translateY(100%); }
  .rv-panel.abierto { transform: none; }
}
/* Precios en el calendario de Reservas */
.rv-tl .tl-celda { position: relative; display: flex; align-items: flex-end; justify-content: center; }
.rv-precio { font-style: normal; font-size: 10px; font-weight: 600; color: #9AA1A8; padding-bottom: 3px; pointer-events: none; letter-spacing: -.02em; }
.rv-precio sup { font-size: 8px; color: var(--coral); margin-left: 1px; }
.rv-tl .tl-celda.sin-precio { background-image: repeating-linear-gradient(135deg, transparent 0 5px, #F6F1EA 5px 7px); }
.rv-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rv-dos label { display: grid; gap: 3px; }
.rv-precio-form { border-color: #CFE3D6; background: #F7FBF8; }
/* Reseñas: Booking, nota privada, responder y para escribir */
.res-puntaje { font-weight: 800; font-size: 16px; } .res-puntaje small { font-size: 11px; color: var(--texto-2); font-weight: 600; }
.res-titulo { font-weight: 700; margin: 6px 0 2px; }
.res-privado { background: #FFF8E6; border: 1px dashed #E8C66A; border-radius: 10px; padding: 8px 12px; margin: 8px 0; }
.res-privado p { margin: 2px 0 0; font-size: 13.5px; }
.res-cats { color: #B5651D; margin: 4px 0; }
.res-responder { margin-top: 10px; border-top: 1px solid var(--borde); padding-top: 10px; }
.res-responder textarea, .res-pend textarea { min-height: 72px; }
.res-botones { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 6px; }
.res-botones select { width: auto; padding: 5px 8px; font-size: 13px; }
.res-pend-lista { display: grid; gap: 12px; }
.res-pend.urgente { border-left: 4px solid var(--coral); }
.res-pend .res-cab { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.res-plazo { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--texto-2); }
.res-notas { margin-bottom: 6px; font-size: 13.5px; }
.res-ia { display: grid; grid-template-columns: 1fr auto; gap: 6px; margin-bottom: 6px; }
.res-ia input { font-size: 13.5px; } .res-ia select { width: auto; padding: 6px 8px; font-size: 13px; }
@media (max-width: 600px) { .res-ia { grid-template-columns: 1fr; } }
/* Tarjeta de la reserva: cuánto cobrar */
.b24-cuenta { background: #F8F5F0; border-radius: 10px; padding: 10px 12px; margin: 8px 0; }
.b24-presets { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; align-items: center; }
.b24-noches { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; }
.b24-noches input { width: 60px; padding: 4px 6px; }
/* Grupos de reservas */
.grupo-res { border-left: 4px solid #6B4FBB; }
.grupo-cands { display: grid; gap: 6px; margin-bottom: 4px; }
.grupo-cands label { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-weight: 400; }

/* Horas trabajadas: un renglón por día, una columna por persona */
.horas-grilla td, .horas-grilla th { min-width: 96px; padding: 4px 6px; }
.horas-grilla tbody th { white-space: nowrap; font-weight: 500; text-align: left; }
.horas-grilla td.cargado input { font-weight: 600; background: #FFF8E6; }
.horas-grilla .horas-celda { padding: 4px 6px; font-size: 13.5px; width: 100%; }
.horas-grilla tfoot th { text-align: left; font-size: 12.5px; }
.horas-grilla tfoot td { font-size: 13.5px; }

.wz-pl-libre{display:flex;flex-direction:column;gap:8px;margin:-4px 0 10px;padding:10px;border:1px solid var(--borde,#ddd);border-radius:10px}
.wz-pl-libre textarea{width:100%;font:inherit;resize:vertical}
.wz-pl-libre .btn{align-self:flex-end}

/* Buscador del menú */
.nav-buscar { position: relative; margin: 0 4px 6px; }
.nav-buscar input { width: 100%; box-sizing: border-box; background: var(--grafito-2); border: 1px solid #4A525B; color: #fff; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13.5px; }
.nav-buscar input::placeholder { color: #8D969F; }
.nav-buscar input:focus { outline: none; border-color: var(--coral); }
.sidebar .nav a[hidden], .sidebar .nav[hidden], .sidebar .nav-group[hidden], .sidebar .equipo[hidden] { display: none !important; }
.nav a.nav-primero { outline: 2px solid var(--coral); outline-offset: -2px; }
.nav-sin { color: #8D969F; font-size: 13px; padding: 8px 10px; margin: 0; }
/* Promociones: días con precio promocional en la grilla de precios */
td.pr-promo { box-shadow: inset 0 -3px 0 var(--coral); }
.promo-card { display: grid; gap: 6px; }
.promo-card .promo-cab { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.promo-card .promo-cab h3 { margin: 0; font-size: 16px; }
.promo-form [data-para] { display: none; }
.promo-form .campo > .mini { display: block; margin-top: 3px; }
.promo-form .campo { margin-bottom: 12px; }
.promo-grid { align-items: start; }
@media (max-width: 900px) { .promo-grid { grid-template-columns: 1fr; } }
.promo-grid > .card { margin-top: 0; }
/* Bandeja: reacciones con emoji (como en WhatsApp: colgando abajo de la burbuja) */
.wz-fila { display: flex; align-items: center; gap: 4px; max-width: 100%; }
.wz-m.con-reac { margin-bottom: 14px; }
.wz-reac { position: absolute; bottom: -15px; left: 8px; display: flex; gap: 2px; background: #fff; border-radius: 12px; padding: 1px 5px; box-shadow: 0 1px 2px rgba(11,20,26,.2); font-size: 14px; line-height: 20px; cursor: default; }
.wz-m.out .wz-reac { left: auto; right: 8px; }
.wz-reac[data-wz-reaccionar] { cursor: pointer; }
.wz-reac-btn { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(255,255,255,.85); color: #54656f; font-size: 17px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .15s; box-shadow: 0 1px 2px rgba(11,20,26,.15); }
.wz-m:hover .wz-reac-btn, .wz-reac-btn:focus-visible { opacity: 1; }
@media (hover: none) { .wz-reac-btn { opacity: .7; } }
.wz-m { position: relative; }
.wz-reac-menu { position: absolute; z-index: 5; top: -44px; left: 0; display: flex; gap: 2px; background: #fff; border-radius: 22px; padding: 4px 6px; box-shadow: 0 2px 10px rgba(11,20,26,.25); }
.wz-reac-menu button { border: 0; background: none; font-size: 22px; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; }
.wz-reac-menu button:hover, .wz-reac-menu button.activa { background: #e9edef; }
.wz-reac-menu button.quitar { font-size: 15px; color: #54656f; }

/* ═══════════════ Store&Café ═══════════════ */
body { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", Arial, sans-serif; }
h1 { letter-spacing: -.02em; }
.flash.error { background: #FDECEC; color: #B42318; }
.btn.peligro { color: #B42318; }
.btn.peligro.lleno { background: #B42318; border-color: #B42318; color: #fff; }
.btn.verde { background: #1F8A4C; border-color: #1F8A4C; color: #fff; }
.btn.grande { padding: 14px 18px; font-size: 16px; font-weight: 700; }
.btn.ancho { width: 100%; justify-content: center; }
.sidebar .logo.marca { display: flex; align-items: center; gap: 10px; color: #fff; font-weight: 600; font-size: 19px; letter-spacing: -.02em; padding: 4px 10px 20px; text-decoration: none; }
.sidebar .logo.marca img { width: 34px; max-width: none; }
.marca-login { text-align: center; margin-bottom: 24px; }
.marca-login img { width: 74px; margin: 0 auto 8px; }
.marca-texto { font-size: 30px; font-weight: 600; letter-spacing: -.03em; }
.login-caja .marca-login img { width: 74px; }
.aviso-amarillo { background: #FFF6E0; color: #7A4E00; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
.chip.ok { background: #E3F4EA; color: #1F6B3F; }
.chip.alerta { background: #FFF1D6; color: #8A5A00; }
.chip.rojo { background: #FDECEC; color: #B42318; }
.chip.negro { background: #1D1D1F; color: #fff; }
.chip.violeta { background: #EEE8FB; color: #5B3BA8; }
.num { font-variant-numeric: tabular-nums; }
.fila { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.entre { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.oculto { display: none !important; }

/* Diálogos */
.dialogo-fondo { position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 80; display: flex; align-items: flex-end; justify-content: center; }
@media (min-width: 640px) { .dialogo-fondo { align-items: center; } }
.dialogo { background: #fff; width: 100%; max-width: 460px; max-height: 92dvh; overflow-y: auto; border-radius: 22px 22px 0 0; padding: 20px 20px calc(20px + env(safe-area-inset-bottom)); box-shadow: 0 20px 60px rgba(0,0,0,.25); }
@media (min-width: 640px) { .dialogo { border-radius: 22px; } }
.dialogo.ancho { max-width: 620px; }
.dialogo h3 { margin: 0 0 14px; font-size: 18px; display: flex; justify-content: space-between; align-items: start; gap: 10px; }
.dialogo .cerrar { border: 0; background: none; font-size: 20px; cursor: pointer; color: var(--texto-2); }
.opciones-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.opcion-b { border: 1px solid var(--borde); background: #fff; border-radius: 12px; padding: 10px 12px; text-align: left; font: inherit; font-weight: 600; cursor: pointer; }
.opcion-b.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.opcion-b small { display: block; font-weight: 400; opacity: .7; }
.pin { text-align: center; font-size: 24px; letter-spacing: .5em; }
.stepper { display: inline-flex; align-items: center; border: 1px solid var(--borde); border-radius: 99px; background: #fff; }
.stepper button { border: 0; background: none; width: 38px; height: 38px; font-size: 20px; font-weight: 700; cursor: pointer; }
.stepper span { min-width: 26px; text-align: center; font-weight: 700; }

/* Salón */
.zonas { display: inline-flex; gap: 4px; background: #fff; border-radius: 99px; padding: 4px; box-shadow: var(--sombra); overflow-x: auto; }
.zonas button { border: 0; background: none; border-radius: 99px; padding: 8px 16px; font: inherit; font-weight: 600; color: var(--texto-2); cursor: pointer; white-space: nowrap; }
.zonas button.si { background: #1D1D1F; color: #fff; }
.salon-grid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr) 330px; align-items: start; }
@media (max-width: 1200px) { .salon-grid { grid-template-columns: minmax(0, 1fr); } }
.plano { position: relative; aspect-ratio: 16 / 10; background: #fff radial-gradient(circle, #e2e2e7 1px, transparent 1px) 0 0 / 24px 24px; border-radius: 24px; border: 1px solid var(--borde); overflow: hidden; }
.mesa { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 76px; border: 1px solid #C7C7CC; background: #fff; border-radius: 16px; cursor: pointer; font: inherit; color: var(--texto); padding: 4px; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.mesa.cuadrada { width: 11%; aspect-ratio: 1; }
.mesa.redonda { width: 11%; aspect-ratio: 1; border-radius: 50%; }
.mesa.larga { width: 20%; aspect-ratio: 2 / 1; }
.mesa b { font-size: 21px; line-height: 1; }
.mesa small { font-size: 10.5px; color: var(--texto-2); line-height: 1.2; }
.mesa .imp { font-size: 12px; font-weight: 700; }
.mesa.ocupada { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.mesa.ocupada small { color: #C7C7CC; }
.mesa.cuenta { background: #FFC24A; color: #1D1D1F; border-color: #E5A100; }
.mesa.cuenta small { color: #5A4200; }
.mesa .burbuja { position: absolute; top: -8px; right: -8px; min-width: 24px; height: 24px; border-radius: 12px; background: #1F8A4C; color: #fff; font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; padding: 0 5px; }
.mesa .punto { position: absolute; top: -5px; right: -5px; width: 14px; height: 14px; border-radius: 50%; background: #0A84FF; border: 2px solid #fff; }
.mesas-lista { display: none; grid-template-columns: 1fr 1fr; gap: 8px; }
.mesas-lista .mesa { position: static; width: auto; aspect-ratio: auto; min-height: 92px; border-radius: 16px; align-items: flex-start; padding: 12px; }
@media (max-width: 640px) { .plano { display: none; } .mesas-lista { display: grid; } }
.leyenda { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--texto-2); margin-top: 8px; }
.leyenda i { display: inline-block; width: 12px; height: 12px; border-radius: 4px; border: 1px solid #C7C7CC; margin-right: 5px; vertical-align: -2px; }
.pedido-fila { display: flex; align-items: center; gap: 10px; border: 1px solid var(--borde); border-radius: 12px; padding: 8px 10px; background: #fff; width: 100%; font: inherit; text-align: left; cursor: pointer; margin-bottom: 6px; color: inherit; }
.pedido-fila .nro { width: 40px; height: 40px; border-radius: 10px; background: #1D1D1F; color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; flex: none; font-size: 13px; }
.card.listos { border: 2px solid #1F8A4C; }

/* Cuenta */
.cuenta-grid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr) 400px; align-items: start; }
@media (max-width: 1024px) { .cuenta-grid { grid-template-columns: minmax(0, 1fr); } }
#carta-mozo { min-width: 0; }
.chips-cat { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin: 10px 0; }
.chips-cat button { flex: none; border: 1px solid var(--borde); background: #fff; border-radius: 99px; padding: 8px 16px; font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; }
.chips-cat button.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.prod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.prod { display: flex; flex-direction: column; justify-content: space-between; min-height: 92px; padding: 12px; border-radius: 16px; background: #fff; border: 1px solid var(--borde); text-align: left; font: inherit; cursor: pointer; color: inherit; }
.prod:active { transform: scale(.98); background: #F5F5F7; }
.prod b { font-weight: 600; line-height: 1.2; }
.prod .precio { font-weight: 700; margin-top: 8px; display: flex; justify-content: space-between; align-items: end; }
.prod .precio small { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); }
.panel-cuenta { position: sticky; top: 14px; }
@media (max-width: 1024px) {
  .panel-cuenta { position: fixed; inset: 0; z-index: 70; border-radius: 0; overflow-y: auto; display: none; padding-top: calc(16px + env(safe-area-inset-top)); }
  .panel-cuenta.abierto { display: block; }
}
.barra-cuenta { display: none; }
@media (max-width: 1024px) {
  .barra-cuenta { display: flex; position: fixed; left: 10px; right: 10px; bottom: calc(70px + env(safe-area-inset-bottom)); z-index: 40; align-items: center; gap: 10px; background: #1D1D1F; color: #fff; border: 0; border-radius: 18px; padding: 12px 16px; font: inherit; text-align: left; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
  .espacio-barra { height: 80px; }
}
.borrador { background: #F5F5F7; border-radius: 14px; padding: 8px 10px; margin-bottom: 14px; }
.borrador h4, .titulito { margin: 0 0 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--texto-2); }
.item { display: flex; gap: 8px; align-items: flex-start; padding: 9px 2px; border-bottom: 1px solid #EFEFF2; width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; font: inherit; text-align: left; color: inherit; cursor: pointer; }
.item:disabled { cursor: default; }
.item .cant { width: 30px; flex: none; text-align: right; font-weight: 700; }
.item .desc { flex: 1; min-width: 0; }
.item .desc small { display: block; color: var(--texto-2); }
.item .desc .nota-item { color: #9A5B00; font-weight: 600; }
.item .imp { flex: none; font-weight: 600; }
.estado { display: inline-block; font-size: 11px; font-weight: 700; border-radius: 99px; padding: 1px 8px; margin-top: 4px; }
.estado.enviado { background: #E8F1FF; color: #0A5BC2; }
.estado.preparando { background: #FFF1D6; color: #8A5A00; }
.estado.listo { background: #1F8A4C; color: #fff; }
.estado.entregado { background: #EFEFF2; color: #6E6E73; }
.estado.anulado { background: #FDECEC; color: #B42318; }
.toast { position: fixed; left: 50%; bottom: 130px; transform: translateX(-50%); background: #1D1D1F; color: #fff; padding: 10px 18px; border-radius: 99px; font-weight: 700; z-index: 90; pointer-events: none; }
@media (min-width: 1025px) { .toast { bottom: 40px; } }

/* Comandas (pantalla oscura) */
body.oscuro .main { background: #0F1114; color: #fff; min-height: 100vh; }
body.oscuro .topbar h1 { color: #fff; }
.kds-barra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.kds-sectores { display: inline-flex; gap: 4px; background: rgba(255,255,255,.08); border-radius: 99px; padding: 4px; }
.kds-sectores button { border: 0; background: none; color: #C7C7CC; border-radius: 99px; padding: 8px 16px; font: inherit; font-weight: 700; cursor: pointer; }
.kds-sectores button.si { background: #fff; color: #1D1D1F; }
.kds { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; align-items: start; }
.ticket { background: #1C1F24; border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); }
.ticket header { padding: 9px 12px; display: flex; justify-content: space-between; gap: 8px; background: #1F8A4C; }
.ticket header.amarillo { background: #E5A100; color: #1D1D1F; }
.ticket header.rojo { background: #D92D20; }
.ticket header b { font-size: 17px; line-height: 1.15; }
.ticket header small { display: block; font-size: 11.5px; opacity: .85; }
.ticket header .min { font-size: 19px; font-weight: 800; white-space: nowrap; }
.ticket .nota-mesa { background: rgba(229,161,0,.18); color: #FFD27A; padding: 6px 12px; font-weight: 700; font-size: 13px; }
.ticket button.ki { display: flex; gap: 8px; width: 100%; background: none; border: 0; border-top: 1px solid rgba(255,255,255,.05); color: #fff; text-align: left; padding: 10px 12px; font: inherit; cursor: pointer; }
.ticket button.ki.preparando { background: rgba(229,161,0,.12); }
.ticket button.ki.listo { background: rgba(31,138,76,.22); }
.ticket .ki .n { width: 26px; flex: none; text-align: right; font-size: 18px; font-weight: 800; }
.ticket .ki .t { flex: 1; }
.ticket .ki .t b { font-size: 16px; display: block; line-height: 1.2; }
.ticket .ki.listo .t b, .ticket .ki.entregado .t b { text-decoration: line-through; color: #8E8E93; }
.ticket .ki.anulado .t b { text-decoration: line-through; color: #FF6B5E; }
.ticket .ki .op { color: #7CC4FF; font-size: 13.5px; display: block; }
.ticket .ki .nt { color: #FFD27A; font-size: 13.5px; font-weight: 700; display: block; }
.ticket .ki .es { flex: none; font-size: 11px; font-weight: 800; border-radius: 99px; padding: 2px 8px; height: fit-content; background: rgba(255,255,255,.12); color: #C7C7CC; }
.ticket .ki.preparando .es { background: #E5A100; color: #1D1D1F; }
.ticket .ki.listo .es { background: #1F8A4C; color: #fff; }
.ticket footer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; }
.ticket footer button { border: 0; border-radius: 12px; padding: 11px; font: inherit; font-weight: 800; cursor: pointer; background: rgba(255,255,255,.1); color: #fff; }
.ticket footer button.listo { background: #fff; color: #1D1D1F; }
.ticket footer button:disabled { opacity: .35; cursor: default; }

/* Cobro */
.cobro-grid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; max-width: 1050px; }
@media (max-width: 900px) { .cobro-grid { grid-template-columns: minmax(0, 1fr); } }
.medios { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.total-grande { font-size: 32px; font-weight: 800; letter-spacing: -.02em; }

/* Plano editable (gestión) */
.plano.editable .mesa { cursor: grab; touch-action: none; }
.plano.editable .mesa.elegida { outline: 4px solid #0A84FF; }
.plano.editable { touch-action: none; user-select: none; }

/* Tickets de 80 mm */
.ticket80 { width: 76mm; margin: 0 auto; background: #fff; color: #000; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.3; padding: 6px; }
.ticket80 hr { border: 0; border-top: 1px dashed #000; margin: 5px 0; }
.ticket80 .c { text-align: center; }
.ticket80 .fl { display: flex; justify-content: space-between; gap: 6px; }
@media print { .no-print { display: none !important; } body { background: #fff; } @page { size: 80mm auto; margin: 2mm; } }

/* Carta pública */
.carta { max-width: 760px; margin: 0 auto; padding: 18px 16px 40px; }
.carta-head { position: sticky; top: 0; z-index: 5; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--borde); }
.carta-head .in { max-width: 760px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; gap: 10px; }
.carta-head img { width: 34px; }
.carta-head b { font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.carta-cats { display: flex; gap: 6px; overflow-x: auto; max-width: 760px; margin: 0 auto; padding: 0 16px 10px; }
.carta-cats a { flex: none; border: 1px solid var(--borde); border-radius: 99px; padding: 6px 14px; font-weight: 600; color: var(--texto); background: #fff; }
.carta h2 { text-transform: none; letter-spacing: -.02em; font-size: 22px; color: var(--texto); margin: 26px 0 8px; scroll-margin-top: 110px; }
.carta-item { display: flex; justify-content: space-between; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--borde); }
.carta-item b { font-size: 16px; }
.carta-item .pr { font-weight: 700; white-space: nowrap; }
.carta-item p { margin: 3px 0 0; color: var(--texto-2); font-size: 13.5px; }
.carta-item .et { display: inline-block; font-size: 11px; font-weight: 700; background: #F0F0F2; border-radius: 99px; padding: 2px 8px; margin: 6px 4px 0 0; }
.carta-mesa { background: #1D1D1F; color: #fff; border-radius: 14px; padding: 12px 16px; margin: 14px 0; text-align: center; font-weight: 600; }
.solo-movil { display: none; }
@media (max-width: 1024px) { .solo-movil { display: inline-flex; } }

/* ─── Punto de venta: pantalla completa, pensado para el iPad (el menú se abre con ☰) ─── */
.layout.sin-menu { display: block; }
.layout.sin-menu .sidebar { position: fixed; inset: 0 auto 0 0; width: 260px; height: 100%; z-index: 95; transform: translateX(-100%); transition: transform .2s; }
.layout.sin-menu.abierto .sidebar { transform: none; box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .35); }
.layout.sin-menu .tabbar { display: none !important; }
.layout.sin-menu .main { padding: 20px 20px 40px; }
body.pdv-body { overflow: hidden; background: #F2F2F4; }
.pdv { position: fixed; inset: 0; display: flex; flex-direction: column; background: #F2F2F4; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left); }
.pdv button, .pdv a { touch-action: manipulation; }
.pdv-top { flex: none; display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: #1D1D1F; color: #fff; }
.pdv-ico { flex: none; width: 44px; height: 44px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .1); color: #fff; font-size: 20px; cursor: pointer; }
.pdv-marca { display: flex; align-items: center; gap: 8px; color: #fff; font-weight: 700; font-size: 17px; text-decoration: none; letter-spacing: -.01em; white-space: nowrap; }
.pdv-marca img { width: 30px; height: 30px; }
.pdv-tabs { display: flex; gap: 2px; margin-left: 8px; background: rgba(255, 255, 255, .08); border-radius: 12px; padding: 4px; }
.pdv-tabs a { color: #D1D1D6; text-decoration: none; font-weight: 600; font-size: 15px; padding: 9px 16px; border-radius: 9px; white-space: nowrap; }
.pdv-tabs a.si { background: #fff; color: #1D1D1F; }
.pdv-esp { flex: 1; }
.pdv-pedidos { flex: none; height: 44px; padding: 0 14px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .12); color: #fff; font: inherit; font-weight: 600; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.pdv-num { min-width: 24px; height: 24px; border-radius: 99px; background: #fff; color: #1D1D1F; font-size: 13px; line-height: 24px; text-align: center; padding: 0 6px; }
.pdv-pedidos.listo .pdv-num { background: #34C759; color: #fff; }
.pdv-quien { color: #AEAEB2; font-size: 14px; white-space: nowrap; }
.pdv-aviso { flex: none; background: #FFF6E0; color: #7A4E00; padding: 9px 16px; font-size: 14px; }
.pdv-aviso a { color: inherit; font-weight: 700; }
.pdv-cuerpo { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) clamp(300px, 32vw, 400px); }
.pdv-carta { min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 16px 28px; }
.pdv-buscar input { width: 100%; height: 46px; border-radius: 14px; border: 1px solid #E5E5EA; padding: 0 14px; font-size: 16px; background: #fff; }
.pdv-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 14px; }
.pdv-cats button { height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid #E5E5EA; background: #fff; font: inherit; font-weight: 600; font-size: 15px; cursor: pointer; display: flex; align-items: center; gap: 8px; color: #1D1D1F; }
.pdv-cats button i { width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.pdv-cats button.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.pdv-prods { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.pdv-prod { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 10px; min-height: 104px; padding: 16px 14px 12px; border-radius: 16px;
  background: #fff; border: 1px solid #E5E5EA; text-align: left; font: inherit; color: #1D1D1F; cursor: pointer;
  user-select: none; -webkit-user-select: none; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); transition: transform .08s; }
.pdv-prod::before { content: ''; position: absolute; top: 0; left: 14px; right: 14px; height: 4px; border-radius: 0 0 4px 4px; background: var(--c, #1D1D1F); }
.pdv-prod:active { transform: scale(.97); background: #F5F5F7; }
.pdv-prod-n { font-weight: 700; font-size: 16px; line-height: 1.22; }
.pdv-prod-p { display: flex; justify-content: space-between; align-items: end; gap: 6px; font-weight: 600; color: #3A3A3C; font-size: 15px; }
.pdv-prod-p small { font-size: 11px; color: #8E8E93; font-weight: 600; }
.pdv-prod-cant { position: absolute; top: -9px; right: -7px; min-width: 26px; height: 26px; border-radius: 99px; background: #1D1D1F; color: #fff; font-size: 13px; font-weight: 700;
  line-height: 26px; text-align: center; padding: 0 7px; box-shadow: 0 2px 6px rgba(0, 0, 0, .25); }
.pdv-vacio { color: #8E8E93; text-align: center; padding: 40px 10px; font-size: 15px; grid-column: 1 / -1; }
.pdv-ticket { min-height: 0; display: flex; flex-direction: column; background: #fff; border-left: 1px solid #E5E5EA; }
.pdv-ticket-cab { flex: none; padding: 14px 16px 12px; display: grid; gap: 10px; border-bottom: 1px solid #F0F0F2; }
.pdv-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; background: #F2F2F4; border-radius: 12px; padding: 4px; }
.pdv-tipo button { height: 40px; border: 0; border-radius: 9px; background: none; font: inherit; font-weight: 600; cursor: pointer; color: #3A3A3C; }
.pdv-tipo button.si { background: #fff; color: #1D1D1F; box-shadow: 0 1px 3px rgba(0, 0, 0, .14); }
.pdv-nombre { width: 100%; height: 44px; border-radius: 12px; border: 1px solid #E5E5EA; padding: 0 12px; font-size: 16px; }
.pdv-lineas { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 4px 16px; }
.pdv-linea { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid #F0F0F2; }
.pdv-linea-txt { border: 0; background: none; padding: 4px 0; text-align: left; font: inherit; color: inherit; cursor: pointer; min-width: 0; }
.pdv-linea-txt b { display: block; font-weight: 600; line-height: 1.25; }
.pdv-linea-txt small { display: block; color: #8E8E93; font-size: 13px; margin-top: 2px; }
.pdv-linea-imp { min-width: 70px; text-align: right; font-weight: 600; }
.pdv-pie { flex: none; padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid #E5E5EA; display: grid; gap: 10px; }
.pdv-total { display: flex; justify-content: space-between; align-items: baseline; color: #3A3A3C; }
.pdv-total b { font-size: 30px; letter-spacing: -.02em; color: #1D1D1F; }
.pdv-cobrar { height: 60px; border: 0; border-radius: 16px; background: #1D1D1F; color: #fff; font: inherit; font-size: 19px; font-weight: 700; cursor: pointer; }
.pdv-cobrar:disabled, .pdv-acciones button:disabled { opacity: .35; cursor: default; }
.pdv-acciones { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.pdv-acciones button { height: 46px; border-radius: 12px; border: 1px solid #E5E5EA; background: #fff; font: inherit; font-weight: 600; cursor: pointer; padding: 0 16px; color: #1D1D1F; }
.pdv-cerrar-ticket, .pdv-barra { display: none; }
.pdv-ped { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid #F0F0F2; }
@media (max-width: 1100px) { .pdv-quien { display: none; } }
@media (max-width: 900px) {
  .pdv-tabs a { padding: 9px 11px; } .pdv-marca span { display: none; }
  .pdv-cuerpo { grid-template-columns: minmax(0, 1fr) 310px; } .pdv-prods { grid-template-columns: repeat(auto-fill, minmax(136px, 1fr)); }
  .pdv-linea { grid-template-columns: auto minmax(0, 1fr); row-gap: 6px; } .pdv-linea-txt { grid-column: 1 / -1; }
}
.layout.sin-menu .main > .pdv-top.suelta { margin: -20px -20px 20px; }
@media (max-width: 700px) {
  .pdv-cuerpo { grid-template-columns: 1fr; }
  .pdv-ticket { position: fixed; inset: 0; z-index: 60; display: none; border: 0; padding-top: env(safe-area-inset-top); }
  .pdv-ticket.abierto { display: flex; }
  .pdv-cerrar-ticket { display: inline-flex; }
  .pdv-barra { display: flex; position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 50; align-items: center; gap: 10px;
    background: #1D1D1F; color: #fff; border: 0; border-radius: 18px; padding: 12px 16px; font: inherit; box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
  .pdv-barra.vacia { opacity: .85; }
  .pdv-carta { padding-bottom: 100px; }
  .pdv-tabs { margin-left: 0; } .pdv-tabs a { padding: 9px 9px; font-size: 14px; }
  .pdv-pedidos { padding: 0 10px; } .pdv-pedidos { font-size: 0; } .pdv-pedidos .pdv-num { font-size: 13px; }
  .pdv-prods { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; }
  .pdv-cats { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; }
  .pdv-cats button { flex: none; }
}

/* Dibujos de las categorías (public/brand/categorias) y portada de la carta del QR */
.pdv-cats button i.ico-cat { width: 24px; height: 24px; border-radius: 0; background: var(--c); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.pdv-cats button.si i.ico-cat { background: #fff; }
.carta-cats a { display: inline-flex; align-items: center; gap: 6px; }
.carta-cats a img { width: 18px; height: 18px; }
.carta h2 { display: flex; align-items: center; gap: 10px; }
.carta h2 img { width: 30px; height: 30px; }
.carta-hero { position: relative; margin: 16px 0 6px; border-radius: 20px; overflow: hidden; background: #F5F5F7; }
.carta-hero img { display: block; width: 100%; height: clamp(170px, 42vw, 330px); object-fit: cover; object-position: 70% 55%; }
.carta-hero .txt { position: absolute; left: 6%; top: 50%; transform: translateY(-50%); max-width: 40%; color: #1D1D1F; }
.carta-hero .txt small { display: block; font-size: clamp(10px, 2.4vw, 13px); letter-spacing: .08em; text-transform: uppercase; color: #6E6E73; margin-bottom: 6px; }
.carta-hero .txt b { display: block; font-size: clamp(22px, 6vw, 40px); line-height: 1.05; letter-spacing: -.03em; font-weight: 700; }
.login-pagina { background: #F5F5F7 url(/static/brand/patron.png) repeat; background-size: 512px; }
.marca-login img.logo-completo { width: 210px; margin: 0 auto 4px; display: block; }

/* ─── PDV en una pantalla (una sola persona): en curso | carta | pedido y cobro ─── */
.pdv-top .pdv-buscar { flex: 1; min-width: 0; max-width: 560px; margin: 0 4px 0 8px; }
.pdv-top .pdv-buscar input { height: 44px; width: 100%; border: 0; background: rgba(255, 255, 255, .13); color: #fff; border-radius: 12px; padding: 0 14px; font-size: 16px; }
.pdv-top .pdv-buscar input::placeholder { color: #AEAEB2; }
.pdv-curso-btn, .pdv-turno { flex: none; height: 44px; padding: 0 14px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .13); color: #fff; font: inherit; font-weight: 600; cursor: pointer; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.pdv-curso-btn { display: none; }
.pdv-curso-btn.hay .pdv-num { background: #FF9F0A; color: #fff; }
.pdv-turno i { width: 9px; height: 9px; border-radius: 50%; background: #34C759; }
.pdv-turno.cerrada { background: #FFD60A; color: #1D1D1F; }
.pdv-turno.cerrada i { background: #1D1D1F; }
.pdv3 .pdv-cuerpo { grid-template-columns: 270px minmax(0, 1fr) clamp(330px, 30vw, 390px); }
.pdv3 .pdv-carta { padding-top: 10px; }
.pdv3 .pdv-cats { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px 12px; padding: 4px 16px 6px; scrollbar-width: none; }
.pdv3 .pdv-cats::-webkit-scrollbar { display: none; }
.pdv3 .pdv-cats button { flex: none; }
.pdv-curso { min-height: 0; display: flex; flex-direction: column; background: #E8E8EC; border-right: 1px solid #DCDCE0; }
.pdv-curso-cab { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 14px 10px; }
.pdv-curso-cab b { font-size: 17px; }
.pdv-curso-lista { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 10px 18px; display: grid; gap: 10px; align-content: start; }
.pdv-card { background: #fff; border-radius: 14px; box-shadow: 0 1px 3px rgba(0, 0, 0, .08); border: 2px solid transparent; overflow: hidden; }
.pdv-card.listo { border-color: #34C759; }
.pdv-card.activa { border-color: #1D1D1F; }
.pdv-card-cab { width: 100%; display: flex; justify-content: space-between; align-items: start; gap: 8px; padding: 10px 12px 4px; border: 0; background: none; font: inherit; text-align: left; cursor: pointer; color: inherit; }
.pdv-card-cab b { display: block; font-size: 15px; }
.pdv-card-cab small { display: block; color: #8E8E93; font-size: 12px; }
.pdv-t { font-size: 13px; font-weight: 700; color: #8E8E93; white-space: nowrap; }
.pdv-t.algo { color: #C77700; }
.pdv-t.muy { color: #D70015; }
.pdv-card-items { padding: 0 6px; }
.pdv-it { width: 100%; display: flex; gap: 9px; align-items: flex-start; text-align: left; border: 0; background: none; font: inherit; color: inherit; padding: 7px 6px; border-radius: 10px; cursor: pointer; }
.pdv-it:active { background: #F2F2F4; }
.pdv-it b { display: block; font-weight: 600; font-size: 14px; line-height: 1.25; }
.pdv-it small { display: block; color: #8E8E93; font-size: 12px; }
.pdv-check { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid #C7C7CC; margin-top: 1px; display: flex; align-items: center; justify-content: center; }
.pdv-it.si .pdv-check { background: #34C759; border-color: #34C759; }
.pdv-it.si .pdv-check::after { content: '✓'; color: #fff; font-size: 13px; font-weight: 800; }
.pdv-it.si b { text-decoration: line-through; color: #8E8E93; }
.pdv-card-pie { display: flex; gap: 6px; justify-content: flex-end; align-items: center; flex-wrap: wrap; padding: 6px 10px 10px; }
.pdv-card-pie .btn { min-height: 38px; }
.pdv-tk-cab { flex: none; padding: 14px 16px 12px; display: grid; gap: 10px; border-bottom: 1px solid #F0F0F2; }
.pdv-tk-tit { font-size: 19px; letter-spacing: -.01em; }
.pdv-tipo3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 4px; background: #F2F2F4; border-radius: 12px; padding: 4px; }
.pdv-tipo3 button { height: 40px; border: 0; border-radius: 9px; background: none; font: inherit; font-weight: 600; cursor: pointer; color: #3A3A3C; padding: 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pdv-tipo3 button.si { background: #fff; color: #1D1D1F; box-shadow: 0 1px 3px rgba(0, 0, 0, .14); }
.pdv-linea.vieja { grid-template-columns: minmax(0, 1fr) auto; color: #6E6E73; }
.pdv-linea.vieja .pdv-linea-txt b { font-weight: 500; }
.pdv-sep { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: #8E8E93; padding: 14px 0 2px; }
.pdv-cobro { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 12px 16px; display: grid; gap: 10px; align-content: start; }
.pdv-cobro .titulito { margin: 4px 0 0; }
.pdv-cobro-total { display: flex; justify-content: space-between; align-items: baseline; color: #3A3A3C; }
.pdv-cobro-total b { font-size: 34px; letter-spacing: -.02em; color: #1D1D1F; }
.pdv-medios { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pdv-billetes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pdv-medios button, .pdv-billetes button { min-height: 52px; border-radius: 12px; border: 1px solid #E5E5EA; background: #fff; font: inherit; font-weight: 600; font-size: 15px; cursor: pointer; color: #1D1D1F; padding: 6px 8px; }
.pdv-medios button.si, .pdv-billetes button.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.pdv-billetes input { min-height: 52px; border-radius: 12px; border: 1px solid #E5E5EA; padding: 0 10px; font-size: 16px; width: 100%; min-width: 0; }
.pdv-vuelto { background: #FFF6E0; color: #7A4E00; border-radius: 12px; padding: 10px 14px; display: flex; justify-content: space-between; align-items: baseline; font-weight: 600; gap: 10px; }
.pdv-vuelto b { font-size: 26px; color: #1D1D1F; }
.pdv-fac { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 4px; }
.pdv-switch { height: 40px; padding: 0 16px; border-radius: 99px; border: 1px solid #C7C7CC; background: #fff; font: inherit; font-weight: 700; cursor: pointer; color: #1D1D1F; }
.pdv-switch.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.pdv-cli { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 6px; width: 100%; }
.pdv-cli input, .pdv-cli select { height: 44px; font-size: 16px; min-width: 0; }
.link { border: 0; background: none; padding: 0; color: #0A63C9; font: inherit; font-weight: 600; cursor: pointer; }
.pdv-mas { color: #6E6E73; text-decoration: underline; margin-top: 4px; }
.pdv-hecho { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 24px; text-align: center; }
.pdv-hecho .pdv-vuelto { width: 100%; }
.pdv-ok { width: 64px; height: 64px; border-radius: 50%; background: #1F8A4C; color: #fff; font-size: 34px; display: flex; align-items: center; justify-content: center; }
.pdv-hecho h2 { margin: 4px 0 0; font-size: 26px; text-transform: none; letter-spacing: -.02em; color: #1D1D1F; }
.pdv-hecho-bot { display: grid; gap: 8px; width: 100%; margin-top: 8px; }
.pdv-mesas { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; margin-bottom: 8px; }
.pdv-mesas button { min-height: 76px; border-radius: 14px; border: 1px solid #E5E5EA; background: #fff; font: inherit; cursor: pointer; color: #1D1D1F; }
.pdv-mesas button b { display: block; font-size: 22px; }
.pdv-mesas button small { color: #8E8E93; }
.pdv-mesas button.ocupada { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.pdv-mesas button.ocupada small { color: #D1D1D6; }
@media (min-width: 1000px) { .pdv-cerrar-curso { display: none; } }
@media (max-width: 999px) {
  .pdv3 .pdv-cuerpo { grid-template-columns: minmax(0, 1fr) 330px; }
  .pdv-curso { position: fixed; top: 0; bottom: 0; left: 0; width: min(330px, 92vw); z-index: 70; transform: translateX(-104%); transition: transform .2s; box-shadow: 0 0 40px rgba(0, 0, 0, .3); padding-top: env(safe-area-inset-top); }
  .pdv-curso.abierto { transform: none; }
  .pdv-curso-btn { display: flex; }
}
@media (max-width: 700px) {
  .pdv3 .pdv-cuerpo { grid-template-columns: 1fr; }
  .pdv-marca, .pdv-quien { display: none; }
  .pdv-turno span, .pdv-curso-btn { font-size: 0; } .pdv-curso-btn .pdv-num { font-size: 13px; }
  .pdv-turno, .pdv-curso-btn { padding: 0 12px; }
}
/* Tarjetas de «En curso»: en columna (sin achicarse) y con el estado del pago arriba */
.pdv-curso-lista { display: flex; flex-direction: column; }
.pdv-card { flex: none; }
.pdv-pago { font-style: normal; font-weight: 600; color: #B25E00; white-space: nowrap; }
.pdv-pago.ok { color: #1F8A4C; }
.pdv-card-pie { flex-wrap: nowrap; }
.pdv-card-pie .btn { flex: 1; justify-content: center; }
.pdv-card-pie:empty { display: none; }
@media (max-width: 900px) { .pdv-linea.vieja { grid-template-columns: minmax(0, 1fr) auto; } .pdv-linea.vieja .pdv-linea-txt { grid-column: auto; } }
/* PDV: personas y cambio de mesa */
.pdv-mesa-fila { display: flex; gap: 6px; flex-wrap: wrap; }
.pdv-chip { height: 38px; padding: 0 14px; border-radius: 99px; border: 1px solid #E5E5EA; background: #fff; font: inherit; font-weight: 600; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; color: #1D1D1F; text-decoration: none; white-space: nowrap; }
.pdv-chip:active { background: #F2F2F4; }
.pdv-personas { display: grid; grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 6px; margin: 4px 0 2px; }
.pdv-personas.grande { grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); gap: 8px; }
.pdv-personas button { height: 48px; border-radius: 12px; border: 1px solid #E5E5EA; background: #fff; font: inherit; font-weight: 700; font-size: 18px; cursor: pointer; color: #1D1D1F; }
.pdv-personas.grande button { height: 58px; font-size: 20px; }
.pdv-personas button.si { background: #1D1D1F; color: #fff; border-color: #1D1D1F; }
.pdv-mesas button.actual { border: 3px solid #34C759; cursor: default; }
/* Mesas giradas en el plano (de a 45°): la mesa gira y el número queda derecho */
.plano .mesa { transform: rotate(var(--giro, 0deg)); }
.mesa-in { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; transform: rotate(calc(-1 * var(--giro, 0deg))); }
.mesas-lista .mesa, .mesas-lista .mesa-in { transform: none; }
.mesas-lista .mesa-in { align-items: flex-start; text-align: left; }
/* Plano del local: cada zona sombreada con su color alrededor de sus mesas */
.zona-area { position: absolute; border-radius: 22px; background: var(--zc); background: color-mix(in srgb, var(--zc) 80%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--zc) 72%, #1D1D1F 28%); pointer-events: none; }
.zona-area span { position: absolute; left: 12px; top: 3px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6E6E73; color: color-mix(in srgb, var(--zc) 30%, #1D1D1F 70%); white-space: nowrap; }
.plano .mesa { z-index: 1; }
.dialogo.mapa { max-width: 940px; }
.pdv-plano { margin-top: 12px; }
.pdv-plano .mesa b { font-size: 18px; }
.pdv-plano .mesa.actual { border: 3px solid #34C759; cursor: default; }
.pdv-mesas-lista { display: none; }
@media (max-width: 640px) { .pdv-mesas-lista { display: block; } }
/* En el editor, el área de cada zona se agarra para moverla entera */
.plano.editable .zona-area { pointer-events: auto; cursor: move; touch-action: none; }
.plano.editable .zona-area span::before { content: '✥ '; }
/* Pantalla completa (iPad): el botón aparece sólo donde el navegador la permite; el ícono cambia según esté activa */
.boton-pc { display: none !important; }
.pc-ok .boton-pc { display: inline-flex !important; align-items: center; justify-content: center; }
.ico-pc-salir, .txt-pc-salir, .pc-activa .ico-pc-entrar, .pc-activa .txt-pc-entrar { display: none; }
.pc-activa .ico-pc-salir, .pc-activa .txt-pc-salir { display: inline; }
.pc-menu { display: none; width: 100%; margin: 0 0 10px; padding: 8px 10px !important; border: 1px solid #3A424B !important; border-radius: 10px; color: #fff !important; font-weight: 600 !important; }
/* Ayuda: en el café, el acento del panel es el negro de la marca; botón «?» en la barra del PDV y en el menú */
.ayuda-flotante span { background: #fff; color: #1D1D1F; }
.ayuda-tema summary::after { color: #1D1D1F; }
.pdv-ayuda { font-size: 20px; font-weight: 800; }
.ayuda-menu { display: block; text-align: left; }
.ayuda-capa { z-index: 96; }