/* ===========================================================================
   OdontoCare — camada responsiva
   O app nasceu com layout fixo de desktop (barra lateral de 236px + área 100vh).
   Esta folha é aplicada por cima: nada do HTML original precisou ser reescrito.

   Como os seletores funcionam: o runtime entrega o `style` inline já normalizado
   pelo navegador — sempre "propriedade: valor;" com espaço depois do dois-pontos,
   `0` vira `0px`, `.85fr` vira `0.85fr` e cada declaração termina em ponto e vírgula.
   Por isso todo seletor abaixo casa o valor INTEIRO terminado em `;` — sem o `;`
   final, "1.3fr 1fr" casaria também dentro de "1.3fr 1fr 1fr 1fr" (uma tabela) e
   a tabela viraria uma coluna só.
   =========================================================================== */

/* botão de menu e fundo escurecido: só aparecem no modo compacto */
#ofta-menu-btn {
  display: none;
  position: fixed;
  top: 13px;
  left: 12px;
  z-index: 95;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text);
  cursor: pointer;
  padding: 0;
}
#ofta-backdrop { display: none; }

/* ------------------------------------------------ tablet e telas médias ---- */
@media (max-width: 1180px) {
  .ofta-main > div:last-child { padding: 18px 18px 56px !important; }

  [style*="grid-template-columns: minmax(0px, 1fr) 380px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 300px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 280px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 220px;"] {
    grid-template-columns: minmax(0px, 1fr) !important;
  }
  [style*="grid-template-columns: repeat(5, minmax(0px, 1fr));"] { grid-template-columns: repeat(3, minmax(0px, 1fr)) !important; }
  [style*="grid-template-columns: repeat(4, minmax(0px, 1fr));"] { grid-template-columns: repeat(2, minmax(0px, 1fr)) !important; }
  [style*="grid-template-columns: repeat(4, 1fr);"] { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ---------------------------------------------------- celular e tablet ----- */
@media (max-width: 900px) {
  .ofta-raiz { height: 100dvh !important; }

  /* --- barra lateral vira gaveta --- */
  .ofta-sidebar {
    position: fixed !important;
    top: 0;
    left: 0;
    height: 100dvh !important;
    width: 268px !important;
    z-index: 90;
    transform: translateX(-105%);
    transition: transform .22s ease;
    box-shadow: 0 0 44px rgba(0, 0, 0, .28);
  }
  html.ofta-menu-aberto .ofta-sidebar { transform: none; }

  #ofta-menu-btn { display: flex; }
  #ofta-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 85;
    background: rgba(0, 0, 0, .45);
  }
  html.ofta-menu-aberto #ofta-backdrop { display: block; }

  /* topbar abre espaço para o botão de menu */
  .ofta-main > div:first-child { padding: 0 14px 0 60px !important; height: 64px !important; }
  .ofta-main > div:last-child { padding: 16px 14px 64px !important; }

  /* campo de busca ⌘K não cabe no celular */
  .ofta-main > div:first-child [style*="width: 210px;"] { display: none !important; }

  /* --- grupo A: grades de cartões e indicadores --- */
  [style*="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));"],
  [style*="grid-template-columns: repeat(5, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(4, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(2, minmax(0px, 1fr));"] {
    grid-template-columns: repeat(2, minmax(0px, 1fr)) !important;
  }
  [style*="grid-template-columns: repeat(5, 1fr);"],
  [style*="grid-template-columns: repeat(4, 1fr);"],
  [style*="grid-template-columns: repeat(3, 1fr);"] { grid-template-columns: repeat(2, 1fr) !important; }

  /* --- grupo B: layouts de duas colunas viram uma --- */
  [style*="grid-template-columns: 1fr 1fr;"],
  [style*="grid-template-columns: 1.1fr 1fr;"],
  [style*="grid-template-columns: 1.15fr 1fr;"],
  [style*="grid-template-columns: 1.25fr 1fr;"],
  [style*="grid-template-columns: 1.3fr 1fr;"],
  [style*="grid-template-columns: 1.35fr 1fr;"],
  [style*="grid-template-columns: 1.4fr 1fr;"],
  [style*="grid-template-columns: 1.5fr 1fr;"],
  [style*="grid-template-columns: 1.6fr 1fr;"],
  [style*="grid-template-columns: 1fr 1.15fr;"],
  [style*="grid-template-columns: 1fr 1.12fr;"],
  [style*="grid-template-columns: minmax(0px, 1.4fr) minmax(0px, 1fr);"],
  [style*="grid-template-columns: 320px minmax(0px, 1fr);"],
  [style*="grid-template-columns: minmax(0px, 1fr) 380px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 300px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 280px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 220px;"] {
    grid-template-columns: minmax(0px, 1fr) !important;
  }

  /* --- grupo C: tabelas mantêm as colunas e rolam na horizontal --- */
  [style*="grid-template-columns: 1.7fr 0.85fr 1.15fr 0.8fr 0.8fr 0.95fr 0.8fr 0.8fr 0.95fr;"] { min-width: 940px; }
  [style*="grid-template-columns: 1.1fr 2.4fr 1.2fr 1.2fr 1.2fr 1fr;"],
  [style*="grid-template-columns: 1.5fr 0.7fr 0.8fr 0.8fr 0.9fr 1.3fr;"] { min-width: 800px; }
  [style*="grid-template-columns: 170px repeat(7, 1fr);"],
  [style*="grid-template-columns: 200px repeat(6, 1fr);"] { min-width: 720px; }
  [style*="grid-template-columns: 2.3fr 1fr 1fr 1fr;"],
  [style*="grid-template-columns: 1.6fr 1fr 1fr 1fr;"],
  [style*="grid-template-columns: 1.4fr 1.3fr 0.8fr 1fr;"],
  [style*="grid-template-columns: 1.5fr 1fr 1.5fr 80px;"] { min-width: 660px; }
  /* mesma tabela com a coluna "Excluir" (Administração) */
  [style*="grid-template-columns: 1.5fr 1fr 1.5fr 80px 92px;"] { min-width: 760px; }
  [style*="grid-template-columns: 1.3fr 1fr 1fr 1fr;"] { min-width: 600px; }
  [style*="grid-template-columns: 60px 1fr 1fr 1fr;"],
  [style*="grid-template-columns: 160px 1fr 150px;"],
  [style*="grid-template-columns: minmax(0px, 1fr) 120px 96px;"],
  [style*="grid-template-columns: repeat(7, 1fr);"] { min-width: 540px; }

  /* o cartão que embrulha a tabela tem overflow:hidden e cortaria as colunas —
     aqui ele passa a ser a área de rolagem horizontal */
  .ofta-main div:has(> [style*="grid-template-columns: 1.7fr 0.85fr 1.15fr 0.8fr 0.8fr 0.95fr 0.8fr 0.8fr 0.95fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.1fr 2.4fr 1.2fr 1.2fr 1.2fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.5fr 0.7fr 0.8fr 0.8fr 0.9fr 1.3fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 170px repeat(7, 1fr);"]),
  .ofta-main div:has(> [style*="grid-template-columns: 200px repeat(6, 1fr);"]),
  .ofta-main div:has(> [style*="grid-template-columns: 2.3fr 1fr 1fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.6fr 1fr 1fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.4fr 1.3fr 0.8fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.5fr 1fr 1.5fr 80px;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.5fr 1fr 1.5fr 80px 92px;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 1.3fr 1fr 1fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 60px 1fr 1fr 1fr;"]),
  .ofta-main div:has(> [style*="grid-template-columns: 160px 1fr 150px;"]),
  .ofta-main div:has(> [style*="grid-template-columns: minmax(0px, 1fr) 120px 96px;"]),
  .ofta-main div:has(> [style*="grid-template-columns: repeat(7, 1fr);"]) {
    overflow: auto !important;
  }

  /* painéis, gavetas e caixas de diálogo de largura fixa (380/400/440/460/560px)
     passam a caber na tela */
  [style*="width: 560px;"],
  [style*="width: 460px;"],
  [style*="width: 440px;"],
  [style*="width: 400px;"],
  [style*="width: 380px;"] {
    width: 100% !important;
    max-width: calc(100vw - 22px) !important;
  }

  /* campos de formulário têm largura intrínseca e estouram a coluna */
  .ofta-main input,
  .ofta-main select,
  .ofta-main textarea { max-width: 100% !important; box-sizing: border-box; }

  /* a caixa do ⌘K desce menos e a gaveta lateral do paciente ocupa a tela toda */
  [style*="padding-top: 110px;"] { padding-top: 70px !important; }
  [style*="justify-content: flex-end;"] > [style*="height: 100%;"] { padding: 16px !important; }
}

/* ------------------------------------------------------ celular estreito --- */
@media (max-width: 600px) {
  .ofta-main > div:first-child { height: 60px !important; }
  .ofta-main > div:last-child { padding: 14px 12px 72px !important; }

  [style*="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));"],
  [style*="grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));"],
  [style*="grid-template-columns: repeat(2, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(4, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(5, minmax(0px, 1fr));"],
  [style*="grid-template-columns: repeat(3, 1fr);"],
  [style*="grid-template-columns: repeat(4, 1fr);"],
  [style*="grid-template-columns: repeat(5, 1fr);"] {
    grid-template-columns: minmax(0px, 1fr) !important;
  }
}