/* La Configuration de la solution : la MÉDIATHÈQUE d'un champ image ou vidéo, et le choix d'une icône (CDC_APPSTUDIO_MODIF I5,
   2026-11-05). Une feuille à part : 48-cms.css tient sous 650 lignes (son cliquet ne remonte jamais). Des tuiles carrées sous
   l'adresse : la première dépose (un champ fichier dans un label, le clavier l'atteint), les suivantes choisissent ; la tuile
   dont l'adresse est celle du champ est marquée. Jetons de l'atelier seulement. */
@layer modules{
  .cms-droite .cms-media-champ{ display:flex; flex-direction:column; gap:var(--sp-4); }
  .cms-droite .cms-mediatheque, .cms-droite .cms-icones{ display:grid; grid-template-columns:repeat(auto-fill, minmax(44px, 1fr)); gap:var(--sp-4);
    max-height:188px; overflow:auto; padding:var(--sp-2); border:1px solid var(--line); border-radius:var(--radius); background:var(--card); }
  .cms-droite .cms-mediatheque > .cms-d-note{ grid-column:1 / -1; margin:0; }
  .cms-droite .cms-media-tuile, .cms-droite .cms-icone-tuile{ position:relative; display:grid; place-items:center; aspect-ratio:1; min-width:0; padding:0; overflow:hidden;
    border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); color:var(--mut); cursor:pointer; }
  .cms-droite .cms-media-tuile img{ width:100%; height:100%; object-fit:cover; }
  .cms-droite .cms-media-tuile svg, .cms-droite .cms-icone-tuile svg{ width:20px; height:20px; }
  .cms-droite :is(.cms-media-tuile, .cms-icone-tuile):hover{ border-color:var(--accent); color:var(--txt); }
  .cms-droite :is(.cms-media-tuile, .cms-icone-tuile):focus-visible, .cms-droite .cms-media-depot:focus-within{ outline:2px solid var(--accent); outline-offset:1px; }
  .cms-droite :is(.cms-media-tuile, .cms-icone-tuile)[aria-pressed="true"]{ border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); color:var(--accent); }
  .cms-droite .cms-media-depot{ border-style:dashed; }
  .cms-droite .cms-icone-filtre{ width:100%; }
  .cms-ap-composee .cms-ap-icone{ display:inline-flex; color:var(--txt); } .cms-ap-composee .cms-ap-icone svg{ width:32px; height:32px; }
  .cms-droite .cms-media-depot input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
}