/* FKALL skin for Authelia v4.39.28. Authentication remains upstream. */
@font-face { font-family: "Golos FKALL"; src: url("/fkall-theme/golos-text-latin.woff2") format("woff2"); font-style: normal; font-weight: 400 900; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F; }
@font-face { font-family: "Golos FKALL"; src: url("/fkall-theme/golos-text-cyrillic.woff2") format("woff2"); font-style: normal; font-weight: 400 900; font-display: swap; unicode-range: U+0400-052F,U+2DE0-2DFF,U+A640-A69F,U+1C80-1C8F,U+2116; }
:root, html:root[data-theme], body[data-theme] {
  color-scheme: dark;
  --font-sans: "Golos FKALL", "Segoe UI", sans-serif;
  --default-font-family: var(--font-sans);
  --background: #111017; --foreground: #f0edf7;
  --card: #1b1923; --card-foreground: #f0edf7;
  --popover: #262330; --popover-foreground: #f0edf7;
  --primary: #b7a0ff; --primary-foreground: #17121f;
  --secondary: #302640; --secondary-foreground: #f0edf7;
  --muted: #262330; --muted-foreground: #b6b0c6;
  --accent: #302c3c; --accent-foreground: #f0edf7;
  --border: #393343; --input: #4c4458; --divider: #393343;
  --ring: #b7a0ff; --radius: .75rem;
  --custom-icon: #b7a0ff; --custom-loading-bar: #b7a0ff;
  --destructive: #f295a9; --destructive-foreground: #17121f;
}
body { margin: 0; min-width: 320px; min-height: 100svh; display: flex; flex-direction: column; font-family: var(--font-sans); color: var(--foreground); background: radial-gradient(ellipse 55% 65% at 15% 35%, #33244265, transparent 75%), radial-gradient(ellipse 45% 60% at 95% 5%, #29203855, transparent 75%), #111017; }
#root { flex: 1; min-width: 0; }
.fkall-header, .fkall-footer { width: min(calc(100% - 80px), 1220px); margin-inline: auto; display: flex; align-items: center; gap: 18px; }
.fkall-header { min-height: 82px; padding-right: 150px; border-bottom: 1px solid #2b2635; }
.fkall-brand { display: inline-flex; align-items: center; gap: 12px; color: #f0edf7; font-size: 20px; font-weight: 700; text-decoration: none; letter-spacing: -.03em; }
.fkall-brand img { border-radius: 13px; width: 42px; height: 42px; }
.fkall-header-rule { width: 1px; height: 22px; background: #393343; }
.fkall-header-label { color: #9590a7; font-size: 13px; }
#root header { position: absolute; right: max(40px, calc((100% - 1220px) / 2)); top: 19px; z-index: 10; }
#root header > div { padding: 0; }
#language-button { margin: 0; min-height: 42px; border-radius: 11px; color: #b6b0c6; font-size: 13px; padding-inline: 12px; }
.fkall-footer { min-height: 70px; justify-content: space-between; border-top: 1px solid #2b2635; color: #9590a7; font-size: 12px; line-height: 1.6; }
.fkall-footer a { color: #b6b0c6; text-decoration: none; }
.fkall-footer a:hover { color: #ccbaff; }
#first-factor-stage { min-height: calc(100svh - 152px); padding: 46px 20px; }
#first-factor-stage > div { max-width: 460px; padding: 34px 36px; border: 1px solid #393343; border-radius: 24px; background: #1b1923; box-shadow: 0 24px 80px #0004; text-align: left; }
#first-factor-stage .w-full:has(> #UserSvg) { width: 60px; height: 60px; padding: 0; margin-bottom: 22px; border-radius: 17px; background: url("/fkall-theme/mascot.png") center / cover no-repeat; }
#first-factor-stage #UserSvg { visibility: hidden; width: 60px; height: 60px; margin: 0; }
#first-factor-stage h5 { font-size: 30px; font-weight: 600; line-height: 1.2; letter-spacing: -.035em; margin-bottom: 16px; }
#first-factor-stage h5::before { content: "FKALL / ЕДИНЫЙ ВХОД"; display: block; margin-bottom: 12px; color: #b7a0ff; font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: .1em; }
[data-slot="floating-input"] { height: 58px; border-radius: 12px; background: #17151f; color: #f0edf7; font-family: inherit; font-size: 15px; transition: border-color .16s, box-shadow .16s; }
[data-slot="floating-input"]:hover { border-color: #71647f; }
[data-slot="floating-input"]:focus { outline: none; border-color: #b7a0ff; box-shadow: 0 0 0 3px #b7a0ff20; }
[data-slot="floating-input"]:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px #17151f inset; -webkit-text-fill-color: #f0edf7; caret-color: #f0edf7; }
#form-login label { font-family: inherit; }
#form-login label[for="remember-checkbox"] { color: #b6b0c6; font-size: 13px; }
#form-login button[aria-pressed] { min-width: 40px; min-height: 40px; border-radius: 8px; }
#form-login input[type="password"], #password-textfield { padding-right: 52px; }
#remember-checkbox { width: 18px; height: 18px; }
#sign-in-button { background: #b7a0ff; color: #17121f; height: 52px; border-radius: 12px; text-transform: none; font-size: 14px; font-weight: 600; margin-top: 6px; }
#sign-in-button:not(:disabled):hover { background: #ccbaff; transform: translateY(-1px); }
#sign-in-button:active { transform: translateY(1px); }
#first-factor-stage a[href="https://www.authelia.com"] { display: inline-block; margin-top: 19px; color: #9590a7; font-size: 11px; }
:focus-visible { outline: 2px solid #b7a0ff; outline-offset: 3px; }
::selection { color: #f0edf7; background: #4a385c; }
@media (max-width: 540px) {
 .fkall-header, .fkall-footer { width: calc(100% - 32px); }
 .fkall-header { min-height: 74px; padding-right: 100px; }
 .fkall-header-label, .fkall-header-rule { display: none; }
 #root header { top: 16px; right: 16px; }
 #language-button { padding-inline: 8px; }
 #first-factor-stage { min-height: calc(100svh - 162px); padding: 28px 16px; }
 #first-factor-stage > div { padding: 27px 24px; border-radius: 20px; }
 #first-factor-stage h5 { font-size: 27px; }
 .fkall-footer { min-height: 88px; align-items: flex-start; justify-content: center; flex-direction: column; gap: 5px; padding-block: 15px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { #sign-in-button, [data-slot="floating-input"] { transition: none; transform: none; } }

/* Secondary ghost buttons inherit the dark secondary fill as text upstream. */
:is(#logout-button, #switch-user-button, #openid-consent-deny, #openid-consent-cancel) { color: #d8c8ff; background-color: #b7a0ff0a; border-radius: 8px; transition: color .15s, background-color .15s; }
:is(#logout-button, #switch-user-button, #openid-consent-deny, #openid-consent-cancel):not(:disabled):hover { color: #f0edf7; background-color: #302640; }
:is(#logout-button, #switch-user-button, #openid-consent-deny, #openid-consent-cancel):focus-visible { color: #f0edf7; background-color: #302640; outline: 2px solid #b7a0ff; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { :is(#logout-button, #switch-user-button, #openid-consent-deny, #openid-consent-cancel) { transition: none; } }
