/**
 * Villa Victoria — Fenêtre « Ma liste de souhaits » (WPC Smart Wishlist)
 *
 * L'extension arrive avec son propre habillage : bandeau gris #222, boutons
 * Woo par défaut, vert #5fbd74 au survol des liens du bas, et le thème ajoute
 * son « capitalize » (« Ajouter Au Panier », « Continuer Mes Achats »). La
 * fenêtre jurait avec le reste du site et son bouton d'achat, coincé dans
 * 180 px, écrivait son libellé sur trois lignes autour du panier.
 *
 * Charte : navy #0F1F34, texte #5A6676, doré #C39A6B, filet sable #E6DFD4,
 * ivoire #F7F4EE ; titres Melodrama, courant Jost.
 *
 * Les sélecteurs de l'extension sont longs (jusqu'à cinq classes) : on répète
 * sa chaîne et on ajoute « body » devant plutôt que de poser des !important.
 */

/* =====================================================================
   1. La fenêtre
   ===================================================================== */

body .woosw-popup {
	background: rgba(15, 31, 52, 0.62);
	font-family: "Jost", sans-serif;
	font-size: 15px;
}

/* 460 px n'allaient pas : le nom de la prestation et le bouton d'achat se
   partageaient 300 px. 560 px laissent une ligne au bouton. */
body .woosw-popup .woosw-popup-inner .woosw-popup-content {
	max-width: 560px;
	border: 1px solid #E6DFD4;
	box-shadow: 0 18px 48px rgba(15, 31, 52, 0.22);
}

/* =====================================================================
   2. Bandeau de titre
   ===================================================================== */

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-top {
	height: 58px;
	line-height: 58px;
	padding: 0 62px 0 24px;
	background-color: #0F1F34;
	color: #FFFFFF;
	font-family: "Melodrama", Georgia, serif;
	font-size: 21px;
	font-weight: 500;
	letter-spacing: 0.02em;
}

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-top .woosw-popup-close {
	width: 58px;
	height: 58px;
	opacity: 0.85;
	transition: opacity .25s ease;
}

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-top .woosw-popup-close:hover {
	opacity: 1;
}

/* =====================================================================
   3. La ligne de prestation
   ===================================================================== */

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-mid {
	padding: 22px 24px;
}

/* l'extension sépare les lignes par un pointillé gris #eee posé sur
   .woosw-item-inner : filet sable plein, comme partout ailleurs sur le site */
body .woosw-popup .woosw-items .woosw-item .woosw-item-inner {
	border-top: 1px solid #E6DFD4;
	padding: 14px 0;
}

body .woosw-popup .woosw-item .woosw-item--image img {
	width: 78px;
	height: 78px;
	object-fit: cover;
}

body .woosw-popup .woosw-item .woosw-item--name,
body .woosw-popup .woosw-item .woosw-item--name a {
	font-family: "Jost", sans-serif;
	font-size: 16px;
	line-height: 1.35;
	color: #0F1F34;
	text-transform: none;
}

body .woosw-popup .woosw-item .woosw-item--name a:hover {
	color: #C39A6B;
}

body .woosw-popup .woosw-item .woosw-item--price,
body .woosw-popup .woosw-item .woosw-item--price .amount,
body .woosw-popup .woosw-item .woosw-item--price bdi {
	color: #5A6676;
	font-size: 15px;
}

/* la croix de retrait : discrète au repos, navy au survol */
body .woosw-popup .woosw-item .woosw-item--remove span {
	color: #9AA3AE;
	transition: color .25s ease;
}

body .woosw-popup .woosw-item .woosw-item--remove span:hover {
	color: #0F1F34;
}

/* =====================================================================
   4. Le bouton « Ajouter au panier »
   ===================================================================== */

/* Le thème passe tous les boutons Woo en capitales initiales : « Ajouter Au
   Panier ». Rendu en français courant, sur une seule ligne, et assez large pour
   que le panier de l'icône ne coupe plus la phrase en deux. */
/* la colonne de droite de la ligne : c'est .woosw-item--actions qui est
   l'élément flexible, .woosw-item--atc n'est qu'une boîte à l'intérieur */
body .woosw-popup .woosw-item .woosw-item--actions {
	min-width: 208px;
}

body .woosw-popup .woosw-item .woosw-item--atc .button,
body .woosw-popup .woosw-item .woosw-item--atc a.button,
body .woosw-popup .woosw-item .woosw-item--atc .added_to_cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 48px;
	padding: 0 22px;
	white-space: nowrap;
	text-transform: none;
	font-family: "Jost", sans-serif;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: 0.01em;
	color: #FFFFFF;
	background-color: #0F1F34;
	border: 1px solid #0F1F34;
	border-radius: 0;
	transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

body .woosw-popup .woosw-item .woosw-item--atc .button:hover,
body .woosw-popup .woosw-item .woosw-item--atc a.button:hover,
body .woosw-popup .woosw-item .woosw-item--atc .added_to_cart:hover {
	background-color: #C39A6B;
	border-color: #C39A6B;
	color: #FFFFFF;
}

/* « Voir le panier », qui s'affiche sous le bouton une fois l'ajout fait */
body .woosw-popup .woosw-item .woosw-item--atc .added_to_cart {
	margin-top: 8px;
	background-color: transparent;
	color: #0F1F34;
}

body .woosw-popup .woosw-item .woosw-item--atc .added_to_cart:hover {
	background-color: #0F1F34;
	border-color: #0F1F34;
	color: #FFFFFF;
}

/* =====================================================================
   5. Le pied de la fenêtre
   ===================================================================== */

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot {
	background-color: #F7F4EE;
	border-top: 1px solid #E6DFD4;
}

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-popup-content-bot-inner {
	padding: 16px 24px;
}

body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-popup-content-bot-inner a {
	color: #0F1F34;
	border-bottom: 1px solid #C39A6B;
	text-decoration: none;
	text-transform: none;
	font-size: 15px;
	transition: color .25s ease, border-color .25s ease;
}

/* l'extension écrit en ligne un survol vert #5fbd74 : on le reprend en doré */
body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-popup-content-bot-inner a:hover {
	color: #C39A6B;
	border-color: #C39A6B;
}

/* le bandeau de confirmation (« Produit ajouté au panier ») */
body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-notice {
	background-color: #0F1F34;
	font-family: "Jost", sans-serif;
}

/* =====================================================================
   6. Mobile
   ===================================================================== */

@media (max-width: 575px) {
	body .woosw-popup .woosw-popup-inner .woosw-popup-content {
		max-width: calc(100% - 28px);
	}

	body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-mid {
		padding: 16px;
	}

	/* la ligne de l'extension reste horizontale quelle que soit la largeur :
	   croix, photo, nom et bouton se serraient dans 288 px et le bouton
	   sortait de la fenêtre. On autorise le retour à la ligne et le bouton
	   prend toute la largeur, sous la photo et le nom. */
	body .woosw-popup .woosw-item .woosw-item-inner {
		flex-wrap: wrap;
		row-gap: 14px;
	}

	body .woosw-popup .woosw-item .woosw-item--actions {
		min-width: 0;
		flex: 0 0 100%;
		width: 100%;
	}

	/* les deux liens du pied s'empilent sans respirer entre eux */
	body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-popup-content-bot-inner {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 12px;
		text-align: center;
	}

	body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-bot .woosw-popup-content-bot-inner a {
		display: inline-block;
	}

	body .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-top {
		height: 52px;
		line-height: 52px;
		padding: 0 54px 0 16px;
		font-size: 19px;
	}
}