/* kurapica.nl design for the Authelia login / 2FA / reset pages.
Served same-origin at /kura-style.css and ed into Authelia's index.html
shell by data/nginx/custom/authelia-style.conf. It lives in its own file
because nginx cannot parse a single config parameter larger than 4 KB. */
/* ---- theme tokens: Authelia blue (primary) + red (secondary) -> kura grey ----
Everything that used to need a per-component MUI override (sign-in button,
reset-password link, Logout/Methods, focus ring, field borders) now derives
from these. data-theme lives on ; !important beats [data-theme=dark]. */
html[data-theme],body[data-theme],:root{
--primary:#A1A1A1 !important;
--primary-foreground:#111111 !important;
--secondary:#A1A1A1 !important;
--secondary-foreground:#111111 !important;
--ring:#A1A1A1 !important;
--input:rgba(255,255,255,.22) !important;
--border:rgba(255,255,255,.22) !important;
}
/* ---- landing-page background + warp starfield ---- */
html,body{background:transparent !important;}
body{background:radial-gradient(ellipse 70% 70% at 50% 50%,#0b1220 0%,#05080f 45%,transparent 100%),#020307 !important;}
#kura-warp{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none;}
body::after{content:"";position:fixed;inset:0;background:radial-gradient(ellipse 50% 50% at 50% 50%,transparent 30%,rgba(0,0,0,.65) 100%);pointer-events:none;z-index:1;}
#root{background:transparent !important;position:relative;z-index:2;}
/* ---- glowing / pulsing logo (invert grey -> light + blue glow) ----
display:block + auto side margins because the logo is centred by Tailwind
mx-auto, which our margin shorthand would otherwise wipe out. */
img[alt="Logo"]{display:block !important;width:154px !important;height:154px !important;margin:18px auto 10px !important;filter:invert(1) hue-rotate(180deg) drop-shadow(0 0 16px rgba(110,170,255,.55)) drop-shadow(0 0 2px rgba(255,255,255,.25)) !important;animation:kura-pulse 4.5s ease-in-out infinite !important;}
@keyframes kura-pulse{0%,100%{opacity:.9}50%{opacity:1}}
/* ---- glass card behind the form for readability over the starfield ----
The stage wrapper (#first-factor-stage etc.) holds one max-width column; that
column is what used to be .MuiContainer-maxWidthXs. */
[id$="-stage"]>div:first-child{background:rgba(3,6,12,.55) !important;backdrop-filter:blur(6px) !important;-webkit-backdrop-filter:blur(6px) !important;border:1px solid rgba(120,170,255,.14) !important;border-radius:18px !important;box-shadow:0 12px 48px rgba(0,0,0,.55) !important;padding:10px 22px 14px !important;width:100% !important;}
/* ---- text fields: Authelia ships them bg-transparent, which reads as a hole
in the starfield; give them a dark fill like the autofill state below ---- */
#username-textfield,#password-textfield{background-color:rgba(10,14,22,.55) !important;}
/* ---- removed chrome: header bar (language selector + account menu) and
the "Powered by Authelia" footer row ---- */
header{display:none !important;}
div:has(>a[href*="authelia.com"]){display:none !important;}
/* ---- removed headings (rendered as
by the login layout) ---- */
#first-factor-stage h5{display:none !important;}
#reset-password-step1-stage h5{display:none !important;}
/* ---- bootstrap loading page: keep the animated bars, drop the "Loading..."
caption that sits in the sibling block right after them ---- */
div:has(>span>span.animate-scale-loader)+div{display:none !important;}
/* ---- kill the hover tint on the nav text buttons (Home | Methods | Logout) ---- */
#logout-button:hover,#methods-button:hover,#kura-home-link:hover{background-color:transparent !important;}
/* nav order: Home | Methods | Logout (logout on the right). Reorder with flexbox
order so we never move the React logout/methods nodes (moving them starts a
flip-war with the re-inject observer in kura-warp.js). font-size:0 hides the
bare pipe text-node separators (anonymous flex items); the buttons and our
injected pieces carry their own font-size so they stay visible. */
:has(> #logout-button){display:flex !important;justify-content:center;align-items:center;font-size:0 !important;}
#kura-home-link{order:1;}
#methods-button{order:3;}
#logout-button{order:5;}
.kura-home-sep{order:2;font-size:.875rem;color:#A1A1A1;padding:0 6px;user-select:none;}
.kura-home-sep.b{order:4;}
/* kill the light-blue browser/password-manager autofill background */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{
-webkit-text-fill-color:#e6edf6 !important;
-webkit-box-shadow:0 0 0 1000px #0a0e16 inset !important;
caret-color:#e6edf6 !important;
transition:background-color 99999s ease-in-out 0s !important;
}