/* Login-only gateway theme; native Plex OAuth and local admin remain intact. */
body:has(.login-card){background:#070d17!important;color:#fff;overflow:auto!important}
body:has(.login-card) ombi-image-background{display:none!important}
.small-middle-container:has(.login-card){
 position:fixed!important;inset:0!important;width:100%!important;height:100%!important;
 max-width:none!important;margin:0!important;padding:48px 8vw!important;box-sizing:border-box!important;
 overflow:auto!important;display:flex!important;flex-direction:column!important;gap:32px!important;
 align-items:flex-start!important;justify-content:center!important;isolation:isolate;
 background:linear-gradient(90deg,rgba(4,9,17,.68),rgba(4,9,17,.18) 60%,transparent),url('/ombi-theme/action-anime.png') 70% center/cover no-repeat;
 animation:cinema-pan 24s ease-in-out infinite alternate;
}
.small-middle-container:has(.login-card)>div:has(>.login-card){display:contents!important}
.small-middle-container:has(.login-card)::before{
 content:'YOUR NEXT\A OBSESSION.';white-space:pre-line;display:block;flex:none;position:relative;z-index:2;
 font-family:Impact,'Arial Narrow',sans-serif;font-style:italic;font-weight:900;
 font-size:clamp(50px,6.5vw,100px);line-height:.98;letter-spacing:1px;
 color:#f4f7fa;text-shadow:3px 3px 0 #12677d,0 8px 30px #000;
 border-left:4px solid #efb629;padding-left:20px;
}
.small-middle-container:has(.login-card)::after{
 content:'';position:fixed;inset:-100px;z-index:0;pointer-events:none;opacity:.3;
 background-image:repeating-linear-gradient(108deg,transparent 0 47px,rgba(150,215,245,.18) 48px,transparent 49px 130px),radial-gradient(ellipse at 20% 80%,#ffad45 0 1px,transparent 3px),radial-gradient(ellipse at 70% 45%,#ff8d36 0 1px,transparent 3px);
 background-size:270px 300px,310px 430px,470px 570px;
 animation:rain-embers 8s linear infinite;
}
body .small-middle-container .login-card{
 display:flex!important;flex-direction:column!important;gap:0!important;position:relative!important;
 top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;
 width:390px!important;max-width:100%!important;min-height:0!important;height:auto!important;
 padding:28px!important;margin:0!important;box-sizing:border-box!important;z-index:2;
 border-radius:16px!important;background:rgba(6,15,26,.82)!important;border:1px solid #54748a66;
 box-shadow:0 18px 60px #0005!important;backdrop-filter:blur(12px);color:#fff!important;
}
body .small-middle-container .login-card::before{content:none!important}
body .small-middle-container .login-card .login_logo{
 position:static!important;transform:none!important;display:block!important;width:auto!important;
 height:auto!important;font-size:16px!important;line-height:1.5!important;letter-spacing:4px!important;
 margin:0 0 18px!important;padding:0!important;text-align:left!important;color:#8fd4e5!important;
}
body .login-card mat-card-content{position:static!important;display:block!important;margin:0!important;padding:0!important;flex:none!important}
body .login-card .login-buttons>div{display:flex!important;flex-direction:column!important;gap:0!important}
body .login-card #sign-in,body .login-card #login-box{display:none!important}
body .login-card #sign-plex{
 position:static!important;transform:none!important;width:100%!important;height:54px!important;min-height:54px!important;
 margin:0!important;border-radius:9px!important;background:#edb928!important;color:#0a111c!important;
 font-size:16px!important;line-height:54px!important;font-weight:800!important;
}
body .login-card #sign-plex:hover{background:#ffcf47!important}
body .login-card #sign-plex:focus-visible{outline:3px solid #9beeff;outline-offset:4px}
body .login-card::after{content:'Movies. Series. Anime.\A Request your next watch with Plex.';white-space:pre-line;
 position:static!important;display:block!important;margin:18px 0 0!important;line-height:1.7!important;font-size:14px;color:#c3cfde}
@keyframes cinema-pan{from{background-position:center,70% center}to{background-position:center,75% center}}
@keyframes rain-embers{from{background-position:0 0,0 0,0 0}to{background-position:-80px 300px,10px -430px,-20px -570px}}
@media(max-width:700px){
 .small-middle-container:has(.login-card){padding:26px 22px max(26px,env(safe-area-inset-bottom))!important;
  justify-content:flex-end!important;gap:20px!important;
  background:linear-gradient(0deg,rgba(4,9,17,.93),rgba(4,9,17,.04) 75%),url('/ombi-theme/action-anime.png') 88% center/cover no-repeat;animation:none}
 .small-middle-container:has(.login-card)::before{font-size:clamp(42px,12vw,66px);padding-left:14px}
 body .small-middle-container .login-card{width:100%!important;padding:22px!important}
}
@media(max-height:620px) and (min-width:701px){.small-middle-container:has(.login-card){justify-content:flex-start!important;padding-top:28px!important;gap:20px!important}.small-middle-container:has(.login-card)::before{font-size:56px}}
@media(prefers-reduced-motion:reduce){.small-middle-container:has(.login-card),.small-middle-container:has(.login-card)::after{animation:none!important}}
