/* ============================================================
   ASTRA GENESIS, 16-panel-collapse.css
   v0.70.0, repli universel des panneaux (js/01h-panel-collapse.js).
   Déplié : chevron contour subtil (règle .panel-collapse existante,
   css/design-system.css). Replié : en-tête seul, chevron teal REMPLI,
   pastille ambre discrète à côté du titre.
   ============================================================ */

/* tout ce qui n'est ni l'en-tête ni un de ses ancêtres */
.agc-hidden{display:none !important;}

/* un panneau replié ne garde aucune hauteur imposée par sa colonne */
.agc.collapsed{min-height:0 !important;height:auto !important;flex:0 0 auto !important;}

/* en-tête : titre, éléments existants, chevron en fin de ligne */
.agc-head{display:flex;align-items:center;gap:8px;min-width:0;}
.agc-head > .panel-collapse{margin-left:auto;}
.agc-head > .eyebrow ~ .panel-collapse,
.agc-head > .qx-status ~ .panel-collapse,
.agc-head > [style*="margin-left:auto"] ~ .panel-collapse,
.agc-head > .xp-map-sub ~ .panel-collapse{margin-left:6px;}
/* en-têtes dont le titre était poussé par space-between */
.agc-head.panel-head{justify-content:flex-start;}
.agc-head.panel-head > .eyebrow{margin-left:auto;}

