/* =====================================================================
   Camada responsiva (mobile-first overrides). Carregada por último para
   ajustar layouts desktop-first (grids/paddings inline) ao celular.
   As telas usam grids via `style` inline; aqui colapsamos por substring.
   ===================================================================== */

@media (max-width:768px){
  /* Grids multi-coluna colapsam: 3+ colunas -> 2; 2 colunas/ratios -> 1 */
  [style*="repeat(4,"], [style*="repeat(4 ,"], [style*="repeat(3,"],
  [style*="repeat(auto-fit"], [style*="repeat(auto-fill"]{
    grid-template-columns:repeat(2,1fr) !important;
  }
  [style*="repeat(2,"], [style*="1fr 1fr"],
  [style*="1.2fr"], [style*="1.3fr"], [style*="1.4fr"], [style*="1.5fr"],
  [style*="1.6fr"], [style*="1.7fr"], [style*="1.8fr"], [style*="1.9fr"], [style*="2fr"],
  [style*="320px"], [style*="340px"], [style*="360px"], [style*="380px"]{
    grid-template-columns:1fr !important;
  }

  /* Respiro: containers com padding grande encolhem */
  .shell__content [style*="padding:24px"]{ padding:16px !important; }
  .shell__content [style*="padding:28px"]{ padding:18px !important; }
  .shell__content [style*="padding:32px"]{ padding:18px !important; }

  /* Nada deve exigir largura mínima que estoure 375px */
  .shell__content [style*="min-width:340px"],
  .shell__content [style*="min-width:360px"],
  .shell__content [style*="min-width:400px"],
  .shell__content [style*="max-width:340px"]{ min-width:0 !important; }

  /* Títulos grandes ficam proporcionais */
  .shell__content h1[style*="font-size:28px"],
  .shell__content h1[style*="font-size:26px"]{ font-size:22px !important; }

  /* ---- Inbox: master-detail (lista <-> thread) ---- */
  .inbox{ height:calc(100svh - 58px - 62px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important; }
  .shell__content:has(.inbox){ padding-bottom:0 !important; }
  .inbox__col1{ width:100% !important; border-right:none !important; }
  .inbox__col3{ display:none !important; }
  .inbox--list .inbox__col2{ display:none !important; }
  .inbox--thread .inbox__col1{ display:none !important; }
  .inbox__back{ display:inline-flex !important; }

  /* ---- Kanban (Leads): empilha as etapas em 1 coluna ---- */
  [data-controller="kanban"]{ height:auto !important; padding:16px !important; }
  [data-controller="kanban"] > div[style*="grid-template-columns"]{ grid-template-columns:1fr !important; }
  [data-controller="kanban"] [data-stage-id]{ min-width:0 !important; }

  /* ---- CRM: master-detail (lista <-> perfil) ---- */
  .crm{ height:calc(100svh - 58px - 62px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important; }
  .shell__content:has(.crm){ padding-bottom:0 !important; }
  .crm__col1{ width:100% !important; border-right:none !important; }
  .crm--list .crm__col2{ display:none !important; }
  .crm--detail .crm__col1{ display:none !important; }
  .crm__back{ display:inline-flex !important; }
}

/* Botão "voltar" do CRM só existe no mobile */
.crm__back{ display:none; }

@media (max-width:768px){
  /* ---- Agenda: tela cheia estilo Google Calendar ----
     Ocupa toda a área entre a topbar e a bottom nav; a grade/lista rola por
     dentro (mesmo padrão do Inbox/CRM). A barra lateral (IA, mini-calendário,
     próximos) fica oculta — navegação está no cabeçalho e "concluir" no popover. */
  .agenda{
    flex-direction:column !important;
    height:calc(100svh - 58px - 62px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  }
  .shell__content:has(.agenda){ padding-bottom:0 !important; }
  .agenda__sidebar{ display:none !important; }
  .agenda__week{ flex:1; min-height:0 !important; }

  /* Mês encaixa as 6 semanas na tela toda (sem exigir 110px por linha). */
  .agenda__week [style*="grid-auto-rows:minmax(110px,1fr)"]{ grid-auto-rows:minmax(0,1fr) !important; }

  /* Cabeçalho da agenda: quebra em linhas p/ o seletor Dia/Semana/Mês
     e o "+ Novo" não saírem da tela no celular. */
  .agenda__toolbar{ flex-wrap:wrap !important; gap:10px !important; padding:14px 16px !important; }
  .agenda__toolbar-spacer{ display:none !important; }
}

/* Botão "voltar" da inbox só existe no mobile */
.inbox__back{ display:none; }