/**
 * ==============================================================================
 * ASSETTO REMOTE CLOUD — MOBILE & PWA UTILITIES (mobile-app.css)
 * ==============================================================================
 */

@supports (padding-top: env(safe-area-inset-top)) {
  .cockpit-top-hud {
    padding-top: calc(8px + env(safe-area-inset-top));
  }
  .carplay-media-bar {
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
  }
  .app-main {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* Landscape Mode on Phones (Sim-Rig Phone Mount) */
@media (max-height: 520px) and (orientation: landscape) {
  .cockpit-top-hud {
    display: none; /* Hide top header to maximize vertical telemetry */
  }
  .cockpit-viewport {
    padding: 6px;
    height: 100vh;
  }
  .cockpit-binnacle-card {
    padding: 8px 12px;
    gap: 8px;
  }
  .cluster-stage-3zone {
    grid-template-columns: 180px 1fr 180px !important;
    gap: 8px !important;
    min-height: 180px !important;
  }
  .gear-val {
    font-size: 3.8rem !important;
  }
  .speed-val {
    font-size: 3rem !important;
  }
  .shift-light-crown {
    height: 8px;
    gap: 3px;
  }
}