/* Gladiatorz inline registration v3
   Registration and legal information stay on the portal page.
*/

/* "Passwort vergessen?" remains part of the login artwork. */
.portal-form .portal-forgot-link{
  pointer-events: auto;
  position: absolute;
  left: 42.04%;
  top: 50.9%;
  width: 14.94%;
  padding-left: .25em;
  color: rgba(242,230,200,.92);
  font-size: clamp(11px, .85vw, 13px);
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-shadow: 0 1px 2px rgba(0,0,0,.75);
  opacity: .95;
}
.portal-form .portal-forgot-link:hover,
.portal-form .portal-forgot-link:focus-visible{
  color: rgba(255,215,140,.98);
  opacity: 1;
}

/* Login fades away while the parchment is shown. */
.portal-wrap #login,
.portal-wrap #quickregister,
.portal-wrap .portal-copyright{
  transition: opacity .22s ease, visibility .22s ease;
}
.portal-wrap.is-register-open #login,
.portal-wrap.is-register-open #quickregister,
.portal-wrap.is-register-open .portal-copyright{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.portal-page.portal-register-active .portal-scroll-hint{
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Full-size image overlay. The supplied WebP uses the exact portal aspect ratio. */
#registerWrap.portal-register-inline{
  position: absolute !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  overflow: hidden !important;
  z-index: 20 !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
}
#registerWrap.portal-register-inline[hidden]{
  display: none !important;
}
#registerWrap.portal-register-inline:not([hidden]){
  display: block !important;
}
#registerWrap.portal-register-inline.is-visible{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#registerWrap.portal-register-inline::before,
#registerWrap.portal-register-inline::after{
  content: none !important;
  display: none !important;
}

.portal-register-dim{
  position: absolute;
  inset: 0;
  z-index: 0;
  background: rgba(0,0,0,.46);
  backdrop-filter: blur(1.2px);
}
.portal-register-art{
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.48));
  transform: scale(.988);
  opacity: .3;
  transition: transform .25s ease, opacity .25s ease;
}
#registerWrap.is-visible .portal-register-art{
  transform: scale(1);
  opacity: 1;
}

/* Interior of the parchment in registrieren.webp. */
#registerWrap .portal-register-sheet{
  position: absolute !important;
  left: 40.05% !important;
  top: calc(27.55% + 45px) !important;
  width: 18.75% !important;
  height: 43.15% !important;
  z-index: 2 !important;
  box-sizing: border-box !important;
  padding: .42cqw .46cqw .38cqw !important;
  color: #3d2413 !important;
  transform: translateY(10px);
  opacity: 0;
  transition: transform .25s ease, opacity .25s ease;
}
#registerWrap.is-visible .portal-register-sheet{
  transform: translateY(0);
  opacity: 1;
}

#registerWrap .portal-register-form{
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(3px, .23cqw, 7px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: none;
  transform: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #3d2413 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(10px, .69cqw, 14px) !important;
  line-height: 1.18 !important;
}
#registerWrap .portal-register-form::-webkit-scrollbar{ display:none; }

#registerWrap .portal-register-heading{
  flex: 0 0 auto;
  text-align: center;
  margin: 0 0 clamp(1px, .08cqw, 3px);
}
#registerWrap .portal-register-heading > span{
  display: block;
  margin-bottom: 1px;
  color: #81501d;
  font-family: system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: clamp(8px, .46cqw, 10px);
  font-weight: 850;
  letter-spacing: .14em;
}
#registerWrap .portal-register-heading h2{
  margin: 0 !important;
  color: #4b2a13 !important;
  font-size: clamp(18px, 1.22cqw, 25px) !important;
  line-height: 1 !important;
  letter-spacing: .01em;
  text-shadow: 0 1px rgba(255,241,192,.55);
}

