/* Sistema Exclusiva 0.10.31 — shell responsivo canônico
   Base funcional: 0.10.22. Navegação alinhada ao comportamento da Lugli:
   sidebar fixa no desktop, drawer off-canvas no mobile e topbar persistente. */

:root{
  --sidebar-open:198px;
  --content-gap:12px;
  --mobile-header:64px;
}

html,body{max-width:100%;overflow-x:hidden}
body{min-width:0}
.app-layout,.content-area,.view-panel,.shell,.panel-card,.table-wrap,.fleet-relation-wrap,.vistoria-module-content{min-width:0;max-width:100%}
.content-area{container-type:inline-size;container-name:app-content}
img,svg,video,canvas{max-width:100%}
input,select,textarea,button{min-width:0;max-width:100%}
button,.btn,.icon-btn{white-space:nowrap}
.eyebrow,.subline,.brand-area h1{overflow-wrap:normal;word-break:normal}

/* Desktop / notebook — sidebar sempre presente, como na Lugli. */
@media (min-width:901px){
  .app-layout{padding-left:var(--sidebar-open)}
  .sidebar{width:var(--sidebar-open);transform:none;visibility:visible}
  .sidebar-overlay{display:none}
  .mobile-menu-btn{display:none}
  .topbar{position:sticky;top:0;z-index:30;min-height:64px;padding:7px 18px;gap:10px;background:var(--panel)}
  .shell{padding:12px 18px 28px}
  .brand-block{height:78px;padding:10px 14px}
  .sidebar-logo{width:54px;height:54px}
  .sidebar-section-title{padding:16px 14px 6px}
  .nav-item{padding:9px 9px}
}

