/* HAVAL LAWYER / Mobile and tablet interface finish.
   One responsive extension for both portals; module business logic untouched. */
html[data-haval-brand="white-first"] body{
 min-width:0;overscroll-behavior-x:none;
 -webkit-text-size-adjust:100%;text-size-adjust:100%;
}
html[data-haval-brand="white-first"] :is(#app,#portalView,#loginView) :is(
 .main,.content,.page,.modalbox,.card,.grid2,.grid3,.grid4,.pagehead,.toolbar,.topactions,.field,.tablewrap
){min-width:0;max-width:100%}
html[data-haval-brand="white-first"] :is(#app,#portalView,#loginView) img{
 max-width:100%;object-fit:contain;
}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 .hv-device-table,.tablewrap,.hv-dms-tablewrap
){
 max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;
 -webkit-overflow-scrolling:touch;scrollbar-width:thin;
}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 .hv-device-table,.tablewrap,.hv-dms-tablewrap
):focus-visible{outline:3px solid var(--hl2-focus)!important;outline-offset:0}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 .pagehead,.page-actions,.toolbar,.modalhead,.modalfoot,.dash-panel-head
){gap:clamp(8px,1vw,16px)}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 .pagehead h1,.page-heading h1
){font-size:clamp(20px,2.4vw,30px)!important;line-height:1.4!important}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 .field,.form-field,.hv-settings-row
){min-width:0}
html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
 svg,i[data-lucide]
){flex-shrink:0}
html[data-haval-brand="white-first"] #app .hv-mobile-header-brand{display:none}
@media(min-width:1101px){
 html[data-haval-brand="white-first"] #app .legal-top-actions{
  flex-wrap:wrap!important;min-width:0!important;gap:10px!important;
 }
 html[data-haval-brand="white-first"] #app .legal-search{
  min-width:min(250px,100%)!important;
 }
}
@media(max-width:1100px){
 html[data-haval-brand="white-first"] #app.app,
 html[data-haval-brand="white-first"] #app.legal-sidebar-mini.app{
  grid-template-columns:minmax(0,1fr)!important;
 }
 html[data-haval-brand="white-first"] #app>.main{
  width:100%!important;grid-column:1!important;overflow-x:clip;
 }
 html[data-haval-brand="white-first"] #app>.sidebar{
  background:var(--hl2-surface)!important;z-index:1002!important;
  max-height:100dvh!important;overscroll-behavior:contain;
  box-shadow:var(--hl2-elevation)!important;
 }
 html[data-haval-brand="white-first"] #app .hv-device-drawer-scrim:not([hidden]){
  display:block;background:var(--hl2-overlay)!important;z-index:1001!important;
 }
 html[dir="ltr"][data-haval-brand="white-first"] #app>.sidebar{
  left:-320px!important;right:auto!important;
  transition:left .2s ease!important;
 }
 html[dir="ltr"][data-haval-brand="white-first"] #app>.sidebar.open{
  left:0!important;right:auto!important;
 }
 html[data-haval-brand="white-first"] #app .legal-top-actions #mobileMenu{
  display:grid!important;min-width:44px!important;width:44px!important;
  height:44px!important;
 }
 html[data-haval-brand="white-first"] #app .hv-mobile-header-brand{
  display:block;align-self:center;flex:0 0 auto;
  width:134px;height:44px;max-width:35vw;
  background:#fff;border-radius:7px;padding:4px;
 }
}
@media(max-width:980px){
 html[data-haval-brand="white-first"] #portalView.app{
  grid-template-columns:minmax(0,1fr)!important;
 }
 html[data-haval-brand="white-first"] #portalView>.main{
  grid-column:1!important;width:100%!important;min-width:0!important;
 }
 html[data-haval-brand="white-first"] #portalView>.sidebar{
  background:var(--hl2-surface)!important;z-index:1002!important;
  max-height:100dvh!important;overscroll-behavior:contain;
 }
 html[data-haval-brand="white-first"] #portalView .hv-device-drawer-scrim:not([hidden]){
  background:var(--hl2-overlay)!important;display:block;
 }
 html[data-haval-brand="white-first"] #portalView .content{
  max-width:100%!important;width:100%!important;
 }
}
@media(max-width:820px){
 html[data-haval-brand="white-first"] :is(#app,#portalView,#loginView) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,textarea
 ){font-size:16px!important}
 html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
  button,.btn,.iconbtn,[role="button"],.lang-cycle
 ){min-height:44px}
 html[data-haval-brand="white-first"] :is(#app,#portalView) .content{
  padding-inline:clamp(12px,2.7vw,20px)!important;
  min-width:0;
 }
 html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
  .grid3,.grid4,.dash-secondary-grid,.dash-primary-grid,.dash-command-grid,
  .company-info-grid,.hv-dms-layout
 ){grid-template-columns:minmax(0,1fr)!important}
 html[data-haval-brand="white-first"] :is(#app,#portalView) :is(
  .stats,.dash-stats,.hv-v2-summary,.hv-dms-metrics
 ){gap:10px!important}
 html[data-haval-brand="white-first"] #app .topbar.legal-topbar{
  position:sticky!important;top:0;z-index:90;
  padding:10px max(12px,env(safe-area-inset-right)) 10px
    max(12px,env(safe-area-inset-left))!important;
  min-height:0!important;
 }
 html[data-haval-brand="white-first"] #app .legal-top-actions{
  display:flex!important;flex-wrap:wrap!important;
  width:100%!important;align-items:center!important;
  gap:8px!important;min-height:unset!important;padding:0!important;
 }
 html[data-haval-brand="white-first"] #app .legal-top-title,
 html[data-haval-brand="white-first"] #app .legal-top-actions>.legal-account{
  display:none!important;
 }
 html[data-haval-brand="white-first"] #app .topactions.legal-toolbar{
  display:grid!important;width:100%!important;min-width:0!important;
  flex:1 1 100%!important;order:2!important;
  grid-template-columns:minmax(0,1fr) repeat(3,44px)!important;
  grid-template-rows:44px 44px!important;
  gap:8px!important;justify-content:stretch!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar #companyPickerWrap{
  grid-column:1/-1!important;grid-row:1!important;
  width:100%!important;max-width:none!important;min-width:0!important;
  height:44px!important;min-height:44px!important;
  margin:0!important;order:initial!important;
  background:var(--hl2-surface)!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar #companySelect{
  width:100%!important;min-width:0!important;max-width:100%!important;
  background:transparent!important;color:var(--hl2-text)!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar .legal-language-wrap{
  grid-column:1!important;grid-row:2!important;min-width:0!important;
  order:initial!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar .legal-lang-btn{
  width:100%;height:44px;min-height:44px;
  justify-content:flex-start;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar .notifywrap{
  grid-column:2!important;grid-row:2!important;order:initial!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar #legalThemeBtn{
  display:grid!important;grid-column:3!important;grid-row:2!important;
  order:initial!important;width:44px!important;height:44px!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar #legalSettingsBtn{
  display:grid!important;grid-column:4!important;grid-row:2!important;
  order:initial!important;width:44px!important;height:44px!important;
 }
 html[data-haval-brand="white-first"] #app .legal-toolbar #legalFullscreenBtn{
  display:none!important;
 }
 html[data-haval-brand="white-first"] #app .legal-search{
  flex:1 1 100%!important;max-width:none!important;
  min-width:0!important;width:100%!important;
  order:3!important;min-height:44px!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar{
  position:sticky!important;top:0;z-index:90;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto 42px 42px!important;
  grid-template-rows:44px 44px!important;
  gap:7px!important;align-items:center!important;
  padding:8px max(10px,env(safe-area-inset-right))
  9px max(10px,env(safe-area-inset-left))!important;
  background:var(--hl2-surface)!important;
 }
 html[data-haval-brand="white-first"] #portalView .hv-portal-top-start{
  grid-column:1!important;grid-row:1!important;gap:5px!important;
  min-width:0!important;overflow:hidden;
 }
 html[data-haval-brand="white-first"] #portalView .topactions{
  display:contents!important;
 }
 html[data-haval-brand="white-first"] #portalView .hv-portal-utility-actions{
  grid-column:2!important;grid-row:1!important;display:flex!important;
  gap:4px!important;justify-content:center;
 }
 html[data-haval-brand="white-first"] #portalView .topactions>.notifywrap{
  grid-column:3!important;grid-row:1!important;
 }
 html[data-haval-brand="white-first"] #portalView .topactions>.accountwrap{
  grid-column:4!important;grid-row:1!important;min-width:0!important;
 }
 html[data-haval-brand="white-first"] #portalView .topactions>.hv-portal-language{
  grid-column:1!important;grid-row:2!important;min-width:0!important;
  justify-self:stretch!important;
 }
 html[data-haval-brand="white-first"] #portalView .topactions>.companyselect{
  grid-column:2/5!important;grid-row:2!important;
  display:flex!important;width:100%!important;min-width:0!important;
  max-width:none!important;justify-self:stretch!important;
  align-items:center!important;gap:4px;
 }
 html[data-haval-brand="white-first"] #portalView .companyselect select{
  width:100%!important;min-width:0!important;max-width:none!important;
  flex:1 1 0!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar :is(
  .hv-portal-control,#mobileMenu,#notifyBtn,.top-account-chip
 ){
  width:40px!important;min-width:40px!important;height:44px!important;
  padding:0!important;min-height:44px!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar #portalHomeBtn{
  display:none!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar .topbar-brandmark{
  max-width:clamp(74px,20vw,118px);height:40px;
  object-fit:contain!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar h2{
  display:none!important;
 }
 html[data-haval-brand="white-first"] #portalView .hv-portal-language .lang-cycle{
  width:100%!important;min-width:0!important;
  min-height:44px!important;max-width:100%!important;
 }
 html[data-haval-brand="white-first"] #portalView :is(.portal-privacy-chip){
  display:none!important;
 }
 html[data-haval-brand="white-first"] :is(#app,#portalView) .modal{
  align-items:flex-end!important;padding:0!important;
 }
 html[data-haval-brand="white-first"] :is(#app,#portalView) .modalbox,
 html[data-haval-brand="white-first"] :is(#app,#portalView) .modalbox.wide{
  max-width:100%!important;width:100%!important;
  max-height:calc(100dvh - env(safe-area-inset-top,0px) - 12px)!important;
  border-radius:18px 18px 0 0!important;overflow-y:auto;
  overscroll-behavior:contain;
 }
 html[data-haval-brand="white-first"] :is(#app,#portalView) .modalfoot{
  position:sticky;bottom:0;z-index:3;
  background:var(--hl2-elevated)!important;
  padding-bottom:max(14px,env(safe-area-inset-bottom,0px))!important;
 }
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-head{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto!important;padding:20px 14px!important;
  gap:12px!important;
 }
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-hero-intro,
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-company-picker,
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-head-actions{
  grid-column:1!important;grid-row:auto!important;
 }
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-layout{
  grid-template-columns:minmax(0,1fr)!important;
 }
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-tabs{
  display:flex!important;flex-direction:row!important;
  flex-wrap:nowrap!important;overflow-x:auto!important;
  gap:7px!important;scroll-snap-type:x proximity;
 }
 html[data-haval-brand="white-first"] #app #hvDmsRoot .hv-dms-tabs button{
  flex:0 0 auto!important;scroll-snap-align:start;
 }
 html[data-haval-brand="white-first"] #portalView .content{
  padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;
 }
 html[data-haval-brand="white-first"] #portalView .bottom-nav{
  background:var(--hl2-elevated)!important;
  border-top:1px solid var(--hl2-border)!important;
  padding-bottom:env(safe-area-inset-bottom,0px)!important;
  box-shadow:0 -2px 16px rgba(0,0,0,.06)!important;
 }
 html[data-haval-brand="white-first"] #portalView .bottom-nav button{
  color:var(--hl2-muted)!important;background:transparent!important;
  min-height:54px!important;
 }
 html[data-haval-brand="white-first"] #portalView .bottom-nav button.active{
  color:var(--hl2-text)!important;
  box-shadow:inset 0 2px 0 var(--hl2-accent)!important;
 }
}
@media(max-width:540px){
 html[data-haval-brand="white-first"] #app .pagehead{
  align-items:stretch!important;flex-direction:column!important;
 }
 html[data-haval-brand="white-first"] #app .page-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  width:100%!important;gap:8px!important;
 }
 html[data-haval-brand="white-first"] #app :is(.stats,.legal-stats,.compliance-stats,.compliance-calcs,.hv-dms-metrics){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;
 }
 html[data-haval-brand="white-first"] #app :is(.stats .stat,.hv-dms-metric){
  min-width:0!important;padding:13px!important;
 }
 html[data-haval-brand="white-first"] #app :is(.grid2,.grid3,.grid4,.split,
  .employee-row.tax,.employee-row.social-security
 ){grid-template-columns:minmax(0,1fr)!important}
 html[data-haval-brand="white-first"] :is(#app,#portalView) :is(.modalbody,.modalfoot){
  padding-inline:14px!important;
 }
 html[data-haval-brand="white-first"] #portalView .dash-stats{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
 }
 html[data-haval-brand="white-first"] #portalView .dash-quick-actions{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
 }
 html[data-haval-brand="white-first"] #portalView :is(.dash-command-meta,.dash-secondary-grid,.hv-v2-summary){
  grid-template-columns:minmax(0,1fr)!important;
 }
 html[data-haval-brand="white-first"] #portalView :is(.dash-panel,.dash-command,.card){
  padding:clamp(12px,3vw,18px)!important;
 }
 html[data-haval-brand="white-first"] #loginView.login-shell.login-v3{
  padding:clamp(10px,2vw,24px)!important;
  padding-top:max(14px,env(safe-area-inset-top,0px))!important;
  padding-bottom:max(24px,env(safe-area-inset-bottom,0px))!important;
  min-width:0!important;background:var(--hl2-bg)!important;
 }
 html[data-haval-brand="white-first"] #loginView .login-v3-stage{
  width:100%!important;max-width:100%!important;
  margin-inline:auto!important;padding:0!important;
 }
 html[data-haval-brand="white-first"] #loginView :is(.login-v3-hero,.login-v3-authzone){
  padding-inline:12px!important;width:100%!important;min-width:0!important;
 }
 html[data-haval-brand="white-first"] #loginView .login-v3-hero .login-v3-logo{
  width:clamp(180px,62vw,245px)!important;height:125px!important;
 }
 html[data-haval-brand="white-first"] #loginView .login-v3-hero h1{
  font-size:clamp(22px,6vw,30px)!important;line-height:1.45!important;
 }
 html[data-haval-brand="white-first"] #loginView .login-v3-hero p{
  font-size:14px!important;line-height:1.75!important;max-width:100%!important;
 }
 html[data-haval-brand="white-first"] #loginView .loginbox{
  width:100%!important;max-width:100%!important;padding:20px 16px!important;
  border-radius:14px!important;
 }
 html[data-haval-brand="white-first"] #loginView :is(.loginbtn,.hv-client-entry){
  min-height:50px!important;
 }
 html[data-haval-brand="white-first"] #loginView :is(.login-v3-trust,.login-v3-support-grid){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;
 }
 html[data-haval-brand="white-first"] #loginView .login-v3-support{
  padding-inline:8px!important;
 }
}
@media(max-width:375px){
 html[data-haval-brand="white-first"] #portalView .topbar{
  grid-template-columns:minmax(0,1fr) auto 38px 38px!important;
  column-gap:4px!important;
 }
 html[data-haval-brand="white-first"] #portalView .topbar .topbar-brandmark{
  width:78px!important;max-width:78px!important;
 }
 html[data-haval-brand="white-first"] #portalView .hv-portal-control,
 html[data-haval-brand="white-first"] #portalView #mobileMenu{
  width:36px!important;min-width:36px!important;
 }
 html[data-haval-brand="white-first"] #portalView .hv-portal-utility-actions{gap:2px!important}
 html[data-haval-brand="white-first"] #app .hv-mobile-header-brand{width:115px}
 html[data-haval-brand="white-first"] #portalView .bottom-nav button{
  font-size:10px!important;
 }
}
@media(orientation:landscape) and (max-height:540px){
 html[data-haval-brand="white-first"] :is(#app,#portalView) .modalbox{
  max-height:calc(100dvh - 8px)!important;
 }
 html[data-haval-brand="white-first"] :is(#app,#portalView) .topbar{
  position:relative!important;
 }
}