/* GH Logistics · adattamento dei portali al telefono (sotto 820px di larghezza).
   I portali usano stili inline: qui li si sovrascrive con !important tramite le classi gh-*. */
.gh-burger, .gh-backdrop { display: none; }
.gh-to-app { position: fixed; z-index: 90; left: 12px; bottom: calc(14px + env(safe-area-inset-bottom)); border: 0; border-radius: 999px; background: #0d9488; color: #fff; font: 700 14px/1 "Archivo", system-ui, sans-serif; padding: 12px 16px; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
.gh-mobile-only { display: none !important; }

@media (max-width: 820px) {
  html, body { overflow-x: hidden; }
  .gh-mobile-only { display: block !important; }
  .gh-desk-only { display: none !important; }

  /* Menu laterale → cassetto a scomparsa */
  .gh-aside {
    position: fixed !important; top: 0; left: 0; z-index: 95;
    width: 264px !important; height: 100% !important; height: 100dvh !important;
    padding: 20px 14px !important; align-items: stretch !important;
    padding-top: calc(20px + env(safe-area-inset-top)) !important;
    transform: translateX(-105%); transition: transform .22s ease !important;
    overflow-y: auto !important; box-shadow: 0 0 40px rgba(0,0,0,.35);
  }
  body.gh-nav-open .gh-aside { transform: none; }
  .gh-collapse { display: none !important; }
  .gh-backdrop {
    display: block; position: fixed; inset: 0; z-index: 94; background: rgba(10,14,20,.45);
    opacity: 0; pointer-events: none; transition: opacity .2s;
  }
  body.gh-nav-open .gh-backdrop { opacity: 1; pointer-events: auto; }
  body.gh-nav-open { overflow: hidden; }
  .gh-burger {
    display: grid; place-items: center; position: fixed; z-index: 66;
    top: calc(12px + env(safe-area-inset-top)); left: 12px; width: 40px; height: 40px;
    border: 0; border-radius: 12px; background: #171b23; color: #fff; cursor: pointer;
  }
  body.gh-nav-open .gh-burger { display: none; }

  /* Intestazione compatta */
  .gh-header {
    gap: 8px !important; padding: 12px 12px 12px 62px !important;
    padding-top: calc(12px + env(safe-area-inset-top)) !important; min-height: 64px; box-sizing: border-box;
  }
  .gh-header h4 { font-size: 16px !important; }
  .gh-search { width: auto !important; flex: 1 1 auto; min-width: 0; }
  .gh-hide-m { display: none !important; }
  .gh-dropdown { position: fixed !important; top: 70px !important; left: 12px !important; right: 12px !important; width: auto !important; max-height: calc(100dvh - 90px); overflow-y: auto !important; }

  /* Contenuto */
  .gh-content { padding: 16px 12px 88px !important; }
  .gh-content section { padding: 16px !important; }
  /* Griglie: le "tabelle" hanno min-width e scorrono di lato; le altre si impilano */
  .gh-content :where([style*="grid-template-columns"]:not([style*="min-width"])) { grid-template-columns: minmax(0, 1fr) !important; }
  /* matrici del listino (corriere × fasce di peso): restano a 4 colonne */
  .gh-content [style*="grid-template-columns: 64px"] { grid-template-columns: 74px repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
  /* riquadri numerici (KPI): due per riga */
  .gh-content [style*="auto-fit, minmax(1"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  .gh-content [style*="grid-template-columns: repeat(2"]:not([style*="min-width"]),
  .gh-content [style*="grid-template-columns: repeat(3"]:not([style*="min-width"]),
  .gh-content [style*="grid-template-columns: repeat(4"]:not([style*="min-width"]),
  .gh-content [style*="grid-template-columns: repeat(6"]:not([style*="min-width"]) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .gh-content [style*="overflow-x: auto"] { -webkit-overflow-scrolling: touch; }
  /* righe di elementi che non ci stanno: vanno a capo invece di uscire dallo schermo */
  .gh-content [style*="display: flex"]:not([style*="nowrap"]):not([style*="flex-direction: column"]) { flex-wrap: wrap; }

  /* Chat e finestre */
  .gh-chat { left: 8px !important; right: 8px !important; width: auto !important; bottom: 84px !important; height: min(70dvh, 520px) !important; }
  [style*="position: fixed; inset: 0"] > * { max-width: calc(100vw - 24px) !important; max-height: calc(100dvh - 24px); overflow-y: auto; box-sizing: border-box; }

  /* iOS non fa zoom sui campi se il testo è almeno 16px */
  input, select, textarea, .input { font-size: 16px !important; }
}
