/* Responsive hardening V34 */
:root{--border:var(--line);--primary:var(--teal);--accent:var(--teal-2);--app-vh:1vh}
html{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden;min-width:320px}
img,svg,video,canvas{max-width:100%;height:auto}
button,a,input,select,textarea{touch-action:manipulation}
button,.btn,.icon-btn,.nav-link{-webkit-tap-highlight-color:transparent}
.app-content,.content-panel,.table-panel,.panel-body,.modal-body{min-width:0}
.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.table-responsive table{min-width:720px}
.dataTables_wrapper,.dt-container{width:100%;min-width:0}
.dt-layout-row{gap:10px;align-items:center}
.dt-layout-cell{min-width:0}
.dt-search input{max-width:100%}
.action-group{display:flex;gap:5px;flex-wrap:nowrap;justify-content:flex-end}
.action-group .btn,.action-group button{flex:0 0 auto}
.modal-content{max-width:100%;overflow:hidden}
.modal-body{overflow-x:hidden}
.form-grid>*{min-width:0}
.ts-wrapper,.ts-control,.ts-dropdown{max-width:100%}
.ts-dropdown{z-index:1080}
.page-hero,.panel-head,.table-toolbar{min-width:0}
.page-hero>div:first-child,.panel-head>div:first-child{min-width:0}
.page-hero h2,.page-hero p,.panel-head h3,.panel-head p{overflow-wrap:anywhere}

/* Escritorio grande 1920x1080 */
@media(min-width:1600px){
  .app-shell{grid-template-columns:268px minmax(0,1fr)}
  .sidebar{width:268px;padding-inline:14px}
  .app-content{padding:24px 28px;max-width:1720px;width:100%;margin:0 auto}
  .metric-grid{grid-template-columns:repeat(4,minmax(220px,1fr))}
  .quick-grid{grid-template-columns:repeat(4,minmax(220px,1fr))}
  .modal-dialog.modal-xl{max-width:1320px}
}

/* Portátil 1366x768 y escritorio mediano */
@media(min-width:901px) and (max-width:1440px){
  .app-shell{grid-template-columns:224px minmax(0,1fr)}
  .sidebar{width:224px}
  .sidebar-nav .nav-link{padding:8px 9px;font-size:.76rem}
  .nav-caption{margin-top:10px}
  .workspace-card{padding:9px;margin-block:9px 11px}
  .app-content{padding:16px}
  .topbar{padding-inline:14px}
  .topbar-actions{gap:6px}
  .top-user div{max-width:150px}
  .metric-grid{gap:10px}
  .metric-card{padding:13px}
  .modal-dialog.modal-xl{max-width:calc(100vw - 42px)}
}

/* Tablet landscape / small laptop */
@media(min-width:901px) and (max-width:1180px){
  .app-shell{grid-template-columns:86px minmax(0,1fr)}
  .sidebar{width:86px;align-items:stretch}
  .brand-copy,.workspace-card div,.sidebar-nav .nav-link span,.sidebar-nav .nav-link em,.nav-caption,.sidebar-footer .user-mini div{display:none}
  .sidebar-brand{justify-content:center;padding:0}
  .sidebar-collapse{display:none}
  .workspace-card{justify-content:center;padding:9px 0}
  .sidebar-nav .nav-link{justify-content:center;padding:10px 6px}
  .sidebar-nav .nav-link i{font-size:1.15rem;width:auto}
  .sidebar-nav .nav-link.active:before{left:-1px}
  .sidebar-footer .user-mini{justify-content:center}
  .sidebar-footer .user-mini button{display:none}
  .top-user div{display:none}
  .breadcrumb-box strong{font-size:.92rem}
}

/* Tablet portrait and mobile navigation */
@media(max-width:900px){
  .app-shell{min-height:calc(var(--app-vh) * 100);grid-template-rows:64px minmax(0,1fr) calc(68px + env(safe-area-inset-bottom))}
  .sidebar{height:calc(var(--app-vh) * 100);max-height:100dvh;overflow:hidden}
  .sidebar-nav{padding-bottom:24px;overscroll-behavior:contain}
  .sidebar-backdrop.show{touch-action:none}
  .topbar{position:fixed;inset:0 0 auto 0;width:100%;padding-top:env(safe-area-inset-top);height:calc(64px + env(safe-area-inset-top))}
  .app-content{padding-top:calc(14px + env(safe-area-inset-top));padding-bottom:18px}
  .mobile-nav{position:fixed;left:0;right:0;bottom:0;min-height:68px}
  .topbar-actions{min-width:0}
  .breadcrumb-box{min-width:0}
  .breadcrumb-box strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40vw}
  .topbar-actions .icon-btn,.network-state{width:38px;height:38px;min-width:38px}
  .page-hero{gap:10px;flex-wrap:wrap}
  .hero-actions{display:flex;gap:7px;flex-wrap:wrap;width:100%}
  .hero-actions .btn{flex:1 1 auto;min-width:44px}
  .table-panel{overflow:hidden}
  .table-toolbar{width:100%}
  .modal-dialog{margin:8px auto;width:calc(100% - 16px)}
  .modal-dialog.modal-xl,.modal-dialog.modal-lg{max-width:calc(100% - 16px)}
  .modal-content{max-height:calc(var(--app-vh) * 100 - 16px)}
  .modal-header{padding:14px 16px}
  .modal-footer{padding:11px 15px;position:sticky;bottom:0;background:#fff;border-top:1px solid var(--line);z-index:2}
  .form-grid{gap:11px}
  .report-control-panel{padding:14px}
}

