/* WebVision Web v0.12 — readable, independently scrolling sidebar on
   phones/tablets in landscape; accessible optional Remember me checkbox. */
.dialog label.remember-option {
  display:flex;
  align-items:center;
  gap:11px;
  font-size:14px;
  font-weight:600;
  margin-top:14px;
  cursor:pointer;
}
.dialog .remember-option input[type=checkbox] {
  appearance:auto;
  width:19px;
  height:19px;
  min-width:19px;
  margin:0;
  padding:0;
  accent-color:var(--blue);
  cursor:pointer;
}
.dialog p.remember-help {
  font-size:12px;
  color:var(--muted);
  line-height:1.4;
  margin:8px 0 0 30px;
}
/* Use a labeled sidebar in the tablet/landscape range instead of the 76px
   icon-only breakpoint from the original TV stylesheet. */
@media (min-width:701px) and (max-width:1050px) {
  .app-shell {grid-template-columns:184px minmax(0,1fr)}
  .sidebar {height:100dvh; min-height:0; overflow:hidden; padding:17px 9px 12px}
  .brand {justify-content:flex-start; gap:8px; margin:0 0 15px 4px; font-size:12px; letter-spacing:.7px; white-space:nowrap}
  .brand svg {width:30px; height:30px; flex:none}
  .brand span,.nav-link .nav-label {display:inline}
  #side-nav {flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#415575 transparent; -webkit-overflow-scrolling:touch}
  #side-nav .side-nav {gap:5px}
  .nav-link {min-height:43px; justify-content:flex-start; gap:9px; padding:0 10px; font-size:13px; overflow:hidden}
  .nav-link .nav-icon {font-size:19px; width:23px}
  .nav-link .nav-label {white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
  .nav-link.active::before {left:10px; bottom:2px; width:22px; height:3px}
  .sidebar-bottom {display:none}
}
/* Reduce sidebar vertical whitespace on short landscape displays. */
@media (orientation:landscape) and (min-width:701px) and (max-height:560px) {
  .sidebar {padding-top:max(7px,env(safe-area-inset-top)); padding-bottom:max(7px,env(safe-area-inset-bottom))}
  .brand {margin-bottom:8px}
  #side-nav .side-nav {gap:2px}
  .nav-link {min-height:40px}
}
