/* Shared museum lighting. Important layer beats older page-specific overrides.
   Shadows only: no image filters, colour changes, layout shifts or animation. */
@layer museum-lighting {
  :root {
    --museum-control-glow: 0 0 0 2px rgba(255,255,255,.98),
      0 0 14px 4px rgba(56,189,248,.95),
      0 0 32px 8px rgba(30,144,255,.72),
      inset 0 0 18px 3px rgba(240,249,255,.65);
    --museum-text-glow: 0 0 1px #fff,
      0 0 5px rgba(255,255,255,.98),
      0 0 12px rgba(125,211,252,.95),
      0 0 22px rgba(56,189,248,.8);
  }

  /* Keyboard users and touch presses receive the same lighting as a mouse. */
  :where(button, [role="button"], input[type="button"], input[type="submit"],
    input[type="reset"], select, summary):not(:disabled):not([aria-disabled="true"]):is(:focus-visible, :active) {
    box-shadow: var(--museum-control-glow) !important;
    text-shadow: var(--museum-text-glow) !important;
  }

  :where(button, a[href], [role="button"], input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):not(:disabled):not([aria-disabled="true"]):focus-visible {
    outline: 2px solid #fff !important;
    outline-offset: 4px !important;
    box-shadow: var(--museum-control-glow) !important;
    text-shadow: var(--museum-text-glow) !important;
  }

  @media (hover: hover) and (pointer: fine) {
    :where(button, [role="button"], input[type="button"], input[type="submit"],
      input[type="reset"], select, summary):not(:disabled):not([aria-disabled="true"]):hover {
      box-shadow: var(--museum-control-glow) !important;
      text-shadow: var(--museum-text-glow) !important;
    }

    /* Text can light up without a border or a new click action. */
    :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, legend, summary,
      figcaption, blockquote, span, small, strong, b, em, i, a, button,
      input, textarea, text, tspan, td, th, caption, code, pre, time,
      address, cite, q, abbr, u, mark, div:not(:has(*)), .label, .room-sign, .status):not(:disabled):not([aria-disabled="true"]):not(:where(:disabled, [aria-disabled="true"]) *):hover {
      text-shadow: var(--museum-text-glow) !important;
    }
  }
}


/* Compact header tabs keep their lighting inside the button and scroll row. */
@layer museum-lighting {
  [data-museum-visitor-experience] header nav > button {
    --museum-control-glow: inset 0 0 0 1px rgba(30,144,255,.8),
      inset 0 0 8px rgba(56,189,248,.28);
    --museum-text-glow: 0 0 3px rgba(240,249,255,.85);
  }
  [data-museum-visitor-experience] header nav > button:not(:disabled):not([aria-disabled="true"]):focus-visible {
    outline: 2px solid #1E90FF !important;
    outline-offset: -3px !important;
  }
}