/* ============================================================================
   Sesame Consent Banner

   Global defaults live here.
   Member-specific colors may be overridden in /assets/css/local.css.
   ========================================================================== */

:root {
  --sesame-consent-background:#fff;
  --sesame-consent-text:#000;

  --sesame-consent-link:#1f5f8b;
  --sesame-consent-link-hover:#123f5e;

  --sesame-consent-button-background:#3985bd;
  --sesame-consent-button-text:#fff;
  --sesame-consent-button-hover-background:#3985bd;
  --sesame-consent-button-hover-text:#000;

  --sesame-consent-button-focus:#000;

  --sesame-consent-overlay:rgba(0, 0, 0, 0.45);
  --sesame-consent-shadow:rgba(0, 0, 0, 0.28);
}


/* Prevent the page behind the modal from scrolling. */
html.sesame-consent-open,
body.sesame-consent-open {
  overflow:hidden !important;
  overscroll-behavior:none;
}


/* Full-page layer created by sesame-consent.js. */
#sesame-consent-overlay {
  background:var(--sesame-consent-overlay);
  position:fixed;
  inset:0;
  z-index:2147483646;
  display:none;
  cursor:default;
  touch-action:none;
}

#sesame-consent-overlay.visible {
  display:block;
}


/* Main consent dialog. */
#sesame-consent-banner {
  box-sizing:border-box;
  text-align:center;
  color:var(--sesame-consent-text);
  background:var(--sesame-consent-background);
  width:calc(100% - 2rem);
  max-width:32.5rem;
  max-height:calc(100vh - 2rem);
  max-height:calc(100dvh - 2rem);
  margin:0;
  padding:1.25rem;
  border:0;
  position:fixed;
  top:50%;
  left:50%;
  z-index:2147483647;
  display:none;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  transform:translate(-50%, -50%);
  outline:0;
  box-shadow:0 0.5rem 1.5rem var(--sesame-consent-shadow);
  isolation:isolate;
}

#sesame-consent-banner.visible {
  display:block;
}


/* Keep hidden state authoritative if states briefly overlap. */
#sesame-consent-overlay[hidden],
#sesame-consent-banner[hidden] {
  display:none;
}


/* Reset common member-site heading styles inside the dialog. */
#sesame-consent-banner h2 {
  color:inherit;
  background:none;
  width:auto;
  margin:0 0 0.75rem;
  padding:0;
  border:0;
  float:none;
  font-family:inherit;
  font-size:1.4rem;
  font-style:normal;
  font-weight:700;
  letter-spacing:0.03em; 
  line-height:1.2;
  text-align:center;
  text-transform:uppercase;
}


#sesame-consent-banner .info {
  color:inherit;
  background:none;
  width:auto;
  margin:0 0 1.25rem;
  padding:0;
  border:0;
  float:none;
  font-family:inherit;
  font-size:1rem;
  font-style:normal;
  font-weight:400;
  letter-spacing:normal;
  line-height:1.5;
  text-align:center;
  text-transform:none;
  text-wrap:balance;
}


/* Future privacy-policy or preference links inside the dialog. */
#sesame-consent-banner a {
  color:var(--sesame-consent-link);
  text-decoration:underline;
  text-decoration-thickness:0.125rem;
  text-underline-offset:0.1875rem;
}

#sesame-consent-banner a:hover,
#sesame-consent-banner a:focus-visible {
  color:var(--sesame-consent-link-hover);
}

#sesame-consent-banner a:focus-visible {
  outline:0.1875rem solid var(--sesame-consent-button-focus);
  outline-offset:0.1875rem;
}


#sesame-consent-banner .links {
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:0.75rem;
  width:100%;
  margin:0;
  padding:0;
}


/* Protect the consent buttons from common member-site button styles. */
#sesame-consent-banner button {
  box-sizing:border-box;
  color:var(--sesame-consent-button-text);
  background:var(--sesame-consent-button-background);
  width:auto;
  min-width:9.5rem;
  min-height:2.75rem;
  margin:0;
  padding:0.65rem 1rem;
  border:0;
  border-radius:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  float:none;
  font-family:inherit;
  font-size:0.9rem;
  font-style:normal;
  font-weight:700;
  letter-spacing:normal;
  line-height:1.2;
  text-align:center;
  text-transform:uppercase;
  text-decoration:underline;
  text-decoration-color:transparent;
  text-decoration-thickness:0.125rem;
  text-underline-offset:0.1875rem;
  -webkit-appearance:none;
  appearance:none;
  cursor:pointer;
  box-shadow:none;
  transition:
    color 0.3s ease,
    background-color 0.3s ease,
    text-decoration-color 0.3s ease;
}


#sesame-consent-banner button:hover {
  color:var(--sesame-consent-button-hover-text);
  background:var(--sesame-consent-button-hover-background);
  text-decoration-color:currentcolor;
}


/* Fallback focus treatment for browsers without :focus-visible. */
#sesame-consent-banner button:focus {
  color:var(--sesame-consent-button-hover-text);
  background:var(--sesame-consent-button-hover-background);
  text-decoration-color:currentcolor;
  outline:0.1875rem solid var(--sesame-consent-button-focus);
  outline-offset:0.1875rem;
}


/* Modern browsers: mouse focus stays quiet; keyboard focus is visible. */
@supports selector(:focus-visible) {

  #sesame-consent-banner button:focus {
    outline:none;
  }

  #sesame-consent-banner button:focus-visible {
    color:var(--sesame-consent-button-hover-text);
    background:var(--sesame-consent-button-hover-background);
    text-decoration-color:currentcolor;
    outline:0.1875rem solid var(--sesame-consent-button-focus);
    outline-offset:0.1875rem;
  }

}


@media (max-width:30rem) {

  #sesame-consent-banner {
    width:calc(100% - 1.5rem);
    max-height:calc(100vh - 1.5rem);
    max-height:calc(100dvh - 1.5rem);
    padding:1rem;
  }

  #sesame-consent-banner h2 {
    font-size:1.4rem;
  }

  #sesame-consent-banner .info {
    font-size:0.95rem;
  }

  #sesame-consent-banner .links {
    flex-direction:column;
  }

  #sesame-consent-banner button {
    width:100%;
    min-width:0;
  }

}


@media (prefers-reduced-motion:reduce) {

  #sesame-consent-banner button {
    transition:none;
  }

}


@media (forced-colors:active) {

  #sesame-consent-overlay {
    background:Canvas;
    opacity:0.75;
  }

  #sesame-consent-banner {
    border:0.125rem solid CanvasText;
    box-shadow:none;
  }

  #sesame-consent-banner button {
    border:0.125rem solid ButtonText;
  }

}