/* ==========================================================================
   LDDP · Encart éditorial réutilisable — .lddp-note
   Palette « Décision / achat » par défaut · variante Identité via --sombre
   ========================================================================== */

.lddp-note{
  --note-fond:          #FBF7EE;
  --note-bordure:       #E4DBC9;
  --note-filet:         #8C3B2E;
  --note-texte:         #221D18;
  --note-secondaire:    #7A7166;
  --note-accent:        #8C3B2E;
  --note-accent-survol: #B5581E;

  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:22px;
  align-items:start;
  box-sizing:border-box;
  margin:0 0 clamp(28px,4vw,44px);
  padding:clamp(20px,3vw,26px) clamp(22px,3vw,30px);
  background:var(--note-fond);
  border:1px solid var(--note-bordure);
  border-left:3px solid var(--note-filet);
  border-radius:0;
  color:var(--note-texte);
  font-family:'EB Garamond',Georgia,'Times New Roman',serif;
}
.lddp-note *{box-sizing:border-box;}

.lddp-note__icone{display:block;width:32px;height:32px;margin-top:3px;color:var(--note-accent);}
.lddp-note__icone svg{display:block;width:100%;height:100%;fill:currentColor;}

.lddp-note__surtitre{
  margin:0 0 6px !important;padding:0 !important;
  font-family:'Space Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--note-accent);
}
.lddp-note__texte{
  margin:0 !important;padding:0 !important;
  font-size:1.075rem;line-height:1.6;
}
.lddp-note__texte strong{font-weight:600;color:var(--note-texte);}
.lddp-note__aparte{
  margin:14px 0 0 !important;padding:12px 0 0 !important;
  border-top:1px solid var(--note-bordure);
  font-size:.95rem;line-height:1.55;font-style:italic;
  color:var(--note-secondaire);
}

.lddp-note a{
  color:var(--note-accent);text-decoration:none;
  border-bottom:1px solid currentColor;transition:color .2s ease;
}
.lddp-note a:hover,.lddp-note a:focus-visible{color:var(--note-accent-survol);}

/* — Variante sombre (palette Identité) — */
.lddp-note--sombre{
  --note-fond:#1C1917;
  --note-bordure:#322D28;
  --note-filet:#D98E3B;
  --note-texte:#F1EDE4;
  --note-secondaire:#A69C8D;
  --note-accent:#D98E3B;
  --note-accent-survol:#B5581E;
}

/* — Variante compacte — */
.lddp-note--compact{padding:18px 22px;column-gap:18px;}
.lddp-note--compact .lddp-note__icone{width:26px;height:26px;}
.lddp-note--compact .lddp-note__texte{font-size:1rem;}

/* — Sans icône — */
.lddp-note--sansicone{grid-template-columns:1fr;}
.lddp-note--sansicone .lddp-note__icone{display:none;}

@media (max-width:600px){
  .lddp-note{grid-template-columns:1fr;row-gap:12px;}
  .lddp-note__icone{width:28px;height:28px;}
}


/* ==========================================================================
   LDDP · Grille boutique — module Divi 5 « Boutique » + WooCommerce
   ========================================================================== */

.et_pb_shop{
  --shop-surface:#FBF7EE;
  --shop-bordure:#E4DBC9;
  --shop-texte:#221D18;
  --shop-secondaire:#7A7166;
  --shop-accent:#8C3B2E;
  --shop-hover:#B5581E;
  --shop-mono:'Space Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --shop-serif:'EB Garamond',Georgia,'Times New Roman',serif;
}

/* — Grille : on neutralise les flottants et largeurs Divi — */
.et_pb_shop ul.products,
.et_pb_shop ul.products[class*="columns-"]{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:28px;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
.et_pb_shop ul.products li.product,
.woocommerce-page .et_pb_shop ul.products li.product:nth-child(n){
  width:100% !important;
  margin:0 !important;
  float:none !important;
  clear:none !important;
  display:flex;
}

/* — La carte — */
.et_pb_shop ul.products li.product > a.woocommerce-loop-product__link{
  display:flex;
  flex-direction:column;
  width:100%;
  background:var(--shop-surface);
  border:1px solid var(--shop-bordure);
  border-radius:0;
  text-decoration:none;
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}
.et_pb_shop ul.products li.product > a.woocommerce-loop-product__link:hover{
  border-color:var(--shop-accent);
  box-shadow:0 10px 24px rgba(34,29,24,.10);
  transform:translateY(-3px);
}

/* — Pochette — */
.et_pb_shop ul.products li.product .et_shop_image{display:block;margin:0 !important;}
.et_pb_shop ul.products li.product .et_shop_image img{
  display:block;width:100%;aspect-ratio:1/1;object-fit:cover;
  margin:0 !important;box-shadow:none !important;
}
.et_pb_shop .et_overlay{display:none !important;}

/* — Titres — */
.et_pb_shop ul.products li.product h2.woocommerce-loop-product__title{
  margin:0 !important;
  padding:16px 16px 0 !important;
  font-family:var(--shop-serif);
  font-size:1.06rem !important;
  font-weight:400 !important;
  line-height:1.3;
  color:var(--shop-texte);
}
.et_pb_shop .product-title-main{
  display:block;
  margin-bottom:5px;
  font-family:var(--shop-mono);
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--shop-secondaire);
}
.et_pb_shop .product-title-secondary{display:block;}

