/* ver. 1.3 [2026-08-15] */
.login-wrapper{display:flex;justify-content:center; margin-left:-36px; padding:40px 20px;}
.login-box{background:#fff;border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,0.08);width:100%;max-width:550px;padding:0;overflow:hidden;}
.login-header{background:#f5f5f5;border-bottom:1px solid #ddd;padding:14px 20px;text-align:center;font-size:var(--h2size);font-weight:500;color:var(--h2Col);letter-spacing:0.05em;}
.login-body{padding:24px 30px 20px 30px;}
.login-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:4px;}
.login-row label{font-size:0.9em;font-weight:600;color:var(--txtCol);width:33%;min-width:110px;text-align:right;padding-right:12px;}
.login-row input.inputShort{width:100%;min-width:180px;box-sizing:border-box;padding:6px 10px;font-size:var(--txtSize);border:1px solid #e0e0e0;border-radius:4px;transition:border-color 0.3s;}
.login-row .inputShort:focus{border-color:var(--lnkCol);outline:none;box-shadow:0 0 0 2px rgba(0,102,153,0.2);}
.password-wrapper{position:relative;width:65%;min-width:180px;}
.password-wrapper .inputShort{width:100%;padding-right:40px;}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;font-size:16px;color:var(--txtCol);display:flex;align-items:center;justify-content:center;width:30px;height:30px;}
.password-toggle:hover{color:#333;background:rgba(0,0,0,0.05);border-radius:50%;}
.login-feedback{margin-bottom:12px;padding:10px 14px;border-radius:4px;font-size:var(--txtSize);display:none;text-align:center;}
.login-feedback.error{background-color:#fdd;border:1px solid #c00;color:#600;display:block;}
.login-feedback.success{background-color:#e8f5e9;border:1px solid #4caf50;color:#1b5e20;display:block;}
.login-divider{display:flex;align-items:center;text-align:center;margin:16px 0;color:var(--txtCol);font-size:var(--txtSize);font-family:var(--font);}
.login-divider::before,.login-divider::after{content:'';flex:1;border-bottom:1px solid #ddd;}
.login-divider span{padding:0 12px;}
.login-footer{display:flex;justify-content:space-between;align-items:center;margin-top:8px;flex-wrap:wrap;gap:8px;}
.login-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.login-help-links{margin-top:16px;padding-top:12px;border-top:1px solid #eee;font-size:var(--txtSize);text-align:center;display:flex;flex-direction:column;gap:6px;}
.login-help-links a{font-size:var(--txtSize);color:var(--lnkCol);text-decoration:none;}
.login-help-links a:hover{text-decoration:underline;}
.validation-summary{color:#c00;font-size:var(--txtSize);margin-bottom:12px;padding:10px 14px;border-radius:4px;background-color:#fdd;border:1px solid #c00;display:block;}
.unregister-btn{cursor:pointer;opacity:0.8;transition:opacity 0.2s;background:transparent !important;border:none !important;box-shadow:none !important;padding:0;font-size:1.5em;line-height:1;}
.unregister-btn:hover{opacity:1;}
/* ===== REGISTRATION-SPECIFIKKE KLASSER ===== */
.legal-overlay{visibility:hidden;position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:1000;background-color:rgba(0,0,0,0.4);}
.legal-overlay div{width:420px;margin:200px auto;background-color:#fff;border:1px solid #000;padding:12px;text-align:center;border-radius:8px;}

.terms-row{display:flex;align-items:center;gap:8px;font-size:0.9em;margin-top:4px;flex-wrap:wrap;justify-content:flex-end;}
.terms-row a{color:var(--lnkCol);text-decoration:underline;cursor:pointer;}
.terms-row a:hover{color:#036;}

.login-header span{font-weight:400;}
@media (max-width:var(--breakPointMob)){
    .login-box{margin:0 10px;}.login-body{padding:16px;}
    .login-row{flex-direction:column;align-items:stretch;}
    .login-row label{width:100%;text-align:left;padding-right:0;margin-bottom:2px;}
    .login-row .inputShort{width:100%;min-width:unset;}
    .password-wrapper{width:100%;}
    .login-footer{flex-direction:column;align-items:stretch;}
    .login-divider::before,.login-divider::after{content:'';flex:1;border-bottom:1px solid #ddd;}
}