/* ==========================================================================
   Wake family: wake-appbar v1.0 (2026-10-09)
   Slim, dismissible "open as an app" invite bar for the very top of a site.
   Self-contained: no dependency on tokens.css/family.css (uses them if present).
   Theme it by setting these on :root or <html> (defaults are WCAG AA):
     --wab-bg   bar background        (default #0A1F44 navy)
     --wab-fg   bar text              (default #FFFFFF, 16.0:1 on navy)
     --wab-accent  rule/icon colour   (default #E4324A, decorative only)
   Language: shows .wab-es when <html lang="es">, otherwise .wab-en.
   ========================================================================== */
.wab {
  --_bg: var(--wab-bg, #0A1F44);
  --_fg: var(--wab-fg, #FFFFFF);
  --_ac: var(--wab-accent, #E4324A);
  position: relative;
  z-index: 110;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 32px;
  padding: .3rem 2.75rem .3rem 1rem;   /* room for the close button */
  background: var(--_bg);
  color: var(--_fg);
  border-bottom: 2px solid var(--_ac);
  font: 600 .8125rem/1.35 var(--wake-font-body, "Poppins", system-ui, sans-serif);
  text-align: center;
}
.wab[hidden] { display: none !important; }
.wab__msg { margin: 0; }
.wab__icon {
  display: inline-block; width: .8em; height: 1.05em; margin-right: .4em;
  vertical-align: -.15em; border: 2px solid var(--_ac); border-radius: 3px;
}
.wab__soon {
  display: inline-block; margin-left: .35em; padding: 0 .45em;
  border: 1px solid currentColor; border-radius: 999px;
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
}
.wab__close {
  position: absolute; right: .25rem; top: 50%; transform: translateY(-50%);
  min-width: 44px; min-height: 44px;            /* WCAG 2.5.5 touch target */
  margin: 0; padding: 0; border: 0; background: transparent;
  color: var(--_fg); font: 700 1.25rem/1 system-ui, sans-serif; cursor: pointer;
}
.wab__close:hover { opacity: .85; }
.wab__close:focus-visible, .wab__close:focus {
  outline: 3px solid var(--_fg); outline-offset: -6px; border-radius: 8px;
}
html:lang(es) .wab .wab-en, html:not(:lang(es)) .wab .wab-es { display: none; }
@media (max-width: 480px) { .wab { font-size: .75rem; justify-content: flex-start; text-align: left; } }
@media (forced-colors: active) { .wab { border-bottom-color: CanvasText; } .wab__icon { border-color: CanvasText; } }
@media print { .wab { display: none !important; } }