/* === Vlak CSS uit index.php verplaatst === */
.fixed-text {
  width: 100%;
  margin: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  padding: 20px 8%;
  font-size: 16px;
  line-height: 1.6;
  white-space: pre-wrap;
  background: var(--overlay-black-0); /* kleur komt via id/variabele */
}

/* Header & Footer */
[id$="-headerBox"] { background-color: var(--Header); }
[id$="-footerBox"] { background-color: var(--Footer); }

/* Main 00-09 */
#Main-NL-textBox00, #Main-EN-textBox00 { background-color: var(--Main-00); }
#Main-NL-textBox01, #Main-EN-textBox01 { background-color: var(--Main-01); }
#Main-NL-textBox02, #Main-EN-textBox02 { background-color: var(--Main-02); }
#Main-NL-textBox03, #Main-EN-textBox03 { background-color: var(--Main-03); }
#Main-NL-textBox04, #Main-EN-textBox04 { background-color: var(--Main-04); }
#Main-NL-textBox05, #Main-EN-textBox05 { background-color: var(--Main-05); }
#Main-NL-textBox06, #Main-EN-textBox06 { background-color: var(--Main-06); }
#Main-NL-textBox07, #Main-EN-textBox07 { background-color: var(--Main-07); }
#Main-NL-textBox08, #Main-EN-textBox08 { background-color: var(--Main-08); }
#Main-NL-textBox09, #Main-EN-textBox09 { background-color: var(--Main-09); }

/* Alt0 */
#Alt0-NL-textBox00, #Alt0-EN-textBox00 { background-color: var(--Alt0-00); }
#Alt0-NL-textBox01, #Alt0-EN-textBox01 { background-color: var(--Alt0-01); }
#Alt0-NL-textBox02, #Alt0-EN-textBox02 { background-color: var(--Alt0-02); }
#Alt0-NL-textBox03, #Alt0-EN-textBox03 { background-color: var(--Alt0-03); }
#Alt0-NL-textBox04, #Alt0-EN-textBox04 { background-color: var(--Alt0-04); }
#Alt0-NL-textBox05, #Alt0-EN-textBox05 { background-color: var(--Alt0-05); }
#Alt0-NL-textBox06, #Alt0-EN-textBox06 { background-color: var(--Alt0-06); }
#Alt0-NL-textBox07, #Alt0-EN-textBox07 { background-color: var(--Alt0-07); }
#Alt0-NL-textBox08, #Alt0-EN-textBox08 { background-color: var(--Alt0-08); }
#Alt0-NL-textBox09, #Alt0-EN-textBox09 { background-color: var(--Alt0-09); }

/* Alt1 */
#Alt1-NL-textBox00, #Alt1-EN-textBox00 { background-color: var(--Alt1-00); }
#Alt1-NL-textBox01, #Alt1-EN-textBox01 { background-color: var(--Alt1-01); }
#Alt1-NL-textBox02, #Alt1-EN-textBox02 { background-color: var(--Alt1-02); }
#Alt1-NL-textBox03, #Alt1-EN-textBox03 { background-color: var(--Alt1-03); }
#Alt1-NL-textBox04, #Alt1-EN-textBox04 { background-color: var(--Alt1-04); }
#Alt1-NL-textBox05, #Alt1-EN-textBox05 { background-color: var(--Alt1-05); }
#Alt1-NL-textBox06, #Alt1-EN-textBox06 { background-color: var(--Alt1-06); }
#Alt1-NL-textBox07, #Alt1-EN-textBox07 { background-color: var(--Alt1-07); }
#Alt1-NL-textBox08, #Alt1-EN-textBox08 { background-color: var(--Alt1-08); }
#Alt1-NL-textBox09, #Alt1-EN-textBox09 { background-color: var(--Alt1-09); }

/* Alt2 */
#Alt2-NL-textBox00, #Alt2-EN-textBox00 { background-color: var(--Alt2-00); }
#Alt2-NL-textBox01, #Alt2-EN-textBox01 { background-color: var(--Alt2-01); }
#Alt2-NL-textBox02, #Alt2-EN-textBox02 { background-color: var(--Alt2-02); }
#Alt2-NL-textBox03, #Alt2-EN-textBox03 { background-color: var(--Alt2-03); }
#Alt2-NL-textBox04, #Alt2-EN-textBox04 { background-color: var(--Alt2-04); }
#Alt2-NL-textBox05, #Alt2-EN-textBox05 { background-color: var(--Alt2-05); }
#Alt2-NL-textBox06, #Alt2-EN-textBox06 { background-color: var(--Alt2-06); }
#Alt2-NL-textBox07, #Alt2-EN-textBox07 { background-color: var(--Alt2-07); }
#Alt2-NL-textBox08, #Alt2-EN-textBox08 { background-color: var(--Alt2-08); }
#Alt2-NL-textBox09, #Alt2-EN-textBox09 { background-color: var(--Alt2-09); }

