/* =========================================================
   Gestion Client v0.4.8 — Correctifs mobiles ciblés
   - Hamburger plus visible et zone tactile plus grande
   - Modales verrouillées horizontalement sur mobile
   Aucun changement de palette ni de logique métier.
   ========================================================= */

@media (max-width: 1050px) {
  .avsg-gc-app .gc-menu-toggle {
    display: inline-grid !important;
    place-items: center !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    flex: 0 0 52px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    border-radius: 12px !important;
    color: var(--gc-header-fg) !important;
    cursor: pointer;
    touch-action: manipulation;
  }

  .avsg-gc-app .gc-menu-icon {
    display: block;
    width: 27px;
    height: 20px;
    background:
      linear-gradient(currentColor, currentColor) 0 0 / 100% 3px no-repeat,
      linear-gradient(currentColor, currentColor) 0 50% / 100% 3px no-repeat,
      linear-gradient(currentColor, currentColor) 0 100% / 100% 3px no-repeat;
    border-radius: 2px;
  }

  .avsg-gc-app .gc-mobile-brand {
    margin-left: 6px !important;
  }
}

@media (max-width: 760px) {
  html,
  body.avsg-gc-standalone,
  .avsg-gc-app,
  .avsg-gc-app .gc-content {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Le dialog reste dans le viewport. Le contenu peut défiler verticalement,
     mais ne peut plus glisser de droite à gauche. */
  .avsg-gc-app .gc-dialog {
    box-sizing: border-box !important;
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    touch-action: pan-y;
  }

  .avsg-gc-app .gc-dialog > .gc-modal {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    max-height: calc(100svh - 24px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    touch-action: pan-y;
  }

  .avsg-gc-app .gc-dialog .gc-modal-head,
  .avsg-gc-app .gc-dialog .gc-modal-head > div,
  .avsg-gc-app .gc-dialog .gc-modal-form,
  .avsg-gc-app .gc-dialog .gc-form-grid,
  .avsg-gc-app .gc-dialog .gc-field,
  .avsg-gc-app .gc-dialog .gc-detail-summary,
  .avsg-gc-app .gc-dialog .gc-subscription-summary,
  .avsg-gc-app .gc-dialog .gc-invoice-summary,
  .avsg-gc-app .gc-dialog .gc-subscription-detail,
  .avsg-gc-app .gc-dialog .gc-notes-card,
  .avsg-gc-app .gc-dialog .gc-danger-zone,
  .avsg-gc-app .gc-dialog .gc-modal-footer {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .avsg-gc-app .gc-dialog .gc-form-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }

  .avsg-gc-app .gc-dialog .gc-field input,
  .avsg-gc-app .gc-dialog .gc-field select,
  .avsg-gc-app .gc-dialog .gc-field textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .avsg-gc-app .gc-dialog .gc-modal-head h2,
  .avsg-gc-app .gc-dialog .gc-modal-head p,
  .avsg-gc-app .gc-dialog .gc-detail-summary strong,
  .avsg-gc-app .gc-dialog .gc-detail-summary span {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  /* Fiche client : son ancien style inline utilisait un dialog plein écran.
     On garde ce comportement tout en interdisant le déplacement horizontal. */
  .avsg-gc-app .gc-client-dialog {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  .avsg-gc-app .gc-client-dialog > .gc-modal {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    margin: 10px auto !important;
  }
}

@media (max-width: 390px) {
  .avsg-gc-app .gc-menu-toggle {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    flex-basis: 50px !important;
  }

  .avsg-gc-app .gc-menu-icon {
    width: 26px;
    height: 19px;
  }
}
