/* GFA APITA v2.3.1 — Apparence & Modèles: correction de positionnement
   Correctif visuel uniquement. Aucun changement métier/API. */

/* Le popup exploite mieux la largeur disponible et évite l'étirement vertical
   artificiel du bloc Modèle & ressources. */
@media (min-width:1180px){
  #gfa-dm-box-v114{
    width:min(1380px,calc(100vw - 36px))!important;
    max-width:1380px!important;
    grid-template-columns:minmax(360px,38%) minmax(0,62%)!important;
    grid-template-areas:
      'header header'
      'model brand'
      'home home'
      'footer footer'!important;
    align-items:start!important;
    column-gap:14px!important;
  }

  #gfa-v150-model-zone,
  #gfa-brand-block{
    align-self:start!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
  }
}

/* Les sélecteurs Kiosque / Écran doivent rester parfaitement visibles :
   pas de texte coupé, pas d'overflow masqué, boutons bien alignés. */
#gfa-brand-block{
  overflow:visible!important;
}

#gfa-display-manager-v211,
#gfa-kiosk-manager-v230{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}

.gfa-dm-inline-row-v211,
.gfa-km-inline-row-v230{
  width:100%!important;
  min-width:0!important;
  align-items:center!important;
}

#gfa-display-select-v211,
#gfa-kiosk-select-v230{
  width:100%!important;
  min-width:0!important;
  height:40px!important;
  min-height:40px!important;
  line-height:38px!important;
  padding-top:0!important;
  padding-bottom:0!important;
  vertical-align:middle!important;
  overflow:visible!important;
}

#gfa-display-preview-v211,
#gfa-display-gallery-open-v211,
#gfa-kiosk-preview-v230,
#gfa-kiosk-gallery-open-v230{
  height:40px!important;
  min-height:40px!important;
  white-space:nowrap!important;
  align-self:center!important;
}

/* La zone Identité visuelle utilise toute sa largeur au lieu de laisser
   des espaces inutiles entre les champs. */
@media (min-width:1180px){
  #gfa-brand-colors{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:9px!important;
    align-items:end!important;
  }

  #gfa-brand-scope,
  #gfa-brand-agency{
    max-width:100%!important;
  }
}

/* Écrans moyens : rester compact sans provoquer de chevauchement. */
@media (min-width:768px) and (max-width:1179px){
  #gfa-dm-box-v114{
    align-items:start!important;
  }
  .gfa-dm-inline-row-v211,
  .gfa-km-inline-row-v230{
    grid-template-columns:minmax(0,1fr) auto auto!important;
  }
}

/* Mobile : comportement existant préservé, avec sélecteurs non coupés. */
@media (max-width:767px){
  #gfa-display-select-v211,
  #gfa-kiosk-select-v230{
    line-height:normal!important;
  }
}


/* v2.3.2 — sécurité anti-casse : le popup devient scrollable au lieu d'être
   agrandi ou déplacé davantage. Le contenu reste intact. */
#gfa-dm-box-v114{
  max-height:calc(100vh - 24px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  -webkit-overflow-scrolling:touch;
}

/* Conserve le popup entièrement dans la fenêtre, même sur écran moins haut. */
#gfa-dm-box-v114{
  margin-top:12px!important;
  margin-bottom:12px!important;
}

/* Scrollbar discrète, sans modifier le layout métier. */
#gfa-dm-box-v114::-webkit-scrollbar{width:8px!important;}
#gfa-dm-box-v114::-webkit-scrollbar-thumb{
  background:rgba(71,85,105,.28)!important;
  border-radius:999px!important;
}
#gfa-dm-box-v114::-webkit-scrollbar-track{background:transparent!important;}

/* v2.3.4 — compactage identité visuelle uniquement.
   6 couleurs sur une seule ligne. Aucun changement du logo/sidebar/publicités. */
@media (min-width:900px){
  #gfa-brand-colors{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:8px!important;
    align-items:end!important;
  }
  #gfa-brand-colors .gfa-brand-field{
    min-width:0!important;
    margin:0!important;
  }
  #gfa-brand-colors .gfa-brand-field label{
    display:block!important;
    margin:0 0 5px!important;
    white-space:nowrap!important;
    font-size:11px!important;
  }
  #gfa-brand-colors .gfa-brand-field input[type=color]{
    width:100%!important;
    height:34px!important;
    min-height:34px!important;
    padding:2px!important;
    margin:0!important;
  }
  #gfa-brand-actions{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:end!important;
    gap:8px!important;
    margin-top:9px!important;
  }
  #gfa-brand-scope{
    flex:1 1 220px!important;
    max-width:310px!important;
    min-height:38px!important;
  }
  #gfa-brand-agency:not([style*="display:none"]){
    flex:1 1 220px!important;
    max-width:310px!important;
    min-height:38px!important;
  }
  #gfa-brand-save{
    flex:0 0 auto!important;
    min-height:38px!important;
    padding:8px 13px!important;
    margin:0!important;
  }
  #gfa-brand-status{
    flex-basis:100%!important;
    min-height:0!important;
    margin:0!important;
  }
}

/* v2.3.6 — Apparence FINAL: cette feuille est volontairement chargée APRES
   tous les CSS historiques. Elle gagne donc réellement la cascade. */
@media (min-width:900px){
  #gfa-brand-colors{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }
  #gfa-brand-colors > *{
    min-width:0!important;
    grid-column:auto!important;
    grid-row:auto!important;
  }
  #gfa-brand-colors .gfa-brand-field label{
    font-size:11px!important;
    line-height:1.15!important;
    margin-bottom:4px!important;
  }
  #gfa-brand-colors .gfa-brand-field input[type="color"]{
    height:32px!important;
    min-height:32px!important;
  }

  /* Réduire la hauteur du bloc identité pour faire remonter le contenu et le footer. */
  #gfa-brand-block{
    padding:12px!important;
  }
  #gfa-brand-block > p{
    margin-bottom:7px!important;
  }
  #gfa-brand-scope,
  #gfa-brand-agency{
    min-height:36px!important;
    height:36px!important;
    padding-top:6px!important;
    padding-bottom:6px!important;
  }
  #gfa-display-manager-v211,
  #gfa-kiosk-manager-v230{
    padding:10px!important;
    margin-top:9px!important;
  }

  /* Le footer Enregistrer doit rester accessible : scroll interne réel si nécessaire. */
  #gfa-dm-box-v114{
    max-height:calc(100vh - 16px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  #gfa-save-all-footer-v146{
    position:sticky!important;
    bottom:0!important;
    z-index:20!important;
    background:#fff!important;
    padding:9px 0 2px!important;
  }
}