/* Mobile / tablet — hamburger no topo persistente e sidebar como drawer. */
@media (max-width:900px){
  html,body{min-height:100%;overflow-x:hidden;overscroll-behavior-x:none}
  body.menu-open{overflow:hidden}
  .app-layout{min-height:100dvh;padding-left:0;overflow:visible}
  .content-area{
    min-height:100dvh;
    padding-top:calc(var(--mobile-header) + env(safe-area-inset-top));
    overflow:visible;
    touch-action:pan-y
  }
  .sidebar{
    position:fixed;left:0;top:0;bottom:auto;
    width:min(292px,88vw);height:100dvh;
    transform:translateX(-100%);
    transition:transform .22s ease,box-shadow .22s ease;
    z-index:50;overflow-y:auto;overflow-x:hidden;
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)
  }
  body.menu-open .sidebar{transform:translateX(0);box-shadow:0 18px 50px rgba(0,0,0,.28)}
  .brand-block{min-height:64px;height:64px;padding:8px 12px}
  .sidebar-logo{width:46px;height:46px}
  .sidebar-overlay{display:block;z-index:45}
  .topbar{
    position:fixed;
    top:0;left:0;right:0;
    width:100%;
    z-index:40;
    min-height:calc(var(--mobile-header) + env(safe-area-inset-top));
    padding:calc(7px + env(safe-area-inset-top)) 12px 7px;
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;gap:9px;background:var(--panel);isolation:isolate;
    box-shadow:0 1px 0 var(--border)
  }
  .mobile-menu-btn{display:grid;width:38px;height:38px;min-width:38px;place-items:center;color:var(--text)}
  .brand-area{min-width:0;overflow:hidden}
  .brand-area h1,.brand-area .eyebrow,.subline{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top-actions{min-width:0;flex-wrap:nowrap;gap:5px}
  .shell{padding:10px 12px calc(24px + env(safe-area-inset-bottom))}
  .view-panel{min-height:calc(100dvh - var(--mobile-header) - env(safe-area-inset-top))}
  .history-wrap,.line-manager-wrap,.fleet-relation-wrap,.permissions-wrap{max-height:none;min-height:0;overflow-y:visible}
  .table-wrap,.history-wrap,.line-manager-wrap,.fleet-relation-wrap,.permissions-wrap{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .vistoria-tabs{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  body.reports-mode .reports-module-view{height:calc(100dvh - var(--mobile-header) - env(safe-area-inset-top));min-height:0;overflow:hidden}
  body.reports-mode .reports-module-frame{display:block;width:100%;height:100%;min-height:0;border:0;overflow:hidden;overscroll-behavior:contain}
}

@media (max-width:700px){
  .topbar{padding-inline:9px}
  .brand-area h1{font-size:.94rem;line-height:1.15}
  .brand-area .eyebrow{font-size:.54rem}
  .subline{font-size:.6rem}
  .mode-badge,.version-badge,.user-pill,.garage-field{display:none}
  .garage-badge{display:inline-flex;max-width:92px;overflow:hidden;text-overflow:ellipsis}
  .top-actions .icon-btn{width:36px;height:36px;min-width:36px;padding:0}
  .sync-badge{width:28px;height:28px;padding:0;justify-content:center;font-size:0}
  .sync-badge::before{width:8px;height:8px}
  .shell{padding:9px 9px 20px}
  .view-panel{min-height:calc(100dvh - var(--mobile-header))}
  .management-head{align-items:flex-start;flex-direction:column;gap:8px}
  .management-head-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .management-head-actions .btn{width:100%}
  .list-head{align-items:flex-start;flex-direction:column;gap:5px}
  .table-title{align-items:flex-start;gap:8px}
  .toolbar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .toolbar .field{min-width:0}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .modal{max-width:calc(100vw - 18px);max-height:calc(100dvh - 18px)}
}

@container app-content (max-width:520px){
  .service-card{grid-template-columns:1fr}
  .service-card .action-col{grid-column:auto}
  .service-card .action-buttons{grid-template-columns:1fr}
}

@media (max-width:480px){
  .topbar{gap:6px}
  .top-actions{gap:3px}
  .top-actions #refreshBtn{display:none}
  .top-actions .icon-btn{width:34px;height:34px;min-width:34px}
  .garage-badge{display:none}
  .mobile-menu-btn{width:34px;height:34px;min-width:34px}
  .brand-area h1{font-size:.84rem}
  .brand-area .eyebrow{font-size:.5rem}
  .subline{font-size:.56rem}
  .shell{padding:8px 7px 18px}
  .management-head-actions{grid-template-columns:1fr}
  .btn{white-space:normal;text-align:center}
}

/* Blocos gerais */
.kpis,.management-kpis,.module-grid,.system-admin-actions,.garage-checks{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.history-filters,.line-manager-filters,.fleet-relation-filters,.vistoria-dashboard-filters{grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr));align-items:end}
.history-filter-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:7px;align-items:end}
.history-filter-actions .btn,.fleet-clear-filters{width:100%}
.table-wrap,.history-wrap,.line-manager-wrap,.permissions-wrap,.fleet-relation-wrap{overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.history-table,.admin-table,.line-manager-table,.users-table,.module-permissions-table{max-width:none}

@container app-content (max-width:980px){
  .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .management-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .system-hero{grid-template-columns:1fr}
  .system-admin-card{grid-template-columns:1fr}
  .service-card{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
  .service-card .action-col{grid-column:1/-1}
  .vistoria-check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@container app-content (max-width:650px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .kpi{min-height:74px;padding:10px}
  .kpi span{font-size:1.45rem}
  .kpi em{display:none}
  .management-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .module-grid{grid-template-columns:1fr}
  .module-card-actions{display:grid;grid-template-columns:1fr;gap:7px}
  .service-card{grid-template-columns:repeat(2,minmax(0,1fr));padding:9px;gap:7px 10px}
  .service-card .action-col{grid-column:1/-1}
  .service-card .action-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .service-card .action-buttons .btn{width:100%;min-width:0}
  .traffic-bar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .operation-group-head{align-items:flex-start;flex-direction:column;gap:4px}
  .line-manager-filters,.fleet-relation-filters,.history-filters,.vistoria-dashboard-filters{grid-template-columns:1fr}
  .vistoria-dashboard-filters .field.grow{grid-column:auto}
  .vistoria-check-grid,.vistoria-kpis{grid-template-columns:1fr}
  .vistoria-tabs{width:100%}
  .vistoria-tab{flex:1;text-align:center}
  .vistoria-filter-head{align-items:stretch;flex-direction:column}
  .vistoria-filter-head .btn{width:100%}
  .vistoria-form-actions .btn{width:100%;min-width:0}
  .admin-toolbar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .admin-toolbar .btn{width:100%}
}

@container app-content (max-width:390px){
  .kpis{grid-template-columns:1fr 1fr}
  .kpi{min-width:0}
  .service-card{grid-template-columns:1fr}
  .service-card .action-col{grid-column:auto}
  .service-card .action-buttons{grid-template-columns:1fr}
}

/* Cards de frota: um registro por linha, conteúdo fluido + ações independentes */
.fleet-card-grid{display:grid;grid-template-columns:1fr;gap:8px;width:100%;min-width:0}
.fleet-vehicle-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--panel);box-shadow:0 3px 10px rgba(5,18,14,.035);min-width:0;max-width:100%}
.fleet-card-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:8px 14px;min-width:0}
.fleet-card-main,.fleet-card-data{display:grid;gap:2px;min-width:0;align-content:center}
.fleet-card-label,.card-field-label{color:var(--muted);font-size:.52rem;font-weight:900;letter-spacing:.055em;line-height:1.15;text-transform:uppercase}
.fleet-card-main span:last-child,.fleet-card-data span:last-child,.fleet-card-data strong{min-width:0;overflow-wrap:anywhere;word-break:break-word}
.fleet-card-prefix{font-size:.98rem;line-height:1.15}
.fleet-card-actions{display:grid;grid-template-columns:repeat(2,minmax(82px,1fr));gap:6px;width:210px;max-width:100%;min-width:0}
.fleet-card-actions .btn{width:100%;min-width:0}
.fleet-card-state{padding:18px 12px;border:1px dashed var(--border);border-radius:10px;color:var(--muted);text-align:center;background:var(--panel)}