/* pastille ambre, visible seulement replié */
.agc-dot{display:none;flex:none;width:6px;height:6px;border-radius:50%;background:#F59E0B;opacity:.8;box-shadow:0 0 6px rgba(245,158,11,.45);}
.agc.collapsed .agc-dot{display:inline-block;}

/* chevron replié : pastille teal remplie, triangle plein pointé à droite */
.agc.collapsed .agc-head > .panel-collapse{
  background:#2DD4BF;border-color:#2DD4BF;color:#04211D;
}
.agc.collapsed .agc-head > .panel-collapse svg{transform:rotate(-90deg);}
.agc.collapsed .agc-head > .panel-collapse svg path{fill:currentColor;}
.agc.collapsed .agc-head > .panel-collapse:hover{background:#5EEAD4;border-color:#5EEAD4;color:#04211D;}
.agc-head > .panel-collapse:focus-visible{outline:2px solid #2DD4BF;outline-offset:2px;}

/* ============================================================
   v0.70.3, LAYOUT DE REPLI ET HAUTEURS NATURELLES (Quêtes, Expéditions,
   Planète, Bâtiments, Usines). Quatre règles :
     1. dans une RANGÉE (grille ou flex horizontal), un panneau replié
        s'aligne en haut de sa cellule : derrière lui, c'est le fond de
        l'écran, jamais un bloc sombre étiré ;
     2. une rangée entièrement repliée retombe à la hauteur de ses
        en-têtes, ce qui fait remonter la suite ;
     3. dans une COLONNE (.agc-stack, marquée par js/01h-panel-collapse.js),
        aucun panneau n'est étiré ni comprimé : chacun garde la hauteur de
        son contenu et c'est la colonne qui défile. Seules les ZONES
        FLEXIBLES déclarées (AG.COLLAPSE_FLEX_ZONES : grille de cartes,
        journal, canvas) portent .agc-grow et absorbent la hauteur
        restante jusqu'à la nav, contenu aligné en haut. Hors d'elles,
        l'espace libre laisse voir le fond de l'écran ;
     4. un panneau à grille de cartes déclaré (AG.COLLAPSE_CARD_GRIDS)
        prend la largeur de ses cartes (.agc-fitw), plafonnée à la place
        disponible : 3 cartes = 3 cartes de large, le fond se voit à côté.
   Les largeurs viennent des gabarits de colonnes : aucun panneau ne
   s'élargit quand son voisin se replie.
   ============================================================ */
/* 1. rangées */
.qx-center-top > .agc.collapsed,
.xp-maprow > .agc.collapsed,
.fgx-bottom-grid > .agc.collapsed,
.dv2-dock > .agc.collapsed{align-self:start;}

/* 2. rangées entièrement repliées : plus de hauteur imposée */
.xp-maprow:not(:has(> .agc:not(.collapsed))){height:auto;}
.fgx-tabpanel.fgx-tab-overview:not(:has(.fgx-bottom-panel:not(.collapsed))){
  grid-template-rows:auto minmax(240px,1fr) auto;
}

/* 3. colonnes : hauteur naturelle par défaut, jamais de compression.
   Sans ce flex-shrink:0, le dernier panneau d'une colonne trop pleine se
   fait écraser sous son contenu (Ressources secondaires réduite à 35 px
   pour 416 px de contenu, mesuré en v0.70.2) au lieu de faire défiler la
   colonne. */
.agc-stack > *{flex-shrink:0;}
/* zones flexibles : elles seules absorbent la place restante, et ne
   rétrécissent jamais sous leur contenu (flex-shrink:0 conservé) */
.agc-stack > .agc-grow{flex-grow:1;flex-basis:auto;min-height:0;}
.agc-stack > .agc.agc-grow{display:flex;flex-direction:column;}
.agc-stack > .agc.agc-grow > .panel-body{flex:1 1 auto;min-height:0;}
/* la colonne Planète pose flex:0 0 auto avec plus de spécificité */
.dv2-fullbleed .side-stack.agc-stack > .agc-grow{flex-grow:1;flex-shrink:0;flex-basis:auto;}
/* un panneau replié ne grandit jamais et garde sa largeur de colonne */
.agc-stack > .agc.collapsed{flex:0 0 auto;align-self:stretch;}

/* 4. largeur pilotée par le contenu (panneaux à grille de cartes).
   --agc-n (nombre de cartes) est posé par js/01h-panel-collapse.js : le
   panneau fait exactement ses cartes plus les gaps, plancher d'une carte,
   plafond de la place disponible. Pas de min-width:min-content ici : sur
   le journal, l'aide de l'en-tête (nowrap + ellipsis) portait un
   min-content de 626 px et le plancher d'une carte devenait inatteignable
   (mesuré en contrôle navigateur). */
.agc-fitw{
  width:min(100%, calc(
    var(--agc-n,1) * var(--agc-card-w,200px)
    + (var(--agc-n,1) - 1) * var(--agc-card-gap,10px)
    + var(--agc-fitw-extra,0px)));
  min-width:0;max-width:100%;
}
/* cartes alignées en haut quand la zone est plus haute que la grille */
.agc-fitw .qx-grid, .agc-fitw .qx-unlocks{align-content:start;}
#qx-panel-journal{
  --agc-card-w:var(--qx-card-min-w,200px);--agc-card-gap:10px;
  --agc-fitw-extra:calc(24px*var(--scale) + 2px);
}
#qx-panel-unlocks{
  --agc-card-w:112px;--agc-card-gap:8px;
  --agc-fitw-extra:calc(24px*var(--scale) + 2px);
}

/* en-têtes sans bordure basse une fois seuls */
.agc.collapsed > .panel-head{border-bottom-color:transparent;}

@media (prefers-reduced-motion: reduce){
  .agc-head > .panel-collapse svg{transition:none;}
}

/* v0.70.3, en-tête d'un panneau à largeur réduite : l'aide secondaire
   s'efface au lieu de faire passer le titre sur trois lignes. Requête de
   conteneur sur le panneau lui-même, dont la largeur est déjà imposée
   par .agc-fitw (aucune dépendance circulaire). */
.agc-fitw{container-type:inline-size;}
@container (max-width: 420px){
  .agc-fitw > .panel-head > .qx-sect-hint{display:none;}
}

/* Usines sous 1300 px : les deux colonnes latérales deviennent des
   RANGÉES qui wrappent (css/design-system.css, `.fgx-col-left > *`).
   En rangée, la compression est voulue : le flex-shrink:0 du mode
   colonne y ferait déborder la ligne. */
@media (max-width:1300px){
  #screen-factories .agc-stack > *{flex-shrink:1;}
}