/* ==========================================================================
   Deukeundo — identité visuelle
   Palette tirée du logo : dégradé orange → magenta → violet.
   Les surcharges d'Astra (polices, couleurs de l'en-tête) sont dans functions.php.
   ========================================================================== */

:root {
	--dkd-violet: #5B2D8C;
	--dkd-magenta: #B3358F;
	--dkd-orange: #F37B3B;
	--dkd-encre: #1F1B2E;
	--dkd-texte: #4B4A57;
	--dkd-lilas: #F5EFFA;
	--dkd-bord: #E4DAEE;
	--dkd-degrade: linear-gradient(135deg, #F37B3B 0%, #B3358F 55%, #5B2D8C 100%);
	--dkd-ombre: 0 10px 30px rgba(91, 45, 140, 0.12);
	--dkd-ombre-forte: 0 18px 44px rgba(91, 45, 140, 0.22);
	--dkd-rayon: 22px;
}

body {
	color: var(--dkd-texte);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	letter-spacing: -0.01em;
}

a {
	transition: color 0.2s ease;
}

/* --- En-tête et menu ----------------------------------------------------- */

.site-header {
	border-bottom: 3px solid transparent;
	border-image: var(--dkd-degrade) 1;
	box-shadow: 0 4px 22px rgba(31, 27, 46, 0.07);
}

.main-header-menu .menu-link {
	border-radius: 999px;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.main-header-menu .menu-item:hover > .menu-link,
.main-header-menu .current-menu-item > .menu-link {
	background-color: var(--dkd-lilas);
}

/* --- Page d'accueil ------------------------------------------------------- */

/* Le titre « Accueil » reste pour les moteurs de recherche, sans s'afficher. */
.home .entry-header {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Surtitre : « Deukeundo — Agence de voyage & Multiservices à Thiès » */
body .elementor .elementor-element-ef435f8 {
	align-items: center;
	justify-content: center;
	padding: 40px 16px 0;
}

body .elementor .elementor-element-ef435f8 .e-heading-base {
	background: none;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dkd-magenta);
}

/* Accroche : « Cliquez sur l'image… » */
body .elementor .elementor-element-3484788 {
	align-items: center;
	padding: 8px 16px 20px;
}

body .elementor .elementor-element-3484788 .e-heading-base {
	max-width: 780px;
	background: none;
	font-family: 'Poppins', sans-serif;
	font-size: clamp(24px, 3.2vw, 36px);
	font-weight: 600;
	line-height: 1.25;
	color: var(--dkd-encre);
}

body .elementor .elementor-element-3484788 .e-heading-base::after,
body .elementor .elementor-element-3a334e9 .e-heading-base::after {
	content: '';
	display: block;
	width: 72px;
	height: 4px;
	margin: 18px auto 0;
	border-radius: 4px;
	background: var(--dkd-degrade);
}

/* Cartes de services : images */
body .elementor .e-grid > .e-con-inner {
	gap: 32px 40px;
	padding-inline: 16px;
}

body .elementor .e-grid .e-image-link-base {
	display: block;
	overflow: hidden;
	background: #fff;
	border-radius: var(--dkd-rayon);
	box-shadow: var(--dkd-ombre);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

body .elementor .e-grid .e-image-link-base:hover,
body .elementor .e-grid .e-image-link-base:focus-visible {
	transform: translateY(-6px);
	box-shadow: var(--dkd-ombre-forte);
}

body .elementor .e-grid .e-image-base {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: contain;
}

/* Cartes de services : légendes sous les images */
body .elementor .e-grid .e-heading-base {
	background: none;
	font-family: 'Poppins', sans-serif;
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	color: var(--dkd-violet);
}

body .elementor .e-grid .e-heading-base::after {
	content: '';
	display: block;
	width: 40px;
	height: 3px;
	margin: 10px auto 0;
	border-radius: 3px;
	background: var(--dkd-orange);
}

/* Séparateurs : un filet discret à la place des grands espaces vides */
body .elementor .e-divider-base {
	height: 1px;
	border: 0;
	background: linear-gradient(90deg, transparent, var(--dkd-bord), transparent);
}

body .elementor .e-flexbox-base:has(> .e-divider-base) {
	padding-block: 28px;
}

/* Titre de section : « SERVICES DIVERS » */
body .elementor .elementor-element-3a334e9 {
	align-items: center;
	padding-bottom: 12px;
}

body .elementor .elementor-element-3a334e9 .e-heading-base {
	background: none;
	font-family: 'Poppins', sans-serif;
	font-size: clamp(26px, 3vw, 38px);
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: center;
	color: var(--dkd-encre);
}

/* Visuels de la section « Services divers » : mêmes arrondis */
body .elementor .e-flexbox-base .e-image-base {
	border-radius: var(--dkd-rayon);
}

/* Section « Transfert d'argent » (widget titre classique) */
body .elementor .elementor-widget-heading .elementor-heading-title {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: var(--dkd-violet);
}

/* Logos de transfert d'argent : mêmes coins arrondis que les cartes */
body .elementor .elementor-element-4e6577a .e-image-base {
	border-radius: var(--dkd-rayon);
}

/* Mobile : les légendes sont dans une grille séparée des images, elles se
   retrouveraient toutes après les deux images. On les masque et on affiche
   la légende sous chaque image (le texte est donc doublé ici : à modifier
   aussi si les légendes changent dans Elementor). */
@media (max-width: 767px) {
	body .elementor .e-grid > .e-con-inner {
		gap: 20px;
	}

	body .elementor .elementor-element-575e7f0,
	body .elementor .elementor-element-a97d678 {
		display: none;
	}

	body .elementor .e-grid .e-image-link-base {
		text-decoration: none;
	}

	body .elementor .e-image-link-base::after {
		display: block;
		padding: 14px 0 18px;
		font-family: 'Poppins', sans-serif;
		font-size: 20px;
		font-weight: 600;
		text-align: center;
		color: var(--dkd-violet);
	}

	body .elementor a[data-interaction-id="82a298b"]::after { content: 'Fournitures'; }
	body .elementor a[data-interaction-id="0888049"]::after { content: 'Accessoires'; }
	body .elementor a[data-interaction-id="38a4b10"]::after { content: 'Agence de voyage'; }
	body .elementor a[data-interaction-id="c4405b6"]::after { content: 'Location voiture'; }
}

/* --- Pages intérieures ---------------------------------------------------- */

.page:not(.home) .entry-header .entry-title {
	text-align: center;
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 700;
	color: var(--dkd-encre);
}

.page:not(.home) .entry-header .entry-title::after {
	content: '';
	display: block;
	width: 72px;
	height: 4px;
	margin: 16px auto 0;
	border-radius: 4px;
	background: var(--dkd-degrade);
}

/* Paragraphes d'introduction (saisis dans un widget titre) */
body .elementor .e-flexbox-base > h2.e-heading-base:not(:only-of-type),
body .elementor .elementor-element-f33f589 .e-heading-base {
	max-width: 820px;
	margin-inline: auto;
	background: none;
	font-family: 'Inter', sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.7;
	text-align: center;
	color: var(--dkd-texte);
}

body .elementor .elementor-element-f33f589 .e-heading-base strong {
	display: inline-block;
	margin-top: 10px;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: var(--dkd-violet);
}

/* --- Formulaires intégrés (agence de voyage, location…) ---------------------
   Chaque formulaire est un bloc HTML qui définit ses propres variables
   (marine / or). On les remplace par la palette du logo. */
html:root {
	--navy: #3B1F66;
	--navy-deep: #2A1B4D;
	--sand: #F5EFFA;
	--gold: #F37B3B;
	--gold-soft: #B3358F;
	--ink: #1F1B2E;
	--line: #E4DAEE;
}

/* Le texte du formulaire était prévu pour un fond marine : on le rend lisible sur blanc. */
body .elementor .header p {
	color: var(--dkd-texte);
}

body .elementor .header .eyebrow {
	color: var(--dkd-magenta);
}

body .elementor .header h1,
body .elementor .card legend {
	font-family: 'Poppins', sans-serif;
	color: var(--dkd-encre);
}

body .elementor .card {
	background: #fff;
	border-radius: var(--dkd-rayon);
	border-top-width: 5px;
	border-image: var(--dkd-degrade) 1;
	border-radius: 0 0 var(--dkd-rayon) var(--dkd-rayon);
	box-shadow: var(--dkd-ombre-forte);
}

body .elementor .card input:focus,
body .elementor .card select:focus,
body .elementor .card textarea:focus {
	border-color: var(--dkd-violet);
	box-shadow: 0 0 0 3px rgba(91, 45, 140, 0.15);
	outline: none;
}

body .elementor .card button[type='submit'],
body .elementor .card .btn,
body .elementor .card button {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: #fff;
	background: var(--dkd-degrade);
	border: 0;
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(179, 53, 143, 0.3);
}

/* Les blocs HTML intégrés définissent un « body { padding } » qui s'applique à tout le site. */
body.page,
body.woocommerce-page {
	padding: 0;
}

/* Astra impose sa couleur de titre aux <h1> du contenu : on rend le blanc au bandeau du formulaire de location. */
.entry-content .card-head h1 {
	color: #fff;
}

/* Réglages globaux d'Elementor (texte, polices) alignés sur la charte */
body.elementor-kit-17 {
	--e-global-color-text: var(--dkd-texte);
	--e-global-color-primary: var(--dkd-violet);
	--e-global-color-secondary: var(--dkd-magenta);
	--e-global-color-accent: var(--dkd-orange);
	--e-global-typography-primary-font-family: 'Poppins';
	--e-global-typography-secondary-font-family: 'Poppins';
	--e-global-typography-text-font-family: 'Inter';
	--e-global-typography-accent-font-family: 'Inter';
}

/* --- Boutique WooCommerce -------------------------------------------------- */

.woocommerce-page .site-content > .ast-container {
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 24px;
}

.woocommerce-page .site-content > .ast-container {
	padding-top: 24px;
}

.woocommerce-page .woocommerce-breadcrumb {
	font-size: 14px;
	color: var(--dkd-texte);
}

.woocommerce-page .woocommerce-products-header__title,
.woocommerce-page h1.entry-title {
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 700;
	color: var(--dkd-encre);
}

.woocommerce ul.products {
	gap: 28px;
}

.woocommerce ul.products li.product-category,
.woocommerce ul.products li.product {
	overflow: hidden;
	border-radius: var(--dkd-rayon);
	box-shadow: var(--dkd-ombre);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.woocommerce ul.products li.product-category:hover,
.woocommerce ul.products li.product:hover {
	transform: translateY(-6px);
	box-shadow: var(--dkd-ombre-forte);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: var(--dkd-encre);
}

.woocommerce .price,
.woocommerce ul.products li.product .price {
	font-weight: 700;
	color: var(--dkd-violet);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce button.single_add_to_cart_button,
.wc-block-components-button:not(.is-link),
.ast-button {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: #fff;
	background: var(--dkd-degrade);
	border: 0;
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(179, 53, 143, 0.28);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce button.single_add_to_cart_button:hover,
.wc-block-components-button:not(.is-link):hover,
.ast-button:hover {
	color: #fff;
	background: var(--dkd-degrade);
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(179, 53, 143, 0.4);
}

/* --- Espacements des pages intérieures ------------------------------------ */

.page:not(.home) .entry-header {
	margin-top: 36px;
	margin-bottom: 8px;
}

/* Logo du formulaire (JPG à fond grisé) */
.entry-content .brand img {
	mix-blend-mode: multiply;
	filter: brightness(1.04) contrast(1.12);
}

@media (max-width: 767px) {
	.page:not(.home) .entry-header {
		margin-top: 24px;
	}

	.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
		font-size: 12px;
	}

	.woocommerce-page .site-content > .ast-container {
		padding-inline: 16px;
	}
}

/* --- En-tête : icône panier et bouton « Réserver » ------------------------- */

.dkd-reserver {
	position: relative;
}

.dkd-reserver summary {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 24px;
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	color: #fff;
	list-style: none;
	cursor: pointer;
	background: var(--dkd-degrade);
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(179, 53, 143, 0.28);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dkd-reserver summary::-webkit-details-marker {
	display: none;
}

.dkd-reserver summary::after {
	content: '';
	width: 7px;
	height: 7px;
	margin-top: -3px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}

.dkd-reserver[open] summary::after {
	margin-top: 3px;
	transform: rotate(-135deg);
}

.dkd-reserver summary:hover,
.dkd-reserver summary:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(179, 53, 143, 0.4);
}

.dkd-reserver__menu {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	z-index: 100;
	min-width: 210px;
	margin: 0;
	padding: 8px;
	list-style: none;
	background: #fff;
	border: 1px solid var(--dkd-bord);
	border-radius: 16px;
	box-shadow: var(--dkd-ombre-forte);
}

.dkd-reserver__menu::before {
	/* Zone invisible qui relie le bouton à la liste : le survol n'est pas interrompu. */
	content: '';
	position: absolute;
	top: -14px;
	right: 0;
	left: 0;
	height: 14px;
}

.dkd-reserver__menu a {
	display: block;
	padding: 12px 16px;
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--dkd-encre);
	border-radius: 10px;
}

.dkd-reserver__menu a:hover,
.dkd-reserver__menu a:focus-visible {
	color: var(--dkd-violet);
	background: var(--dkd-lilas);
}

/* Dans le menu déroulant mobile : la liste s'affiche à la suite, sans fenêtre flottante. */
.ast-mobile-popup-content .dkd-reserver__menu,
.ast-mobile-header-content .dkd-reserver__menu {
	position: static;
	margin-top: 10px;
	box-shadow: none;
}

/* Les formulaires s'affichent un peu sous le haut de l'écran quand on y arrive par un lien. */
#resa-form,
#carForm {
	scroll-margin-top: 120px;
}

.ast-header-woo-cart .ast-site-header-cart a,
.ast-header-woo-cart .ast-site-header-cart .ast-icon {
	color: var(--dkd-violet);
}

.ast-header-woo-cart .ast-site-header-cart a:hover {
	color: var(--dkd-magenta);
}

.ast-header-woo-cart .ast-addon-cart-wrap::after,
.ast-header-woo-cart .count {
	background: var(--dkd-orange);
	color: #fff;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
}

/* --- Petit panier au survol de l'icône ----------------------------------------
   Le conteneur du panier fait toute la hauteur de l'en-tête : « top: 100% » éloignait
   la fenêtre de l'icône. On la place juste sous l'icône, centrée sur la ligne de l'en-tête. */
@media (min-width: 922px) {
	.ast-site-header-cart .widget_shopping_cart {
		top: calc(50% + 20px);
	}
}

.ast-site-header-cart .widget_shopping_cart {
	border-radius: 14px;
	box-shadow: var(--dkd-ombre-forte);
}

/* Boutons du petit panier : texte blanc sur le dégradé (Astra le mettait en violet). */
.ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons a.button,
.ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons a.button:hover {
	color: #fff;
}

/* --- Bouton « Itinéraire » (page Contact) ----------------------------------- */

.dkd-itineraire {
	margin: 18px 0 0;
	text-align: center;
}

.dkd-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 26px;
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	background: var(--dkd-degrade);
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(179, 53, 143, 0.28);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dkd-btn:hover,
.dkd-btn:focus-visible {
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(179, 53, 143, 0.4);
}

.entry-content a.dkd-btn {
	text-decoration: none;
}

/* --- Boutique : cartes de catégories --------------------------------------- */

/* Titre et introduction de la page Boutique, centrés comme la grille. */
.post-type-archive-product .woocommerce-products-header,
.tax-product_cat .woocommerce-products-header {
	margin-bottom: 32px;
	text-align: center;
}

/* Les noms de catégories sont saisis en minuscules dans l'administration : majuscule à l'initiale. */
.tax-product_cat .woocommerce-products-header__title::first-letter,
.woocommerce-page ul.products li.product.product-category .woocommerce-loop-category__title::first-letter {
	text-transform: uppercase;
}

.dkd-shop-intro {
	max-width: 620px;
	margin: 10px auto 0;
	font-size: 17px;
	color: var(--dkd-texte);
}

/* Grille : 3 à 4 colonnes, cartes centrées même quand il y a peu de catégories. */
.woocommerce-page ul.products:has(> li.product-category) {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 340px));
	justify-content: center;
	gap: 28px;
	margin: 0 0 48px;
}

.woocommerce-page ul.products:has(> li.product-category)::before,
.woocommerce-page ul.products:has(> li.product-category)::after {
	display: none;
}

.woocommerce-page ul.products li.product.product-category {
	float: none;
	width: auto;
	margin: 0;
	background: #fff;
	border: 1px solid #ECE4F4;
	text-align: left;
}

.woocommerce-page ul.products li.product.product-category > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
}

