/**
 * Mitra — compatibilidade Chrome / Firefox / Safari / Edge / Android WebView
 * Evita dependência de 100dvh, color-mix, :has e min() em layouts críticos.
 */

/* Sidebar: altura com vh (todos) + dvh onde existir */
.app-sidebar {
  height: calc(100vh - 5rem);
  max-width: 280px;
  width: 100%;
}
@supports (height: 100dvh) {
  .app-sidebar {
    height: calc(100dvh - 5rem);
  }
}
@media (min-width: 768px) {
  .app-sidebar {
    height: 100vh;
    max-width: none;
    width: 280px;
  }
}

/* Modal pagamento: selecção sem :has() */
.pay-mode-option {
  border-color: #e2e8f0;
  background-color: #fff;
}
.pay-mode-option.is-selected {
  border-color: #10b981;
  background-color: rgba(236, 253, 245, 0.6);
}

.otp-choice.is-selected {
  border-color: #3b82f6;
  background-color: rgba(239, 246, 255, 0.4);
}

/* Scrollbars Firefox + WebKit */
.app-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #c6d0e1 transparent;
}

/* Backdrop blur: fallback sólido se não suportado */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .backdrop-blur-sm,
  .backdrop-blur-md {
    background-color: rgba(15, 23, 42, 0.55) !important;
  }
}

/* Touch scroll iOS */
.overflow-y-auto,
.overflow-auto {
  -webkit-overflow-scrolling: touch;
}

/* Reduz FOUC enquanto o Tailwind CDN processa classes */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  min-height: 100vh;
  min-height: 100dvh;
}

/* Ícones: se a fonte não carregar, esconde o texto da ligadura em vez de
   mostrar a palavra (que rebentaria o layout em ecrãs pequenos). */
.icons-unavailable .material-symbols-outlined:not(.mitra-icon-probe) {
  visibility: hidden;
  max-width: 1em;
  overflow: hidden;
}
