/* Public login shell only. Authenticated PhazTrack/TimaLink app layouts are intentionally untouched. */
html.product-login-clean body{min-height:100vh;overflow-x:hidden}
html.product-login-clean #login.login{
  min-height:100svh!important;
  display:grid!important;
  grid-template-columns:minmax(360px,520px) minmax(420px,1fr)!important;
  align-items:center!important;
  gap:clamp(28px,5vw,76px)!important;
  padding:clamp(24px,4vw,54px)!important;
  position:relative!important;
  overflow:hidden!important
}
html.product-login-clean body[data-product="timalink"] #login.login.hidden{display:none!important}
html.product-login-clean #login.login:after{display:none!important}
html.product-login-clean body[data-product="phaztrack"] #login.login{
  background:
    radial-gradient(circle at 74% 22%,rgba(226,39,53,.18),transparent 25%),
    radial-gradient(circle at 98% 96%,rgba(43,74,105,.18),transparent 32%),
    linear-gradient(135deg,#06111d 0%,#071522 54%,#09131f 100%)!important
}
html.product-login-clean body[data-product="timalink"] #login.login{
  background:
    radial-gradient(circle at 72% 18%,rgba(22,103,217,.14),transparent 27%),
    linear-gradient(145deg,#f6f9fd 0%,#eef4fb 48%,#e9f1fa 100%)!important
}
html.product-login-clean #login .login-card{
  align-self:center!important;
  justify-self:center!important;
  margin:0!important;
  width:min(430px,100%)!important;
  max-width:430px!important;
  border-radius:24px!important;
  padding:clamp(26px,3vw,36px)!important;
  position:relative!important;
  z-index:2!important
}
html.product-login-clean body[data-product="phaztrack"] #login .login-card{
  background:rgba(8,22,35,.94)!important;
  border:1px solid rgba(89,119,148,.34)!important;
  color:#f8fbff!important;
  box-shadow:0 28px 80px rgba(0,0,0,.35)!important;
  backdrop-filter:blur(18px)!important
}
html.product-login-clean body[data-product="timalink"] #login .login-card{
  background:#fff!important;
  border:1px solid #dfe8f2!important;
  color:#132033!important;
  box-shadow:0 28px 80px rgba(26,48,78,.12)!important;
  backdrop-filter:none!important
}
html.product-login-clean #login .login-brand{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  margin:0 0 18px!important
}
html.product-login-clean #login .login-brand img{
  width:46px!important;
  height:52px!important;
  object-fit:contain!important
}
html.product-login-clean body[data-product="timalink"] #login .login-brand img{
  width:48px!important;
  height:48px!important
}
html.product-login-clean #login .login-brand h1{
  margin:0!important;
  font-size:clamp(1.72rem,3vw,2rem)!important;
  letter-spacing:-.045em!important;
  line-height:1!important
}
html.product-login-clean .login-welcome{
  margin:0 0 7px!important;
  font-size:1.28rem!important;
  letter-spacing:-.025em!important;
  line-height:1.2!important
}
html.product-login-clean body[data-product="phaztrack"] .login-welcome{color:#fff!important}
html.product-login-clean body[data-product="timalink"] .login-welcome{color:#102541!important}
html.product-login-clean #login .login-card>p:not(.product-password-note){
  margin:0 0 22px!important;
  font-size:.88rem!important;
  line-height:1.55!important
}
html.product-login-clean body[data-product="phaztrack"] #login .login-card>p:not(.product-password-note){color:#9fb0c5!important}
html.product-login-clean body[data-product="timalink"] #login .login-card>p:not(.product-password-note){color:#68778a!important}
html.product-login-clean #login .field{
  display:grid!important;
  gap:7px!important;
  margin:13px 0!important
}
html.product-login-clean #login .field label{
  font-size:.76rem!important;
  font-weight:800!important;
  letter-spacing:.01em!important
}
html.product-login-clean body[data-product="phaztrack"] #login .field label{color:#c7d2df!important}
html.product-login-clean body[data-product="timalink"] #login .field label{color:#405168!important}
html.product-login-clean #login .field input{
  width:100%!important;
  min-height:50px!important;
  border-radius:12px!important;
  padding:13px 14px!important;
  outline:none!important
}
html.product-login-clean body[data-product="phaztrack"] #login .field input{
  background:#071521!important;
  color:#fff!important;
  border:1px solid #38506a!important
}
html.product-login-clean body[data-product="phaztrack"] #login .field input:focus{
  border-color:#e22735!important;
  box-shadow:0 0 0 3px rgba(226,39,53,.12)!important
}
html.product-login-clean body[data-product="timalink"] #login .field input{
  background:#fff!important;
  color:#132033!important;
  border:1px solid #d7e1ec!important
}
html.product-login-clean body[data-product="timalink"] #login .field input:focus{
  border-color:#6e9fe0!important;
  box-shadow:0 0 0 3px rgba(22,103,217,.08)!important
}
html.product-login-clean #login .primary{
  width:100%!important;
  min-height:50px!important;
  margin-top:8px!important;
  border:0!important;
  border-radius:12px!important;
  color:#fff!important;
  font-weight:850!important;
  cursor:pointer!important;
  box-shadow:none!important
}
html.product-login-clean body[data-product="phaztrack"] #login .primary{
  background:linear-gradient(135deg,#f03a49,#d7192d)!important
}
html.product-login-clean body[data-product="timalink"] #login .primary{
  background:#1667d9!important
}
html.product-login-clean #login .primary:hover{filter:brightness(1.04)}
html.product-login-clean #login .msg{
  min-height:18px!important;
  margin:8px 0 0!important;
  font-size:.78rem!important
}
html.product-login-clean #login #productForgotPassword{
  display:block!important;
  margin:10px auto 0!important;
  padding:2px 4px!important;
  border:0!important;
  background:transparent!important;
  font-size:.78rem!important;
  font-weight:750!important;
  text-decoration:none!important;
  cursor:pointer!important
}
html.product-login-clean body[data-product="phaztrack"] #login #productForgotPassword{color:#ff7a84!important}
html.product-login-clean body[data-product="timalink"] #login #productForgotPassword{color:#1667d9!important}
html.product-login-clean #login .passkey-quick-wrap{
  margin:12px 0 0!important
}
html.product-login-clean #login .passkey-quick-wrap .passkey-login{
  width:100%!important;
  min-height:44px!important;
  padding:10px 13px!important;
  border-radius:11px!important;
  box-shadow:none!important;
  font-weight:800!important
}
html.product-login-clean body[data-product="phaztrack"] #login .passkey-quick-wrap .passkey-login{
  border:1px solid #425c75!important;
  background:#0a1c2b!important;
  color:#edf5fb!important
}
html.product-login-clean body[data-product="timalink"] #login .passkey-quick-wrap .passkey-login{
  border:1px solid #cfdae7!important;
  background:#f8fbff!important;
  color:#24415f!important
}
html.product-login-clean #login .passkey-quick-wrap .passkey-login small{
  display:block!important;
  margin-top:2px!important;
  font-size:.68rem!important;
  font-weight:650!important;
  opacity:.76!important;
  color:inherit!important
}
html.product-login-clean #login .passkey-saved,
html.product-login-clean #login .passkey-divider,
html.product-login-clean #login .product-password-note,
html.product-login-clean #login .login-passkey-unavailable,
html.product-login-clean #login #productInstall,
html.product-login-clean #login #productInstallAppLogin{
  display:none!important
}
html.product-login-clean #login .demo{
  margin:18px 0 0!important;
  padding-top:14px!important;
  border-top:1px solid rgba(127,151,176,.18)!important;
  font-size:.69rem!important;
  text-align:center!important
}
html.product-login-clean body[data-product="phaztrack"] #login .demo{color:#70879d!important}
html.product-login-clean body[data-product="timalink"] #login .demo{color:#8490a0!important}
html.product-login-clean .login-visual{
  min-height:min(690px,calc(100svh - 64px));
  border-radius:30px;
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
  padding:clamp(28px,5vw,72px);
  isolation:isolate
}
html.product-login-clean body[data-product="phaztrack"] .login-visual{
  background:
    linear-gradient(140deg,rgba(12,30,45,.96),rgba(5,18,29,.98)),
    #071522;
  border:1px solid rgba(92,121,148,.24);
  box-shadow:inset 0 1px rgba(255,255,255,.03)
}
html.product-login-clean body[data-product="timalink"] .login-visual{
  background:
    radial-gradient(circle at 72% 18%,rgba(120,167,231,.24),transparent 28%),
    linear-gradient(145deg,#0f2f50,#0c2037);
  border:1px solid rgba(23,75,123,.18);
  box-shadow:0 20px 60px rgba(37,77,118,.12)
}
html.product-login-clean .login-visual:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  opacity:.24;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom right,#000,transparent 78%)
}
html.product-login-clean .login-visual:after{
  content:"";
  position:absolute;
  width:440px;
  height:440px;
  border-radius:50%;
  right:-120px;
  bottom:-160px;
  z-index:-1
}
html.product-login-clean body[data-product="phaztrack"] .login-visual:after{
  background:radial-gradient(circle,rgba(226,39,53,.24),transparent 62%)
}
html.product-login-clean body[data-product="timalink"] .login-visual:after{
  background:radial-gradient(circle,rgba(79,144,222,.28),transparent 62%)
}
html.product-login-clean .login-visual-inner{
  width:min(580px,100%);
  text-align:left;
  color:#fff
}
html.product-login-clean .login-visual-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase
}
html.product-login-clean .login-visual h2{
  margin:18px 0 9px;
  max-width:620px;
  font-size:clamp(1.65rem,3vw,2.55rem);
  line-height:1.08;
  letter-spacing:-.045em
}
html.product-login-clean .login-visual p{
  max-width:540px;
  margin:0;
  color:rgba(235,244,252,.72);
  line-height:1.6;
  font-size:.9rem
}
html.product-login-clean .login-visual-graphic{
  margin-top:38px;
  width:min(560px,100%);
  aspect-ratio:16/9;
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  background:rgba(3,13,23,.30);
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 24px 70px rgba(0,0,0,.18);
  overflow:hidden
}
html.product-login-clean .login-visual-graphic svg{
  display:block;
  width:100%;
  height:100%
}
@media(max-width:980px){
  html.product-login-clean #login.login{
    grid-template-columns:1fr!important;
    padding:22px!important
  }
  html.product-login-clean .login-visual{display:none!important}
  html.product-login-clean #login .login-card{width:min(440px,100%)!important}
}
@media(max-width:520px){
  html.product-login-clean #login.login{
    padding:14px!important;
    min-height:100svh!important;
    align-items:center!important
  }
  html.product-login-clean #login .login-card{
    padding:24px 20px!important;
    border-radius:20px!important
  }
  html.product-login-clean #login .login-brand{margin-bottom:15px!important}
  html.product-login-clean #login .login-brand h1{font-size:1.7rem!important}
  html.product-login-clean .login-welcome{font-size:1.16rem!important}
}