/* git.mapen.cz – vlastni prihlasovaci stranka (vklada nginx sub_filter, jen body.login-page)
   zdroj: git.mapen.cz/active/gitlab-login */
body.login-page {
  --mx-green: #39ff8c;
  --mx-green-dim: #1f8f52;
  --mx-text: #d7ffe6;
  --mx-muted: #7fbf98;
  background: #030605 !important;
  color: var(--mx-text) !important;
}
body.login-page #mx-matrix {
  position: fixed; inset: 0; width: 100vw; height: 100vh;
  z-index: 0; pointer-events: none; opacity: .55;
}
body.login-page::after {               /* jemne skenovaci radky CRT */
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 1px, transparent 1px 3px);
}
body.login-page > div, body.login-page .footer-container { position: relative; z-index: 1; }
body.login-page .footer-container, body.login-page .footer-container * { background-color: transparent !important; }
body.login-page .footer-container, body.login-page .footer-container > .container { border: 0 !important; box-shadow: none !important; }
body.login-page .footer-container > .container { border-top: 0 !important; }

/* puvodni male logo pryc, misto nej velke neonove */
body.login-page .js-portrait-logo-detection { display: none !important; }
body.login-page .mx-logo {
  display: block; width: min(460px, 92%); margin: 0 auto 6px; height: auto;
  filter: drop-shadow(0 0 14px rgba(57,255,140,.45)) drop-shadow(0 0 2px rgba(255,45,60,.4));
  animation: mx-glitch 7s infinite steps(1);
}
@keyframes mx-glitch {
  0%, 91%, 100% { transform: none; filter: drop-shadow(0 0 14px rgba(57,255,140,.45)); }
  92% { transform: translate(-3px, 1px) skewX(-4deg); filter: drop-shadow(3px 0 0 rgba(255,45,60,.8)) drop-shadow(-3px 0 0 rgba(57,255,140,.8)); }
  94% { transform: translate(2px, -1px); clip-path: inset(30% 0 40% 0); }
  96% { transform: translate(-1px, 0) skewX(3deg); }
}
body.login-page .mx-term {
  font: 600 14px/1.4 ui-monospace, "JetBrains Mono", "Fira Code", Menlo, Consolas, monospace;
  color: var(--mx-green); text-align: center; min-height: 20px; margin-bottom: 18px;
  text-shadow: 0 0 6px rgba(57,255,140,.6); letter-spacing: .03em;
}
body.login-page .mx-term::after { content: "▋"; animation: mx-blink 1s steps(1) infinite; margin-left: 2px; }
@keyframes mx-blink { 50% { opacity: 0; } }

/* karta s formularem */
body.login-page .bar {
  background: rgba(4, 14, 9, .80) !important;
  border: 1px solid rgba(57,255,140,.35) !important;
  border-radius: 14px !important;
  padding: 28px 24px !important;
  box-shadow: 0 0 40px rgba(57,255,140,.12), inset 0 0 30px rgba(57,255,140,.05) !important;
  backdrop-filter: blur(3px);
}
body.login-page label, body.login-page .gl-form-checkbox label, body.login-page .custom-control-label {
  color: var(--mx-muted) !important;
  font-family: ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace !important;
  text-transform: lowercase; letter-spacing: .04em;
}
/* prompt jen u poli jmeno/heslo (::before u checkboxu kresli GitLab ctverecek!) */
body.login-page label[for="user_login"]::before, body.login-page label[for="user_password"]::before { content: "> "; color: var(--mx-green); }
body.login-page .custom-control-label::before { background: #06110b !important; border-color: var(--mx-green-dim) !important; }
body.login-page .custom-control-input:checked ~ .custom-control-label::before { background: var(--mx-green) !important; border-color: var(--mx-green) !important; }
body.login-page .form-control, body.login-page .gl-form-input, body.login-page input[type=text], body.login-page input[type=password] {
  background: #06110b !important; color: var(--mx-text) !important;
  border: 1px solid var(--mx-green-dim) !important; box-shadow: none !important;
  font-family: ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace !important;
  caret-color: var(--mx-green);
}
body.login-page .form-control:focus, body.login-page .gl-form-input:focus {
  border-color: var(--mx-green) !important;
  box-shadow: 0 0 0 1px var(--mx-green), 0 0 18px rgba(57,255,140,.35) !important;
}
body.login-page .gl-button.btn-confirm, body.login-page button.btn-block {
  background: linear-gradient(180deg, #13b765, #0b7a44) !important; border: 0 !important;
  color: #021008 !important; font: 700 14px ui-monospace, Menlo, Consolas, monospace !important;
  text-transform: uppercase; letter-spacing: .18em;
  box-shadow: 0 0 18px rgba(57,255,140,.35) !important; transition: box-shadow .2s, transform .1s;
}
body.login-page .gl-button.btn-confirm:hover, body.login-page button.btn-block:hover {
  box-shadow: 0 0 28px rgba(57,255,140,.7) !important; transform: translateY(-1px);
}
body.login-page a, body.login-page .gl-link { color: var(--mx-green) !important; }
body.login-page .footer-container a, body.login-page .footer-container .gl-button-text { color: var(--mx-muted) !important; }
body.login-page .footer-container .btn { background: transparent !important; border-color: rgba(57,255,140,.3) !important; }
body.login-page .gl-field-error { color: #ff5c6c !important; }
body.login-page .flash-container .gl-alert { background: rgba(40,6,10,.85) !important; color: #ffd7dc !important; border: 1px solid #ff2d3c !important; }

/* levy sloupec: titulek a popis jako terminal */
body.login-page h1 {
  color: var(--mx-green) !important;
  font-family: ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace !important;
  text-shadow: 0 0 10px rgba(57,255,140,.6);
}
body.login-page h1::before { content: "root@mapen:~# "; color: var(--mx-muted); font-weight: 400; }
body.login-page #js-custom-sign-in-description, body.login-page #js-custom-sign-in-description p {
  color: var(--mx-muted) !important; font-family: ui-monospace, Menlo, Consolas, monospace !important;
}
body.login-page input:-webkit-autofill {
  -webkit-text-fill-color: var(--mx-text) !important;
  -webkit-box-shadow: 0 0 0 1000px #06110b inset !important;
}
@media (prefers-reduced-motion: reduce) {
  body.login-page .mx-logo, body.login-page .mx-term::after { animation: none; }
}
body.login-page .footer-container hr { border-color: rgba(57,255,140,.15) !important; }

/* jen prihlaseni uprostred: levy sloupec (titulek + popis) a mobilni nadpis pryc */
body.login-page main .row > div:has(#js-custom-sign-in-description),
body.login-page main h1,
body.login-page .mx-hide { display: none !important; }
body.login-page main .row { justify-content: center !important; }
body.login-page main .row > div:has(.bar) { flex: 0 0 auto !important; width: min(520px, 100%) !important; max-width: 520px !important; }
