/* VAKSEG: complementos sobre vak.css */
.marca.seg { display: flex; align-items: center; gap: 10px; padding: 4px 8px 6px; }
.marca.seg img { width: 34px; height: 34px; flex: none; }
.marca.seg .t { font-size: 19px; line-height: 1.05; }
.marca.seg small { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--lat-tenue); margin-top: 2px; }
.campana { position: relative; display: inline-flex; padding: 7px; border-radius: 9px; color: var(--tinta2); }
.campana:hover { background: var(--gris-suave); text-decoration: none; }
.campana .globo { position: absolute; top: -2px; right: -4px; margin: 0; }

/* Selfies / evidencias */
.fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.fotito { background: var(--blanco); border: 1px solid var(--linea); border-radius: 10px; overflow: hidden; box-shadow: var(--sombra); font-size: 12.5px; }
.fotito .img { display: block; aspect-ratio: 3 / 4; background: #e9e1e4 center / cover no-repeat; }
.fotito .img.sin { display: grid; place-items: center; color: var(--tenue); }
.fotito .txt { padding: 7px 9px; display: grid; gap: 2px; }
.fotito.mal { border-color: #f0b4b4; box-shadow: 0 0 0 2px var(--rojo-suave); }
.miniatura { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: #eee; display: block; }
.visor { position: fixed; inset: 0; background: rgba(20, 8, 12, .85); z-index: 90; display: grid; place-items: center; padding: 20px; cursor: zoom-out; }
.visor[hidden] { display: none; }
.visor img { max-width: 100%; max-height: 82vh; border-radius: 10px; }
.visor .pie { color: #fff; text-align: center; margin-top: 10px; font-size: 14px; }

/* Mapa */
.mapa { height: 420px; border-radius: var(--radio); border: 1px solid var(--linea); overflow: hidden; background: #e8e3e5; }
.mapa.alto { height: calc(100vh - 170px); min-height: 420px; }
.leyenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; color: var(--tinta2); margin: 8px 0 0; }
.punto-color { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }

/* Estado de servicios en el inicio */
.servicio-fila { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--linea); }
.servicio-fila:last-child { border-bottom: 0; }
.servicio-fila .nom { flex: 1; min-width: 0; }
.servicio-fila .nom b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.semaforo { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.semaforo.verde { background: var(--verde); } .semaforo.rojo { background: var(--rojo); } .semaforo.amarillo { background: #e3a008; } .semaforo.gris { background: #c9bfc3; }
.alerta-item { border-left: 3px solid var(--rojo); }
.r3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.cifra.amarillo .val { color: var(--amarillo); }
.lista-simple { margin: 0; padding: 0; list-style: none; }
.lista-simple li { padding: 9px 0; border-bottom: 1px solid var(--linea); display: flex; justify-content: space-between; gap: 10px; }
.lista-simple li:last-child { border-bottom: 0; }
.qr-hoja { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.qr-tarjeta { border: 2px dashed #bbb; border-radius: 12px; padding: 14px; text-align: center; break-inside: avoid; }
.qr-tarjeta .qr { width: 180px; height: 180px; margin: 6px auto; }
.qr-tarjeta .qr img, .qr-tarjeta .qr canvas { width: 180px !important; height: 180px !important; }
.qr-tarjeta b { display: block; font-size: 16px; }
.sortable li { cursor: grab; }
.tareas-lista input { margin-bottom: 6px; }
@media print { .qr-tarjeta { border-color: #999; } .fotos { grid-template-columns: repeat(4, 1fr); } .fotito { box-shadow: none; } }

/* ================= Tema negro, blanco y dorado ================= */
:root {
  --tinta: #151515; --tinta2: #444; --tenue: #7a7a7a; --linea: #e7e2d7; --fondo: #f6f4ef; --blanco: #fff;
  --marca: #b8923e; --marca-osc: #9a7830; --marca-suave: #f7f0e0; --oro: #c9a96e;
  --lat: #0d0d0d; --lat2: #1f1f1f; --lat-txt: #e9e9e9; --lat-tenue: #9a9a9a;
  --sombra: 0 1px 2px rgba(0, 0, 0, .04), 0 3px 10px rgba(0, 0, 0, .04);
}
a { color: #8a6b22; }
.btn { background: var(--oro); color: #111; }
.btn:hover { background: #b8923e; color: #111; }
.btn.sec { background: #fff; color: var(--tinta); border-color: var(--linea); }
.btn.verde { color: #fff; }
.marca span, .marca.seg .t span { color: var(--oro); }
.lat-menu a.activo { background: var(--lat2); color: #fff; box-shadow: inset 3px 0 0 var(--oro); }
.lat-menu a.activo svg { color: var(--oro); }
.quien .ini { background: var(--oro); color: #111; }
.lateral { border-right: 1px solid #000; }
.topbar { background: rgba(255, 255, 255, .94); }
th { background: #faf8f3; }
tbody tr:hover { background: #fbf8f0; }
input:focus, select:focus, textarea:focus { outline-color: #ecdcb6; border-color: var(--marca); }
.buscador:focus-within { border-color: var(--marca); box-shadow: 0 0 0 3px var(--marca-suave); }
.pestanas a.activo { color: #8a6b22; border-color: var(--oro); }
.eti.azul { background: var(--marca-suave); color: #7a5e1c; }
.aviso.info { background: var(--marca-suave); color: #5e4813; border-color: #eadbb5; }
.globo { background: var(--oro); color: #111; }
.grupo.azul { border-top-color: var(--oro); } .grupo.azul .val { color: #8a6b22; }
/* Entrada: fondo negro, tarjeta blanca, boton dorado */
.entrada { background: #000 !important; }
.entrada .caja { background: #fff; border-top: 4px solid var(--oro); }
.entrada .logo-g { color: #111; }
.entrada .logo-g span { color: var(--oro); }
.entrada .logo-mc { width: 150px; max-width: 60%; }
.marca.seg img { border-radius: 8px; }
.hoja-logo { height: 80px; }

/* ================= Logo como marca de agua ================= */
.principal { position: relative; isolation: isolate; }
.principal::before { content: ""; position: fixed; z-index: -1; pointer-events: none; top: 50%; left: calc(50% + 116px); width: min(62vh, 560px); aspect-ratio: 405 / 466;
  transform: translate(-50%, -45%); background: url('logos/escudo.png') center / contain no-repeat; opacity: .07; }
.tarjeta, .cifra, .cola-item, .grupo, .fotito { background: rgba(255, 255, 255, .86); backdrop-filter: blur(1px); }
.topbar { background: rgba(246, 244, 239, .9); }
.entrada { position: relative; overflow: hidden; }
.entrada::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: url('logos/escudo.png') center / min(90vh, 760px) no-repeat; filter: invert(1); opacity: .09; }
.entrada .caja { position: relative; background: rgba(255, 255, 255, .93); }
@media (max-width: 860px) { .principal::before { left: 50%; width: 80vw; } }
@media print { .principal::before { display: none; } }
/* "no-imp" (no se imprime) dentro del panel: sin el ancho fijo de las hojas imprimibles */
.principal .no-imp { max-width: none; margin-left: 0; margin-right: 0; margin-top: 0; padding-left: 0; padding-right: 0; }
.principal a.no-imp { display: inline; }