/* Match the navigation's native glass, with a slightly darker blue tint. */
.analytics-consent {
  --consent-glass: color-mix(in srgb, var(--glass-theme, #18517a) 78%, black);
  position: fixed;
  z-index: 10000;
  inset: auto 0 max(24px, env(safe-area-inset-bottom));
  width: min(920px, calc(100% - 48px));
  margin-inline: auto;
  padding: 20px 24px;
  border: 0;
  border-radius: 28px;
  background: color-mix(in srgb, var(--consent-glass) 65%, transparent);
  color: #e1eff8;
  box-shadow: 0 5px 20px #0001;
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  font: 15px/1.5 system-ui, -apple-system, sans-serif;
  transition: background-color .4s ease, color .4s ease;
  text-align: left;
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: 24px;
}
.analytics-consent[hidden] { display: none; }
.analytics-consent > div:first-child { min-width: 0; }
.analytics-consent p { margin: 0; font: inherit; color: inherit; }
.analytics-consent a {
  color: color-mix(in srgb, var(--glass-theme, #18517a) 32%, white);
  text-decoration: underline;
  font-stretch: normal;
  font-size: inherit;
  transition: color .4s ease;
}
.analytics-consent .analytics-actions {
  display: flex;
  justify-self: end;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 0;
}
/* Same pill, tint, type and hit area as the navigation's Hämta button. */
.analytics-actions button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 25px;
  border: 0;
  border-radius: 30px;
  font: 500 11px/1.5 system-ui, -apple-system, sans-serif;
  font-stretch: 132%;
  color: inherit;
  background: color-mix(in srgb, currentColor 18%, transparent);
  box-shadow: inset 0 1px 0 #ffffff12;
  cursor: pointer;
  white-space: nowrap;
}
.analytics-actions button:hover { background: color-mix(in srgb, currentColor 24%, transparent); }
.analytics-settings { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.analytics-settings:hover { text-decoration: underline; }
.analytics-consent :focus-visible, .analytics-settings:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 700px) {
  .analytics-consent {
    width: calc(100% - 24px);
    bottom: max(12px, env(safe-area-inset-bottom));
    padding: 20px;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
  .analytics-actions button { padding-inline: 22.5px; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .analytics-consent { background: var(--consent-glass); }
}
@media (prefers-reduced-transparency: reduce) {
  .analytics-consent { background: var(--consent-glass); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

.analytics-consent[data-tone="light"] { color: #343735; }
.analytics-consent[data-tone="light"] a { color: color-mix(in srgb, #343735 80%, var(--glass-theme, #f0eee7)); }
.analytics-consent[data-tone="light"] .analytics-actions button { background: #34373514; }
.analytics-consent[data-tone="light"] .analytics-actions button:hover { background: #34373524; }
@media (prefers-reduced-motion: reduce) { .analytics-consent { transition: none; } }

/* A quieter secondary action, keeping the same label contrast and hit area. */
.analytics-actions button[data-consent="no"] { background: color-mix(in srgb, currentColor 9%, transparent); }
.analytics-actions button[data-consent="no"]:hover { background: color-mix(in srgb, currentColor 15%, transparent); }
.analytics-consent[data-tone="light"] .analytics-actions button[data-consent="no"] { background: #3437350a; }
.analytics-consent[data-tone="light"] .analytics-actions button[data-consent="no"]:hover { background: #34373518; }