/* ODRAVIO V112 — minimalistyczny panel logowania */
:root{
  --v112-navy:#071b3b;
  --v112-blue:#1668e8;
  --v112-red:#e52b43;
  --v112-ink:#0a1e3a;
  --v112-muted:#71839a;
  --v112-line:#dce5ef;
  --v112-bg:#f5f8fc;
}

.v112-login-page{
  background:var(--v112-bg);
  min-height:calc(100svh - 92px);
  overflow:hidden;
}
.v112-login-shell{
  width:min(960px,calc(100% - 48px));
  min-height:calc(100svh - 92px);
  margin:0 auto;
  padding:28px 0;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
.v112-login-card{
  width:100%;
  min-height:500px;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(390px,1.08fr);
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(12,45,84,.10);
  border-radius:24px;
  box-shadow:0 20px 55px rgba(8,34,70,.10);
}

.v112-login-side{
  position:relative;
  padding:40px 42px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:linear-gradient(150deg,#071d41 0%,#0b3974 100%);
  color:#fff;
}
.v112-login-side:after{
  content:"";
  position:absolute;
  width:180px;
  height:3px;
  left:42px;
  bottom:0;
  background:var(--v112-red);
  border-radius:999px 999px 0 0;
}
.v112-login-brand{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:12px;
  width:max-content;
  text-decoration:none;
  color:#fff;
}
.v112-login-logo{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  background:#fff;
  border-radius:13px;
}
.v112-login-logo img{width:36px;height:36px;object-fit:contain;display:block}
.v112-login-wordmark{display:flex;flex-direction:column;gap:1px}
.v112-login-wordmark b{font-size:16px;letter-spacing:.14em}
.v112-login-wordmark small{font-size:8px;letter-spacing:.28em;color:#9db9dc}

.v112-login-copy{position:relative;z-index:1;max-width:380px;margin:42px 0}
.v112-eyebrow{display:block;margin-bottom:13px;font-size:9px;font-weight:900;letter-spacing:.17em;color:#8fb6eb}
.v112-login-copy h2{
  margin:0 0 16px;
  color:#fff;
  font-size:35px;
  line-height:1.08;
  letter-spacing:-.04em;
  font-weight:800;
}
.v112-login-copy h2 em{color:#ff5066;font-style:normal}
.v112-login-copy p{
  max-width:350px;
  margin:0;
  color:#b7cbe5;
  font-size:14px;
  line-height:1.58;
}
.v112-login-status{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:8px;
  color:#9fb7d6;
  font-size:10.5px;
  font-weight:700;
}
.v112-login-status i,.v112-login-bottom i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#3dd39b;
}

.v112-login-form{
  margin:0!important;
  padding:48px 52px!important;
  display:flex!important;
  flex-direction:column;
  justify-content:center;
  background:#fff;
}
.v112-form-intro{margin-bottom:27px}
.v112-form-intro>span{
  display:block;
  margin-bottom:8px;
  color:var(--v112-red);
  font-size:9px;
  font-weight:900;
  letter-spacing:.16em;
}
.v112-form-intro h1{
  margin:0!important;
  color:var(--v112-ink)!important;
  font-size:31px!important;
  line-height:1.1!important;
  letter-spacing:-.035em!important;
}
.v112-form-intro p{
  margin:8px 0 0!important;
  color:var(--v112-muted)!important;
  font-size:13.5px!important;
  line-height:1.45!important;
}
.v112-field{margin:0 0 16px!important}
.v112-field>label,.v112-label-row label{
  display:block;
  color:#334b69!important;
  font-size:11.5px!important;
  font-weight:800!important;
  margin-bottom:7px;
}
.v112-label-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:7px;
}
.v112-label-row label{margin:0}
.v112-forgot{
  color:#657a93;
  font-size:11px;
  font-weight:750;
  text-decoration:none;
}
.v112-forgot:hover{color:var(--v112-blue);text-decoration:underline}
.v112-field input{
  width:100%;
  height:48px!important;
  box-sizing:border-box;
  padding:0 15px!important;
  border:1.5px solid var(--v112-line)!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#142a48!important;
  font-size:14px!important;
  outline:none;
  transition:border-color .16s,box-shadow .16s;
}
.v112-field input:focus{
  border-color:#4f8fe9!important;
  box-shadow:0 0 0 3px rgba(22,104,232,.09)!important;
}
.v112-login-submit{
  width:100%!important;
  height:49px!important;
  margin-top:2px!important;
  border-radius:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:13.5px!important;
  font-weight:900!important;
  box-shadow:none!important;
}
.v112-login-submit:hover{box-shadow:0 8px 20px rgba(22,104,232,.16)!important}
.v112-login-bottom{
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid #edf1f5;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  color:#8b99ab;
  font-size:10px;
}
.v112-login-bottom span{display:flex;align-items:center;gap:7px}
.v112-login-bottom a{color:#718299;text-decoration:none;font-weight:700}
.v112-login-bottom a:hover{color:var(--v112-blue)}

/* Login ma być zamkniętym, jednoekranowym widokiem. */
body:has(.v112-login-page.active) #v117Footer{display:none!important}
body:has(.v112-login-page.active) main{min-height:0!important}

@media (max-height:760px) and (min-width:761px){
  .v112-login-page,.v112-login-shell{min-height:calc(100svh - 78px)}
  .v112-login-shell{padding:18px 0}
  .v112-login-card{min-height:450px}
  .v112-login-side{padding:30px 34px}
  .v112-login-side:after{left:34px}
  .v112-login-copy{margin:26px 0}
  .v112-login-copy h2{font-size:31px}
  .v112-login-form{padding:34px 44px!important}
  .v112-form-intro{margin-bottom:20px}
  .v112-form-intro h1{font-size:28px!important}
  .v112-field{margin-bottom:13px!important}
  .v112-field input{height:44px!important}
  .v112-login-submit{height:45px!important}
  .v112-login-bottom{margin-top:14px;padding-top:13px}
}

@media (max-width:760px){
  .v112-login-page{overflow:visible}
  .v112-login-shell{width:min(520px,calc(100% - 28px));min-height:auto;padding:24px 0 50px}
  .v112-login-card{grid-template-columns:1fr;min-height:0;border-radius:20px}
  .v112-login-side{padding:28px 28px 30px}
  .v112-login-copy{margin:32px 0 20px}
  .v112-login-copy h2{font-size:30px}
  .v112-login-copy p{font-size:13px}
  .v112-login-status{display:none}
  .v112-login-side:after{left:28px;width:120px}
  .v112-login-form{padding:32px 28px 30px!important}
  .v112-form-intro h1{font-size:28px!important}
}

@media (max-width:420px){
  .v112-login-shell{width:calc(100% - 20px)}
  .v112-login-side{padding:24px 22px 26px}
  .v112-login-form{padding:28px 22px 26px!important}
  .v112-login-copy h2{font-size:27px}
  .v112-login-bottom{align-items:flex-start;flex-direction:column}
}
