/* =========================================================
   Elementor — Lauxane Home (tokens-based)
   Dépend de: assets/css/bundle.css (tokens.css)
   ========================================================= */

/* 🎨 Variables Elementor (mappées sur nos tokens) */
:root{
  --elementor-primary-color: var(--gold);
  --elementor-secondary-color: var(--gold-strong);
  --elementor-text-color: var(--ink);
  --elementor-bg-color: var(--panel);
}

/* =========================
   TYPO / TITRES / TEXTES
   ========================= */
body,
.elementor-widget,
.elementor-section,
.elementor-column{
  font-family: var(--body-font, system-ui, -apple-system, "Segoe UI", Inter, Helvetica, Arial);
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink);
}

.elementor-heading-title,
.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3,
.elementor-widget-heading h4,
.elementor-widget-heading h5,
.elementor-widget-heading h6{
  font-family: var(--heading-font, "Cormorant Garamond", Georgia, "Times New Roman", serif) !important;
  color: var(--gold) !important;
  text-transform: none;
  letter-spacing: -.008em;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 16px;
}

.elementor-widget-heading h1{ font-size: 36px }
.elementor-widget-heading h2{ font-size: 30px }
.elementor-widget-heading h3{ font-size: 24px } /* garde H3 lisible */
.elementor-widget-heading h4{ font-size: 20px }
.elementor-widget-heading h5{ font-size: 18px }
.elementor-widget-heading h6{ font-size: 16px }

