/* NxThing — fælles mobil/tablet-lag.
   Gør kunde-siderne (min, booking, order, profil) til at føles som en APP
   når de åbnes på telefon eller tablet. Indlæses EFTER sidens egen CSS. */

/* Safe-area: iPhone-notch og hjemme-indikator */
@supports (padding: max(0px)) {
  body {
    padding-left: max(0px, env(safe-area-inset-left));
    padding-right: max(0px, env(safe-area-inset-right));
    padding-bottom: max(0px, env(safe-area-inset-bottom));
  }
}

/* Ingen utilsigtet vandret scroll / gummi-bånd.
   ⛔ SCROLL-JANK: 'overflow-x:hidden' på html+body TVINGER 'overflow-y:auto', hvilket gør
   body til en ekstra scroll-container og slår browserens GPU-accelererede root-scroll fra
   → hakkende scroll på mobil (kunde/NxSkillz laggede, NxShift ikke fordi den ikke loader denne fil).
   'overflow-x:clip' klipper vandret overflow UDEN at lave en scroll-container → glat vertikal scroll. */
html, body { max-width: 100%; overflow-x: clip; overscroll-behavior-y: contain; }

@media (max-width: 900px) {
  /* iOS zoomer ind hvis input er under 16px — det ødelægger app-følelsen */
  input, select, textarea { font-size: 16px !important; }

  /* Alle tryk-mål mindst 44px */
  button, .btn, a.btn, select, input[type="checkbox"] + span { min-height: 44px; }
  button, .btn, a.btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 12px 16px;
  }
  input[type="checkbox"] { min-height: 0; width: 20px; height: 20px; }

  /* Kort/indhold i fuld bredde med luft i bunden til home-bar */
  .card, .wrap, .container { width: 100%; box-sizing: border-box; }
  body { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }

  /* Grids falder til én kolonne */
  .grid, .grid2, .grid3, .grid c2, [class*="grid"] { grid-template-columns: 1fr !important; }

  /* Tabeller scroller i stedet for at sprænge skærmen */
  .scroll, .tbl-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 560px) {
  h1 { font-size: 1.3rem !important; }
  h2 { font-size: 1.1rem !important; }
  .card { padding: 14px !important; border-radius: 14px !important; }
}

/* Hover "hænger fast" på touch — slå det fra */
@media (hover: none) {
  button:hover, .btn:hover, a:hover, .card:hover { filter: none !important; transform: none !important; }
}

/* Installeret på hjemmeskærmen: ren app-visning */
@media (display-mode: standalone) {
  body { overscroll-behavior-y: none; }
  /* Skjul ting der kun giver mening i en browser */
  .kun-browser { display: none !important; }
}

/* Tablet: bredere indhold, men stadig luftigt */
@media (min-width: 901px) and (max-width: 1180px) {
  .wrap, .container { max-width: 92%; }
}