/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Stable space for consent-gated units, including empty and blocked responses. */
.consent-ad-space { height: 250px; width: 100%; overflow: hidden; }
.consent-ad-slot { min-height: 290px; contain: layout; }
.privacy-dialog { max-width: 36rem; width: calc(100% - 2rem); max-height: calc(100dvh - 3rem); overflow: auto; margin: auto; padding: 1.5rem; border: 2px solid #012169; border-radius: 1rem; color: #111827; background: white; }
.privacy-dialog::backdrop { background: rgb(0 0 0 / 50%); }
.privacy-dialog h2 { font-size: 1.4rem; font-weight: 800; }
.privacy-dialog p { margin: 1rem 0; }
.privacy-dialog a { color: #012169; text-decoration: underline; }
.privacy-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.privacy-actions button { min-height: 44px; padding: .6rem .8rem; border: 2px solid #012169; border-radius: .4rem; font-weight: 700; cursor: pointer; }
.privacy-actions button:focus-visible, [data-privacy-settings]:focus-visible { outline: 3px solid #C8102E; outline-offset: 3px; }

.skip-link { position: fixed; left: 1rem; top: 1rem; z-index: 1000; transform: translateY(-200%); padding: .75rem 1rem; background: #fff; color: #012169; border: 2px solid #012169; border-radius: .4rem; font-weight: 700; }
.skip-link:focus { transform: none; }
html { scroll-padding-top: 7rem; scroll-padding-bottom: 5rem; }
#main-content { overflow-wrap: anywhere; }
.quiz-layout > * { min-width: 0; }
:where(a, button, input, select, textarea, summary, [tabindex]) { scroll-margin-top: 7rem; scroll-margin-bottom: 5rem; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
