/* Pages des thèmes, des soirées et de tous les costumes (29/10/2026). Palette « Loge de théâtre ». */
body.woocommerce { --cd-rouge: #8E1B2E; --cd-prune: #2B1630; --cd-or: #C9A24A; --cd-ivoire: #FBF7F0; --cd-encre: #3B2A3E; --cd-gris: #7A6E7C; }

/* Pas de défilement horizontal si la photo déborde de la largeur de la barre de défilement (Windows). */
html { overflow-x: clip; }

/* Bandeau : texte sur prune à gauche, photo d'ambiance à droite, pleine largeur */
.cd-bandeau { container-type: inline-size; display: grid; grid-template-columns: 1fr; background: var(--cd-prune); box-shadow: 0 0 0 100vmax var(--cd-prune); clip-path: inset(0 -100vmax); color: var(--cd-ivoire); margin: 0 0 40px; }
.cd-bandeau-texte { padding: 56px 0 52px; max-width: 640px; }
.cd-bandeau--photo { grid-template-columns: 5fr 7fr; min-height: 420px; }
.cd-bandeau--photo .cd-bandeau-texte { align-self: center; padding: 48px 56px 48px 0; }
/* La photo va jusqu'au bord droit de l'écran : 100cqw = largeur du bandeau, 100% = largeur de la page sans la barre de défilement. */
.cd-bandeau-photo { position: relative; }
.cd-bandeau--photo .cd-bandeau-photo { margin-right: calc((100cqw - var(--cd-page, 100vw)) / 2); }
.cd-bandeau-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 55% 30%; }
.cd-bandeau .cd-ariane { font-family: 'Jost', sans-serif; font-size: 13px; color: rgba(251,247,240,.7); margin: 0 0 22px; }
.cd-bandeau .cd-ariane a { color: var(--cd-ivoire); text-decoration: none; }
.cd-bandeau .cd-ariane a:hover { color: var(--cd-or); }
.cd-bandeau .cd-ariane .cd-sep { margin: 0 10px; color: var(--cd-or); }
.cd-bandeau h1 { font-family: 'Bodoni Moda', serif; font-size: 46px; line-height: 1.12; font-weight: 500; color: var(--cd-ivoire); margin: 0 0 20px; letter-spacing: 0; }
.cd-bandeau .cd-intro, .cd-bandeau .cd-intro p { font-family: 'Jost', sans-serif; font-size: 17px; line-height: 1.7; color: rgba(251,247,240,.88); margin: 0; max-width: 46ch; }

/* Barre au-dessus de la grille */
.woocommerce .oceanwp-toolbar { border: 0 !important; padding: 0 !important; margin: 0 0 26px !important; display: flex; align-items: center; justify-content: space-between; }
.cd-barre { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 30px; }
.cd-nombre { font-family: 'Jost', sans-serif; font-size: 14px; color: var(--cd-gris); margin: 0; }
.cd-barre .woocommerce-ordering { float: none !important; margin: 0 !important; }
.woocommerce .woocommerce-ordering select, .woocommerce .woocommerce-ordering .theme-select { font-family: 'Jost', sans-serif; font-size: 14px; color: var(--cd-prune); border: 1px solid rgba(43,22,48,.25) !important; border-radius: 0; height: 40px; min-width: 220px; }
.woocommerce .products { clear: both; }

/* Les autres thèmes */
.cd-autres { clear: both; text-align: center; padding: 64px 0 72px; margin-top: 40px; border-top: 1px solid rgba(43,22,48,.1); }
.cd-autres h2 { font-family: 'Bodoni Moda', serif; font-size: 28px; font-weight: 500; color: var(--cd-prune); margin: 0 0 22px; letter-spacing: 0; }
.cd-autres ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 34px; }
.cd-autres a { font-family: 'Bodoni Moda', serif; font-size: 20px; color: var(--cd-prune); text-decoration: none; }
.cd-autres a:hover { color: var(--cd-or); }

/* Téléphone : photo en haut, texte dessous, deux costumes par ligne */
@media (max-width: 767px) {
  .cd-bandeau--photo { grid-template-columns: 1fr; min-height: 0; }
  .cd-bandeau-photo { order: -1; height: 230px; margin: 0 -16px; }
  .cd-bandeau--photo .cd-bandeau-texte, .cd-bandeau-texte { padding: 26px 0 32px; }
  .cd-bandeau h1 { font-size: 31px; margin-bottom: 14px; }
  .cd-bandeau .cd-intro, .cd-bandeau .cd-intro p { font-size: 15.5px; }
  .cd-bandeau { margin-bottom: 26px; }
  .cd-barre { margin-bottom: 22px; }
  html .woocommerce .woocommerce-ordering select, html .woocommerce .woocommerce-ordering .theme-select { min-width: 0 !important; width: 190px !important; max-width: 100%; }
  .woocommerce ul.products { display: grid !important; grid-template-columns: 1fr 1fr; gap: 28px 14px; }
  .woocommerce ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; }
  .cd-autres { padding: 44px 0 52px; }
  .cd-autres a { font-size: 18px; }
}
.cd-autres span[aria-current] { font-family: 'Bodoni Moda', serif; font-size: 20px; color: var(--cd-or); }
@media (max-width: 767px) { .cd-autres span[aria-current] { font-size: 18px; } }

/* Recherche sans résultat : une phrase, puis le bouton prune du panier vide */
.cd-aucun { padding: 8px 0 72px; }
.cd-aucun p { color: var(--cd-encre); margin: 0 0 24px; }
.cd-aucun-lien { display: inline-flex; align-items: center; height: 54px; padding: 0 36px; background: var(--cd-prune); color: var(--cd-ivoire) !important; font-family: 'Jost', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; transition: color .25s; }
.cd-aucun-lien:hover, .cd-aucun-lien:focus-visible { color: var(--cd-or) !important; }

/* Menu de tri : la vraie liste (invisible, posée sur l'habillage d'OceanWP) restait plus large que l'écran sur téléphone. */
html .woocommerce .woocommerce-ordering { position: relative; overflow: hidden; }
html .woocommerce .woocommerce-ordering select.orderby { left: 0 !important; top: 0 !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; }