/* SMAIS CAST phone shell/chrome isolation (v84)
 * Phone behavior is selected by app.js (.nc-phone-device), not viewport width.
 * This prevents narrow iPad Split View from inheriting iPhone chrome rules.
 */
html.nc-phone-device,
body.nc-phone-device {
  --nc-mobile-bottom: var(--nc-safe-bottom, 0px);
}

/* There is no browser API for a physical Home button. The correct layout
 * signal is the bottom safe-area itself: Home-button iPhones/iPods report 0,
 * while Home-indicator devices expose a positive inset when one is required.
 * app.js measures the actual env() result and applies this class. */
html.nc-ios-no-home-indicator,
body.nc-ios-no-home-indicator {
  --nc-safe-bottom: 0px !important;
  --nc-mobile-bottom: 0px !important;
}

/* Keep the full OS safe areas, but do not add oversized CAST chrome around them.
 * On Home-indicator iPhones the bottom inset is still preserved in full; only
 * the tappable navigation body is reduced from 50px to 38px. */
body.nc-phone-device:not(.nc-gated) .nc-shell {
  max-height: none;
  grid-template-rows:
    calc(40px + var(--nc-safe-top))
    minmax(0, 1fr)
    calc(38px + var(--nc-mobile-bottom));
}

body.nc-phone-device:not(.nc-gated) .nc-appbar {
  gap: 8px;
  padding: var(--nc-safe-top) 12px 0;
}
body.nc-phone-device:not(.nc-gated) .nc-appbar > h1 {
  top: calc(var(--nc-safe-top) + 20px);
  width: calc(100% - 124px);
}
body.nc-phone-device:not(.nc-gated) .nc-appbar > .nc-back {
  left: 12px;
  top: calc(var(--nc-safe-top) + 20px);
}
body.nc-phone-device:not(.nc-gated) .nc-brand { gap: 7px; }
body.nc-phone-device:not(.nc-gated) .nc-brand img { width: 90px; height: 32px; }
body.nc-phone-device:not(.nc-gated) .nc-brand span { margin-top: 2px; font-size: 9px; }
body.nc-phone-device:not(.nc-gated) .nc-icon-button {
  flex-basis: 34px;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px;
  min-height: 34px;
  padding: 7px !important;
}
body.nc-phone-device:not(.nc-gated) .nc-icon-button .nc-icon { width: 20px; height: 20px; }
body.nc-phone-device:not(.nc-gated) .nc-appbar-actions { min-width: 34px; }

/* Safe-area space belongs INSIDE the navigation bar. A zero bottom inset means
 * no extra lower strip at all (iPhone SE/8-class Home-button geometry). */
body.nc-phone-device:not(.nc-gated) .nc-tabbar {
  padding: 2px 6px calc(2px + var(--nc-mobile-bottom));
}
body.nc-phone-device:not(.nc-gated) .nc-tab { gap: 1px; min-height: 34px; }
body.nc-phone-device:not(.nc-gated) .nc-tab .nc-icon { width: 19px; height: 19px; }
body.nc-phone-device:not(.nc-gated) .nc-tab span { font-size: 9px; }
body.nc-phone-device:not(.nc-gated) .nc-route-progress { top: calc(39px + var(--nc-safe-top)); }
body.nc-phone-device:not(.nc-gated) .nc-offline { top: calc(43px + var(--nc-safe-top)); }
body.nc-phone-device:not(.nc-gated) .nc-toast { bottom: calc(50px + var(--nc-mobile-bottom)); }

/* While the software keyboard owns the visual viewport, keep only app bar +
 * content. This avoids a detached navigation strip on small iPhones. */
body.nc-phone-device:not(.nc-gated).nc-keyboard .nc-shell {
  grid-template-rows: calc(40px + var(--nc-safe-top)) minmax(0, 1fr);
}
body.nc-phone-device:not(.nc-gated).nc-keyboard .nc-tabbar { display: none; }