@container app-content (max-width:760px){
  .fleet-vehicle-card{grid-template-columns:1fr;align-items:stretch}
  .fleet-card-actions{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container app-content (max-width:420px){
  .fleet-card-content{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 10px}
  .fleet-card-main{grid-column:1/-1}
}

/* Cards do relatório de vistorias */
.vistoria-cards-panel{overflow:hidden;min-width:0}
.vistoria-card-list{display:grid;grid-template-columns:1fr;gap:8px;padding:9px;min-width:0}
.vistoria-result-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--panel);box-shadow:0 3px 10px rgba(5,18,14,.035);min-width:0;max-width:100%}
.vistoria-card-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:8px 14px;min-width:0}
.vistoria-card-prefix,.vistoria-card-field{display:grid;gap:2px;min-width:0;align-content:center}
.vistoria-card-prefix strong{font-size:.92rem}
.vistoria-card-prefix small,.vistoria-card-field>span:last-child{min-width:0;font-size:.7rem;line-height:1.25;overflow-wrap:anywhere;word-break:break-word}
.vistoria-card-actions{width:172px;max-width:100%;min-width:0}
.vistoria-card-actions .vistoria-row-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}
.vistoria-card-actions .btn{width:100%;min-width:0}
.vistoria-card-detail{grid-column:1/-1;border-top:1px solid var(--border);padding-top:9px;min-width:0}
.vistoria-card-detail[hidden]{display:none}
.vistoria-card-state{padding:18px 12px;border:1px dashed var(--border);border-radius:10px;color:var(--muted);text-align:center;background:var(--panel)}
.vistoria-pending-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}

@container app-content (max-width:760px){
  .vistoria-result-card{grid-template-columns:1fr;align-items:stretch}
  .vistoria-card-actions{width:100%}
}
@container app-content (max-width:480px){
  .vistoria-card-content{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 10px}
  .vistoria-card-prefix{grid-column:1/-1}
}
@container app-content (max-width:340px){
  .vistoria-card-content{grid-template-columns:1fr}
  .vistoria-card-prefix{grid-column:auto}
}

/* Reports incorporado */
.reports-module-view{width:100%;max-width:100%;overflow:hidden}
.reports-module-frame{display:block;width:100%;max-width:100%;border:0}

/* Modais e mensagens */
.notification-dialog,.global-loading-overlay{max-width:100vw;max-height:100dvh}
.toast-container,.global-loading-card{max-width:calc(100vw - 20px)}
.vistoria-edit-modal{max-width:calc(100vw - 18px);max-height:calc(100dvh - 18px)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto;animation-duration:.001ms;animation-iteration-count:1;transition-duration:.001ms}
}

/* Estado utilitário: necessário para elementos controlados por JS/atributo hidden. */
.hidden,[hidden]{display:none!important}