/* — Lien « voir les infos » — */
.et_pb_shop .product-info-button-wrapper{
  padding:10px 16px 14px;
  text-align:center !important;
}
.et_pb_shop .product-info-button{
  padding:0;background:none;border:0;border-bottom:1px solid transparent;
  cursor:pointer;
  font-family:var(--shop-mono);
  font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--shop-accent);
  transition:color .2s ease,border-color .2s ease;
}
.et_pb_shop .product-info-button:hover{color:var(--shop-hover);border-bottom-color:currentColor;}

/* — Pastilles de format — */
.et_pb_shop .format-variations-wrapper{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:auto;
  padding:0 16px 16px;
}
.et_pb_shop .format-variations-wrapper:empty{display:none;}
.et_pb_shop .format-variation-item{flex:1 1 90px;}
.et_pb_shop .format-icon-with-price{
  position:relative;
  display:flex;flex-direction:column;align-items:center;
  width:100%;padding:9px 6px;
  background:transparent;
  border:1px solid var(--shop-bordure);
  border-radius:0;
  cursor:pointer;
  transition:border-color .2s ease;
}
.et_pb_shop .format-icon-with-price:hover:not([disabled]){border-color:var(--shop-accent);}
.et_pb_shop .format-icon{
  color:var(--shop-texte) !important;
  font-family:var(--shop-mono);
  font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.3;
}
.et_pb_shop .format-icon br{display:none;}
.et_pb_shop .format-price{
  margin-top:3px;
  font-family:var(--shop-serif);
  font-size:.95rem;
  color:var(--shop-secondaire);
}

/* — Badge « Ajouter » révélé au survol — */
.et_pb_shop .add-to-cart-badge{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;gap:6px;
  background:var(--shop-accent);color:var(--shop-surface);
  font-family:var(--shop-mono);
  font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;
  opacity:0;transition:opacity .2s ease;
}
.et_pb_shop .format-icon-with-price:hover:not([disabled]) .add-to-cart-badge{opacity:1;}
.et_pb_shop .format-icon-with-price.loading .add-to-cart-badge{opacity:1;}

/* — Épuisé — */
.et_pb_shop li.product.outofstock .et_shop_image img{filter:grayscale(.7);opacity:.75;}
.et_pb_shop li.product.outofstock .et_shop_image::after{
  content:"Épuisé";
  position:absolute;top:12px;left:12px;
  padding:4px 10px;
  background:var(--shop-texte);color:var(--shop-surface);
  font-family:var(--shop-mono);
  font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
}
.et_pb_shop .format-variation-item.out-of-stock .format-icon-with-price{
  border-style:dashed;opacity:.5;cursor:not-allowed;
}
.et_pb_shop .format-variation-item.out-of-stock .format-price{text-decoration:line-through;}

@media (max-width:600px){
  .et_pb_shop ul.products,
  .et_pb_shop ul.products[class*="columns-"]{
    grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
    gap:16px;
  }
}


/* ==========================================================================
   LDDP · Vidéos produit
   ========================================================================== */

.lddp-videos{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:20px;
  margin:0 0 32px;
}
.lddp-videos[data-nb="1"]{grid-template-columns:minmax(0,720px);}

