/* RSBI consent banner (public/consent/consent.js). Framework-free: used by Next.js and by the Ghost theme.
   Colours, radii, shadows, focus ring and type come from src/styles/tokens.css; the fallbacks repeat
   the token values so the banner stays usable if a page loads it without the tokens. */

.rsbi-consent[hidden],
.rsbi-consent [hidden] { display: none !important; }

.rsbi-consent {
  position: fixed;
  inset-inline: 0;
  /* Sits above a visible sticky bottom bar (sticky mobile bar, calculator result bar), never over it. */
  bottom: var(--rsbi-consent-offset, 0px);
  z-index: 60; /* above the in-flow announcement strip (z-50) and the sticky header (z-40) */
  max-height: calc(100vh - var(--rsbi-consent-offset, 0px));
  max-height: calc(100dvh - var(--rsbi-consent-offset, 0px));
  overflow-y: auto;
  overscroll-behavior: contain;
  box-sizing: border-box;
  background: var(--rsbi-white, #ffffff);
  color: var(--rsbi-ink, #0d1b2a);
  border-top: 1px solid var(--rsbi-line, rgba(2, 36, 65, 0.12));
  box-shadow: 0 -10px 30px rgba(2, 36, 65, 0.12);
  font-family: var(--rsbi-font, "Archivo", system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
  font-size: 1rem;
  line-height: 1.55;
  text-align: start;
}
.rsbi-consent *, .rsbi-consent *::before, .rsbi-consent *::after { box-sizing: border-box; }
.rsbi-consent:focus { outline: none; } /* the container only receives focus to announce the dialog */
.rsbi-consent :focus-visible {
  outline: var(--rsbi-focus-width, 3px) solid var(--rsbi-focus-outline, #042d4d);
  outline-offset: var(--rsbi-focus-offset, 3px);
}

.rsbi-consent__inner {
  display: grid;
  grid-template-areas: "body" "prefs" "actions";
  gap: 0.875rem;
  max-width: calc(1200px + 2.5rem);
  margin: 0 auto;
  padding: 1rem 1.25rem max(1rem, env(safe-area-inset-bottom));
}
.rsbi-consent__body { grid-area: body; min-width: 0; }
.rsbi-consent__prefs { grid-area: prefs; min-width: 0; }
.rsbi-consent__actions { grid-area: actions; }

.rsbi-consent__title {
  margin: 0 0 0.25rem;
  font-size: 1.0625rem;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--rsbi-navy-900, #022441);
}
.rsbi-consent__text { margin: 0; font-size: 0.9375rem; color: var(--rsbi-ink-soft, #2c3e50); }
.rsbi-consent__text a {
  color: var(--rsbi-navy-800, #042d4d);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.rsbi-consent__text a:hover { color: var(--rsbi-navy-600, #164f7c); }

/* Actions: "Accept toate" and "Refuz" share one style and one size (equal prominence). */
.rsbi-consent__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
  align-items: stretch;
}
.rsbi-consent__actions [data-action="prefs"] { grid-column: 1 / -1; }

.rsbi-consent__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 0;
  padding: 0.5rem 1rem;
  border: 2px solid var(--rsbi-navy-900, #022441);
  border-radius: var(--rsbi-radius-pill, 999px);
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.rsbi-consent__btn--primary { background: var(--rsbi-navy-900, #022441); color: var(--rsbi-white, #ffffff); }
.rsbi-consent__btn--primary:hover { background: var(--rsbi-navy-700, #0b3d63); border-color: var(--rsbi-navy-700, #0b3d63); }
.rsbi-consent__btn--secondary { background: var(--rsbi-white, #ffffff); color: var(--rsbi-navy-900, #022441); }
.rsbi-consent__btn--secondary:hover { background: var(--rsbi-navy-50, #f3f7fb); }

/* Preferences panel */
.rsbi-consent__prefs-title {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--rsbi-navy-900, #022441);
}
.rsbi-consent__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 0;
  border-top: 1px solid var(--rsbi-line, rgba(2, 36, 65, 0.12));
}
.rsbi-consent__row:last-of-type { border-bottom: 1px solid var(--rsbi-line, rgba(2, 36, 65, 0.12)); margin-bottom: 0.75rem; }
.rsbi-consent__row-text { min-width: 0; }
.rsbi-consent__row-name { display: block; margin: 0; font-size: 0.9375rem; font-weight: 700; color: var(--rsbi-navy-900, #022441); }
.rsbi-consent__row-desc { margin: 0.125rem 0 0; font-size: 0.875rem; color: var(--rsbi-muted, #4a5a6a); }
.rsbi-consent__always { flex-shrink: 0; margin: 0; font-size: 0.875rem; font-weight: 700; color: var(--rsbi-success, #1f7a4d); }

/* Switch: a native checkbox (role="switch"), restyled; borders and knob keep 3:1 against white. */
.rsbi-consent__switch {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  flex-shrink: 0;
  width: 3rem;
  height: 1.75rem;
  margin: 0;
  border: 2px solid var(--rsbi-muted, #4a5a6a);
  border-radius: var(--rsbi-radius-pill, 999px);
  background: var(--rsbi-white, #ffffff);
  cursor: pointer;
}
.rsbi-consent__switch::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 50%;
  background: var(--rsbi-muted, #4a5a6a);
  transform: translateY(-50%);
}
.rsbi-consent__switch:checked { background: var(--rsbi-navy-800, #042d4d); border-color: var(--rsbi-navy-800, #042d4d); }
.rsbi-consent__switch:checked::before { background: var(--rsbi-white, #ffffff); transform: translate(1.25rem, -50%); }

@media (min-width: 640px) {
  .rsbi-consent__actions { display: flex; flex-wrap: wrap; }
  .rsbi-consent__btn { padding-inline: 1.5rem; }
}
@media (min-width: 1024px) {
  .rsbi-consent__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "body actions" "prefs prefs";
    column-gap: 2rem;
    align-items: center;
    padding-block: 1.25rem;
  }
  .rsbi-consent__actions { flex-wrap: nowrap; }
  .rsbi-consent__prefs { max-width: 46rem; }
}
/* Short viewports (landscape phones, 400% zoom): tighter, at most half the height so the page stays
   reachable, and the bar scrolls within itself (focused buttons scroll into view inside it).
   The sticky mobile bar steps aside while the banner shows (its actions repeat the header CTA and
   page links), so header + banner + bar never fill the screen and focused controls stay visible
   (WCAG 2.4.11); the calculator bar is already hidden at these heights (calculator.css). */
@media (max-height: 480px) {
  .rsbi-consent { max-height: 50vh; max-height: 50dvh; }
  html[data-consent-shown] [data-sticky-mobile-bar] { display: none; }
  .rsbi-consent__inner { gap: 0.5rem; padding-block: 0.625rem; }
  .rsbi-consent__title { font-size: 1rem; }
  .rsbi-consent__text { font-size: 0.875rem; line-height: 1.45; }
}

/* While the banner shows, focused controls are scrolled clear of it (WCAG 2.4.11). Scroll padding cannot
   lift the last footer row above the banner once the page is scrolled to its end, so the body also
   reserves the banner's space (and the home indicator's safe area) below the page. */
html[data-consent-shown] { scroll-padding-bottom: calc(var(--rsbi-consent-space, 0px) + 1rem); }
html[data-consent-shown] body { padding-bottom: calc(var(--rsbi-consent-space, 0px) + env(safe-area-inset-bottom, 0px)); }

@media (prefers-reduced-motion: no-preference) {
  .rsbi-consent { transition: bottom 0.3s var(--rsbi-ease, cubic-bezier(0.2, 0.8, 0.2, 1)); }
  .rsbi-consent:not([hidden]) { animation: rsbi-consent-in 0.3s var(--rsbi-ease, cubic-bezier(0.2, 0.8, 0.2, 1)); }
  .rsbi-consent__btn { transition: background-color 0.15s, border-color 0.15s; }
}
@keyframes rsbi-consent-in {
  from { transform: translateY(100%); }
  to { transform: none; }
}

@media (forced-colors: active) {
  .rsbi-consent { border-top: 2px solid CanvasText; }
  .rsbi-consent__switch { -webkit-appearance: auto; appearance: auto; width: auto; height: auto; border: 0; }
  .rsbi-consent__switch::before { content: none; }
}

@media print {
  .rsbi-consent { display: none !important; }
}