/* Textes & liens dans Éditeur de texte */
.elementor-widget-text-editor,
.elementor-widget-text-editor p{ color: var(--ink); font-size: 16px }
.elementor-widget-text-editor a,
.elementor-widget a{
  color: var(--gold);
  font-weight: 600;
  text-decoration: none;
  transition: color .2s ease, text-decoration-color .2s ease;
}
.elementor-widget a:hover{
  color: var(--gold-strong);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* =========================
   BOUTONS (btn-stroke)
   ========================= */
.elementor-button,
.elementor-button-link{
  background:#fff !important;
  color: var(--cta-stroke) !important;
  border: 1.5px solid var(--cta-stroke) !important;
  border-radius: 999px !important;
  padding: 10px 24px !important;
  font: 600 14px/1 ui-sans-serif, system-ui, Inter, Helvetica, Arial !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  box-shadow: none !important;
  transition: background .18s ease, color .18s ease, border-color .18s ease !important;
}
.elementor-button:hover,
.elementor-button:focus{
  background: color-mix(in srgb, var(--gold) 12%, #fff 88%) !important;
  color: var(--cta-stroke-hover) !important;
  border-color: var(--cta-stroke-hover) !important;
  text-decoration: none !important;
}
.elementor-button:focus-visible{
  outline: 0 !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
}

/* Texte interne du bouton */
.elementor-button .elementor-button-text{
  color: inherit !important;
  text-transform: none !important;
  font-weight: 600 !important;
}

/* =========================
   ENCARTS / BADGES / ICONES
   ========================= */
.elementor-element.lauxane-gold-box,
.elementor-section.lauxane-gold-box,
.elementor-column.lauxane-gold-box{
  background: color-mix(in srgb, var(--champagne) 60%, #fff 40%);
  border: 1.5px solid var(--gold);
  border-radius: 12px;
  padding: 24px;
  box-shadow: var(--shadow);
  text-align: center;
}

.lauxane-gold-badge{
  background: var(--gold);
  color:#fff;
  font-size: 12.5px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 999px;
  letter-spacing: .04em;
  text-transform: uppercase;
  display:inline-block;
}

.elementor-icon i,
.elementor-icon svg{
  color: var(--gold);
  transition: color .2s ease;
}
.elementor-icon:hover i,
.elementor-icon:hover svg{ color: var(--gold-strong) }

/* =========================
   IMAGES / GALERIES
   ========================= */
.elementor-widget-image img{
  border-radius: 12px;
  max-width:100%; height:auto;
  box-shadow: var(--shadow);
  transition: transform .25s ease;
}
.elementor-widget-image:hover img{ transform: scale(1.02) }

.elementor-gallery-item img{
  border-radius: 8px;
  box-shadow: var(--shadow);
  transition: transform .25s ease;
}
.elementor-gallery-item:hover img{ transform: scale(1.03) }

/* =========================
   DIVISEURS / LISTES / ICON LIST
   ========================= */
.elementor-widget-divider .elementor-divider-separator{
  border-top: 1px solid color-mix(in srgb, var(--gold) 40%, #000 60%);
  opacity: .6;
  margin: 24px 0;
}
.elementor-widget-icon-list .elementor-icon-list-item{ color: var(--ink); font-size: 16px }
.elementor-widget-icon-list .elementor-icon-list-icon i,
.elementor-widget-icon-list .elementor-icon-list-icon svg{
  color: var(--gold); font-size: 18px;
}

/* =========================
   ACCORDÉONS / TABS
   ========================= */
.elementor-accordion .elementor-accordion-item,
.elementor-tabs .elementor-tab-title{
  border-bottom: 1px solid color-mix(in srgb, var(--gold) 35%, #000 65%);
}
.elementor-accordion .elementor-tab-title a,
.elementor-accordion-title,
.elementor-tab-title{
  color: var(--gold);
  font-weight: 600;
  font-size: 16px;
}

/* =========================
   FORMULAIRES
   ========================= */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select{
  width:100%;
  background:#fff;
  color: var(--ink);
  border:1px solid color-mix(in srgb, var(--gold) 35%, #000 65%);
  border-radius: 8px;
  padding: 10px 14px;
  font: 400 14px/1.4 var(--body-font, system-ui, -apple-system, "Segoe UI", Inter, Helvetica, Arial);
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, textarea:focus, select:focus{
  outline:0;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px var(--ring);
}
input::placeholder, textarea::placeholder{ color:#A8A8A8; font-style: italic }

/* =========================
   SLIDERS / NAV FLECHES
   ========================= */
.elementor-swiper-button{
  width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#fff; color: var(--gold);
  border:1px solid var(--gold);
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.elementor-swiper-button:hover{
  background: var(--gold); color:#fff; border-color: var(--gold);
}

/* =========================
   SECTIONS BOXÉES
   ========================= */
.elementor-section.elementor-section-boxed{
  max-width: var(--maxw, 1180px);
  margin: 0 auto;
  padding-left: clamp(16px,4vw,48px);
  padding-right: clamp(16px,4vw,48px);
  box-sizing: border-box;
}
.elementor-section,
.elementor-column{ padding: 24px 0 }

/* =========================
   TABLEAUX DE PRIX
   ========================= */
.elementor-price-table{
  border: 1px solid var(--gold);
  border-radius: 12px;
  background: color-mix(in srgb, var(--champagne) 55%, #fff 45%);
  box-shadow: var(--shadow);
  padding: 24px; text-align:center;
  transition: transform .2s ease, box-shadow .2s ease;
}
.elementor-price-table:hover{ transform: translateY(-4px) }
.elementor-price-table__heading{
  font-family: var(--heading-font); color: var(--gold);
  font-size: 24px; font-weight: 700; margin-bottom: 8px; text-transform: uppercase;
}
.elementor-price-table__price{ font-size: 36px; font-weight: 700; color: var(--ink); margin-bottom: 16px }
.elementor-price-table__features-list{ list-style:none; margin:0 0 16px; padding:0 }
.elementor-price-table__features-list li{
  padding:8px 0; border-bottom:1px solid color-mix(in srgb, var(--gold) 20%, #000 80%);
  font-size: 15px; color: var(--ink);
}

/* =========================
   COMPTEURS / CHIFFRES
   ========================= */
.elementor-counter-number{
  font-family: var(--heading-font);
  font-size:40px; font-weight:700; color: var(--gold);
}
.elementor-counter-title{
  font-size:16px; color: var(--ink);
  text-transform: uppercase; letter-spacing:.04em;
}

/* =========================
   TÉMOIGNAGES
   ========================= */
.elementor-testimonial-content{
  font-size: 16px; color: var(--ink);
  font-style: italic; line-height: 1.6;
}
.elementor-testimonial-name{
  font-weight:700; color: var(--gold);
  margin-top:12px; font-size:15px; text-transform: uppercase; letter-spacing:.03em;
}
.elementor-testimonial-job{ font-size:13px; color: color-mix(in srgb, var(--ink) 55%, #000 45%) }

/* =========================
   FLIP BOX
   ========================= */
.elementor-flip-box{
  border:1px solid var(--gold);
  border-radius:12px; overflow:hidden;
  background: color-mix(in srgb, var(--champagne) 55%, #fff 45%);
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease;
}
.elementor-flip-box__front,
.elementor-flip-box__back{
  padding:24px; color: var(--ink);
}
.elementor-flip-box__back{ background: var(--gold); color:#fff }
.elementor-flip-box__heading{
  font-family: var(--heading-font); font-size:20px; color: var(--gold); text-transform: uppercase;
}
.elementor-flip-box__description{ font-size:15px; color: var(--ink) }

/* =========================
   POPUP (Elementor Pro)
   ========================= */
body.elementor-popup-active .dialog-widget-content{
  border:1.5px solid var(--gold);
  border-radius:14px; background: color-mix(in srgb, var(--champagne) 60%, #fff 40%);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.elementor-popup-modal .elementor-widget-heading h2,
.elementor-popup-modal .elementor-widget-heading h3{
  color: var(--gold) !important;
  font-family: var(--heading-font);
}
.elementor-popup-modal .elementor-button{
  background: var(--gold) !important; color:#fff !important; border: none !important;
}
.elementor-popup-modal .elementor-button:hover{
  background: var(--gold-strong) !important; color:#fff !important;
}

/* =========================
   PROGRESS BARS
   ========================= */
.elementor-progress-wrapper{
  background: color-mix(in srgb, var(--champagne) 70%, #fff 30%);
  border-radius: 30px; overflow: hidden;
}
.elementor-progress-bar{
  background: var(--gold); height:8px; border-radius: 30px;
  transition: width .6s ease;
}
.elementor-progress-text{
  font-weight:600; color: var(--ink); font-size:14px; margin-top:6px; text-align:left;
}

/* =========================
   ANCRES / INTERACTIONS
   ========================= */
.elementor-menu-anchor{ scroll-margin-top: 120px }
.elementor-widget:hover{ transition: all .2s ease-in-out }

/* =========================
   BACKGROUND VIDEO
   ========================= */
.elementor-background-video-container{
  position:absolute; inset:0; width:100% !important; height:100% !important;
  z-index:0; overflow:hidden;
}
.elementor-background-video-hosted{
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important;
  object-fit: cover !important; object-position: center !important;
  z-index:-1;
}
.elementor-element{ position: relative }

/* =========================
   RTE Elementor : liens lisibles par défaut 
   ========================= */
.elementor-widget-text-editor a{
  text-decoration: underline;
  text-underline-offset: 3px;
}
.elementor-widget-text-editor a:hover{
  text-decoration-color: currentColor;
}

/* =========================
   Focus clair et cohérent 
   ========================= */

.elementor a:focus-visible,
.elementor-button:focus-visible{
  outline: 2px solid var(--ring);
  outline-offset: 3px;
  border-radius: 6px;
  box-shadow: none !important;
}

@supports not (color: color-mix(in srgb, #000 50%, #fff 50%)){
  .elementor-widget-divider .elementor-divider-separator{ border-top-color: var(--gold); }
  input, textarea, select{ border-color: var(--gold); }
  .woocommerce-ordering{ border-color: var(--gold); background:#fff; }
}

/* au lieu de all: unset; */
.woocommerce ul.products li.product{
  list-style: none; /* garde la sémantique li */
  margin: 0; padding: 0; border: 0; background: transparent;
  display:flex; flex-direction:column; align-items:center;
  width:100%; position:relative; overflow:hidden; cursor:pointer;
  border-radius:12px; box-shadow: 0 2px 6px rgba(0,0,0,.04);
  transition: transform .35s ease, box-shadow .35s ease, background-color .35s ease, border-color .35s ease;
}


@media (prefers-reduced-motion: reduce){
  .elementor-widget-image img,
  .elementor-gallery-item img,
  .woocommerce ul.products li.product,
  .woocommerce ul.products li.product img{
    transition: none !important;
    transform: none !important;
  }
}

@supports not (aspect-ratio: 2/3){
  .woocommerce ul.products li.product img{
    height: auto; /* laisse l’image gérer sa hauteur */
  }
}

:root[data-theme="dark"]{
  --elementor-primary-color: var(--gold);
  --elementor-secondary-color: var(--gold-strong);
  --elementor-text-color: var(--text-900);
  --elementor-bg-color: #1a1a1a;
}
/* Lisibilité des composants clés côté Woo */
:root[data-theme="dark"] .woocommerce-breadcrumb,
:root[data-theme="dark"] .woocommerce-ordering select{
  color: var(--gold);
}

.elementor-accordion .elementor-tab-title{ outline: none; }
.elementor-accordion .elementor-tab-title:focus-visible{
  outline: 2px solid var(--ring);
  outline-offset: 3px;
  border-radius: 6px;
}