/* Plan du rez-de-chaussée, salles cliquables. Le tracé vient du relevé
   d'architecte ; ses styles sont repris ici, préfixés pour ne pas déborder
   sur le reste du site. */
:root{
  --plan-trait:#1d1d1d;   /* murs et cloisons */
  --plan-other:#f4f5f3;   /* espaces sans stand */
}

.plan{
  padding:calc(var(--nav-h) + 1.5rem) 0 2rem;
  display:flex;align-items:safe center;
}
.plan-grid{
  display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.35fr);
  gap:2.2rem;align-items:center;width:min(100% - 2.5rem,var(--container));margin-inline:auto;
}

.plan-lead{margin:.7rem 0 1.2rem;color:var(--muted);font-size:.95rem;line-height:1.55;max-width:48ch}

.plan-panel{background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:1.1rem 1.2rem;box-shadow:var(--shadow-sm)}
.plan-hint{margin:0;color:var(--muted);font-size:.9rem}
.plan-result-title{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin:0 0 .8rem;
  font-family:var(--font-display);text-transform:uppercase;font-size:1.05rem;color:var(--bark);letter-spacing:0}
.plan-badge{font-family:var(--font-sans);text-transform:none;font-size:.78rem;font-weight:600;
  color:var(--moss-deep);background:color-mix(in oklab,var(--lime) 18%,var(--paper));
  border:1px solid color-mix(in oklab,var(--lime) 38%,var(--line));padding:.2rem .6rem;border-radius:999px}
.plan-badge b{font-family:var(--font-display)}

/* la liste défile dans le panneau pour que la page tienne en un écran */
.plan-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem;
  max-height:min(38vh,320px);overflow-y:auto;overscroll-behavior:contain;padding-right:.3rem;
  scrollbar-width:thin;scrollbar-color:color-mix(in oklab,var(--moss) 32%,transparent) transparent}
.plan-list::-webkit-scrollbar{width:6px}
.plan-list::-webkit-scrollbar-thumb{background:color-mix(in oklab,var(--moss) 30%,transparent);border-radius:99px}