#registerWrap .portal-register-fields{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(3px, .22cqw, 6px) !important;
  flex: 0 0 auto;
}
#registerWrap input[type="text"],
#registerWrap input[type="email"],
#registerWrap input[type="password"]{
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: clamp(27px, 1.72cqw, 35px) !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 clamp(8px, .54cqw, 12px) !important;
  border: 1px solid rgba(93,55,22,.58) !important;
  border-radius: clamp(5px, .34cqw, 8px) !important;
  outline: none !important;
  background: rgba(255,244,199,.48) !important;
  box-shadow: inset 0 1px 3px rgba(72,39,14,.14), 0 1px rgba(255,255,255,.25) !important;
  color: #3b2111 !important;
  -webkit-text-fill-color: #3b2111 !important;
  caret-color: #6e3f17 !important;
  font: 700 clamp(10px, .67cqw, 14px)/1 system-ui, -apple-system, Segoe UI, sans-serif !important;
}
#registerWrap input[type="text"]::placeholder,
#registerWrap input[type="email"]::placeholder,
#registerWrap input[type="password"]::placeholder{
  color: rgba(74,42,19,.66) !important;
  opacity: 1 !important;
}
#registerWrap input[type="text"]:focus,
#registerWrap input[type="email"]:focus,
#registerWrap input[type="password"]:focus{
  border-color: rgba(139,78,20,.95) !important;
  box-shadow: 0 0 0 2px rgba(139,78,20,.18), inset 0 1px 3px rgba(72,39,14,.12) !important;
}
#registerWrap input:-webkit-autofill,
#registerWrap input:-webkit-autofill:hover,
#registerWrap input:-webkit-autofill:focus{
  -webkit-text-fill-color: #3b2111 !important;
  box-shadow: 0 0 0 1000px rgba(255,244,199,.92) inset !important;
}

#registerWrap .portal-name-suggestions{
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin: -1px 0 0;
}
#registerWrap .portal-name-suggestions[hidden]{ display:none !important; }
#registerWrap .portal-sug{
  min-height: 20px !important;
  margin: 0 !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(105,60,21,.48) !important;
  border-radius: 999px !important;
  background: rgba(255,239,178,.5) !important;
  color: #4d2b13 !important;
  box-shadow: none !important;
  font: 700 clamp(8px, .52cqw, 11px)/1 system-ui, sans-serif !important;
}

#registerWrap .portal-register-gender{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: clamp(7px, .55cqw, 13px) !important;
  margin: 0 !important;
  padding: clamp(2px, .12cqw, 4px) 0 0 !important;
  border: 0 !important;
  min-width: 0 !important;
  flex: 0 0 auto;
}
#registerWrap .portal-register-gender legend{
  padding: 0 !important;
  color: #5c3417 !important;
  font: 800 clamp(9px, .58cqw, 12px)/1 system-ui, sans-serif !important;
}
#registerWrap .portal-register-gender label{
  position: relative;
  display: inline-flex !important;
  align-items: center !important;
  cursor: pointer;
  color: #4d2a13 !important;
  font: 750 clamp(9px, .57cqw, 12px)/1 system-ui, sans-serif !important;
}
#registerWrap .portal-register-gender input,
#registerWrap .portal-register-terms input{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none;
}
#registerWrap .portal-register-gender span{
  position: relative;
  padding-left: clamp(17px, 1.04cqw, 21px);
}
#registerWrap .portal-register-gender span::before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: clamp(11px, .73cqw, 15px);
  height: clamp(11px, .73cqw, 15px);
  transform: translateY(-50%);
  border: 1px solid rgba(92,50,17,.8);
  border-radius: 50%;
  background: rgba(255,242,190,.55);
  box-shadow: inset 0 1px 2px rgba(60,30,8,.22);
}
#registerWrap .portal-register-gender input:checked + span::after{
  content: "";
  position: absolute;
  left: clamp(3px, .22cqw, 5px);
  top: 50%;
  width: clamp(5px, .32cqw, 7px);
  height: clamp(5px, .32cqw, 7px);
  transform: translateY(-50%);
  border-radius: 50%;
  background: #8b4c18;
  box-shadow: 0 0 5px rgba(116,56,12,.35);
}

#registerWrap .portal-register-terms{
  position: relative;
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 clamp(18px, 1.08cqw, 22px) !important;
  color: #4c2b14 !important;
  cursor: pointer;
  font: 650 clamp(8px, .53cqw, 11px)/1.25 system-ui, -apple-system, Segoe UI, sans-serif !important;
  flex: 0 0 auto;
}
#registerWrap .portal-register-terms > span::before{
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  width: clamp(11px, .73cqw, 15px);
  height: clamp(11px, .73cqw, 15px);
  border: 1px solid rgba(92,50,17,.8);
  border-radius: 3px;
  background: rgba(255,242,190,.55);
  box-shadow: inset 0 1px 2px rgba(60,30,8,.22);
}
#registerWrap .portal-register-terms input:checked + span::after{
  content: "";
  position: absolute;
  left: clamp(3px, .2cqw, 4px);
  top: clamp(1px, .08cqw, 2px);
  width: clamp(4px, .28cqw, 6px);
  height: clamp(7px, .43cqw, 9px);
  border: solid #814516;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
