/*
 * Cartes des spectacles [maj_mcf_spectacles] / [maj_mcf_spectacle] (mu-plugin maj-rodrigue-billetterie 0.5.0).
 * Cible : variante C du haut de page, validée par Jérémie le 05/10/2026 (banc 2_Build/2026-10-05-haut-de-page).
 * Badges et séances : classes du calendrier (billetterie.css, chargée avant). Rayons : crans natifs de Salient
 * (20 px les cartes et le panneau, 15 px les photos). Couleurs du socle : variables de Redux.
 */
.mcf-spc{margin-bottom:0}
.mcf-spc-grille{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}

/* Carte : un vrai bouton (clavier, lecteur d'écran) ; all:unset efface le style de bouton du thème. Le rayon est en
   !important : le style de bouton « rounded » de Salient pose 200px !important sur tout <button>
   (body[data-button-style^="rounded"] … button), les cartes sortaient en ovale (05/10/2026). */
#ajax-content-wrap button.mcf-spc-carte{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:10px;
 background:#fffefb;color:var(--nectar-extra-color-2);padding:22px;border:2px solid transparent;border-radius:20px!important;transition:border-color .2s,transform .2s}
#ajax-content-wrap button.mcf-spc-carte:hover{transform:translateY(-2px)}
#ajax-content-wrap button.mcf-spc-carte[aria-expanded="true"]{border-color:var(--nectar-accent-color)}
#ajax-content-wrap button.mcf-spc-carte:focus-visible{outline:2px solid var(--nectar-extra-color-1);outline-offset:3px}
.mcf-spc-carte .mcf-badge{margin-bottom:2px}
.mcf-spc-quand{font-family:'Barlow Condensed',sans-serif;font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:13px;line-height:1.3;color:#555}
.mcf-spc-court{flex:1;font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:17px;line-height:1.35;color:var(--nectar-extra-color-2)}
.mcf-spc-plus{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--nectar-accent-color)}

/* Panneau du détail : sous la rangée, sous la carte touchée en dessous de 1000 px (spectacles.js). Son contenu
   reprend le panneau de l'accordéon (.mcf-sp-panneau, billetterie.css) ; ici, seulement le fond ivoire des cartes et
   les crans de rayon natifs (20 px le panneau, 15 px les photos). */
.mcf-spc-panneau[hidden]{display:none}
.mcf-spc .mcf-sp-panneau{background:#fffefb;border-radius:20px}
.mcf-spc .mcf-sp-photos figure{border-radius:15px}
.mcf-spc .mcf-sp-seances a{border-color:#e6dfd3}

@media (max-width:999px){
 .mcf-spc-grille{grid-template-columns:1fr}
}