/* Project-specific overrides on top of Bootstrap. */

.app-container {
  max-width: 56rem;
}

.app-container-narrow {
  max-width: 24rem;
}

/* Tab nav wraps to as many rows as needed instead of scrolling
   horizontally (GET-48) -- see spec-v1 §2/§5.7 for the removed reflow
   exception. `.nav-tabs` items don't carry vertical spacing of their own
   since they're normally a single row; add row-gap so a wrapped second row
   doesn't butt up against the first row's bottom border. */
#tab-nav .nav-tabs {
  row-gap: 0.375rem;
}

/* Toast safe area (GET-47, spec-v1 §3 "No occluding a live control").
   The toast container is position-fixed per spec-v1 §2, so it can never
   push list content out of the way on its own. While a toast is visible,
   app.js adds this class and sets --toast-safe-area to the toast stack's
   current rendered height, reserving scroll room below the list equal to
   that height so the fixed toast has empty space to sit over instead of a
   real control -- app.js then nudges the scroll position into that room
   only when a control would otherwise be covered. */
main.toast-safe-area-active {
  /* Bootstrap's .py-4 spacing utility sets padding-bottom with !important
     (all Bootstrap utilities do, by design, so they always win over
     component styles) -- match it so this override actually applies. */
  padding-bottom: calc(1.5rem + var(--toast-safe-area, 0px)) !important;
}

@media (prefers-reduced-motion: no-preference) {
  main {
    transition: padding-bottom 0.15s ease;
  }
}