/* Familie zuhause – Browser- und Gerätekompatibilität v351 */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
button,
input,
select,
textarea,
optgroup {
  font-family: var(--font-body, "Inter", "Segoe UI", Roboto, Arial, sans-serif);
}

button,
input,
select,
textarea {
  font-synthesis: none;
}

h1, h2, h3, h4, h5, h6,
.display-font,
.navbar-brand,
.page-title-serif {
  font-family: var(--font-display, "Fraunces", Georgia, "Times New Roman", serif);
}

.no-dynamic-viewport .page-wrapper,
.no-dynamic-viewport .auth-wrapper,
.no-dynamic-viewport .modal-backdrop,
.no-dynamic-viewport .quick-add-sheet-v298,
.no-dynamic-viewport .mobile-nav-sheet {
  min-height: 100vh;
  min-height: calc(var(--familie-vh, 1vh) * 100);
}

.no-backdrop-filter .mobile-bottom-nav,
.no-backdrop-filter .mobile-nav-sheet,
.no-backdrop-filter .quick-add-sheet-v298,
.no-backdrop-filter .modal-content,
.no-backdrop-filter .navbar {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

:root[data-theme="light"].no-backdrop-filter .mobile-bottom-nav,
:root[data-theme="light"].no-backdrop-filter .mobile-nav-sheet,
:root[data-theme="light"].no-backdrop-filter .modal-content {
  background-color: rgba(248, 252, 248, .98) !important;
}

:root[data-theme="dark"].no-backdrop-filter .mobile-bottom-nav,
:root[data-theme="dark"].no-backdrop-filter .mobile-nav-sheet,
:root[data-theme="dark"].no-backdrop-filter .modal-content {
  background-color: rgba(7, 20, 12, .98) !important;
}

.no-color-mix .btn,
.no-color-mix button,
.no-color-mix [role="button"] {
  border-color: var(--accent-border, rgba(74, 124, 89, .42));
}

.no-color-mix .btn-primary,
.no-color-mix .floating-add-btn,
.no-color-mix .desktop-plus-button-v298 {
  background: var(--accent-solid-start, #AEE0B8) !important;
  color: var(--accent-on-solid, #07110C) !important;
}

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

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}