/*
 * Theme Name:  Thieuley Child
 * Theme URI:   https://thieuley.com
 * Description: Thème enfant Château Thieuley — WordPress + Elementor Pro + WooCommerce
 * Author:      Château Thieuley
 * Author URI:  https://thieuley.com
 * Template:    hello-elementor
 * Version:     1.0.0
 * Text Domain: thieuley-child
 * License:     Private
 */

/* ============================================================
   POLICES CUSTOM — @font-face
   Fichiers à uploader dans : thieuley-child/assets/fonts/
   ============================================================ */

@font-face {
  font-family: 'D-DIN Condensed';
  src: url('assets/fonts/D-DINCondensed.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'D-DIN Condensed';
  src: url('assets/fonts/D-DINCondensed-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'The Secret Things';
  src: url('assets/fonts/TheSecretThings.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/*
 * ============================================================
 * SOMMAIRE
 * ============================================================
 * 01. Variables locales (compléments aux ct-tokens)
 * 02. Base & reset Hello Elementor
 * 03. Typographie globale Elementor
 * 04. Containers & sections Elementor
 * 05. Widgets Elementor — overrides ciblés
 * 06. Navigation Elementor (nav widget)
 * 07. Boutons Elementor
 * 08. Formulaires Elementor
 * 09. Classes utilitaires .ct-*
 * 10. Responsive
 * ============================================================
 */


/* ============================================================
   01. VARIABLES LOCALES
   Complète ct-tokens.css — valeurs non couvertes par les tokens
   ============================================================ */
:root {
  /* Overrides Hello Elementor spécifiques */
  --e-global-color-primary:    #3D5A3E;
  --e-global-color-secondary:  #8B7355;
  --e-global-color-accent:     #1A1A1A;
  --e-global-color-text:       #5C5C5C;

  --e-global-typography-primary-font-family:   'Cormorant Garamond';
  --e-global-typography-primary-font-weight:   300;
  --e-global-typography-secondary-font-family: 'DM Sans';
  --e-global-typography-secondary-font-weight: 400;
  --e-global-typography-text-font-family:      'DM Sans';
  --e-global-typography-accent-font-family:    'DM Sans';

  /* Z-index Elementor */
  --e-header-z-index: 300;
}


/* ============================================================
   02. BASE & RESET HELLO ELEMENTOR
   ============================================================ */

/* Hello Elementor supprime tous les styles — on réintroduit le strict nécessaire */
html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  color: #1A1A1A;
  background-color: #F7F3EC;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

a {
  color: #3D5A3E;
  text-decoration: none;
  transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
  color: #2A3F2B;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

/* Sélection de texte */
::selection {
  background-color: rgba(61, 90, 62, 0.15);
  color: #1A1A1A;
}


/* ============================================================
   03. TYPOGRAPHIE GLOBALE ELEMENTOR
   Override des typographies générées par Elementor
   ============================================================ */

/* H1–H6 : serif par défaut */
h1, h2, h3, h4,
.elementor-heading-title,
.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3,
.elementor-widget-heading h4 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: #1A1A1A;
}

h5, h6,
.elementor-widget-heading h5,
.elementor-widget-heading h6 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-weight: 500;
  line-height: 1.3;
}

/* Tailles desktop (Elementor peut les surcharger par widget) */
h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
h2 { font-size: clamp(2rem,   4vw, 3.5rem); }
h3 { font-size: clamp(1.5rem, 2.5vw, 2.5rem); }
h4 { font-size: clamp(1.25rem, 2vw, 2rem); }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

/* Texte courant via Elementor text-editor widget */
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.75;
  color: #5C5C5C;
}

/* Italique serif pour les accroche éditoriales */
.elementor-widget-text-editor em,
.ct-italic-serif {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 1.15em;
}

/* Eyebrow / label */
.ct-eyebrow,
.elementor-widget-heading.ct-eyebrow .elementor-heading-title {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #8B7355;
  line-height: 1;
}


/* ============================================================
   04. CONTAINERS & SECTIONS ELEMENTOR
   ============================================================ */

/* Container global */
.elementor-container {
  max-width: 1320px;
}

/* Section standard — padding genereux */
.elementor-section .elementor-container,
.e-con {
  padding-left: clamp(1.25rem, 4vw, 3rem);
  padding-right: clamp(1.25rem, 4vw, 3rem);
}

/* Classe utilitaire pour sections pleine largeur sans gutter */
.elementor-section.ct-fullwidth > .elementor-container {
  max-width: 100%;
  padding-left: 0 !important;  /* Override Elementor inline style — autorisé */
  padding-right: 0 !important;
}

/* Padding section par défaut (Elementor peut surcharger par section) */
.elementor-section.elementor-top-section {
  padding-top: clamp(4rem, 8vw, 7rem);
  padding-bottom: clamp(4rem, 8vw, 7rem);
}

/* Section sur fond ivoire */
.elementor-section.ct-bg-ivoire {
  background-color: #F7F3EC;
}

/* Section sur fond ivoire alt */
.elementor-section.ct-bg-alt {
  background-color: #EDE8DF;
}

/* Section sur fond primaire */
.elementor-section.ct-bg-primary {
  background-color: #3D5A3E;
}

/* Section sur fond sombre */
.elementor-section.ct-bg-dark {
  background-color: #1A1A1A;
}

/* Alignement vertical colonnes */
.elementor-section.ct-col-vcenter > .elementor-container > .elementor-row {
  align-items: center;
}

/* Suppression du padding Elementor par défaut quand .ct-section-no-pad */
/* !important — nécessaire pour surcharger le CSS inline d'Elementor */
.elementor-section.ct-section-no-pad,
.elementor-section.ct-section-no-pad > .elementor-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


/* ============================================================
   05. WIDGETS ELEMENTOR — OVERRIDES CIBLÉS
   ============================================================ */

/* --- Image widget --- */
.elementor-widget-image img {
  border-radius: 0;
  display: block;
}

/* --- Divider widget --- */
.elementor-widget-divider .elementor-divider-separator {
  border-color: #D9D3C8;
}

.elementor-widget-divider.ct-divider-accent .elementor-divider-separator {
  border-color: #8B7355;
  border-width: 1px;
  width: 40px;
}

/* --- Icon Box widget --- */
.elementor-widget-icon-box .elementor-icon {
  color: #8B7355;
}

.elementor-widget-icon-box .elementor-icon-box-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
}

/* --- Testimonial / Quote widget --- */
.elementor-widget-testimonial .elementor-testimonial-content {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 1.5rem;
  line-height: 1.7;
  color: #1A1A1A;
}

.elementor-widget-testimonial .elementor-testimonial-name {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #8B7355;
}

/* --- Counter widget --- */
.elementor-widget-counter .elementor-counter-number-wrapper {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  color: #3D5A3E;
}

/* --- Progress bar --- */
.elementor-widget-progress .elementor-progress-bar {
  background-color: #3D5A3E;
  border-radius: 0;
}

/* --- Tabs widget --- */
.elementor-widget-tabs .elementor-tab-title {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.elementor-widget-tabs .elementor-tab-title.elementor-active {
  color: #3D5A3E;
  border-bottom-color: #3D5A3E;
}

/* --- Accordion widget --- */
.elementor-widget-accordion .elementor-accordion-title {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-weight: 500;
}

/* --- Alert widget --- */
.elementor-widget-alert {
  border-radius: 0;
  border-left: 3px solid #3D5A3E;
  background-color: #EFF3EF;
}


/* ============================================================
   06. NAVIGATION ELEMENTOR (Nav Menu widget)
   ============================================================ */

/* Menu desktop */
.elementor-nav-menu .elementor-item {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Dropdown */
.elementor-nav-menu--dropdown .elementor-item {
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.03em;
  text-transform: none;
}

/* Indicateur actif */
.elementor-nav-menu .elementor-item.elementor-item-active,
.elementor-nav-menu .elementor-item:focus,
.elementor-nav-menu .elementor-item:hover {
  color: #8B7355;
}


/* ============================================================
   07. BOUTONS ELEMENTOR
   Override du Button widget pour adopter nos styles
   ============================================================ */

.elementor-widget-button .elementor-button {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: 1px;
  padding: 0.875rem 2rem;
  transition: background-color 0.25s ease, color 0.25s ease,
              border-color 0.25s ease, transform 0.15s ease;
  line-height: 1;
}

.elementor-widget-button .elementor-button:hover {
  transform: translateY(-1px);
}

/* Variante Primary (couleur primaire définie dans Elementor Global Colors) */
.elementor-widget-button .elementor-button-primary {
  background-color: #3D5A3E;
  border-color: #3D5A3E;
  color: #FFFFFF;
}

.elementor-widget-button .elementor-button-primary:hover {
  background-color: #2A3F2B;
  border-color: #2A3F2B;
}

/* Variante Ghost */
.elementor-widget-button .elementor-button.ct-btn-ghost {
  background: transparent;
  color: #3D5A3E;
  border: 1px solid #3D5A3E;
}

.elementor-widget-button .elementor-button.ct-btn-ghost:hover {
  background: #3D5A3E;
  color: #FFFFFF;
}

/* Variante M&S — pill terracotta */
.elementor-widget-button .elementor-button.ct-btn-ms {
  background-color: #C47B5A;
  border-color: #C47B5A;
  color: #FFFFFF;
  border-radius: 999px;
}

.elementor-widget-button .elementor-button.ct-btn-ms:hover {
  background-color: #A05E3E;
  border-color: #A05E3E;
}

/* Variante CSA — carré, outline or */
.elementor-widget-button .elementor-button.ct-btn-csa {
  background: transparent;
  color: #C4A862;
  border: 1px solid #C4A862;
  border-radius: 0;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 0.875rem;
  letter-spacing: 0.25em;
}

.elementor-widget-button .elementor-button.ct-btn-csa:hover {
  background: #C4A862;
  color: #1A2B1A;
}


/* ============================================================
   08. FORMULAIRES ELEMENTOR (Form widget)
   ============================================================ */

.elementor-form .elementor-field-group label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: #1A1A1A;
  margin-bottom: 0.375rem;
}

.elementor-form .elementor-field {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.9375rem;
  color: #1A1A1A;
  background-color: #FFFFFF;
  border: 1px solid #D9D3C8;
  border-radius: 1px;
  padding: 0.875rem 1rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  outline: none;
}

.elementor-form .elementor-field:focus {
  border-color: #3D5A3E;
  box-shadow: 0 0 0 3px rgba(61, 90, 62, 0.1);
}

.elementor-form .elementor-field::placeholder {
  color: #8A8A8A;
}

.elementor-form .elementor-button {
  background-color: #3D5A3E;
  color: #FFFFFF;
  border: none;
  border-radius: 1px;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.875rem 2rem;
  cursor: pointer;
  transition: background-color 0.25s;
}

.elementor-form .elementor-button:hover {
  background-color: #2A3F2B;
}


/* ============================================================
   09. CLASSES UTILITAIRES .ct-*
   Classes Elementor custom (CSS Classes field dans chaque widget)
   ============================================================ */

/* Textes */
.ct-text-accent  { color: #8B7355; }
.ct-text-primary { color: #3D5A3E; }
.ct-text-muted   { color: #5C5C5C; }
.ct-text-white   { color: #FFFFFF; }
.ct-text-center  { text-align: center; }

/* Règle décorative */
.ct-rule {
  display: block;
  width: 40px;
  height: 1px;
  background-color: #8B7355;
  margin: 1.25rem 0;
}

.ct-rule--center {
  margin-left: auto;
  margin-right: auto;
}

/* Overlay sombre pour sections avec image de fond */
.elementor-section.ct-overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(26, 26, 26, 0.45);
  z-index: 0;
}

.elementor-section.ct-overlay > .elementor-container {
  position: relative;
  z-index: 1;
}

/* Radius carte */
.ct-radius-card { border-radius: 4px; overflow: hidden; }
.ct-radius-none { border-radius: 0; }

/* Espacement */
.ct-mt-0  { margin-top: 0 !important; }
.ct-mb-0  { margin-bottom: 0 !important; }
.ct-mb-lg { margin-bottom: 3rem !important; }

/* Polices custom */
.ct-font-din {
  font-family: 'D-DIN Condensed', system-ui, sans-serif;
}

.ct-font-script {
  font-family: 'The Secret Things', cursive;
}

/* Badges sous-marque (utilisables dans HTML widget Elementor) */
.ct-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 2px;
  line-height: 1;
}

.ct-badge--thieuley {
  background-color: #EFF3EF;
  color: #2A3F2B;
}

.ct-badge--csa {
  background-color: #1A2B1A;
  color: #C4A862;
}

.ct-badge--ms {
  background-color: #F5EAE3;
  color: #A05E3E;
}

.ct-badge--appellation {
  background-color: #F0EBE2;
  color: #6B5640;
}


/* ============================================================
   10. RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .elementor-section.elementor-top-section {
    padding-top: clamp(3rem, 6vw, 5rem);
    padding-bottom: clamp(3rem, 6vw, 5rem);
  }
}

@media (max-width: 767px) {
  h1 { font-size: clamp(2rem, 7vw, 2.75rem); }
  h2 { font-size: clamp(1.625rem, 5.5vw, 2.25rem); }
  h3 { font-size: clamp(1.25rem, 4vw, 1.75rem); }

  .elementor-section.elementor-top-section {
    padding-top: clamp(2.5rem, 8vw, 3.5rem);
    padding-bottom: clamp(2.5rem, 8vw, 3.5rem);
  }

  .elementor-container {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}


/* ============================================================
   11. CT-CARD — Loop card WooCommerce (content-product.php)
   Utilisé par archives, shortcodes et Elementor Loop Grid.
   ============================================================ */

.ct-card {
  position: relative;
  background: #FFFFFF;
  border-radius: 2px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
}

.ct-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.09);
}

.ct-card__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
}

/* Thumbnail */
.ct-card__thumb {
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 4;
}

.ct-card__img,
.ct-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.ct-card:hover .ct-card__img,
.ct-card:hover .ct-card__thumb img {
  transform: scale(1.04);
}

.ct-card__img--placeholder {
  background: #EDE9E0;
}

/* Badge marque — positionné en haut à gauche de l'inner */
.ct-card__inner .ct-loop-badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 2;
  pointer-events: none;
}

