
.login-flow-shell{
    min-height:calc(100svh - 86px);
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:12px 14px 18px;
}
.login-flow-card{
    width:min(100%, 500px);
    border:1px solid rgba(255,255,255,.15);
    border-radius:22px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
        rgba(7,11,18,.42);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
    box-shadow:0 18px 55px rgba(0,0,0,.28);
    padding:20px 22px;
    color:#f8fafc;
    overflow:hidden;
}
.login-step-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:5px 11px;
    border-radius:999px;
    background:rgba(245,184,75,.13);
    border:1px solid rgba(245,184,75,.44);
    color:#ffd98a;
    font-weight:900;
    font-size:.70rem;
    letter-spacing:.11em;
    text-transform:uppercase;
    margin-bottom:10px;
}
.login-flow-card h1{
    margin:0 0 12px;
    font-size:clamp(1.65rem,3vw,2.15rem);
    line-height:1.04;
    letter-spacing:-.035em;
    color:#fff;
    text-shadow:0 3px 18px rgba(0,0,0,.58);
}
.login-flow-card .subtitle{
    margin:0 0 12px;
    color:rgba(230,235,245,.80);
    line-height:1.45;
    font-size:.94rem;
}
.login-flow-card .form-grid{gap:10px}
.login-flow-card label{
    margin-bottom:4px;
    color:rgba(230,235,245,.86);
    font-size:.86rem;
    font-weight:800;
}
.login-flow-card input{
    min-height:40px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(2,6,23,.62);
    color:#f8fafc;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.login-flow-card button,
.login-flow-card .btn{
    width:100%;
    min-height:42px;
    justify-content:center;
    text-align:center;
    border-radius:999px;
    border:1px solid rgba(245,184,75,.54);
    background:linear-gradient(180deg,#ffd98a,#f5b84b);
    color:#101827;
    font-weight:950;
    box-shadow:0 12px 30px rgba(245,184,75,.16), 0 16px 40px rgba(0,0,0,.18);
    transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.login-flow-card button:hover,
.login-flow-card .btn:hover{
    transform:translateY(-1px);
    border-color:rgba(255,217,138,.72);
    box-shadow:0 14px 36px rgba(245,184,75,.22), 0 18px 46px rgba(0,0,0,.24);
}
.login-flow-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px}
.login-forgot{
    margin-top:-2px;
    text-align:right;
    font-size:.90rem;
}
.login-flow-card a{color:#ffd98a;font-weight:850;text-decoration:none}
.login-flow-card a:hover{text-decoration:underline}
.login-redirect-note{margin-top:10px;color:#b9c5d6;font-size:.90rem;text-align:center}.login-redirect-note a{color:#e8eef8;text-decoration:none}.login-redirect-note a:hover{color:#ffd98a;text-decoration:underline}

.vacation-confirm-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(3,8,18,.84);
    backdrop-filter:blur(9px);
}
.vacation-confirm-dialog{
    width:min(560px,100%);
    padding:24px;
    border-radius:22px;
    background:linear-gradient(145deg,rgba(20,31,50,.99),rgba(9,16,29,.99));
    border:1px solid rgba(245,184,75,.44);
    box-shadow:0 28px 80px rgba(0,0,0,.58);
    color:#e8eef8;
}
.vacation-confirm-dialog h2{
    margin:0 0 12px;
    color:#ffd98a;
    font-size:1.45rem;
    line-height:1.2;
}
.vacation-confirm-dialog p{margin:0 0 14px;line-height:1.58;color:#dbe5f1}
.vacation-confirm-details{
    margin:0 0 16px;
    padding:13px 15px;
    border-radius:14px;
    background:rgba(245,184,75,.09);
    border:1px solid rgba(245,184,75,.30);
    line-height:1.55;
}
.vacation-confirm-check{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin:14px 0 17px;
    line-height:1.45;
    font-weight:750;
}
.vacation-confirm-check input{width:20px;min-height:20px;margin-top:2px;flex:0 0 auto}
.vacation-confirm-actions{display:grid;gap:10px}
.vacation-confirm-cancel{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:10px 16px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.16);
    color:#e8eef8!important;
    background:rgba(255,255,255,.055);
    text-decoration:none!important;
}
.vacation-confirm-cancel:hover{border-color:rgba(255,217,138,.5);background:rgba(255,255,255,.09)}

@media (max-width:760px){
    .login-flow-shell{min-height:calc(100svh - 76px);padding:10px 10px 14px;align-items:flex-start}
    .login-flow-card{width:min(100%,520px);padding:16px;border-radius:20px}
    .login-flow-card .form-grid{grid-template-columns:1fr;gap:10px}
    .login-step-badge{margin-bottom:8px}
    .login-flow-card h1{margin-bottom:12px}
}
@media (max-height:760px) and (min-width:761px){
    .login-flow-shell{padding-top:8px;padding-bottom:10px;align-items:flex-start}
    .login-flow-card{padding:16px 20px;width:min(100%,480px)}
    .login-step-badge{margin-bottom:8px}
    .login-flow-card h1{font-size:1.8rem;margin-bottom:12px}
    .login-flow-card .subtitle{margin-bottom:12px}
    .login-flow-card input{min-height:38px}
    .login-flow-card button,.login-flow-card .btn{min-height:40px}
}
