/* =========================================================
   MOOV INSIGHTS — RESPONSIVE PROFESSIONAL GLOBAL
   Compatibilidade visual cross-browser e cross-device.
   Não altera dados, API ou lógica.
========================================================= */

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  margin:0;
  overflow-x:hidden;
  background:#f6f7fb;
}

/* Evita quebra feia em textos */
h1,h2,h3,h4,p,span,strong,small,label,button,input,select,td,th{
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

img,svg,canvas,video{
  max-width:100%;
}

/* Layout principal */
.app,
.app-shell,
.layout,
.dashboard-layout,
.main,
.main-content,
.content,
main{
  min-width:0 !important;
  max-width:100% !important;
}

/* Seções */
.app-section{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}

/* Cards */
.card,
.moov-card,
.vendedor-panel-card,
.moov-producao-card,
.moov-origens-card,
.moov-radar-card,
.moov-agenda-card,
.moov-prod-projection-card,
.moov-regua-pro-card{
  max-width:100% !important;
  overflow:hidden;
}

/* Botões e inputs */
button,
input,
select,
textarea{
  font-family:inherit;
  max-width:100%;
}

button{
  cursor:pointer;
  touch-action:manipulation;
}

input,
select,
textarea{
  min-height:42px;
}

/* Tabelas: nunca quebrar layout */
table{
  max-width:100%;
}

.moov-producao-table-wrap,
.moov-origens-table-wrap,
.table-wrap,
.table-responsive,
[class*="table-wrap"]{
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch;
}

/* Scrollbar elegante */
.moov-producao-table-wrap::-webkit-scrollbar,
.moov-origens-table-wrap::-webkit-scrollbar,
[class*="table-wrap"]::-webkit-scrollbar,
.moov-regua-pro-chart::-webkit-scrollbar,
.moov-regua-pro-axis::-webkit-scrollbar{
  height:8px;
}

.moov-producao-table-wrap::-webkit-scrollbar-thumb,
.moov-origens-table-wrap::-webkit-scrollbar-thumb,
[class*="table-wrap"]::-webkit-scrollbar-thumb,
.moov-regua-pro-chart::-webkit-scrollbar-thumb,
.moov-regua-pro-axis::-webkit-scrollbar-thumb{
  background:#cbd5e1;
  border-radius:999px;
}

/* Grids principais */
.moov-producao-kpis,
.moov-origens-kpis,
.moov-radar-kpis,
.vendedor-kpi-grid,
.moov-kpi-grid,
.seller-kpi-grid,
.moov-pro-kpi-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important;
  gap:16px !important;
}

/* Filtros */
.moov-producao-filters,
.moov-origens-filters,
.moov-radar-filters,
.moov-conversao-pro-filters{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:end !important;
  gap:14px !important;
}

.moov-producao-filters label,
.moov-origens-filters label,
.moov-radar-filters label,
.moov-conversao-pro-filters label{
  flex:1 1 180px !important;
  min-width:160px !important;
}

.moov-producao-filters input,
.moov-producao-filters select,
.moov-origens-filters input,
.moov-origens-filters select,
.moov-radar-filters input,
.moov-radar-filters select,
.moov-conversao-pro-filters input,
.moov-conversao-pro-filters select{
  width:100% !important;
}

/* Evita cards espremidos */
.moov-regua-pro-body,
.vendedor-main-grid,
.moov-main-grid,
.seller-main-grid,
.moov-pro-grid{
  min-width:0 !important;
}

/* Melhor compatibilidade de gráficos */
canvas{
  display:block;
  width:100% !important;
  max-width:100% !important;
}

/* Notebook */
@media (max-width:1366px){
  .app-section[id^="sec-vendedor"]{
    padding:22px !important;
  }

  h1{
    font-size:clamp(30px,4vw,52px) !important;
  }

  .moov-regua-pro-body{
    grid-template-columns:1fr !important;
  }
}

/* Tablet */
@media (max-width:1024px){
  .sidebar{
    position:fixed !important;
    z-index:999 !important;
    height:100vh !important;
    max-height:100vh !important;
    overflow-y:auto !important;
  }

  .main,
  .main-content,
  .content,
  main{
    width:100% !important;
    margin-left:0 !important;
  }

  .app-section[id^="sec-vendedor"],
  .app-section{
    padding:18px !important;
  }

  .moov-regua-pro-head{
    flex-direction:column !important;
  }

  .moov-regua-pro-legend{
    width:100% !important;
  }
}

/* Celular */
@media (max-width:760px){
  body{
    overflow-x:hidden !important;
  }

  .app-section[id^="sec-vendedor"],
  .app-section{
    padding:14px !important;
  }

  h1{
    font-size:32px !important;
    line-height:1.05 !important;
  }

  h2{
    font-size:24px !important;
  }

  .moov-producao-kpis,
  .moov-origens-kpis,
  .moov-radar-kpis,
  .vendedor-kpi-grid,
  .moov-kpi-grid,
  .seller-kpi-grid,
  .moov-pro-kpi-grid{
    grid-template-columns:1fr !important;
  }

  .moov-producao-filters,
  .moov-origens-filters,
  .moov-radar-filters,
  .moov-conversao-pro-filters{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .moov-producao-filters label,
  .moov-origens-filters label,
  .moov-radar-filters label,
  .moov-conversao-pro-filters label{
    min-width:0 !important;
  }

  .moov-regua-pro-card{
    padding:18px !important;
  }

  .moov-regua-pro-summary{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .moov-regua-pro-chart{
    padding:18px 10px 10px !important;
  }

  .moov-regua-pro-axis{
    gap:10px !important;
  }

  .moov-regua-pro-day{
    min-width:30px !important;
  }

  .moov-producao-table,
  .moov-origens-table{
    min-width:980px !important;
  }

  button{
    width:100%;
  }

  .moov-radar-actions,
  .moov-origens-actions,
  .moov-producao-actions{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
  }

  .moov-radar-actions a,
  .moov-radar-actions button,
  .moov-origens-actions button,
  .moov-producao-actions a{
    width:auto !important;
    flex:1 1 130px !important;
  }
}

/* Celular pequeno */
@media (max-width:420px){
  .app-section[id^="sec-vendedor"],
  .app-section{
    padding:10px !important;
  }

  h1{
    font-size:28px !important;
  }

  .moov-regua-pro-title{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .moov-regua-pro-legend{
    gap:10px !important;
    padding:10px !important;
  }
}

/* Firefox */
@supports (-moz-appearance:none){
  .moov-producao-table-wrap,
  .moov-origens-table-wrap,
  [class*="table-wrap"]{
    scrollbar-width:thin;
    scrollbar-color:#cbd5e1 transparent;
  }
}

/* Safari */
@supports (-webkit-touch-callout:none){
  .moov-regua-pro-card,
  .moov-producao-card,
  .moov-origens-card,
  .moov-radar-card{
    transform:translateZ(0);
  }
}
