/* vpLgx-20261022: prihlasovaci (a odhlasovaci) obrazovka intranetu jako v portalu – preklapeci hodiny ve stylu nadrazi 70. let
   a barva podle denni doby: ve dne svetla, od zapadu do vychodu slunce (Praha) tmava; zmena za chodu plynule.
   Jen vzhled – prihlasovani vstupenkou z portalu beze zmeny. Vse pod html.lgx (trida jen na prihlaseni a odhlaseni). */

/* rozlozeni: pocitac – hodiny vlevo, karta vpravo; mobil – hodiny nahore, karta jako spodni panel */
html.lgx body{background:var(--bg);overflow-x:hidden}
html.lgx .wrap{position:relative;z-index:1;min-height:100vh;min-height:100svh}
html.lgx .hdr,html.lgx .foot{position:relative;z-index:2}
html.lgx main{flex:1;justify-content:center}
html.lgx .login{flex:1;display:flex;align-items:center;justify-content:flex-end;padding:2vh 6% 4vh 0}
html.lgx .login-card{position:relative;z-index:2;width:min(440px,100%);gap:12px;padding:34px 32px 30px;border-radius:30px;background:var(--card);border:1px solid var(--bd);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 6px rgba(60,52,25,.06),0 30px 70px rgba(60,52,25,.18)}
html.lgx.dark .login-card{background:rgba(34,33,29,.92);border-color:rgba(255,255,255,.08);box-shadow:0 0 0 1px rgba(0,0,0,.2),0 30px 80px rgba(0,0,0,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
html.lgx .login-logo{width:62px;height:62px;border-radius:18px;margin-bottom:6px;box-shadow:0 1px 2px rgba(20,20,15,.2),0 10px 22px rgba(20,20,15,.18)}
html.lgx .login-card h1{font-size:30px;line-height:36px;font-weight:500}
html.lgx .login-card .sub{margin:0;color:var(--mut);line-height:1.5}
html.lgx .login-card .btn.big{height:54px;margin-top:8px;padding:0 24px}
html.lgx.dark .login-card .btn.y{box-shadow:0 10px 26px rgba(242,185,53,.25)}

/* pozadi: den a noc jako dve vrstvy, pri zmene se prolnou */
.lgx-bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;--cx:31%;--cy:50%}
.lgx-sky{position:absolute;inset:0;transition:opacity 1.6s ease}
.lgx-day{background:radial-gradient(900px 560px at 92% -10%,rgba(242,185,53,.30),transparent 62%),radial-gradient(780px 540px at var(--cx) var(--cy),rgba(255,255,255,.62),transparent 70%),#eeece2}
.lgx-night{opacity:0;background:radial-gradient(1000px 700px at var(--cx) var(--cy),rgba(242,185,53,.08),transparent 70%),radial-gradient(800px 480px at 92% -10%,rgba(150,160,190,.07),transparent 62%),#171715}
html.dark .lgx-night{opacity:1}
/* plynula zmena za chodu (trida jen na chvili) */
html.lgx-fade *,html.lgx-fade *::before,html.lgx-fade *::after{transition:opacity 1.6s ease,background-color 1.4s ease,color 1.4s ease,border-color 1.4s ease,box-shadow 1.4s ease,fill 1.4s ease!important}
html.lgx-fade body{transition:background-color 1.4s ease}

/* preklapeci hodiny (stejne jako prihlaseni do portalu): cerna skrin se sklem, okna HH | MM, zavesena na tycich; jen vzhled, aria-hidden */
.lgc{position:absolute;left:31%;top:50%;width:720px;height:240px;margin:-120px 0 0 -360px;transform:scale(var(--s,1));-webkit-user-select:none;user-select:none}
.lgc *{box-sizing:border-box}
.lgc-rod{position:absolute;bottom:100%;width:6px;height:1600px;background:linear-gradient(90deg,#121211,#34332f 40%,#57554f 55%,#1a1a19);box-shadow:0 0 14px rgba(0,0,0,.55)}
.lgc-rodL{left:150px}.lgc-rodR{right:150px}
.lgc-rod::after{content:"";position:absolute;left:-11px;bottom:-1px;width:28px;height:11px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#34332f,#151514);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.lgc-case{position:absolute;inset:0;border-radius:16px;background:radial-gradient(rgba(255,255,255,.035) .8px,transparent 1.2px) 0 0/3px 3px,linear-gradient(180deg,#272725 0%,#171716 36%,#0e0e0d 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),inset 0 -2px 0 rgba(0,0,0,.7),inset 1px 0 0 rgba(255,255,255,.05),inset -1px 0 0 rgba(255,255,255,.05),0 2px 0 #050505,0 36px 72px rgba(0,0,0,.66),0 10px 22px rgba(0,0,0,.45)}
.lgc-face{position:absolute;inset:12px;border-radius:7px;overflow:hidden;background:radial-gradient(rgba(255,255,255,.025) .7px,transparent 1px) 0 0/3px 3px,linear-gradient(180deg,#141413,#0d0d0c);box-shadow:inset 0 3px 8px rgba(0,0,0,.9),inset 0 0 0 1px rgba(255,255,255,.05)}
.lgc-win{position:absolute;top:22px;width:220px;height:172px;border-radius:4px;overflow:hidden;background:linear-gradient(180deg,#222221,#191918);box-shadow:inset 0 0 0 1px rgba(0,0,0,.8),inset 0 2px 0 rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.06)}
.lgc-win::before{content:"";position:absolute;inset:6px;border-radius:3px;background:#050505;box-shadow:inset 0 6px 10px rgba(0,0,0,.9)}
.lgc-winH{left:111px}.lgc-winM{right:111px}
.lgc-u{position:absolute;inset:8px;--h:156px;-webkit-perspective:900px;perspective:900px}
.lgc-u::before,.lgc-u::after{content:"";position:absolute;z-index:3;top:calc(50% - 7px);width:4px;height:14px;border-radius:1px;background:linear-gradient(180deg,#45443f,#1b1b1a)}
.lgc-u::before{left:-6px}.lgc-u::after{right:-6px}
.lgc-h{position:absolute;left:0;right:0;height:calc(var(--h) / 2 - 1px);overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.lgc-t{top:0;border-radius:3px 3px 0 0;background:linear-gradient(180deg,#1e1e1d,#181817);-webkit-transform-origin:50% calc(100% + 1px);transform-origin:50% calc(100% + 1px)}
.lgc-b{bottom:0;border-radius:0 0 3px 3px;background:linear-gradient(180deg,#141413,#0f0f0f);box-shadow:0 2px 0 #070707,0 3px 0 #1c1c1b,0 4px 0 #080808;-webkit-transform-origin:50% -1px;transform-origin:50% -1px}
.lgc-b::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:rgba(255,255,255,.07)}
.lgc-h span{position:absolute;left:0;right:0;height:var(--h);display:flex;align-items:center;justify-content:center;padding-top:4px;font:600 138px/1 'Outfit',system-ui,-apple-system,sans-serif;letter-spacing:.01em;color:#eceeec;-webkit-text-stroke:3px #eceeec;white-space:nowrap}
.lgc-t span{top:0}
.lgc-b span{top:calc(var(--h) / -2 - 1px);color:#dfe2df;-webkit-text-stroke-color:#dfe2df}
.lgc-ft,.lgc-fb{visibility:hidden;z-index:2}
.lgc-ft::after,.lgc-fb::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--sh,0)}
.lgc-glass{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(112deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.028) 23%,transparent 23.4%,transparent 60%,rgba(255,255,255,.04) 60.4%,rgba(255,255,255,.012) 71%,transparent 71.4%),linear-gradient(180deg,rgba(255,255,255,.05),transparent 20%)}
.lgc-plate{position:absolute;bottom:17px;z-index:3;height:20px;padding:0 7px;border-radius:2px;font:600 10.5px/20px 'Outfit',system-ui,sans-serif;letter-spacing:.12em;white-space:nowrap}
.lgc-plD{left:15px;color:#252523;background:linear-gradient(180deg,#e7e6e0,#b9b8b1);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(0,0,0,.25),0 1px 2px rgba(0,0,0,.7)}
.lgc-plB{right:15px;color:#a9a8a1;background:#121211;border:1px solid rgba(255,255,255,.2);line-height:18px;font-size:9.5px;letter-spacing:.22em}
.lgc-cap{position:absolute;left:0;right:0;top:calc(100% + 26px);text-align:center;font:400 30px/1.2 'Outfit',system-ui,sans-serif;color:var(--mut);display:none}
/* ve dne mekci stin (hodiny visi ve svetle mistnosti) */
html:not(.dark) .lgc-case{box-shadow:inset 0 1px 0 rgba(255,255,255,.15),inset 0 -2px 0 rgba(0,0,0,.7),inset 1px 0 0 rgba(255,255,255,.05),inset -1px 0 0 rgba(255,255,255,.05),0 2px 0 #050505,0 34px 64px rgba(60,52,25,.30),0 10px 22px rgba(60,52,25,.20)}
html:not(.dark) .lgc-rod{box-shadow:0 0 10px rgba(60,52,25,.22)}

@media (max-width:900px){
  html.lgx .wrap{padding:16px 16px 0;gap:0}
  html.lgx main{justify-content:flex-end}
  html.lgx .login{flex:none;align-items:flex-end;justify-content:stretch;padding:0}
  html.lgx .login-card{width:auto;flex:1;margin:0 -16px;border-radius:30px 30px 0 0;border-bottom:0;padding:26px 22px calc(22px + env(safe-area-inset-bottom,0px))}
  html.lgx .login-logo{display:none}
  html.lgx .login-card h1{font-size:26px;line-height:32px}
  html.lgx .login-card .btn.big{align-self:stretch;height:56px;font-size:17px}
  html.lgx .foot{display:none}
  .lgc-plate{display:none}
  .lgc-cap{display:block}
  .lgc-rodL{left:170px}.lgc-rodR{right:170px}
}
