/* Floating cookie and TableServ buttons (created by the template script – logic untouched) in the
   modern NWS look: glass surface, soft shadow, brand line icon, light/dark. */
.nw-cookie-button,
.nw-ts-button {
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid var(--nws-header-line);
  border-radius: 14px;
  background: var(--nws-header-bg);
  -webkit-backdrop-filter: saturate(160%) blur(18px);
  backdrop-filter: saturate(160%) blur(18px);
  box-shadow: 0 10px 30px rgba(18, 19, 44, 0.16);
  color: var(--nws-c-brand);
  transition:
    transform var(--nws-dur-fast) ease,
    box-shadow var(--nws-dur-fast) ease,
    opacity 220ms ease,
    visibility 0s linear 0s,
    bottom 380ms var(--nws-ease-out),
    top 380ms var(--nws-ease-out);
}
[data-theme='dark'] .nw-cookie-button,
[data-theme='dark'] .nw-ts-button {
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45);
  color: #8db0ee;
}
@media (hover: hover) and (pointer: fine) {
  .nw-cookie-button:hover,
  .nw-ts-button:hover {
    background: var(--nws-header-bg);
    /* no lift (transform) – in Safari it makes the surroundings shimmer; a soft glow instead */
    box-shadow: 0 14px 36px rgba(74, 129, 211, 0.32);
  }
}
.nw-cookie-button:focus-visible,
.nw-ts-button:focus-visible {
  outline: 3px solid var(--nws-c-focus);
  outline-offset: 3px;
}

/* Cookie: a clean line icon instead of the emoji (the emoji stays in the markup, only hidden). */
.nw-cookie-button span {
  display: none;
}
.nw-cookie-button::before {
  content: '';
  width: 24px;
  height: 24px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a9 9 0 1 0 9 9 4 4 0 0 1-4.5-4A4 4 0 0 1 12 3z'/%3E%3Cpath d='M8.5 11.5h.01M12 16h.01M15.5 13.5h.01M9 15.5h.01'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a9 9 0 1 0 9 9 4 4 0 0 1-4.5-4A4 4 0 0 1 12 3z'/%3E%3Cpath d='M8.5 11.5h.01M12 16h.01M15.5 13.5h.01M9 15.5h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* TableServ: the icon a little smaller, so it breathes inside the glass tile. */
.nw-ts-button img {
  width: 28px;
  height: 28px;
}

/* Expanded service bar (phones/tablets) or open mobile menu: both buttons step back. */
body.nws-localnav-open .nw-cookie-button,
body.nws-localnav-open .nw-ts-button {
  opacity: 0;
  visibility: hidden;
  transition: opacity 220ms ease, visibility 0s linear 220ms;
}

/* TableServ offer pop-up (opens by the template script after 20 s, once per session) in the NWS look:
   glass card, theme colours, icon tile, quiet close button, gradient CTA. Timing and logic unchanged. */
.nw-ts-banner {
  width: min(360px, calc(100vw - 32px));
  padding: 22px 22px 22px 88px;
  border: 1px solid var(--nws-header-line);
  border-radius: 20px;
  background: #ffffff;
  -webkit-backdrop-filter: saturate(160%) blur(20px);
  backdrop-filter: saturate(160%) blur(20px);
  box-shadow: 0 24px 60px rgba(18, 19, 44, 0.22);
  color: var(--nws-header-fg-2);
  font-family: var(--nws-font-body);
}
[data-theme='dark'] .nw-ts-banner {
  background: #12132c;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}
.nw-ts-banner .nw-ts-banner-logo {
  left: 22px;
  top: 22px;
  width: 48px;
  height: 48px;
  padding: 8px;
  border-radius: 14px;
  background: rgba(var(--nws-c-primary-rgb), 0.12);
}
.nw-ts-banner h4 {
  margin: 0 0 8px;
  padding-right: 36px;
  color: var(--nws-header-fg);
  font-family: var(--nws-font-heading);
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}
.nw-ts-banner p {
  margin: 0 0 16px;
  color: var(--nws-header-fg-2);
  font-size: 0.875rem;
  line-height: 1.55;
}
.nw-ts-banner .nw-ts-close {
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 1px solid var(--nws-header-line);
  background: transparent;
  color: var(--nws-header-fg-2);
  font-size: 18px;
  font-weight: 500;
}
.nw-ts-banner .nw-ts-close:hover {
  background: rgba(var(--nws-c-primary-rgb), 0.12);
  color: var(--nws-header-fg);
}
.nw-ts-banner .nw-ts-banner-link,
.nw-ts-banner .nw-ts-banner-link:hover {
  padding: 10px 18px;
  border-radius: var(--nws-radius-btn);
  background: var(--nws-grad-button);
  box-shadow: 0 8px 22px rgba(74, 129, 211, 0.3);
  color: #fff;
  font-size: 0.875rem;
  text-decoration: none;
}
/* Pages with the bottom service bar: the pop-up opens above it (and drops down when the bar is away). */
body:has(.nws-localnav) .nw-ts-banner {
  bottom: calc(16px + var(--nws-bar-bottom));
}
body.nws-localnav-away .nw-ts-banner {
  bottom: 22px;
}
@media (max-width: 734px) {
  .nw-ts-banner {
    left: 16px;
    right: 16px;
    width: auto;
  }
}

/* Calm hover everywhere on the floating elements (no transform → no shimmer in Safari). */
.nw-cookie-button:hover,
.nw-ts-button:hover,
.nw-ts-banner .nw-ts-banner-link:hover {
  transform: none;
}

/* "Scroll to top" + progress line (template, fixed on the left, ≥ 768 px). The template turns them white only over
   .section-dark – over the dark NWS areas, in the dark theme and across section borders they were invisible or
   half visible. Now they sit on their own small capsule in the navbar colours, readable on any background.
   Template logic (show/hide, progress height, .dark class) unchanged – the .dark class no longer matters. */
.float-text span {
  display: inline-block;
  padding: 12px 5px;
  border: 1px solid var(--nws-header-line);
  border-radius: 999px;
  background: var(--nws-header-bg);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
  color: var(--nws-header-fg);
  line-height: 1;
}
.float-text a,
.float-text.dark a {
  color: var(--nws-header-fg);
  transition: color 160ms ease;
}
.float-text a:hover,
.float-text a:focus-visible {
  color: var(--nws-c-primary);
}
[data-theme='dark'] .float-text a:hover,
[data-theme='dark'] .float-text a:focus-visible {
  color: #8db0ee;
}
/* line: rail (::before, 100 px) in the capsule colours, progress (::after, height set by the template) on top */
.scrollbar-v,
.scrollbar-v.dark {
  background: transparent;
}
.scrollbar-v::before,
.scrollbar-v.dark::before {
  left: -2px;
  width: 6px;
  min-height: 100px;
  border: 1px solid var(--nws-header-line);
  border-radius: 3px;
  background: var(--nws-header-bg);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}
.scrollbar-v::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 100%;
  max-height: 100px;
  border-radius: 1px;
  background: var(--nws-c-primary);
}
[data-theme='dark'] .scrollbar-v::after {
  background: #8db0ee;
}