/* FOGL029 – Ellenőrzött látványterv: az oldalsó grafika az eredeti marad.
   A referencia képből a nyomtatott űrlap/naptár el lett távolítva,
   hogy a működő HTML elemek ne duplázódjanak. */
body:has(.f018-page){margin:0!important;padding:0!important}
.f018-page{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,634px) minmax(0,1fr)!important;
  gap:0!important;
  justify-content:stretch!important;
  align-items:center!important;
  position:relative;
  width:100%;min-height:100vh;min-height:100dvh;
  height:100vh;height:100dvh;
  padding:12px 0!important;
  overflow:hidden;
  background-color:#eaf2fd!important;
  background-image:url('/design/fogl029-login-reference.png?v=FOGL029-CHECKED-2')!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:cover!important;
  font-family:Arial,Helvetica,sans-serif;
}
.f018-page:before{display:none!important}
/* Az ikonok és a feliratok a jóváhagyott referencia képen változtatás nélkül szerepelnek. */
.f018-page>.f018-side{display:none!important}
.f018-page>.f018-form-area{
  grid-column:2!important;min-width:0;width:100%!important;
  display:flex!important;align-items:center;justify-content:center;
  transform:translateX(-21px);
  position:relative;z-index:2;
}
.f018-page .f018-login-card{
  display:block;
  width:100%!important;
  max-width:none!important;
  min-height:0;
  max-height:none!important;
  padding:38px 36px 28px!important;
  background:#fff!important;
  border:1px solid #d5e5fa!important;
  border-radius:28px!important;
  box-shadow:0 16px 42px rgba(63,109,171,.10)!important;
  transform:translateY(-8px)!important;
}
.f018-page .f018-card-header{min-height:62px;align-items:center;gap:12px}
.f018-page .f018-logo-login b{font-size:27px}
.f018-page .f018-logo-login small{font-size:15px}
.f018-page .f018-card-header h1,
.f018-page .f018-login-card .f018-card-header h1{font-size:25px;letter-spacing:-.4px}
.f018-page .f018-card-note{margin:14px 0 19px;font-size:12px;line-height:1.4;text-align:left;text-align-last:left;color:#5c789e}
.f018-page .f018-roles{gap:10px;margin-bottom:20px}
.f018-page .f018-role{min-height:103px;border-radius:13px;padding:10px 8px;gap:6px}
.f018-page .f018-role b{font-size:13px}
.f018-page .f018-role small{font-size:11px}
.f018-page .f018-form>label{font-size:13px;margin-bottom:7px}
.f018-page .f018-input{height:43px;border-radius:10px;margin-bottom:14px}
.f018-page .f018-options{margin:0 0 14px}
.f018-page .f018-submit{height:54px;border-radius:11px;background:linear-gradient(90deg,#318efa,#0877ef)}
.f018-page .f018-separator{margin:11px 0}
.f018-page .f018-social-login{height:44px}
.f018-page .f018-passkey-login{height:41px;min-height:41px}
.f018-page .f018-https{margin-top:11px}
.f018-page .f018-login-result:empty{display:none}

/* Működő naptár: pontosan a referencia nagy, bal felső üvegkártyájának helyén. */
.f029-calendar{
  box-sizing:border-box;
  position:absolute;z-index:3;
  top:12.8%;left:clamp(22px,calc((100vw - 1240px)/4.3),124px);
  width:clamp(265px,21.2vw,378px);
  padding:23px 25px 20px;
  border:1px solid rgba(213,229,249,.95);
  border-radius:35px;
  background:rgba(255,255,255,.96);
  box-shadow:0 14px 30px rgba(87,133,197,.12);
  color:#153c7e;
  font-family:Arial,Helvetica,sans-serif;
  transform:rotate(0deg);
}
.f029-calendar *{box-sizing:border-box}
.f029-cal-top{display:flex;align-items:center;justify-content:space-between;font-size:18px;color:#31558e;height:26px}
.f029-cal-nav{border:0;border-radius:50%;width:31px;height:31px;display:grid;place-items:center;background:#f1f7ff;color:#3576d4;font-size:23px;line-height:1;cursor:pointer;padding:0}
.f029-cal-nav:hover,.f029-cal-nav:focus-visible{background:#dcecff;outline:2px solid transparent}
.f029-calendar h2{margin:9px 0 14px;color:#113c82;font-size:28px;font-weight:800;text-align:center;line-height:1.05}
.f029-cal-body{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px}
.f029-cal-current{min-width:0;min-height:136px;border:1px solid #dceaff;border-radius:16px;background:#f7faff;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}
.f029-cal-weekday{font-size:13px;font-weight:700;color:#16417f;white-space:nowrap}
.f029-cal-current strong{font-size:65px;letter-spacing:-3px;line-height:1.12;color:#1052a2;margin-top:7px}
.f029-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:22px;align-items:center;text-align:center;gap:2px 0;padding:7px 3px;border:1px solid #e2edfa;border-radius:16px;background:rgba(255,255,255,.82);font-size:11px}
.f029-cal-grid span{font-size:10px;font-weight:700;color:#456d9f}
.f029-cal-grid button{appearance:none;border:0;border-radius:50%;background:transparent;color:#19407a;font-size:11px;width:21px;height:21px;padding:0;margin:auto;cursor:pointer}
.f029-cal-grid button.weekend{color:#0a78df}
.f029-cal-grid button.other-month{opacity:.35}
.f029-cal-grid button.selected{color:white;background:#1884f9;font-weight:700}
.f029-cal-grid button:hover:not(.selected){background:#ebf4ff}
.f029-cal-today{display:flex;align-items:center;text-align:left;width:100%;height:62px;gap:11px;margin-top:10px;border:1px solid #dceaff;border-radius:14px;background:#f7fbff;padding:5px 13px;color:#1767c8;cursor:pointer}
.f029-cal-today>.glyphicon{font-size:22px}
.f029-cal-today span:last-child{display:flex;flex-direction:column;gap:2px}
.f029-cal-today b{font-size:15px}
.f029-cal-today small{font-size:12px;color:#377ce3}
.f029-cal-today:hover{background:#ecf6ff}
/* Kevesebb vízszintes hely esetén a teljesen működő naptár az űrlap alá kerül;
   a képes hátteret nem vágjuk rá a gépelhető mezőkre. */
@media(max-width:1450px){
  .f029-calendar{width:clamp(245px,21vw,305px);padding:18px 14px;border-radius:24px}
  .f029-cal-body{grid-template-columns:90px minmax(0,1fr);gap:5px}
  .f029-cal-current{min-height:116px}
  .f029-cal-current strong{font-size:53px}
  .f029-cal-grid{grid-auto-rows:19px;font-size:10px}
  .f029-cal-grid button{height:18px;width:18px;font-size:9px}
  .f029-calendar h2{font-size:24px;margin:8px 0 10px}
}
@media(max-width:1320px){
  .f018-page{grid-template-columns:minmax(0,1fr) minmax(0,600px) minmax(0,1fr)!important}
  .f018-page .f018-form-area{transform:none}
  .f029-calendar{left:16px;width:270px;padding:15px 12px}
}
@media(max-width:1180px){
  .f018-page{
    height:auto!important;min-height:100dvh!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:flex-start!important;gap:20px!important;
    overflow:visible!important;
    padding:22px 16px 32px!important;
    background-image:linear-gradient(145deg,rgba(234,243,255,.90),rgba(248,251,255,.92)),url('/design/fogl029-login-reference.png?v=FOGL029-CHECKED-2')!important;
  }
  .f018-page .f018-form-area{order:1;flex:0 0 auto;transform:none!important;width:100%!important;max-width:634px;align-self:center}
  .f018-page .f018-login-card{padding:26px 30px 22px!important;transform:none!important}
  .f029-calendar{display:block;order:2;position:relative;top:auto;left:auto;width:min(100%,378px);margin:0 auto;transform:none;padding:23px 25px 20px;border-radius:30px}
  .f029-cal-body{grid-template-columns:110px minmax(0,1fr);gap:12px}
  .f029-cal-current{min-height:136px}
  .f029-cal-current strong{font-size:65px}
  .f029-cal-grid{grid-auto-rows:22px}
  .f029-cal-grid button{height:21px;width:21px;font-size:11px}
}
@media(max-width:600px){
  .f018-page{padding:14px 10px 25px!important;gap:15px!important}
  .f018-page .f018-login-card{padding:20px 15px 16px!important;border-radius:22px!important}
  .f018-page .f018-card-header h1,.f018-page .f018-login-card .f018-card-header h1{font-size:clamp(14px,3.2vw,21px)}
  .f018-page .f018-logo-login b{font-size:clamp(15px,3.4vw,22px)}
  .f018-page .f018-logo-login small{font-size:11px}
  .f018-page .f018-card-note{font-size:11px;line-height:1.35;margin:12px 0 14px}
  .f018-page .f018-role{min-height:88px;padding:8px 4px}
  .f018-page .f018-role b{font-size:clamp(10px,2.6vw,12px)}
  .f018-page .f018-role small{font-size:clamp(8px,2.1vw,10px)}
  .f018-page .f018-roles{gap:6px;margin-bottom:13px}
  .f018-page .f018-form>label{font-size:12px}
  .f018-page .f018-social-login{font-size:clamp(10px,2.7vw,12px)}
  .f018-page .f018-passkey-login{font-size:11px}
}
@media(max-height:775px) and (min-width:1181px){
  .f018-page{overflow:auto!important;min-height:775px!important;height:auto!important}
}