/* ROMVI R29 | Four scoped presentation fixes | 2026-10-25
 * 1. Allow scrolling past the fixed bottom navigation.
 * 2. Show one Today overview, not three competing greetings.
 * 3. Use the available desktop width and pair content cards in expanded mode.
 * 4. Keep Solo / Work / Family / Child readable and tappable.
 * No state, access, event handlers, feature limits or persistence changed.
 */

/* 1 — Bottom fixed navigation must never be the end of the scrollable viewport.
 * Screen contents scroll inside .panel; padding the panel itself has no effect.
 * Reserve enough room for navigation and the floating add action at all widths.
 */
#dashboard, #familyHub, .tasks-list, #lifeList, .profile-hub {
  padding-bottom:calc(164px + env(safe-area-inset-bottom, 0px))!important;
  scroll-padding-bottom:calc(164px + env(safe-area-inset-bottom, 0px))!important;
  box-sizing:border-box!important;
}
.chat {
  padding-bottom:calc(206px + env(safe-area-inset-bottom, 0px))!important;
  scroll-padding-bottom:calc(206px + env(safe-area-inset-bottom, 0px))!important;
}
/* Keep fixed nav above the OS safe area and below sheets/modals as before. */
.bottom-nav:not(.hidden) {max-width:calc(100vw - 16px)!important}

/* 2 — R3 Today already has live priorities, Ask, Task and Review actions.
 * The old Living Brief and legacy decorative hero repeat its introduction.
 * Hide presentation only, retain DOM/data/handlers and all other cards.
 */
#dashboard:has(> #r3Today) > #romviLivingBrief,
#dashboard:has(> #r3Today) > .dash-hero,
#dashboard:has(> #r3Today) > .life-engine-hero {
  display:none!important;
}

/* 3 — Use wider screens instead of locking the whole product at 920–940px.
 * Scope strictly to the main app; onboarding, auth forms and dialogs are intact.
 */
@media (min-width: 1024px) {
  #dashboard, #familyHub, .tasks-list, #lifeList, .profile-hub {
    width:100%!important;
    max-width:1440px!important;
    margin-inline:auto!important;
    padding-inline:clamp(24px, 3vw, 52px)!important;
  }
  .header > * {max-width:1440px!important}
  #dashboard.home-expanded {
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:18px!important;
    row-gap:14px!important;
    align-content:start!important;
  }
  #dashboard.home-expanded > :is(.r3-today, .romvi-spaces-10, .home-more-toggle,
     .solo-command-10, .work-command-10, .feature-strip) {
    grid-column:1 / -1!important;
  }
  #dashboard.home-expanded > :not(.hidden) {min-width:0}
  #dashboard:not(.home-expanded) > .r3-today {width:100%!important}
}

/* 4 — Real, full-size four-way mode selector. The legacy thin outline
 * should never be the only tap target on desktop or phone.
 */
#dashboard > .romvi-spaces-10, #familyHub > .romvi-spaces-10 {
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  width:100%!important;
  min-height:62px!important;
  align-items:stretch!important;
  gap:8px!important;
  padding:7px!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  flex:0 0 auto!important;
  border-width:1px!important;
  border-radius:17px!important;
  margin-bottom:12px!important;
}
#dashboard > .romvi-spaces-10 .romvi-space-btn,
#familyHub > .romvi-spaces-10 .romvi-space-btn {
  display:flex!important;
  flex:initial!important;
  min-width:0!important;
  width:100%!important;
  min-height:48px!important;
  padding:10px 8px!important;
  gap:8px!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1.2!important;
  border-radius:12px!important;
  box-sizing:border-box!important;
  white-space:nowrap!important;
}
#dashboard > .romvi-spaces-10 .romvi-space-btn svg,
#familyHub > .romvi-spaces-10 .romvi-space-btn svg {
  width:19px!important;
  height:19px!important;
  flex:0 0 19px!important;
}
#dashboard > .romvi-spaces-10 .romvi-space-btn:focus-visible,
#familyHub > .romvi-spaces-10 .romvi-space-btn:focus-visible {
  outline:3px solid #22b7cc!important;
  outline-offset:2px!important;
}
/* The condensed Today layout used to hide every sibling except R3.
 * Keep the four-space selector visible without exposing legacy cards.
 */
#dashboard:not(.home-expanded) > .romvi-spaces-10.romvi-spaces-10 {
  display:grid!important;
}

@media (max-width: 760px) {
  #dashboard, #familyHub, .tasks-list, #lifeList, .profile-hub {
    padding-bottom:calc(150px + env(safe-area-inset-bottom, 0px))!important;
    scroll-padding-bottom:calc(150px + env(safe-area-inset-bottom, 0px))!important;
  }
  .chat {padding-bottom:calc(200px + env(safe-area-inset-bottom, 0px))!important}
  #dashboard > .romvi-spaces-10, #familyHub > .romvi-spaces-10 {
    min-height:58px!important;
    gap:4px!important;
    padding:5px!important;
    margin-bottom:10px!important;
  }
  #dashboard > .romvi-spaces-10 .romvi-space-btn,
  #familyHub > .romvi-spaces-10 .romvi-space-btn {
    min-height:46px!important;
    gap:5px!important;
    padding:9px 3px!important;
    font-size:11px!important;
  }
  #dashboard > .romvi-spaces-10 .romvi-space-btn svg,
  #familyHub > .romvi-spaces-10 .romvi-space-btn svg {
    width:16px!important;height:16px!important;flex-basis:16px!important;
  }
}
@media (max-width: 360px) {
  #dashboard > .romvi-spaces-10 .romvi-space-btn,
  #familyHub > .romvi-spaces-10 .romvi-space-btn {
    flex-direction:column!important;
    gap:2px!important;
    font-size:10px!important;
    padding:5px 1px!important;
  }
}
@media (prefers-reduced-motion: reduce) {
  #dashboard > .romvi-spaces-10 .romvi-space-btn,
  #familyHub > .romvi-spaces-10 .romvi-space-btn {transition:none!important}
}