.plan-item{display:flex;align-items:center;gap:.75rem;width:100%;text-align:left;
  padding:.55rem .7rem;border-radius:12px;border:1px solid var(--line);background:var(--cream);
  font:inherit;color:inherit;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.plan-item:hover{background:var(--paper);border-color:color-mix(in oklab,var(--moss) 30%,var(--line));transform:translateX(3px)}
.plan-item-stand{flex:0 0 auto;min-width:2.9rem;text-align:center;padding:.2rem .4rem;border-radius:8px;
  background:color-mix(in oklab,var(--teal) 14%,var(--paper));color:var(--teal-deep);
  font-family:var(--font-display);font-size:.75rem}
/* une activité du programme porte son horaire là où une entreprise porte son
   stand ; elle ne s’ouvre pas, contrairement à une fiche entreprise */
.plan-item--prog{cursor:default}
.plan-item--prog:hover{transform:none}
.plan-item--prog .plan-item-stand{background:color-mix(in oklab,var(--lime) 34%,var(--paper));
  color:var(--moss-deep);white-space:nowrap}
.plan-item-body{min-width:0}
.plan-item-name{display:block;font-weight:700;font-size:.92rem;color:var(--bark);
  line-height:1.25;overflow-wrap:anywhere}
.plan-item-sector{display:block;margin-top:.1rem;font-size:.74rem;color:var(--muted)}
.plan-none{margin:.2rem 0 0;color:var(--muted);font-size:.88rem}

/* ---- le plan ---- */
.plan-mapwrap{justify-self:center;width:100%;max-width:min(100%,820px)}
.plan-map{width:100%;height:auto;display:block;border-radius:18px;background:var(--paper);
  border:1px solid var(--line);box-shadow:var(--shadow-lg)}

/* le relevé lui-même */
.plan-wall{fill:none;stroke:var(--plan-trait);stroke-width:3;stroke-linejoin:miter;stroke-linecap:square}
.plan-partition{fill:none;stroke:var(--plan-trait);stroke-width:1.6;stroke-linejoin:miter;stroke-linecap:square}
.plan-zone{fill:var(--plan-other)}
.plan-room{fill:var(--plan-other);stroke:var(--plan-trait);stroke-width:2;stroke-linejoin:miter}
/* la coupe efface le mur sous la porte : elle prend donc le fond des pièces,
   sinon elle y laisse une entaille blanche */
.plan-door-cut{fill:none;stroke:var(--plan-other);stroke-width:4;stroke-linecap:butt}
.plan-door path:not(.plan-door-cut){fill:none;stroke:var(--plan-trait);stroke-width:1.1}
.plan-stair{fill:none;stroke:var(--plan-trait);stroke-width:1.1;stroke-linecap:butt}
.plan-symbol{fill:var(--plan-trait);stroke:none}
.plan-symbol-line{fill:none;stroke:var(--plan-trait);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.plan-symbol-box{fill:var(--paper);stroke:var(--plan-trait);stroke-width:1.4}
/* Le décor est posé par-dessus les zones : sans cela un clic tombant sur une
   marche d'escalier ou un pictogramme n'atteindrait pas la salle en dessous. */
.plan-wall,.plan-partition,.plan-stair,.plan-door,
.plan-symbol,.plan-symbol-line,.plan-symbol-box,.plan-limite,.plan-lead{pointer-events:none}
.plan-label{font-family:var(--font-display);font-size:17px;letter-spacing:.02em;
  fill:var(--bark);text-anchor:middle;dominant-baseline:central}

/* les salles qui accueillent des stands */
.plan-pick{cursor:pointer;fill:color-mix(in oklab,var(--teal) 26%,var(--paper));
  transition:fill .2s var(--ease)}
.plan-pick:hover{fill:color-mix(in oklab,var(--teal) 45%,var(--paper))}
.plan-pick.is-active{fill:color-mix(in oklab,var(--orange) 55%,var(--paper))}
/* :focus et pas seulement :focus-visible : au clic le navigateur pose son
   propre contour orange, que la teinte de sélection remplace déjà. */
.plan-pick:focus{outline:none}
.plan-pick:focus-visible{fill:color-mix(in oklab,var(--orange) 55%,var(--paper))}

/* Le hall haut s'ouvre sur le couloir : sa limite n'est pas un mur, elle se
   marque en pointillé plutôt qu'au trait plein. */
.plan-limite{fill:none;stroke:var(--plan-trait);stroke-width:1.6;stroke-dasharray:7 6}

/* Les espaces communs, nommés en toutes lettres. Deux d'entre eux manquent de
   place là où ils désignent : ils se posent à l'écart, reliés par une flèche. */
.plan-place{font-family:var(--font-sans);font-size:15px;font-weight:700;
  fill:var(--moss-deep);text-anchor:middle;dominant-baseline:central}
.plan-lead{fill:none;stroke:var(--moss-deep);stroke-width:1.6;stroke-linecap:round}
.plan-lead-head{fill:var(--moss-deep);stroke:none}

.plan-legend{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;
  margin:.7rem 0 0;font-size:.78rem;color:var(--muted)}
/* Le fond de page est clair : sans un contour franc, une pastille pâle y
   disparaît. Le remplissage reste celui du plan pour rester honnête. */
.plan-key{width:14px;height:14px;border-radius:4px;display:inline-block;
  border:1.5px solid color-mix(in oklab,var(--bark) 45%,transparent)}
.plan-key--pick{background:color-mix(in oklab,var(--teal) 26%,var(--paper));
  border-color:color-mix(in oklab,var(--teal-deep) 70%,transparent)}
.plan-key--active{background:color-mix(in oklab,var(--orange) 55%,var(--paper));
  border-color:color-mix(in oklab,var(--clay) 85%,var(--bark));margin-left:.8rem}
.plan-key--other{background:var(--plan-other);margin-left:.8rem}

/* Zoom à deux doigts. js/plan.js déplace le viewBox du SVG, qui redessine
   le vectoriel net à chaque échelle. touch-action:pan-y laisse la page défiler
   à un doigt tout en nous confiant le pincement ; on bascule à « none » une
   fois agrandi, pour que le doigt promène la carte au lieu de la page. */
.plan-frame{overflow:hidden;border-radius:18px;border:1px solid var(--line);
  box-shadow:var(--shadow-lg);background:var(--paper);touch-action:pan-y}
.plan-frame.is-zoom{touch-action:none}
.plan-frame .plan-map{border:0;box-shadow:none;border-radius:0}

/* L'indication se pose dans le coin du plan, là où le pouce arrive. Elle
   n'intercepte pas le geste et s'efface dès que la carte est agrandie :
   une fois le zoom trouvé, elle n'a plus rien à dire. */
.plan-pinch{display:none}
@media (hover:none){
  .plan-frame{position:relative}
  .plan-pinch{display:inline-flex;align-items:center;gap:.35rem;
    position:absolute;left:.6rem;top:.6rem;z-index:2;pointer-events:none;
    padding:.32rem .6rem;border-radius:999px;
    background:color-mix(in oklab,var(--paper) 88%,transparent);
    border:1px solid var(--line);box-shadow:var(--shadow-sm);
    color:var(--moss-deep);font-size:.72rem;font-weight:700;
    transition:opacity .3s var(--ease)}
  .plan-pinch svg{width:14px;height:14px;flex:0 0 auto}
  .plan-frame.is-zoom .plan-pinch{opacity:0}
}

@media (max-width:960px){
  .plan{padding:calc(var(--nav-h) + 1rem) 0 2rem;display:block}
  .plan-grid{grid-template-columns:minmax(0,1fr);gap:1.5rem}
  .plan-mapwrap{order:-1;max-width:none}
  .plan-list{max-height:none}

}