/* Tablet portrait */
@media(min-width:561px) and (max-width:900px){
  .app-content{padding-inline:18px}
  .metric-grid,.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .field-wrap.full{grid-column:1/-1}
  .modal-dialog.modal-xl{width:calc(100% - 28px);max-width:760px}
}

/* Android / teléfonos */
@media(max-width:560px){
  body{font-size:13px}
  .auth-panel{padding:12px;min-height:calc(var(--app-vh) * 100)}
  .auth-card{width:100%;padding:20px 17px;border-radius:16px}
  .auth-card-head{margin-bottom:20px}
  .auth-card-head h2{font-size:1.25rem}
  .form-control,.form-select,.ts-control{font-size:16px;min-height:46px} /* evita zoom Android/iOS */
  .field-action{width:38px;height:38px}
  .topbar{gap:7px;padding-inline:8px}
  .breadcrumb-box strong{max-width:31vw;font-size:.84rem}
  .topbar-actions{gap:3px}
  .topbar-actions .icon-btn,.network-state{width:36px;height:36px;min-width:36px;border-radius:9px}
  #profileBtn,#logoutBtn{display:none}
  .app-content{padding:10px 10px 16px}
  .page-hero{margin-bottom:10px}
  .page-hero h2{font-size:1.08rem}
  .page-hero p{font-size:.72rem}
  .metric-grid,.quick-grid{grid-template-columns:1fr 1fr;gap:7px}
  .metric-card,.quick-card{min-width:0;padding:10px}
  .metric-card strong{font-size:1rem}
  .metric-card span,.quick-card small{font-size:.62rem}
  .content-panel,.table-panel{border-radius:12px}
  .panel-head{padding:12px}
  .panel-body{padding:12px}
  .table-responsive table{min-width:640px}
  .table-responsive th,.table-responsive td{white-space:nowrap;font-size:.72rem;padding:.55rem .55rem}
  .action-group{min-width:78px}
  .action-group .btn{width:34px;height:34px;padding:0;display:grid;place-items:center}
  .action-group .btn span{display:none}
  .dt-layout-row{display:flex!important;flex-direction:column;align-items:stretch!important}
  .dt-layout-cell{width:100%!important;text-align:left!important}
  .dt-search{display:flex;flex-direction:column;gap:5px;width:100%}
  .dt-search input{width:100%!important;margin:0!important}
  .dt-length select{min-width:76px}
  .dt-paging{overflow-x:auto;padding-bottom:3px}
  .dt-paging nav{white-space:nowrap}
  .modal-dialog,.modal-dialog.modal-xl,.modal-dialog.modal-lg{width:100%;max-width:none;margin:0;min-height:calc(var(--app-vh) * 100)}
  .modal-content{min-height:calc(var(--app-vh) * 100);max-height:calc(var(--app-vh) * 100);border:0;border-radius:0}
  .modal-header{padding-top:calc(13px + env(safe-area-inset-top))}
  .modal-body{padding:13px 14px 90px}
  .modal-footer{padding-bottom:calc(12px + env(safe-area-inset-bottom));flex-wrap:wrap}
  .modal-footer .btn{flex:1 1 120px}
  .form-grid{grid-template-columns:1fr!important}
  .field-wrap.full{grid-column:auto}
  .upload-zone{padding:14px;align-items:flex-start}
  .file-item{align-items:flex-start}
  .summary-grid{grid-template-columns:1fr 1fr}
  .report-format-bar{grid-template-columns:1fr 1fr}
  .report-format{min-width:0}
  .report-document-head{padding:15px}
  .notification-item{padding:12px 8px}
  .offline-queue-list{max-height:58vh}
}

/* Very small devices */
@media(max-width:370px){
  .breadcrumb-box{display:none}
  .topbar-actions{margin-left:auto}
  .metric-grid,.quick-grid,.summary-grid,.report-format-bar{grid-template-columns:1fr}
  .mobile-nav a{font-size:.56rem}
}

/* Touch devices */
@media(pointer:coarse){
  .sidebar-nav .nav-link{min-height:44px}
  .btn,.icon-btn,.field-action,.mobile-nav a{min-height:44px}
  .form-check-input{width:1.2em;height:1.2em}
}

/* Reduced motion and browser compatibility */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@supports not (backdrop-filter:blur(4px)){.global-loader{background:rgba(7,29,43,.92)}.topbar{background:#fff}}
@supports(height:100dvh){.auth-shell,.auth-visual{min-height:100dvh}}