.woocommerce-page ul.products li.product.product-category img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	margin: 0;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.woocommerce-page ul.products li.product.product-category:hover img {
	transform: scale(1.05);
}

/* Le nom ne flotte plus sur la photo : il est sous l'image, avec la phrase et le nombre de produits. */
.woocommerce-page ul.products li.product.product-category .woocommerce-loop-category__title {
	position: static;
	margin: 0;
	padding: 18px 22px 0;
	background: none;
	font-family: 'Poppins', sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	text-align: left;
	text-transform: none;
	color: var(--dkd-encre);
}

.woocommerce-page ul.products li.product.product-category > a:hover .woocommerce-loop-category__title {
	background: none;
	color: var(--dkd-violet);
}

.woocommerce-page ul.products li.product.product-category .dkd-cat__desc {
	margin: 6px 0 0;
	padding: 0 22px;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--dkd-texte);
}

.woocommerce-page ul.products li.product.product-category mark.count {
	display: block;
	margin: 12px 22px 0;
	padding: 0;
	background: none;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	opacity: 1;
	color: var(--dkd-magenta);
}

.woocommerce-page ul.products li.product.product-category > a::after {
	content: 'Voir les produits \2192';
	margin-top: auto;
	padding: 14px 22px 20px;
	font-family: 'Poppins', sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--dkd-violet);
}

@media (max-width: 600px) {
	/* « :not(.elementor-grid) » : plus précis que la règle d'Astra qui impose 2 colonnes sur mobile. */
	.woocommerce-page ul.products:not(.elementor-grid):has(> li.product-category) {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.dkd-shop-intro {
		font-size: 15.5px;
	}
}

.post-type-archive-product .woocommerce-products-header__title,
.tax-product_cat .woocommerce-products-header__title {
	margin-bottom: 0;
}
