/* Login presentation only. Native Roundcube form, CSRF and authentication stay intact. */
html:has(#okraina-login){background:#253743;color-scheme:dark}
body:has(#okraina-login){margin:0!important;min-height:100vh;min-height:100dvh;overflow:auto!important;background:#253743!important;color:#fafaff!important;font:16px/1.45 Arial,Helvetica,sans-serif!important}
body:has(#okraina-login) #layout{position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box;min-height:100vh!important;min-height:100dvh!important;height:auto!important;width:100%!important;padding:64px 24px 92px!important;isolation:isolate;background:transparent!important}
.ok-login-backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 16% 12%,#8fa5ac60 0,transparent 48%),radial-gradient(ellipse at 83% 34%,#537e8e55 0,transparent 50%),linear-gradient(165deg,#73878d 0%,#536b76 34%,#304b5c 66%,#182936 100%)}
.ok-login-backdrop i{position:absolute;display:block;width:160vw;height:80vh;left:-25vw;top:57vh;border-radius:50%;transform:rotate(-12deg);background:linear-gradient(160deg,#94b9c224,#0f253610 55%);box-shadow:0 -1px 0 #ccedf514}
.ok-login-backdrop i:nth-child(2){top:72vh;left:-10vw;transform:rotate(14deg);background:linear-gradient(180deg,#88abb71e,#11232f52)}
.ok-login-backdrop i:nth-child(3){top:90vh;left:-30vw;transform:rotate(-7deg);background:#13273150}
body:has(#okraina-login) #layout-content{display:block!important;flex:none!important;position:relative!important;box-sizing:border-box!important;width:400px!important;max-width:100%!important;height:auto!important;min-height:0!important;margin:0!important;padding:30px 32px 28px!important;border:1px solid #ffffff08!important;border-radius:40px!important;background:#202024!important;color:#fafaff!important;box-shadow:0 24px 70px #07111b33!important;overflow:visible!important}
.ok-login-brand{height:118px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 0 24px;gap:8px}
.ok-login-ap{font:600 11px/14px Arial,sans-serif;letter-spacing:3px;color:#cbced4}
.ok-login-brand img{display:block;width:280px;max-width:100%;height:auto;max-height:118px;object-fit:contain}
#ok-login-title{position:static!important;margin:0 0 24px!important;font:600 24px/30px Arial,Helvetica,sans-serif!important;letter-spacing:-.4px;text-align:center;color:#fafaff!important}
.ok-login-domain{margin:8px 0 24px;color:#a9a9b1;text-align:center;font-size:14px}
body:has(#okraina-login) #login-form{position:static!important;top:auto!important;transform:none!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;text-align:left}
body:has(#okraina-login) #login-form .input-group-text{display:none!important}
body:has(#okraina-login) #login-form table{width:100%!important;border:0!important;border-collapse:separate!important;border-spacing:0!important;margin:0!important}
body:has(#okraina-login) #login-form tbody,body:has(#okraina-login) #login-form tr,body:has(#okraina-login) #login-form td{display:block!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important}
body:has(#okraina-login) #login-form td.title{position:absolute!important;width:1px!important;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body:has(#okraina-login) #login-form td.input{position:relative!important;margin-bottom:12px}
body:has(#okraina-login) #login-form input.form-control{display:block!important;box-sizing:border-box!important;width:100%!important;height:56px!important;margin:0!important;padding:0 17px!important;border:2px solid #44444b!important;border-radius:18px!important;background:#202024!important;color:#fafaff!important;box-shadow:none!important;font:16px/1.25 Arial,Helvetica,sans-serif!important;transition:border-color .15s,background-color .15s}
body:has(#okraina-login) #login-form input.form-control::placeholder{color:#9c9ca7!important;opacity:1}
body:has(#okraina-login) #login-form input.form-control:focus{outline:none!important;border-color:#fafaff!important;background:#252529!important}
body:has(#okraina-login) #login-form input[type=password],body:has(#okraina-login) #login-form input.ok-visible-password{padding-right:52px!important}
body:has(#okraina-login) #login-form input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #252529 inset!important;-webkit-text-fill-color:#fafaff!important;caret-color:#fafaff}
body:has(#okraina-login) #login-form p.formbuttons{margin:28px 0 0!important;padding:0!important}
body:has(#okraina-login) #rcmloginsubmit{display:flex!important;align-items:center;justify-content:center;box-sizing:border-box!important;width:100%!important;min-height:56px!important;padding:15px!important;border:0!important;border-radius:18px!important;background:#fafaff!important;color:#17171b!important;box-shadow:none!important;font:600 16px/24px Arial,Helvetica,sans-serif!important;transition:background .15s,transform .15s}
body:has(#okraina-login) #rcmloginsubmit:before{display:none!important}
body:has(#okraina-login) #rcmloginsubmit:hover{background:#e5e5ed!important}
body:has(#okraina-login) #rcmloginsubmit:active{transform:translateY(1px)}
body:has(#okraina-login) #rcmloginsubmit:focus-visible{outline:3px solid #ffda55!important;outline-offset:4px}
body:has(#okraina-login) #rcmloginsubmit:disabled{opacity:.55}
#login-footer:empty{display:none}
.ok-login-help{margin:22px 0 0;text-align:center;color:#d0d0d8;font-size:14px}
.ok-login-help summary{cursor:pointer;display:inline-block;list-style:none;border-bottom:1px solid transparent}
.ok-login-help summary::-webkit-details-marker{display:none}
.ok-login-help summary:hover{border-color:#d0d0d8}
.ok-login-help summary:focus-visible{outline:2px solid #ffda55;outline-offset:5px;border-radius:3px}
.ok-login-help p{margin:14px 0 0;text-align:left;color:#b6b6c0;font-size:13px;line-height:1.6}
body:has(#okraina-login) .ok-password-toggle{position:absolute;right:8px;top:8px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:12px;color:#b8b8c4;background:transparent!important;cursor:pointer}
.ok-password-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}
.ok-password-toggle:hover{background:#ffffff0c;color:#fff}
.ok-password-toggle:focus-visible{outline:2px solid #ffda55}
.ok-login-bottom{position:absolute;bottom:24px;left:32px;right:32px;display:flex;justify-content:space-between;gap:24px;align-items:center;color:#e0e7ec;font-size:13px;line-height:20px}
.ok-login-bottom b{padding:0 7px;font-weight:400;opacity:.65}
body:has(#okraina-login) #messagestack{z-index:1000}
@media(max-width:560px){body:has(#okraina-login) #layout{padding:28px 16px 110px!important}body:has(#okraina-login) #layout-content{padding:28px 24px!important;border-radius:32px!important;width:380px!important}.ok-login-brand{height:108px;margin-bottom:20px}.ok-login-brand img{width:258px}.ok-login-bottom{left:24px;right:24px;bottom:20px;flex-direction:column;gap:7px;text-align:center;font-size:12px}}
@media(prefers-reduced-motion:reduce){body:has(#okraina-login) *{transition:none!important}}

/* Explicit link to the owned Nextcloud service; no SSO or downloads implied. */
.ok-login-services{margin-top:24px}
.ok-login-disk{display:flex;align-items:center;gap:13px;padding:13px 15px;border:1px solid #fff1e9;border-radius:15px;background:#fff1e9;color:#30313d!important;text-align:left;text-decoration:none!important;transition:background .15s}
.ok-login-disk:hover{background:#ffe5d7;border-color:#ffe5d7}
.ok-login-disk:focus-visible{outline:3px solid #ffda55;outline-offset:4px}
.ok-login-disk svg{flex:0 0 24px;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ok-login-disk strong,.ok-login-disk small{display:block;font-family:Arial,Helvetica,sans-serif}
.ok-login-disk strong{font-size:15px;line-height:20px;font-weight:600}
.ok-login-disk small{font-size:13px;line-height:19px;color:#62616b}
.ok-service-arrow{margin-left:auto;font-size:19px;opacity:.7}
