/* Scoped, non-destructive responsive improvements shared by all Smartpanel layouts. */
html,body{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}
*,*:before,*:after{box-sizing:border-box}
img,video,iframe{max-width:100%}
img{height:auto}
input,textarea,select,button{max-width:100%}
.table-responsive,.dataTables_wrapper,.hz-qtable-wrap{max-width:100%;-webkit-overflow-scrolling:touch}
.hz-safety-backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:16px;background:rgba(14,28,51,.66);z-index:2147483647}
.hz-safety-dialog{width:min(100%,470px);padding:28px 26px;border-radius:18px;background:#fff;box-shadow:0 20px 70px rgba(12,28,48,.28);border-top:5px solid #d94751;text-align:center;color:#24364e;direction:inherit}
.hz-safety-dialog h2{font:700 22px/1.4 system-ui,sans-serif;margin:0 0 10px}
.hz-safety-dialog p{font:400 15px/1.7 system-ui,sans-serif;margin:0 0 20px;color:#536780}
.hz-safety-ok{border:0;color:#fff;background:linear-gradient(120deg,#176cc1,#3489de);border-radius:10px;padding:11px 35px;cursor:pointer;font-weight:700;min-height:42px}
.hz-safety-ok:focus-visible{outline:3px solid #8dbfff;outline-offset:2px}
@media(max-width:991px){
  .container,.container-fluid{max-width:100%;padding-left:14px;padding-right:14px}
  .row{min-width:0}
  .row>[class*="col-"]{min-width:0}
  .card,.card-body,.card-header,.modal-content,.tab-content{max-width:100%}
  .card-body{padding:clamp(12px,3vw,22px)}
  .modal-dialog{max-width:calc(100vw - 24px);margin:12px auto}
  .modal-body{max-height:calc(100vh - 120px);overflow-y:auto}
  .navbar-collapse{max-height:calc(100vh - 74px);overflow-y:auto}
  .form-inline{gap:8px;flex-wrap:wrap}
  .dataTables_wrapper .row{gap:9px}
}
@media(max-width:767px){
  body{font-size:14px}
  h1,.h1{font-size:clamp(23px,6vw,32px)}
  h2,.h2{font-size:clamp(20px,5.4vw,27px)}
  .btn,.form-control,.custom-select{min-height:36px}
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px}
  .card-header{padding:12px 14px;flex-wrap:wrap;gap:8px}
  .card-header .card-title{max-width:100%;overflow-wrap:anywhere}
  .form-group,.form-row,.input-group{max-width:100%;min-width:0}
  .input-group{flex-wrap:wrap}
  .input-group>.form-control{min-width:90px;flex:1 1 125px}
  .nav-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .nav-tabs .nav-link{white-space:nowrap}
  table.table:not(.table-borderless){font-size:12px}
  .table-responsive>table,.dataTables_wrapper table{width:100%;min-width:600px}
  .dataTables_wrapper{overflow-x:auto}
  .dataTables_filter input,.dataTables_length select{max-width:100%}
  .pagination{flex-wrap:wrap;gap:3px}
  .hz-warranty-card{max-width:100%!important;min-width:0!important}
  .hz-warranty-details{gap:10px!important}
  .hz-warranty-metric{min-width:110px!important;flex:1 1 120px}
  .hz-refill-inline-item{max-width:100%;white-space:normal!important}
  .hz-refill-indicator{white-space:normal!important}
  #hz-refill-queue .hz-qtable-wrap{overflow-x:auto}
  #hz-refill-queue .hz-qtable{min-width:950px}
  .hz-public-language{margin-inline:4px!important}
}
@media(max-width:400px){
  .container,.container-fluid{padding-left:10px;padding-right:10px}
  .hz-safety-dialog{padding:22px 16px}
  .btn-group{flex-wrap:wrap}
}