/* Alt3 */
#Alt3-NL-textBox00, #Alt3-EN-textBox00 { background-color: var(--Alt3-00); }
#Alt3-NL-textBox01, #Alt3-EN-textBox01 { background-color: var(--Alt3-01); }
#Alt3-NL-textBox02, #Alt3-EN-textBox02 { background-color: var(--Alt3-02); }
#Alt3-NL-textBox03, #Alt3-EN-textBox03 { background-color: var(--Alt3-03); }
#Alt3-NL-textBox04, #Alt3-EN-textBox04 { background-color: var(--Alt3-04); }
#Alt3-NL-textBox05, #Alt3-EN-textBox05 { background-color: var(--Alt3-05); }
#Alt3-NL-textBox06, #Alt3-EN-textBox06 { background-color: var(--Alt3-06); }
#Alt3-NL-textBox07, #Alt3-EN-textBox07 { background-color: var(--Alt3-07); }
#Alt3-NL-textBox08, #Alt3-EN-textBox08 { background-color: var(--Alt3-08); }
#Alt3-NL-textBox09, #Alt3-EN-textBox09 { background-color: var(--Alt3-09); }

/* Alt4 */
#Alt4-NL-textBox00, #Alt4-EN-textBox00 { background-color: var(--Alt4-00); }
#Alt4-NL-textBox01, #Alt4-EN-textBox01 { background-color: var(--Alt4-01); }
#Alt4-NL-textBox02, #Alt4-EN-textBox02 { background-color: var(--Alt4-02); }
#Alt4-NL-textBox03, #Alt4-EN-textBox03 { background-color: var(--Alt4-03); }
#Alt4-NL-textBox04, #Alt4-EN-textBox04 { background-color: var(--Alt4-04); }
#Alt4-NL-textBox05, #Alt4-EN-textBox05 { background-color: var(--Alt4-05); }
#Alt4-NL-textBox06, #Alt4-EN-textBox06 { background-color: var(--Alt4-06); }
#Alt4-NL-textBox07, #Alt4-EN-textBox07 { background-color: var(--Alt4-07); }
#Alt4-NL-textBox08, #Alt4-EN-textBox08 { background-color: var(--Alt4-08); }
#Alt4-NL-textBox09, #Alt4-EN-textBox09 { background-color: var(--Alt4-09); }

/* Alt5 */
#Alt5-NL-textBox00, #Alt5-EN-textBox00 { background-color: var(--Alt5-00); }
#Alt5-NL-textBox01, #Alt5-EN-textBox01 { background-color: var(--Alt5-01); }
#Alt5-NL-textBox02, #Alt5-EN-textBox02 { background-color: var(--Alt5-02); }
#Alt5-NL-textBox03, #Alt5-EN-textBox03 { background-color: var(--Alt5-03); }
#Alt5-NL-textBox04, #Alt5-EN-textBox04 { background-color: var(--Alt5-04); }
#Alt5-NL-textBox05, #Alt5-EN-textBox05 { background-color: var(--Alt5-05); }
#Alt5-NL-textBox06, #Alt5-EN-textBox06 { background-color: var(--Alt5-06); }
#Alt5-NL-textBox07, #Alt5-EN-textBox07 { background-color: var(--Alt5-07); }
#Alt5-NL-textBox08, #Alt5-EN-textBox08 { background-color: var(--Alt5-08); }
#Alt5-NL-textBox09, #Alt5-EN-textBox09 { background-color: var(--Alt5-09); }

/* ✅ Full-bleed alleen binnen page content (modals blijven met vak-stijl) */
#pageContent { overflow-x: clip; }
@supports not (overflow-x: clip) { #pageContent { overflow-x: hidden; } }

#pageContent .fixed-text {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
}



/* ✅ Auth-modal behoudt compacte vak-stijl */
.auth-modal .modal .fixed-text {
  width: auto !important;
  max-width: 420px !important;
  margin: 20px auto !important;
  padding: 20px !important; /* in modals geen 8% zijkant */
  border-radius: 10px;
  box-shadow: 0 3px 10px var(--overlay-black-02);
  background: var(--modal-bg, var(--auth-btn-text));
}

