/* ============================================================
   site-chrome.css — Header + Footer GLOBAL reutilizable
   La Bancaria Seccional San Juan · Fuxia IT
   Se encola en functions.php (carga en todas las páginas).
   Namespace propio (.lb-*) para no chocar con los estilos
   inline .phead / .header de los templates durante la transición.
   Usa var(--x, fallback): respeta la paleta del template si existe.
   ============================================================ */

:root{
  --lb-head-h: 64px;
}

/* Empuja el contenido para que el header fijo no lo tape.
   Se aplica al <body> de cada template vía la clase lb-has-fixed-header. */
body.lb-has-fixed-header{ padding-top: var(--lb-head-h); }

/* ---------- HEADER ---------- */
.lb-header{
  position: fixed; top:0; left:0; right:0; z-index: 1000;
  height: var(--lb-head-h);
  background: var(--azul-noche, #0A1828); color:#fff;
  border-bottom: 4px solid;
  border-image: linear-gradient(to right,
     var(--celeste-alb, #6CACE4) 0 33%, #fff 33% 66%, var(--celeste-alb, #6CACE4) 66% 100%) 1;
}
.lb-header__inner{
  max-width: 1240px; margin:0 auto; height:100%;
  display:flex; align-items:center; gap:16px; padding:0 24px;
}

/* Marca */
.lb-brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; flex-shrink:0; }
.lb-brand:hover{ text-decoration:none; }
.lb-brand__logo{ height:40px; width:auto; max-width:130px; object-fit:contain; }
.lb-brand__logo--text{
  width:38px; height:38px; border-radius:9px; background:var(--azul-principal, #0C6FB0);
  color:#fff; font-family:var(--font-display, 'Playfair Display',serif); font-weight:800;
  display:flex; align-items:center; justify-content:center; font-size:1rem;
}
.lb-brand__name{ font-family:var(--font-display, 'Playfair Display',serif); font-weight:700; font-size:1rem; line-height:1.05; }
.lb-brand__name small{
  display:block; font-family:var(--font-body, 'Inter',sans-serif); font-size:.62rem; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; color:var(--celeste-alb, #6CACE4);
}

/* Navegación */
.lb-nav{ display:flex; align-items:center; gap:18px; margin-left:auto; }
.lb-nav__menu{ display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.lb-nav__menu li{ list-style:none; }
.lb-nav__menu a{
  font-size:.85rem; color:#C9D6E8; text-decoration:none;
  padding:7px 12px; border-radius:7px; border:1px solid transparent;
  transition:.2s ease;
}
.lb-nav__menu a:hover,
.lb-nav__menu .current-menu-item > a{ color:#fff; border-color:var(--celeste-alb, #6CACE4); text-decoration:none; }

/* Acciones (login / cuenta / salir / campana) */
.lb-nav__actions{ display:flex; align-items:center; gap:10px; }
.lb-cta{
  font-size:.84rem; font-weight:600; text-decoration:none;
  background:var(--azul-principal, #0C6FB0); color:#fff;
  border:1px solid var(--azul-principal, #0C6FB0); border-radius:7px; padding:7px 14px;
  transition:.2s ease;
}
.lb-cta:hover{ background:#095E96; border-color:#095E96; color:#fff; text-decoration:none; }
.lb-cta--ghost{ background:transparent; border-color:#25405F; color:#C9D6E8; }
.lb-cta--ghost:hover{ background:transparent; border-color:var(--celeste-alb, #6CACE4); color:#fff; }

.lb-icon-btn{ position:relative; font-size:1.15rem; line-height:1; text-decoration:none; padding:4px; }
.lb-dot{
  position:absolute; top:-4px; right:-6px; min-width:16px; height:16px; padding:0 4px;
  background:var(--rojo-mundial, #C0392B); color:#fff; font-size:.62rem; font-weight:700;
  border-radius:9px; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-body, 'Inter',sans-serif);
}

/* Toggle móvil */
.lb-nav-toggle{
  display:none; margin-left:auto; background:transparent; border:1px solid #25405F;
  color:#fff; font-size:1.2rem; line-height:1; border-radius:7px; padding:6px 10px; cursor:pointer;
}

@media (max-width: 860px){
  .lb-nav-toggle{ display:inline-flex; }
  .lb-nav{
    position:fixed; top:var(--lb-head-h); left:0; right:0;
    flex-direction:column; align-items:stretch; gap:10px;
    background:var(--azul-noche, #0A1828); padding:16px 24px 22px;
    border-bottom:1px solid #25405F; margin-left:0;
    transform:translateY(-12px); opacity:0; pointer-events:none; transition:.2s ease;
  }
  .lb-nav.is-open{ transform:translateY(0); opacity:1; pointer-events:auto; }
  .lb-nav__menu{ flex-direction:column; align-items:stretch; gap:4px; }
  .lb-nav__menu a{ display:block; }
  .lb-nav__actions{ justify-content:flex-start; padding-top:6px; border-top:1px solid #25405F; }
}