/* =================================================================
   BIZZI — Responsivité mobile v306
   Cible: 320 – 430 px, mobile-first
   Ne modifie pas les fonctionnalités, IDs, classes, backend ni logic.
   ================================================================= */

/* ── 0. Overflow horizontal global ─────────────────────────────── */
html,
body {
  overflow-x: hidden;
  max-width: 100%;
}

/* ── 1. Safe-area iOS + bottom-nav qui ne masque pas le contenu ── */
@media (max-width: 920px) {
  .bottom-nav {
    height: calc(62px + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .main {
    padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px));
  }
}

/* ── 2. Viewport mobile — empêche le zoom iOS au focus ─────────── */
/* iOS Safari zoome sur les inputs < 16 px. On force 16 px minimum. */
@media (max-width: 920px) {
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="number"],
  input[type="tel"],
  input[type="password"],
  input[type="url"],
  textarea,
  select {
    font-size: max(16px, 1em);
  }
}

/* ── 3. Typographies globales réduites sur très petits écrans ───── */
@media (max-width: 430px) {
  h1 { font-size: clamp(22px, 7vw, 32px); }
  h2 { font-size: clamp(18px, 5.5vw, 24px); }
}

@media (max-width: 360px) {
  .main {
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* ── 4. ZEYDS CASH ────────────────────────────────────────────────
   La responsivité complète du module (mobile-first, bottom sheets,
   touch targets, safe-area, chips scrollables, etc.) vit désormais
   directement dans zeyds-cash.css, réécrit mobile-first. On ne
   duplique plus rien ici pour éviter les conflits de cascade. */

/* ── 5. Formulaires globaux 100 % sur mobile ───────────────────── */
@media (max-width: 920px) {
  .mobile-forms-overlay .form-group input,
  .mobile-forms-overlay .form-group textarea,
  .mobile-forms-overlay .form-group select,
  .form-grid input,
  .form-grid textarea,
  .form-grid select {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }
}

/* ── 6. Bottom-nav labels + icons touch-friendly ───────────────── */
@media (max-width: 920px) {
  .bottom-link {
    min-height: 44px;
    padding: 6px 2px env(safe-area-inset-bottom, 4px);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .bottom-link-icon { font-size: 20px; }
  .bottom-link-label { font-size: 9.5px; }
}

/* ── 7. Topbar très compact sur cash (renforcé) ─────────────────── */
@media (max-width: 920px) {
  body:has(#view-cash.active) .location-pill {
    gap: 7px;
    padding: 5px 8px;
  }

  body:has(#view-cash.active) #geoButton {
    min-height: 34px;
    padding: 0 10px;
    font-size: 12px;
    white-space: nowrap;
  }

  body:has(#view-cash.active) #citySelect {
    max-width: 130px;
    font-size: 13px;
  }
}

/* ── 8. Cash return bar ─────────────────────────────────────────── */
@media (max-width: 920px) {
  .life-return-bar {
    padding: 8px 13px;
    font-size: 13px;
    border-radius: 12px;
    gap: 8px;
  }

  .life-return-bar button {
    min-height: 36px;
    padding: 0 12px;
    font-size: 13px;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .life-return-bar span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
  }
}

/* ── 9. Prévention débordements résiduels ───────────────────────── */
@media (max-width: 920px) {
  .main > * {
    min-width: 0;
    max-width: 100%;
  }

  .view {
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }

  /* Tableaux et pre (logs/code) */
  table, pre {
    display: block;
    overflow-x: auto;
    max-width: 100%;
    white-space: pre;
  }
}