:root { --aso-blue:#00539b; --aso-secondary:#003d73; --aso-dark:#06182e; --aso-gold:#d5b66c; }
html.login-pf { min-height:100%; background:var(--aso-dark); }
.login-pf body { margin:0; min-height:100vh; min-height:100svh; color:#18324f; font-family:Inter,"Segoe UI",Arial,sans-serif; background:radial-gradient(ellipse at 85% 12%,#12568b99,transparent 52%),radial-gradient(ellipse at 10% 85%,#00539b88,transparent 52%),linear-gradient(140deg,#06182e,#092b50 75%,#003d73); overflow-x:hidden; isolation:isolate; }
.login-pf body::before { content:""; position:fixed; inset:-15%; z-index:0; pointer-events:none; background:radial-gradient(ellipse at 25% 35%,#0088cc24,transparent 45%),radial-gradient(ellipse at 75% 65%,#d5b66c13,transparent 40%); animation:aso-light 18s ease-in-out infinite alternate; }
.login-pf body::after { content:""; position:fixed; top:0; left:0; right:0; height:3px; z-index:5; background:linear-gradient(90deg,var(--aso-blue),var(--aso-gold),#8ccaf5,var(--aso-blue)); background-size:250% 100%; animation:aso-ribbon 9s linear infinite; pointer-events:none; }
.login-pf-page { position:relative; z-index:2; min-height:100vh; min-height:100svh; padding:44px 20px; display:flex; align-items:center; justify-content:center; flex-direction:column; }
.login-pf-page .card-pf { width:100%; max-width:448px; margin:0; padding:34px 36px 26px; border:1px solid #ffffffc4; border-top:3px solid var(--aso-gold); border-radius:24px; background:#fffffff2; backdrop-filter:blur(22px); box-shadow:0 30px 90px #0005,0 1px 0 #fff inset; }
.aso-brand { text-align:center; margin:0 0 24px; }
.aso-logo { display:block; width:76px; height:78px; object-fit:contain; margin:0 auto 16px; }
#kc-header-wrapper { padding:0; color:var(--aso-secondary); font-size:26px; font-weight:750; line-height:1.3; letter-spacing:-.7px; text-transform:none; white-space:normal; }
.aso-subtitle { margin:7px 0 0; color:#64758a; font-size:14px; letter-spacing:.3px; }
.login-pf-page .login-pf-header { margin:0 0 24px; position:relative; }
#kc-page-title { margin:0; font-size:20px; font-weight:650; color:#18324f; line-height:1.4; }
#kc-content { width:100%; }
.login-pf-page .form-group { margin-bottom:20px; }
.login-pf-page label { font-weight:600; font-size:13px; margin-bottom:8px; color:#334b66; }
.login-pf-page input.pf-c-form-control { min-height:48px; border:1px solid #cfdae5; border-radius:10px; background:#f8fafc; color:#18324f; box-shadow:none; font-size:16px; padding:10px 13px; }
.login-pf-page input.pf-c-form-control:focus { outline:2px solid #00539b; outline-offset:2px; border-color:var(--aso-blue); background:#fff; }
.login-pf-page .pf-c-input-group { background:transparent; border-radius:10px; }
.login-pf-page .pf-c-input-group input { border-radius:10px 0 0 10px; min-width:0; }
.login-pf-page [data-password-toggle] { width:46px; border:1px solid #cfdae5; border-left:0; border-radius:0 10px 10px 0; color:var(--aso-blue); background:#f8fafc; }
.login-pf-page [data-password-toggle]::after { border:0; }
.login-pf-page a { color:var(--aso-blue); text-decoration:underline; text-underline-offset:3px; }
.login-pf-page a:hover { color:var(--aso-secondary); }
.login-pf-page :focus-visible { outline:2px solid var(--aso-blue); outline-offset:4px; }
.login-pf-page .login-pf-settings { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; font-size:12px; }
#kc-form-options { padding:0; width:auto; float:none; }
.login-pf-page .login-pf-settings .checkbox { margin:0; }
.login-pf-page .login-pf-settings .checkbox label { margin:0; font-size:12px; font-weight:400; }
#rememberMe { accent-color:var(--aso-blue); }
#kc-form-buttons { padding:0; margin:24px 0 0; float:none; }
#kc-login,.login-pf-page .pf-c-button.pf-m-primary { min-height:48px; border:0; border-radius:10px; background:linear-gradient(110deg,var(--aso-blue),var(--aso-secondary)); color:white; font-size:15px; font-weight:650; box-shadow:0 8px 20px #00539b24; transition:filter .2s,transform .2s; }
#kc-login:hover { filter:brightness(1.12); transform:translateY(-1px); }
#kc-login:disabled { opacity:.65; }
.aso-security { border-top:1px solid #dce4ec; margin-top:26px; padding-top:18px; color:#65758a; font-size:11px; line-height:1.7; text-align:center; }
#kc-info-wrapper { background:transparent; padding:16px 0 0; }
#kc-locale { position:relative; top:auto; right:auto; margin:0 0 14px; text-align:right; }
#kc-locale ul { z-index:10; }
.login-pf-page .pf-c-alert { margin-bottom:20px; border-radius:8px; overflow-wrap:anywhere; }
.aso-background,.aso-stars { position:fixed; inset:0; pointer-events:none; overflow:hidden; }
.aso-background { z-index:0; }
.aso-stars { z-index:1; }
.aso-slide { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.08) translateX(-.5%); transition:opacity 2.5s ease,transform 10s linear; }
.aso-slide.active { opacity:.22; transform:scale(1) translateX(.5%); }
.aso-star { position:absolute; width:2px; height:2px; border-radius:50%; background:#fff; box-shadow:0 0 7px #8edaff; animation:aso-twinkle 3s ease-in-out infinite alternate; }
.aso-meteor { position:absolute; width:160px; height:2px; border-radius:100%; background:linear-gradient(90deg,#fff,#a4e2ff 12%,transparent); box-shadow:0 0 9px #8edaff99; transform-origin:left center; animation:aso-shoot 2s linear both; opacity:0; }
@keyframes aso-twinkle { from { opacity:.15; transform:scale(.6); } to { opacity:.95; transform:scale(1.4); } }
@keyframes aso-shoot { 0% { opacity:0; transform:translate(0,0) rotate(35deg); } 12%,75% { opacity:1; } 100% { opacity:0; transform:translate(-70vw,-49vw) rotate(35deg); } }
@keyframes aso-light { to { transform:translate(5%,-3%) scale(1.06); } }
@keyframes aso-ribbon { to { background-position:250% 0; } }
@media(max-width:480px) { .login-pf-page { padding:28px 16px; } .login-pf-page .card-pf { padding:26px 22px 22px; border-radius:20px; } #kc-header-wrapper { font-size:23px; } .aso-logo { width:65px; height:67px; } }
@media(prefers-reduced-motion:reduce) { .login-pf body::before,.login-pf body::after,.aso-star,.aso-meteor { animation:none; } .aso-meteor { display:none; } .aso-star { opacity:.5; } .aso-slide,#kc-login { transition:none; } }