/* Promo badge — en haut à droite */
.ct-loop-badge--sale {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  left: auto !important;
  background: #B94A3B;
  color: #FFFFFF;
  border-radius: 2px;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.25rem 0.5rem;
  z-index: 2;
}

/* Corps texte */
.ct-card__body {
  padding: 1rem 1rem 0.5rem;
  flex: 1;
}

.ct-card__appellation {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8B7355;
  margin: 0 0 0.35rem;
}

.ct-card__title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.3;
  color: #1A1A1A;
  margin: 0 0 0.35rem;
}

.ct-card__title a {
  color: inherit;
  text-decoration: none;
}

.ct-card__title a:hover {
  color: #3D5A3E;
}

.ct-card__millesime {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.8125rem;
  color: #9B9B9B;
  margin: 0 0 0.5rem;
}

/* Prix */
.ct-card__price .price {
  font-family: 'DM Sans', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: #3D5A3E;
}

.ct-card__price .price del {
  color: #AAAAAA;
  font-size: 0.875em;
  margin-right: 0.25rem;
}

.ct-card__price .price ins {
  text-decoration: none;
}

/* Footer carte : bouton ATC */
.ct-card__footer {
  padding: 0 1rem 1rem;
}

.ct-card__footer .button,
.ct-card__footer a.button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  background: #3D5A3E;
  color: #FFFFFF;
  border-radius: 1px;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.ct-card__footer .button:hover,
.ct-card__footer a.button:hover {
  background: #2F4530;
}

/* Variante CSA : fond sombre + texte or */
.product_cat-clos-sainte-anne .ct-card__footer .button,
.product_cat-clos-sainte-anne .ct-card__footer a.button {
  background: #1E2D1F;
  color: #C4A862;
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.8125rem;
  letter-spacing: 0.14em;
}

.product_cat-clos-sainte-anne .ct-card__footer .button:hover,
.product_cat-clos-sainte-anne .ct-card__footer a.button:hover {
  background: #152214;
}

/* Variante M&S : pill terracotta */
.product_cat-ms-courselle .ct-card__footer .button,
.product_cat-ms-courselle .ct-card__footer a.button {
  background: #C47B5A;
  color: #FFFFFF;
  border-radius: 100px;
}

.product_cat-ms-courselle .ct-card__footer .button:hover,
.product_cat-ms-courselle .ct-card__footer a.button:hover {
  background: #A8624A;
}

/* Étoiles de notation */
.ct-card .star-rating {
  font-size: 0.75em;
  color: #C4A862;
  margin-bottom: 0.35rem;
}

/* Responsive : 2 col sur tablette, 1 col sur mobile géré par woocommerce.css */