/* Orekonect mobile app shell — shared foundation for all app-style screens. */
@media (max-width: 767px) {
  :root {
    --app-canvas: #f4f7f4;
    --app-surface: #ffffff;
    --app-ink: #12261a;
    --app-muted: #6a7b71;
    --app-line: #dfe9e1;
    --app-green: #0b3d2e;
    --app-green-soft: #145a43;
    --app-accent: #FF7000;
    --app-radius-sm: 12px;
    --app-radius-md: 18px;
    --app-radius-lg: 24px;
    --app-shadow: 0 10px 24px rgba(8, 55, 32, .08);
    --app-safe-bottom: env(safe-area-inset-bottom);
  }

  body.homepage {
    min-height: 100vh;
    background: var(--app-canvas);
    color: var(--app-ink);
    -webkit-tap-highlight-color: transparent;
  }

  .app-shell {
    min-height: 100vh;
    background: var(--app-canvas);
  }

  .app-shell *,
  .app-shell *::before,
  .app-shell *::after {
    box-sizing: border-box;
  }

  .app-shell a,
  .app-shell button {
    -webkit-tap-highlight-color: transparent;
  }

  .app-shell a:focus-visible,
  .app-shell button:focus-visible,
  .app-tabbar a:focus-visible {
    outline: 3px solid rgba(245, 158, 11, .6);
    outline-offset: 3px;
  }

  .app-shell .newview-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
  }

  .app-scroll {
    min-height: calc(100vh - 64px);
    padding-bottom: calc(104px + var(--app-safe-bottom));
  }

  .app-shell .newview-tile,
  .app-shell .newview-restaurant-card,
  .app-shell .newview-product-card,
  .app-shell .newview-property-card {
    transition: transform .18s ease, box-shadow .18s ease;
  }

  .app-shell .newview-tile:active,
  .app-shell .newview-restaurant-card:active,
  .app-shell .newview-product-card:active,
  .app-shell .newview-property-card:active {
    transform: scale(.985);
  }

  .app-tabbar {
    padding-bottom: max(0px, var(--app-safe-bottom));
  }

  .app-tabbar .homepage-mobile-tab {
    min-height: 50px;
    justify-content: center;
  }
}

@media (min-width: 768px) {
  .app-shell { display: none; }
}