/* Owner App 4-Tab Mobile Bottom Bar + Desktop Two-Tier Left Rail
   Builds on .spl-appnav in spl-ui.css (loaded before spl-ui.css, so .spl-appnav.spl-appnav--two-tier outranks base rules). */
.spl-nav-two-tier { --spl-nav-h: 88px; }
.spl-lbl-desk { display: none; }
.spl-lbl-mob { display: inline; }

@media (max-width: 1023.98px) {
  body.spl-has-bottom-nav.spl-nav-two-tier {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .spl-appnav.spl-appnav--two-tier {
    flex-wrap: nowrap;
    justify-content: space-around;
    gap: 4px;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px));
  }
  .spl-appnav--two-tier > .spl-appnav__item {
    flex: 1 1 0;
    min-width: 0;
    max-width: 132px;
    min-height: 52px;
  }
  .spl-appnav--two-tier .spl-appnav__divider { display: none; }
  .spl-appnav__more-sheet { display: none; }
  .spl-appnav.is-more-open .spl-appnav__more-sheet {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(70px + env(safe-area-inset-bottom, 0px));
    padding: 12px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.12);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18);
    z-index: 70;
  }
  .spl-appnav.is-more-open .spl-appnav__more-sheet .spl-appnav__item {
    flex: none;
    max-width: none;
    min-height: 48px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 10px;
    padding: 0 12px;
    border-radius: 12px;
    background: var(--spl-ground, #f8fafc);
    color: var(--spl-ink-1, #0f172a);
    font-size: 13.5px;
    font-weight: 600;
  }
  .spl-appnav.is-more-open .spl-appnav__more-sheet .spl-appnav__item[aria-current="page"] {
    color: var(--spl-accent);
    background: var(--spl-accent-wash);
  }
  .spl-appnav.is-more-open .spl-appnav__more-sheet .spl-icon {
    width: 18px;
    height: 18px;
    flex: none;
  }
  .spl-appnav__more-btn[aria-expanded="true"],
  .spl-appnav__more-btn[data-has-active="1"] {
    color: var(--spl-accent);
    background: var(--spl-accent-wash);
  }
}

.spl-appnav__item:focus-visible { outline: 2px solid var(--spl-accent-strong, var(--spl-accent)); outline-offset: -2px; }

@media (min-width: 1024px) {
  .spl-nav-two-tier { --spl-nav-h: 64px; }
  .spl-lbl-mob { display: none; }
  .spl-lbl-desk { display: inline; }
  .spl-appnav__more-btn { display: none !important; }
  .spl-appnav__more-sheet { display: contents; }
  .spl-appnav.spl-appnav--two-tier { flex-wrap: nowrap; justify-content: flex-start; row-gap: 4px; }
  .spl-appnav--two-tier .spl-appnav__brand { order: 0; }
  .spl-appnav--two-tier [data-nav-primary="today"] { order: 1; }
  .spl-appnav--two-tier [data-nav-primary="calendar"] { order: 2; }
  .spl-appnav--two-tier [data-nav-more="business"] { order: 3; }
  .spl-appnav--two-tier [data-nav-more="tools"] { order: 4; }
  .spl-appnav--two-tier .spl-appnav__divider { display: block; order: 5; flex: none; height: 1px; margin: var(--spl-s-3) var(--spl-s-3); background: var(--spl-border); }
  .spl-appnav--two-tier .spl-appnav__item { flex: none; min-height: 48px; }
  .spl-appnav--two-tier .spl-appnav__item--sub,
  .spl-appnav--two-tier .spl-appnav__item--services { order: 6; min-height: 44px; gap: 12px; padding: 0 var(--spl-s-3); font-size: var(--spl-t-helper); font-weight: 500; color: var(--spl-ink-3); }
  .spl-appnav--two-tier .spl-appnav__item--services { order: 9; }
  .spl-appnav--two-tier .spl-appnav__item--sub .spl-icon,
  .spl-appnav--two-tier .spl-appnav__item--services .spl-icon { width: 18px; height: 18px; }
  .spl-appnav--two-tier .spl-appnav__item--sub[aria-current="page"],
  .spl-appnav--two-tier .spl-appnav__item--services[aria-current="page"] { color: var(--spl-accent); background: var(--spl-accent-wash); }
}

/* Solo Mode (2026-10-01): hide navigation and reset body padding so conversational assistant has full focus */
body.is-solo-mode #nav { display: none !important; }
body.is-solo-mode.spl-has-bottom-nav { padding-left: 0 !important; padding-bottom: env(safe-area-inset-bottom, 0px) !important; }
