/* Cookie consent banner (inc/analytics.php, assets/js/consent.js).
   Self-contained: loaded on every template, including the two that skip style-aqua.css,
   so every value has a literal fallback rather than relying on a token being defined. */

.vx-consent[hidden] { display: none; }

.vx-consent {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 2147483000;
  width: min(440px, calc(100vw - 48px));
  box-sizing: border-box;
  padding: 20px 22px;
  background: rgba(10, 30, 44, 0.94);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius-card, 12px);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
  color: #ffffff;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  text-align: left;
}

.vx-consent-title {
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: #ffffff;
}

.vx-consent-text {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.78);
}

.vx-consent-text a {
  color: var(--accent-amber, #AAD0E2);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.vx-consent-actions {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

/* Accept and Reject share this rule and nothing else: equal weight is the point. */
.vx-consent-btn {
  flex: 1 1 0;
  margin: 0;
  padding: 11px 18px;
  background: #f2ede4;
  color: #111111;
  border: 0;
  border-radius: var(--radius-pill, 999px);
  font: 600 14px/1.2 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.vx-consent-btn:hover { background: #ffffff; }

.vx-consent-btn:focus-visible,
.vx-consent-text a:focus-visible {
  outline: 2px solid var(--accent-amber, #AAD0E2);
  outline-offset: 2px;
}

@media (max-width: 600px) {
  .vx-consent {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    padding: 18px;
  }
}

/* The footer's "Cookie Settings" is a <button> dressed as the legal links beside it.
   Font, size and colour come from .footer-legal-link; this only strips button chrome. */
.footer-consent-link {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
}
