/* Safe areas dos PWAs do CCM Scanner no iOS/iPadOS.
   Mantém o viewport físico estável e sem conteúdo artificial fora da tela. */

html.ccm-scanner-pwa-root,
body.ccm-scanner-pwa-root {
  background: var(--sidebar, #05193a) !important;
  background-color: var(--sidebar, #05193a) !important;
}

html.ccm-scanner-pwa-root {
  min-height: 100%;
}

body.ccm-scanner-pwa-root {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
}

/* No PWA instalado o documento não rola. As listas/revisões que precisam de
   rolagem usam os próprios containers internos. */
html.ccm-scanner-pwa-standalone,
body.ccm-scanner-pwa-standalone {
  width: 100%;
  height: 100%;
  min-height: 0 !important;
  max-height: 100%;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  background: var(--sidebar, #05193a) !important;
  background-color: var(--sidebar, #05193a) !important;
}

body.ccm-scanner-pwa-standalone {
  position: fixed;
  inset: 0;
}

/* Os shells ficam exatamente dentro do viewport. */
[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"],
.ccm-scanner-theme.fixed.inset-0 {
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

/* Cabeçalho do Scanner QR: respeita Dynamic Island/status bar. */
[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"]
  > [class~="flex"][class~="items-center"][class~="justify-between"][class~="px-4"][class~="pt-3"][class~="pb-2"] {
  padding-top: calc(env(safe-area-inset-top, 0px) + 0.75rem) !important;
}

/* Câmera do CCM Scanner: o vídeo deve preencher integralmente a janela.
   Antes o html5-qrcode preservava a proporção usando max-height/max-width,
   deixando uma faixa preta na base em algumas proporções de iPhone/iPad. */
[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] video {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  display: block !important;
}

[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [id$="__scan_region"] {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}

[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [id$="__scan_region"] > div {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
}

/* Barra inferior do Scanner QR.
   Não há pseudo-elemento ou área extra abaixo. A própria barra pinta visualmente
   a região inferior por box-shadow (não altera layout nem cria rolagem), e os
   botões descem um pouco mais sem invadir o Home Indicator. */
[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [class~="bg-black/40"] {
  position: relative !important;
  top: auto !important;
  transform: none !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
  padding-top: 0.25rem !important;
  padding-bottom: 0.125rem !important;
  background: var(--sidebar-accent, #142c55) !important;
  box-shadow: 0 5rem 0 5rem var(--sidebar-accent, #142c55) !important;
}

[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [class~="bg-black/40"] > button {
  position: relative;
  z-index: 1;
  min-height: 3.25rem !important;
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
  overflow: visible !important;
  transform: translateY(0.5rem) !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

[class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [class~="bg-black/40"] > button > span {
  display: block;
  line-height: 1rem;
  overflow: visible;
}

@media (min-width: 700px) {
  [class~="fixed"][class~="inset-0"][class~="bg-[#0b3d2e]"] [class~="bg-black/40"] > button {
    min-height: 3.5rem !important;
    transform: translateY(0.4rem) !important;
  }
}

/* Leitor de cartões-resposta: mantém as ações inferiores dentro do viewport,
   sem extensão artificial abaixo da tela. */
.ccm-scanner-theme .sticky.bottom-0 {
  padding-bottom: max(0.35rem, calc(env(safe-area-inset-bottom, 0px) - 1.25rem)) !important;
}

@media (display-mode: standalone) {
  html.ccm-scanner-pwa-root,
  body.ccm-scanner-pwa-root {
    background: var(--sidebar, #05193a) !important;
    background-color: var(--sidebar, #05193a) !important;
  }
}