/* Identidad de Grupo Hotelero Santa Fe: colores, tipografía y logotipo del corporativo (gsf-hotels.com).
   Vive en _content/, se conserva en las actualizaciones de VFM. */
@font-face{font-family:"Red Hat Display";src:url("fonts/RedHatDisplay-latin.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
:root{--gsf-azul:#2F3A48;--gsf-azul-2:#3E4B5D;--gsf-cielo:#A0C4DA;--gsf-fondo:#F4F6F8;--gsf-borde:#DDE4E9;--gsf-texto:#2F3A48;--gsf-texto-2:#56646D;
  --gsf-letra:"Red Hat Display",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body,.btn,.form-control,.input-group-text,.dropdown-menu,.modal,.toast,.navbar,.footer,h1,h2,h3,h4,h5,h6,table{font-family:var(--gsf-letra)}
body{background:var(--gsf-fondo);color:var(--gsf-texto)}
a{color:var(--gsf-azul)}a:hover{color:var(--gsf-azul-2)}

/* Cabecera */
.navbar.bg-dark{background:var(--gsf-azul)!important;box-shadow:none!important;border-bottom:1px solid rgba(255,255,255,.06)}
.navbar-brand{display:flex;align-items:center;gap:16px;padding:6px 0}
.navbar-brand img{height:50px;width:auto;max-width:none}
.navbar-brand::after{content:"Monitoreo Efectivo";padding-left:16px;border-left:1px solid rgba(255,255,255,.28);color:#fff;
  font:500 16px/30px var(--gsf-letra);letter-spacing:.02em;white-space:nowrap}
.navbar .nav-link,.navbar .navbar-nav a{color:rgba(255,255,255,.86)!important}
.navbar .nav-link:hover,.navbar .navbar-nav a:hover{color:var(--gsf-cielo)!important}
@media(max-width:575.98px){.navbar-brand{gap:12px}.navbar-brand img{height:40px}.navbar-brand::after{font-size:14px;padding-left:12px}}

/* Pie */
footer.footer{background:var(--gsf-azul)!important;color:rgba(255,255,255,.72)}
footer.footer a{color:rgba(255,255,255,.86)}footer.footer a:hover{color:var(--gsf-cielo)}

/* Pantallas de entrada y de restablecer contraseña. Retícula de 8 px; la caja va al centro exacto
   (a lo alto y a lo ancho) y lleva el mismo relleno en los cuatro lados. */
body.unlogged:has(.login) .navbar-nav,body.unlogged:has(.login) .navbar-toggler,body.unlogged:has(.login) .navbar-collapse{display:none!important}
body.unlogged:has(.login)>.container.mb-auto{flex:1 0 auto;display:flex;align-items:center;justify-content:center;margin:0 auto!important;padding:89px 16px 48px!important}
body.unlogged:has(.login) .main-content{width:100%;justify-content:center;margin:0}
body.unlogged:has(.login) .main-content>section{width:100%;max-width:440px;margin:0!important;padding:0}
body.unlogged .login .card{margin:0!important;padding:40px;border:1px solid #E3E8ED;border-radius:16px;background:#fff;
  box-shadow:0 1px 2px rgba(47,58,72,.04),0 28px 56px -28px rgba(47,58,72,.30)!important}
body.unlogged .login .card-header{padding:0;border:0;background:none;text-align:center}
body.unlogged .login .card-header::before{content:"\f538";display:grid;place-items:center;width:56px;height:56px;margin:0 auto 24px;
  border-radius:14px;background:var(--gsf-azul);color:#fff;font:normal 24px/1 "bootstrap-icons"}
body.unlogged .login:has(#sendpwd) .card-header::before{content:"\f44f"}
body.unlogged .login .card-header h5{margin:0;text-align:center!important;font-size:24px;line-height:32px;font-weight:600;letter-spacing:-.01em;color:var(--gsf-azul)}
body.unlogged .login .card-header h5 .bi{display:none}
#login-form .card-header h5::after{content:"Control de efectivo de los hoteles del grupo";display:block;margin-top:8px;font-size:15px;line-height:22px;font-weight:400;letter-spacing:0;color:var(--gsf-texto-2);text-wrap:balance}
body.unlogged .login .card-body{padding:0;margin-top:32px}

/* Campo de una pieza: ícono a la izquierda y ojo a la derecha en cajas de 48×48, en espejo. El campo queda siempre
   debajo de los íconos (Bootstrap lo sube al enfocarlo y el relleno del autocompletado los tapaba) y sin el margen
   de -1 px de Bootstrap, que montaba ese relleno sobre el borde izquierdo. */
body.unlogged .login .form-group{margin:0!important}
body.unlogged .login #login_bar>.form-group+.form-group{margin-top:16px!important}
body.unlogged .login .input-group{position:relative;display:block;height:48px;margin:0!important;border:1px solid var(--gsf-borde);border-radius:10px;background:#fff;
  transition:border-color .15s,box-shadow .15s}
body.unlogged .login .input-group:hover{border-color:#C5CFD7}
body.unlogged .login .input-group:focus-within{border-color:var(--gsf-azul);box-shadow:0 0 0 4px rgba(47,58,72,.10)}
body.unlogged .login .input-group-text{position:absolute;z-index:3;top:0;left:0;display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  padding:0;border:0;background:none;color:#7A8894;pointer-events:none}
body.unlogged .login .input-group-text .bi,body.unlogged .login .gsf-ojo .bi{display:block;font-size:18px;line-height:1}
body.unlogged .login .form-control{position:relative;z-index:1!important;display:block;width:100%!important;height:46px;margin:0!important;padding:0 16px 0 46px;border:0!important;border-radius:9px!important;
  background:transparent;box-shadow:none!important;font-size:16px;line-height:24px;color:var(--gsf-texto)}
body.unlogged .login .gsf-con-ojo .form-control{padding-right:46px}
body.unlogged .login .form-control::placeholder{color:#97A3AD}
body.unlogged .login .form-control:-webkit-autofill,body.unlogged .login .form-control:-webkit-autofill:hover,body.unlogged .login .form-control:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #fff inset!important;-webkit-text-fill-color:var(--gsf-texto)!important;caret-color:var(--gsf-texto);transition:background-color 9999s}
body.unlogged .login .gsf-ojo{position:absolute;z-index:3;top:0;right:0;display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  padding:0;border:0;border-radius:0 9px 9px 0;background:none;color:#7A8894;cursor:pointer}
body.unlogged .login .gsf-ojo:hover{color:var(--gsf-azul)}
body.unlogged .login .gsf-ojo:focus-visible{outline:2px solid var(--gsf-azul);outline-offset:-6px;border-radius:8px}
body.unlogged .login .gsf-mayus{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:13px;line-height:20px;color:#8A5A00}
body.unlogged .login .gsf-mayus[hidden]{display:none}
body.unlogged .login .gsf-verifica{display:flex;align-items:flex-start;gap:8px;margin:0 0 16px;font-size:13px;line-height:20px;color:#B3261E}
body.unlogged .login .gsf-verifica[hidden]{display:none}
body.unlogged .login .gsf-verifica .bi{line-height:20px}

/* Recordarme, botón y enlace */
body.unlogged .login .form-check{display:flex;align-items:center;gap:12px;min-height:24px;margin:20px 0 24px!important;padding:0}
body.unlogged .login .form-check-input{float:none;flex:0 0 auto;width:18px;height:18px;margin:0;border:1.5px solid #B8C3CC;border-radius:5px;background-color:#fff;cursor:pointer}
body.unlogged .login .form-check-input:checked{background-color:var(--gsf-azul);border-color:var(--gsf-azul)}
body.unlogged .login .form-check-input:focus{box-shadow:0 0 0 4px rgba(47,58,72,.10)}
body.unlogged .login .form-check label{margin:0;font-size:14px;line-height:24px;color:var(--gsf-texto-2);cursor:pointer}
body.unlogged .login .d-grid{margin:0!important}
body.unlogged .login .btn-primary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:48px;padding:0 16px;border-radius:10px;
  font-size:16px;font-weight:600;letter-spacing:.01em;transition:background-color .15s,transform .15s,box-shadow .15s}
body.unlogged .login .btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 22px -10px rgba(47,58,72,.60)}
body.unlogged .login .btn-primary:active{transform:none;box-shadow:none}
body.unlogged .login .btn-primary.gsf-ocupado{pointer-events:none}
body.unlogged .login .btn-primary.gsf-ocupado .bi{display:none}
body.unlogged .login .btn-primary.gsf-ocupado::before{content:"";width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:gsf-gira .7s linear infinite}
@keyframes gsf-gira{to{transform:rotate(360deg)}}
body.unlogged .login .lostpwd{margin:24px 0 0;text-align:center;font-size:14px;line-height:20px}
body.unlogged .login .lostpwd a,body.unlogged .login .card-body>.btn-link{color:var(--gsf-texto-2);text-decoration:none}
body.unlogged .login .lostpwd a:hover,body.unlogged .login .card-body>.btn-link:hover{color:var(--gsf-azul);text-decoration:underline}

/* Restablecer contraseña: mismo esquema que la entrada. La instrucción va como subtítulo (la de la plataforma,
   debajo del botón, repetía «correo electrónico» y llegaba después de la acción); el botón lleva el ícono de enviar
   (la plataforma pide «bi-arrow-circle-right», que no existe en Bootstrap Icons) y el enlace de regreso, su flecha. */
body.unlogged .login:has(#sendpwd) .card-header h5::after{content:"Te enviaremos un enlace para crear una contraseña nueva.";display:block;margin-top:8px;
  font-size:15px;line-height:22px;font-weight:400;letter-spacing:0;color:var(--gsf-texto-2);text-wrap:balance}
body.unlogged .login #sendpwd .btn-primary i.fa::before{content:"\f6c0";display:block;font:normal 16px/1 "bootstrap-icons"}
body.unlogged .login #sendpwd{text-align:center}
body.unlogged .login #sendpwd .d-flex{margin:0!important}
body.unlogged .login #sendpwd .p-3{padding:0!important}
body.unlogged .login #sendpwd .p-3+.p-3{display:none}
body.unlogged .login #sendpwd .d-grid{margin:24px 0 0!important}
body.unlogged .login #sendpwd p{margin:16px 0 0;font-size:14px;line-height:20px;color:var(--gsf-texto-2)}
body.unlogged .login .card-body>.btn-link{display:block;margin:24px auto 0;padding:0;border:0;font-size:14px;line-height:20px}
body.unlogged .login .card-body>.btn-link{display:flex;align-items:center;justify-content:center;gap:6px;width:max-content}
body.unlogged .login .card-body>.btn-link .bi::before{content:"\f12f";display:block;font-size:14px;line-height:1}

@media(max-width:575.98px){body.unlogged:has(.login)>.container.mb-auto{padding:63px 16px 32px!important}
  body.unlogged .login .card{padding:32px}}

/* Foto de un hotel del grupo con su nombre, rotando entre todos (custom.js, parte 4). En pantallas angostas es una
   franja arriba de la caja, en lugar del distintivo; desde 860 px ocupa la mitad izquierda (acceso partido).
   La marca ya está en la cabecera y no se repite. Sin JavaScript queda el distintivo, o la foto fija desde 860 px. */
.gsf-fotos{display:none}
body.unlogged .login .card.gsf-rota .card-header::before{display:none}
body.unlogged .login .gsf-fotos{display:block;position:relative;height:208px;margin:-40px -40px 32px;border-radius:15px 15px 0 0;overflow:hidden;pointer-events:none}
body.unlogged .login .gsf-fotos span{position:absolute;inset:0;background:center/cover no-repeat;opacity:0;transition:opacity 1.2s ease}
body.unlogged .login .gsf-fotos span.on{opacity:1}
body.unlogged .login .gsf-fotos span::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,37,47,0) 50%,rgba(29,37,47,.82) 100%)}
body.unlogged .login .gsf-fotos b{position:absolute;left:40px;right:40px;bottom:20px;z-index:1;color:#fff;font:600 16px/22px var(--gsf-letra);text-align:left;text-shadow:0 1px 2px rgba(15,23,32,.35)}
@media(max-width:575.98px){body.unlogged .login .gsf-fotos{height:184px;margin:-32px -32px 28px}body.unlogged .login .gsf-fotos b{left:32px;right:32px}}
@media(min-width:860px){
  body.unlogged:has(.login) .main-content>section{max-width:960px}
  body.unlogged .login{max-width:none;width:100%;margin:0 auto}
  body.unlogged .login .card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:1fr auto auto 1fr;
    min-height:560px;padding:0;border:0;overflow:hidden;box-shadow:0 40px 80px -36px rgba(15,23,32,.45),0 2px 6px rgba(15,23,32,.08)!important}
  body.unlogged .login .card::before{content:"";grid-column:1;grid-row:1/5;
    background:linear-gradient(180deg,rgba(29,37,47,0) 50%,rgba(29,37,47,.82) 100%),url("img/acceso-hotel.webp") center/cover no-repeat}
  body.unlogged .login .card-header{grid-column:2;grid-row:2;padding:0 56px;text-align:left}
  body.unlogged .login .card-header::before{display:none}
  body.unlogged .login .card-header h5{text-align:left!important}
  body.unlogged .login .card-body{grid-column:2;grid-row:3;padding:0 56px;margin:32px 0 0}
  body.unlogged .login #sendpwd{text-align:left}
  body.unlogged .login .card.gsf-rota::before{background:var(--gsf-azul)}
  body.unlogged .login .gsf-fotos{position:absolute;top:0;left:0;bottom:0;width:50%;height:auto;margin:0;border-radius:0}
  body.unlogged .login .gsf-fotos b{left:48px;right:48px;bottom:48px;font-size:20px;line-height:28px;letter-spacing:-.005em}
}
@media(prefers-reduced-motion:reduce){.gsf-fotos span{transition:none}}

/* Pie: Centro de Ayuda con su salvavidas */
footer.footer a[href^="mailto:"]::before{content:"\f467";font-family:"bootstrap-icons";font-size:15px;margin-right:7px;vertical-align:-2px}
/* Leyenda de reCAPTCHA en el pie (custom.js, parte 5): sustituye a la insignia flotante, que tapaba el pie. */
.grecaptcha-badge{visibility:hidden!important}
footer.footer .gsf-legal{margin:8px 0 0;font-size:12px;line-height:18px;color:rgba(255,255,255,.56)}
footer.footer .gsf-legal a{color:rgba(255,255,255,.72);text-decoration:underline;text-underline-offset:2px}
/* Teléfono: marca centrada en la entrada y pie centrado en dos renglones (derechos; privacidad y ayuda). */
@media(max-width:575.98px){
  body.unlogged:has(.login) .navbar>.container{justify-content:center}
  body.unlogged:has(.login) .navbar-brand{margin-right:0}
  footer.footer .row{display:block;margin:0;text-align:center}
  footer.footer .row>.col-sm-6{display:inline;width:auto;padding:0;text-align:center!important}
  footer.footer .gsf-sep{display:block;height:6px;font-size:0}
  footer.footer .row>.col-sm-6+.col-sm-6::before{content:"\00b7";margin:0 10px;color:rgba(255,255,255,.4)}
  footer.footer .gsf-legal{max-width:300px;margin:12px auto 0;text-align:center}
}

/* Botones y controles */
.btn{border-radius:6px}
.btn-primary,.btn-dark{background:var(--gsf-azul)!important;border-color:var(--gsf-azul)!important;color:#fff!important}
.btn-primary:hover,.btn-dark:hover{background:var(--gsf-azul-2)!important;border-color:var(--gsf-azul-2)!important}
.btn:focus-visible,.form-control:focus{box-shadow:0 0 0 3px rgba(47,58,72,.14)}
.form-check-input:checked{background-color:var(--gsf-azul);border-color:var(--gsf-azul)}
.btn-secondary{background:#56646D!important;border-color:#56646D!important;color:#fff!important}.btn-secondary:hover{background:var(--gsf-azul-2)!important;border-color:var(--gsf-azul-2)!important}
.card{border-color:var(--gsf-borde)}

/* Monitoreo GHSF — buscador en vivo. Vive en _content/, se conserva en las actualizaciones. */
.bq-ov{position:fixed;inset:0;z-index:2000;display:none;background:rgba(15,23,32,.55);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.bq-ov.on{display:block}
.bq-wrap{max-width:720px;margin:9vh auto 0;padding:0 16px}
.bq-box{background:#fff;border-radius:10px;box-shadow:0 24px 60px -12px rgba(15,23,32,.45),0 2px 8px rgba(15,23,32,.16);overflow:hidden}
.bq-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid #ecebee}
.bq-head svg{flex:0 0 auto;width:19px;height:19px;fill:#8a8590}
.bq-inp{flex:1 1 auto;border:0;outline:0;font-size:17px;line-height:1.4;color:#1d1a1f;background:transparent;
  font-family:inherit;min-width:0}
.bq-inp::placeholder{color:#a6a1aa}
.bq-esc{flex:0 0 auto;font-size:11px;color:#a6a1aa;border:1px solid #e4e2e6;border-radius:4px;padding:3px 7px;letter-spacing:.04em}
.bq-list{max-height:56vh;overflow-y:auto;overscroll-behavior:contain}
.bq-it{display:flex;align-items:flex-start;gap:12px;padding:11px 18px;cursor:pointer;border-bottom:1px solid #f4f3f5;text-decoration:none}
.bq-it:last-child{border-bottom:0}
.bq-it:hover,.bq-it.sel{background:#F4F7FA}
.bq-it.sel{box-shadow:inset 3px 0 0 #2F3A48}
.bq-ic{flex:0 0 auto;width:17px;height:17px;margin-top:2px;fill:#8a8590}
.bq-it.dir .bq-ic{fill:#2F3A48}
.bq-body{min-width:0;flex:1 1 auto}
.bq-nm{font-size:14.5px;line-height:1.35;color:#1d1a1f;font-weight:600;word-break:break-word}
.bq-nm mark{background:#E3EEF5;color:#2F3A48;padding:0 1px;border-radius:2px}
.bq-ctx{font-size:12px;line-height:1.45;color:#8a8590;margin-top:2px;word-break:break-word}
.bq-meta{flex:0 0 auto;text-align:right;font-size:11px;color:#a6a1aa;line-height:1.5;white-space:nowrap;padding-top:2px}
.bq-chip{display:inline-block;background:#EDF2F6;color:#2F3A48;font-size:10px;font-weight:700;letter-spacing:.06em;
  padding:2px 6px;border-radius:3px;margin-bottom:3px}
.bq-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 18px;
  border-top:1px solid #ecebee;background:#faf9fa;font-size:11.5px;color:#8a8590}
.bq-kbd{display:inline-block;border:1px solid #e4e2e6;border-radius:3px;padding:1px 5px;font-size:10.5px;margin:0 2px;background:#fff}
.bq-msg{padding:26px 18px;text-align:center;font-size:13.5px;color:#8a8590}
.bq-msg b{color:#1d1a1f}
@media(max-width:640px){.bq-wrap{margin-top:0;padding:0}.bq-box{border-radius:0;height:100vh;display:flex;flex-direction:column}
  .bq-list{max-height:none;flex:1 1 auto}.bq-meta{display:none}}