#registerWrap .portal-register-terms a{
  color: #703b11 !important;
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: 2px;
}

#registerWrap .portal-register-message{
  display: block !important;
  position: static !important;
  width: 100% !important;
  min-height: clamp(14px, .9cqw, 19px) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #7e2317 !important;
  font: 800 clamp(8px, .52cqw, 11px)/1.15 system-ui, sans-serif !important;
  text-align: center !important;
  text-shadow: none !important;
  flex: 0 0 auto;
}
#registerWrap .portal-register-message.ok{ color:#315f28 !important; }
#registerWrap .portal-register-message.bad{ color:#842617 !important; }

#registerWrap .portal-register-actions{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: clamp(4px, .3cqw, 7px) !important;
  margin-top: auto !important;
  padding-top: 1px !important;
  flex: 0 0 auto;
}
#registerWrap .portal-register-actions button{
  min-width: 0 !important;
  min-height: clamp(27px, 1.72cqw, 35px) !important;
  margin: 0 !important;
  padding: 0 clamp(4px, .32cqw, 8px) !important;
  border: 1px solid rgba(91,49,17,.72) !important;
  border-radius: clamp(5px, .34cqw, 8px) !important;
  color: #fff0c2 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.55) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14), 0 2px 5px rgba(64,31,8,.22) !important;
  cursor: pointer !important;
  font: 850 clamp(8px, .56cqw, 12px)/1 system-ui, -apple-system, Segoe UI, sans-serif !important;
}
#registerWrap .portal-register-submit{
  background: linear-gradient(#9c5a1e,#63320f) !important;
}
#registerWrap .portal-register-cancel{
  background: linear-gradient(#71502d,#452d19) !important;
}
#registerWrap .portal-register-actions button:hover,
#registerWrap .portal-register-actions button:focus-visible{
  filter: brightness(1.12);
  outline: 2px solid rgba(115,60,17,.24) !important;
  outline-offset: 1px !important;
}
#registerWrap .portal-register-actions button:disabled{
  opacity: .62 !important;
  cursor: wait !important;
}

/* Same-page document viewer for AGB, DSE, Impressum and password reset. */
.portal-document-overlay{
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(5px);
}
.portal-document-overlay[hidden]{ display:none !important; }
.portal-document-panel{
  width: min(980px, calc(100vw - 24px));
  height: min(780px, calc(100dvh - 24px));
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  border: 1px solid rgba(212,175,55,.5);
  border-radius: 14px;
  background: #100a06;
  box-shadow: 0 28px 90px rgba(0,0,0,.78), 0 0 35px rgba(166,90,22,.12);
}
.portal-document-header{
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 8px 10px 8px 18px;
  border-bottom: 1px solid rgba(212,175,55,.24);
  background: linear-gradient(180deg,#2a190d,#120b06);
}
.portal-document-header h2{
  margin: 0;
  color: #f2d78e;
  font: 850 clamp(16px,2vw,22px)/1 system-ui, sans-serif;
  letter-spacing: .02em;
}
.portal-document-header button{
  width: 38px;
  height: 36px;
  padding: 0;
  border: 1px solid rgba(212,175,55,.36);
  border-radius: 8px;
  background: rgba(255,255,255,.05);
  color: #f8df9c;
  cursor: pointer;
  font: 400 28px/1 system-ui, sans-serif;
}
.portal-document-header button:hover,
.portal-document-header button:focus-visible{
  background: rgba(255,255,255,.11);
  outline: none;
}
#portalDocumentFrame{
  width: 100%;
  height: 100%;
  border: 0;
  background: #f4ead4;
}
body.portal-document-open{ overflow:hidden !important; }

@media (max-width: 820px){
  .portal-document-overlay{ padding: 7px; }
  .portal-document-panel{
    width: calc(100vw - 10px);
    height: calc(100dvh - 10px);
    border-radius: 9px;
  }
  .portal-document-header{ min-height: 46px; padding-left: 13px; }
}

@media (prefers-reduced-motion: reduce){
  #registerWrap.portal-register-inline,
  .portal-register-art,
  #registerWrap .portal-register-sheet,
  .portal-wrap #login,
  .portal-wrap #quickregister,
  .portal-wrap .portal-copyright{
    transition: none !important;
  }
}