.lddp-video{margin:0;}
.lddp-video__facade,
.lddp-video iframe{
  display:block;width:100%;aspect-ratio:16/9;
  border:1px solid #E4DBC9;border-radius:0;
}
.lddp-video__facade{
  position:relative;padding:0;background:#221D18;cursor:pointer;overflow:hidden;
}
.lddp-video__facade img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:opacity .25s ease;
}
.lddp-video__facade:hover img{opacity:.75;}
.lddp-video__play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;justify-content:center;
  width:62px;height:62px;
  background:#8C3B2E;color:#FBF7EE;
  transition:background .2s ease;
}
.lddp-video__facade:hover .lddp-video__play{background:#B5581E;}
.lddp-video__facade:focus-visible{outline:2px solid #D98E3B;outline-offset:4px;}

.lddp-video__legende{
  margin-top:8px;
  font-family:'Space Mono',ui-monospace,Menlo,monospace;
  font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  color:#7A7166;
}

/* ==========================================================================
   LDDP · images produit
   ========================================================================== */
   
.et-db #et-boc .et-l .lddp-galerie.lddp-galerie ol.flex-control-thumbs.flex-control-nav {
  display: none !important;
}


/* ==========================================================================
   MIGRATION — bloc « CSS personnalisé » des options de thème Divi
   --------------------------------------------------------------------------
   Ce champ n'est ni versionné, ni inclus dans une sauvegarde de fichiers, et
   se perd à la réinitialisation du thème. Le style du catalogue est parti
   dans lddp-boutique/assets/css/lddp-boutique.css ; ne restent ici que la
   palette et les composants transverses.
   ========================================================================== */

/* --------------------------------------------------------------------------
   PALETTE — point d'entrée unique des couleurs du site
   Palette « Décision / achat ». Consommée par lddp-boutique, par
   lddp-panier-popup et par les modules Divi via var().
   -------------------------------------------------------------------------- */

:root {
    --lddp-paper: #F3EDE1;          /* fond crème */
    --lddp-card: #FBF7EE;           /* surface carte */
    --lddp-border: #E4DBC9;         /* bordure discrète */
    --lddp-ink: #221D18;            /* texte principal */
    --lddp-ink-muted: #7A7166;      /* texte secondaire */
    --lddp-accent: #8C3B2E;         /* rouille — accent principal, ce qui est cliquable */
    --lddp-accent-2: #B5581E;       /* ambre — accent secondaire, survol */

    /* État « ajouté au panier ». L'ancien vert #4F7942 sortait de la charte ;
       l'encre marque l'aboutissement sans concurrencer la rouille. */
    --lddp-confirm: #221D18;
    --lddp-confirm-fond: #EDE5D6;   /* crème assombri, fond du bouton confirmé */
}

/* --------------------------------------------------------------------------
   ACCENT TYPOGRAPHIQUE
   Un mot mis en avant dans un texte courant. La couleur suit le contexte :
   la rouille est illisible sur fond sombre, l'ambre sur fond clair.
   -------------------------------------------------------------------------- */

:root {
    --lddp-emphase: #8C3B2E;        /* rouille — contexte clair (7,06:1) */
}

.lddp-sombre {
    --lddp-emphase: #D98E3B;        /* ambre — contexte sombre (7,13:1) */
}

.lddp-accent {
    font-weight: 700;
    color: var(--lddp-emphase);
}
/* --------------------------------------------------------------------------
   AJUSTEMENTS WOOCOMMERCE
   -------------------------------------------------------------------------- */

/* Libellé « Version » du sélecteur de variation : les pictos le rendent
   redondant sur la fiche produit. */
.variations .label { display: none; }

/* Suffixe de prix (mentions de TVA) masqué sur tout le site. */
.woocommerce-price-suffix { display: none; }

/* --------------------------------------------------------------------------
   PAGE D'ACCUEIL — grille de discographie
   La grille porte sur la colonne, pas sur la ligne Divi.
   -------------------------------------------------------------------------- */

.lddp-grid > .et_pb_column {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.lddp-grid .et_pb_image {
    margin: 0;
}

/* aspect-ratio plutôt qu'une hauteur fixe : la pochette est carrée dès le
   premier rendu, sans décalage de mise en page au chargement des images. */
.lddp-grid .et_pb_image img {
    aspect-ratio: 1 / 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
    transition: transform .2s ease;
}

/* --------------------------------------------------------------------------
   PAGE D'ACCUEIL — retournement des pochettes
   -------------------------------------------------------------------------- */

.lddp-flip {
    display: block;
    aspect-ratio: 1 / 1;
    perspective: 1200px;
}

.lddp-flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform .6s ease;
    transform-style: preserve-3d;
}

.lddp-flip-face {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    border-radius: 20px;
    overflow: hidden;
}

.lddp-flip-face img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.lddp-flip-back {
    transform: rotateY(180deg);
}

/* Survol souris uniquement : au tap, un :hover tactile reste « collé » et la
   pochette ne revient jamais sur sa face avant. */
@media (hover: hover) and (pointer: fine) {
    .lddp-flip:hover .lddp-flip-inner {
        transform: rotateY(180deg);
    }
}

/* --------------------------------------------------------------------------
   EN-TÊTE — logo en état collant
   -------------------------------------------------------------------------- */

.et_pb_sticky .et_pb_menu__logo img {
    content: url("/wp-content/uploads/logo_fonce.png");
    width: 100%;
}

.et_pb_menu_0_tb_header .et_pb_menu_inner_container > .et_pb_menu__logo-wrap {
    max-width: 200px !important;
}