/**
 * Page « Votre devis » (YITH Request a Quote)
 *
 * Le plugin sort un tableau WooCommerce brut et un formulaire nu. On reprend son markup
 * (aucun template plugin n'est réécrit) pour le présenter dans la charte du site :
 * récapitulatif en cartes à gauche, formulaire en panneau à droite.
 */

/* ------------------------------------------------------------------ cadre */
body.page-votre-devis,
body.ywraq-page { background: #F2EFD9; }

.ywraq-wrapper {
	max-width: 1280px;
	margin: 0 auto;
	padding: 40px 1rem 80px;
	font-family: 'Basic Sans', 'basic-sans', sans-serif;
	color: #4A4A3F;
}

.ywraq-wrapper .ywraq-form-table-wrapper {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

/* Retour boutique : même bouton que le configurateur */
.yith-ywraq-before-table { margin-bottom: 20px; }
.yith-ywraq-before-table .wc-backward {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 22px; border-radius: 40px;
	background: transparent; border: 1px solid #BFAE41; color: #4A4A3F;
	font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; text-decoration: none;
}
.yith-ywraq-before-table .wc-backward:hover { background: #BFAE41; color: #fff; }

/* ------------------------------------------------- rappel de l'évènement */
.olwe-contexte-config {
	margin: 0 0 24px;
	padding: 22px 26px;
	border: none; border-radius: 22px;
	background: #fff;
	box-shadow: 0 8px 26px rgba(60,55,25,.07);
}
.olwe-contexte-config h3 { margin: 0 0 16px; font-family: 'TheSeasons', serif; font-size: 1.35rem; font-weight: 400; }
.olwe-contexte-config ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px 24px; margin: 0; padding: 0; list-style: none; }
.olwe-contexte-config li { display: flex; flex-direction: column; gap: 3px; margin: 0; }
.olwe-contexte-config span { color: #8A8570; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
.olwe-contexte-config strong { font-size: .95rem; font-weight: 700; }

/* ------------------------------------------------------ liste des articles */
.ywraq-wrapper .shop_table.cart {
	width: 100%;
	margin: 0;
	border: none;
	border-collapse: separate;
	border-spacing: 0;
	background: transparent;
}
.ywraq-wrapper .shop_table.cart thead { display: none; }
/* Les lignes se suivent sans espace : une seule carte par groupe, séparateurs en filet. */
.ywraq-wrapper .shop_table.cart tr.cart_item {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 18px;
	padding: 12px 18px;
	border-top: 1px solid rgba(85, 94, 80, .1);
	background: #fff;
}
/* Premier article d'un groupe : pas de filet, coins arrondis en haut. */
.ywraq-wrapper .shop_table.cart tr.olwe-groupe-titre + tr.cart_item,
.ywraq-wrapper .shop_table.cart tbody tr.cart_item:first-child {
	border-top: none;
	border-radius: 18px 18px 0 0;
}
/* Dernier article d'un groupe : coins arrondis en bas. */
.ywraq-wrapper .shop_table.cart tr.cart_item:last-child,
.ywraq-wrapper .shop_table.cart tr.cart_item:has(+ tr.olwe-groupe-titre) {
	border-radius: 0 0 18px 18px;
}
/* Groupe d'un seul article : les quatre coins. */
.ywraq-wrapper .shop_table.cart tr.olwe-groupe-titre + tr.cart_item:last-child,
.ywraq-wrapper .shop_table.cart tr.olwe-groupe-titre + tr.cart_item:has(+ tr.olwe-groupe-titre),
.ywraq-wrapper .shop_table.cart tbody tr.cart_item:first-child:last-child {
	border-radius: 18px;
}
.ywraq-wrapper .shop_table.cart td {
	border: none;
	padding: 0;
	background: transparent;
}
.ywraq-wrapper td.product-thumbnail { order: 1; }
.ywraq-wrapper td.product-thumbnail img { width: 84px; height: 84px; object-fit: cover; border-radius: 12px; display: block; }
.ywraq-wrapper td.product-name { order: 2; min-width: 0; font-size: .95rem; line-height: 1.35; }
.ywraq-wrapper td.product-name a { color: #4A4A3F; text-decoration: none; font-weight: 700; }
.ywraq-wrapper td.product-name a:hover { color: #BFAE41; }
.ywraq-wrapper td.product-quantity { order: 3; }
.ywraq-wrapper td.product-remove { order: 4; }

/* ---------------------------------------------- quantité et suppression
   Deux commandes de même gabarit (42px de haut), alignées à droite de chaque ligne.
   Le sélecteur est construit par scripts/devis.js ; le « × » du plugin est remplacé
   par une icône de corbeille, plus lisible et plus facile à viser. */

.ywraq-wrapper td.product-quantity,
.ywraq-wrapper td.product-remove { display: flex; align-items: center; }

.ywraq-wrapper div.quantity,
.ywraq-wrapper .quantity[data-type="type-2"],
.ywraq-wrapper td.product-quantity .quantity {
	display: inline-flex !important; align-items: center;
	width: auto !important; min-width: 136px !important; height: 42px !important;
	padding: 0; overflow: hidden;
	border: 1px solid rgba(85,94,80,.2) !important; border-radius: 30px !important;
	background: #F4F2E7;
}
.ywraq-wrapper .olwe-qty__btn {
	flex: 0 0 40px; width: 40px; height: 100%;
	display: inline-flex; align-items: center; justify-content: center;
	border: none; background: none; color: #555E50;
	font-family: inherit; font-size: 1.15rem; font-weight: 700; line-height: 1; cursor: pointer;
	transition: background .15s, color .15s;
}
.ywraq-wrapper .olwe-qty__btn:hover { background: rgba(191,174,65,.2); color: #8C7C1F; }
.ywraq-wrapper .olwe-qty__btn:active { background: rgba(191,174,65,.34); }
.ywraq-wrapper .quantity input[type="number"],
.ywraq-wrapper .quantity input.qty,
.ywraq-wrapper .quantity input.input-text,
.ywraq-wrapper .quantity[data-type="type-2"] input[type="number"] {
	flex: 1 1 auto; width: 54px !important; height: 100% !important; padding: 0 !important; margin: 0;
	border: none !important; background: none !important; box-shadow: none !important;
	text-align: center; font-family: inherit; font-weight: 700; font-size: .95rem; color: #4A4A3F;
	-moz-appearance: textfield;
}
.ywraq-wrapper .quantity input::-webkit-outer-spin-button,
.ywraq-wrapper .quantity input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ywraq-wrapper .quantity input:focus { outline: none; background: #fff !important; }
.ywraq-wrapper .quantity .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

/* Retirer l'article : corbeille dans un bouton rond de 42px */
.ywraq-wrapper a.yith-ywraq-item-remove,
.ywraq-wrapper a.yith-ywraq-item-remove.remove {
	display: inline-flex !important; align-items: center; justify-content: center;
	width: 42px; height: 42px; flex: 0 0 42px;
	border: 1px solid rgba(85,94,80,.2); border-radius: 50%;
	background: #fff; color: transparent; font-size: 0; line-height: 0; text-decoration: none;
	transition: background .2s, border-color .2s;
}
.ywraq-wrapper a.yith-ywraq-item-remove::before {
	content: ''; width: 18px; height: 18px;
	background-color: #8A8570;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4a1 1 0 011-1h6a1 1 0 011 1v2m2 0v14a1 1 0 01-1 1H7a1 1 0 01-1-1V6M10 11v6M14 11v6'/%3E%3C/svg%3E") center/18px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4a1 1 0 011-1h6a1 1 0 011 1v2m2 0v14a1 1 0 01-1 1H7a1 1 0 01-1-1V6M10 11v6M14 11v6'/%3E%3C/svg%3E") center/18px no-repeat;
	transition: background-color .2s;
}
.ywraq-wrapper a.yith-ywraq-item-remove:hover { background: #FBEDEA; border-color: #C0392B; }
.ywraq-wrapper a.yith-ywraq-item-remove:hover::before { background-color: #C0392B; }
.ywraq-wrapper a.yith-ywraq-item-remove .ajax-loading { display: none !important; }

/* ------------------------------------------------------------- formulaire */
.ywraq-wrapper .ywraq-form-wrapper,
.ywraq-wrapper #yith-ywraq-form {
	padding: 28px;
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 8px 26px rgba(60,55,25,.07);
}
.ywraq-wrapper #yith-ywraq-form h3,
.ywraq-wrapper .ywraq-form-wrapper h3 {
	margin: 0 0 20px;
	font-family: 'TheSeasons', serif; font-size: 1.5rem; font-weight: 400;
}
.ywraq-wrapper .form-row,
.ywraq-wrapper .ywraq-form-row { margin: 0 0 16px; padding: 0; }
.ywraq-wrapper label { display: block; margin-bottom: 6px; font-size: .82rem; color: #6B6858; }
.ywraq-wrapper input[type="text"],
.ywraq-wrapper input[type="email"],
.ywraq-wrapper input[type="tel"],
.ywraq-wrapper input[type="password"],
.ywraq-wrapper input[type="date"],
.ywraq-wrapper select,
.ywraq-wrapper textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid rgba(85,94,80,.22);
	border-radius: 12px;
	background: #FCFBF5;
	font-family: inherit; font-size: .92rem; color: #4A4A3F;
}
.ywraq-wrapper textarea { min-height: 120px; resize: vertical; }
.ywraq-wrapper input:focus,
.ywraq-wrapper textarea:focus,
.ywraq-wrapper select:focus { border-color: #BFAE41; outline: none; background: #fff; }
.ywraq-wrapper .required { color: #C0392B; }

.ywraq-wrapper button[type="submit"],
.ywraq-wrapper input[type="submit"],
.ywraq-wrapper .button:not(.wc-backward) {
	display: inline-flex; align-items: center; justify-content: center;
	width: 100%; padding: 15px 28px;
	border: none; border-radius: 40px;
	background: #BFAE41; color: #fff;
	font-family: inherit; font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
	cursor: pointer; transition: opacity .2s;
}
.ywraq-wrapper button[type="submit"]:hover { opacity: .9; }

/* ------------------------------------------------------- liste vide / messages */
.ywraq-wrapper.ywraq-empty { text-align: center; }
.ywraq-wrapper .ywraq_list_empty_message,
.ywraq-wrapper #yith-ywraq-message:not(:empty) {
	margin: 0 auto 24px; padding: 22px 26px; max-width: 620px;
	border-radius: 18px; background: #fff; box-shadow: 0 6px 20px rgba(60,55,25,.06);
}
.ywraq-wrapper .woocommerce-message,
.ywraq-wrapper .woocommerce-info {
	margin-bottom: 20px; padding: 14px 20px;
	border: none; border-left: 4px solid #BFAE41; border-radius: 12px; background: #fff;
}

/* ------------------------------------------------------------------ mobile */
@media (max-width: 980px) {
	.ywraq-wrapper .ywraq-form-table-wrapper { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
	.ywraq-wrapper { padding: 24px 1rem 60px; }
	.ywraq-wrapper .shop_table.cart tr.cart_item {
		grid-template-columns: 64px minmax(0, 1fr) auto;
		grid-template-areas: 'image nom retirer' 'image quantite quantite';
		gap: 10px 14px;
	}
	.ywraq-wrapper td.product-thumbnail { grid-area: image; }
	.ywraq-wrapper td.product-thumbnail img { width: 64px; height: 64px; }
	.ywraq-wrapper td.product-name { grid-area: nom; font-size: .88rem; }
	.ywraq-wrapper td.product-quantity { grid-area: quantite; }
	.ywraq-wrapper td.product-remove { grid-area: retirer; }
}

/* Bandeau de message : seulement s'il contient vraiment quelque chose */
.ywraq-wrapper #yith-ywraq-message:not(:has(*)) { display: none; }
.ywraq-wrapper .ywraq-question-message:empty { display: none; }

/* « Mettre à jour la liste » : action secondaire, pas un bouton principal */
.ywraq-wrapper .ywraq-update-list,
.ywraq-wrapper button[name="update_raq"],
.ywraq-wrapper input[name="update_raq"] {
	width: auto; margin-top: 8px; padding: 12px 26px;
	background: transparent; border: 1px solid rgba(85,94,80,.3); color: #4A4A3F;
}
.ywraq-wrapper .ywraq-update-list:hover,
.ywraq-wrapper button[name="update_raq"]:hover { background: rgba(191,174,65,.14); }

/* Titre de la page */
.ywraq-wrapper::before {
	content: 'Ma demande de devis';
	display: block; margin: 0 0 24px;
	font-family: 'TheSeasons', serif; font-size: 2.4rem; line-height: 1.1; text-align: center; color: #4A4A3F;
}
@media (max-width: 600px) { .ywraq-wrapper::before { font-size: 1.8rem; } }

/* style.css impose « .quantity[data-type=type-2] { width:100px !important } » et
   « div.quantity { height:30px !important } » : sur la page devis, la valeur était rognée. */
.ywraq-wrapper div.quantity,
.ywraq-wrapper .quantity[data-type="type-2"],
.ywraq-wrapper td.product-quantity .quantity {
	width: auto !important;
	min-width: 132px !important;
	height: 40px !important;
	border: 1px solid rgba(85,94,80,.18) !important;
	border-radius: 30px !important;
	overflow: visible;
}
.ywraq-wrapper .quantity[data-type="type-2"] input[type="number"] {
	width: 58px !important; height: 100% !important; padding: 0 !important;
	border: none !important; background: none !important; text-align: center;
}

/* Deux origines dans la liste : configurateur / boutique */
.ywraq-wrapper tr.olwe-groupe-titre { display: block; background: transparent; box-shadow: none; padding: 0; }
.ywraq-wrapper tr.olwe-groupe-titre td { display: block; padding: 18px 4px 6px; }
.ywraq-wrapper tr.olwe-groupe-titre span { display: block; font-family: 'TheSeasons', serif; font-size: 1.3rem; color: #4A4A3F; }
.ywraq-wrapper tr.olwe-groupe-titre em { display: block; margin-top: 2px; color: #8A8570; font-size: .78rem; font-style: normal; text-transform: uppercase; letter-spacing: .04em; }
