/* --- Masque le lien "Voir le panier" que WooCommerce ajoute lui-même
   après un ajout réussi (à côté du bouton) : redondant avec notre propre
   panier latéral, et renvoie vers la page panier classique. --- */
.thresto-inline-panel .added_to_cart,
.thresto-cart-edit-panel .added_to_cart {
	display: none !important;
}

/* --- Barre de recherche + filtres catégorie --- */
.thresto-menu-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.thresto-menu-toolbar .thresto-menu-search {
	flex: 1 1 100%;
	box-sizing: border-box;
	height: 56px;
	padding: 0 20px;
	border: 1px solid #ddd;
	border-radius: 12px;
	font-size: 17px;
	background: #fff !important;
	color: var(--thresto-search-text, #1e1e1e) !important;
	-webkit-text-fill-color: var(--thresto-search-text, #1e1e1e) !important;
	caret-color: var(--thresto-search-text, #1e1e1e);
}

.thresto-menu-cats-wrap {
	position: relative;
	flex: 1 1 100%;
	min-width: 0;
}

/* Une seule ligne défilante : les flèches (affichées seulement quand il
   reste des catégories hors champ) signalent qu'il y en a d'autres. */
.thresto-menu-cats {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	overflow-x: auto;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding: 2px 0;
}
/* Centré quand tout tient sur la ligne, défilant sinon (les marges auto
   remplacent justify-content:center, qui rognerait le début de la liste). */
.thresto-menu-cats > :first-child {
	margin-left: auto;
}
.thresto-menu-cats > :last-child {
	margin-right: auto;
}
.thresto-menu-cats::-webkit-scrollbar {
	display: none;
}

.thresto-menu-cats-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	background: var(--thresto-accent, #1e1e1e);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
	padding: 0 0 3px;
}
.thresto-menu-cats-arrow[hidden] {
	display: none;
}
.thresto-menu-cats-arrow--prev {
	left: -6px;
}
.thresto-menu-cats-arrow--next {
	right: -6px;
}

.thresto-menu-toolbar .thresto-menu-cat-btn {
	box-sizing: border-box;
	height: 56px;
	background: #fff;
	color: #1e1e1e;
	font-family: inherit;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	text-decoration: none;
	border: 1px solid #ddd;
	border-radius: 999px;
	padding: 0 28px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
	flex: 0 0 auto;
}
.thresto-menu-toolbar .thresto-menu-cat-btn:hover,
.thresto-menu-toolbar .thresto-menu-cat-btn:focus {
	background: #fff;
	color: #1e1e1e;
	border-color: var(--thresto-accent, #1e1e1e);
}
.thresto-menu-toolbar .thresto-menu-cat-btn.is-active,
.thresto-menu-toolbar .thresto-menu-cat-btn.is-active:hover,
.thresto-menu-toolbar .thresto-menu-cat-btn.is-active:focus {
	background: var(--thresto-accent, #1e1e1e);
	border-color: var(--thresto-accent, #1e1e1e);
	color: #fff;
}

.thresto-menu-empty-filtered[hidden] {
	display: none;
}

/* --- Grille de produits : deux affichages au choix (ThResto → Apparence) ---
   1. Masonry (par défaut) : colonnes CSS, chaque cartouche garde sa hauteur
      naturelle, sans trous. Un dépliant ouvert n'étire pas ses voisines.
   2. Alignée : grille avec sous-grille, les boutons sont alignés d'une
      cartouche à l'autre sur une même rangée. */
.thresto-menu-grid--masonry {
	column-count: 3;
	column-gap: 20px;
}
.thresto-menu-grid--masonry > .thresto-menu-card {
	break-inside: avoid;
	margin-bottom: 20px;
}

.thresto-menu-grid--aligned {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 20px;
	row-gap: 0;
	align-items: start;
}
.thresto-menu-grid--aligned > .thresto-menu-card {
	display: grid;
	grid-row: span 4;
	grid-template-rows: subgrid;
	margin-bottom: 20px;
	align-self: stretch;
}
/* Placement explicite des 4 lignes de la sous-grille. Sans photo, le texte
   occupe les lignes 1 et 2 (pas de vide au-dessus) et le prix reste calé
   en bas, juste au-dessus du bouton, comme sur les cartes voisines. */
.thresto-menu-grid--aligned > .thresto-menu-card > .thresto-menu-card-image { grid-row: 1; }
.thresto-menu-grid--aligned > .thresto-menu-card > .thresto-menu-card-body  { grid-row: 2; }
.thresto-menu-grid--aligned > .thresto-menu-card > .thresto-menu-card-cta   { grid-row: 3; }
.thresto-menu-grid--aligned > .thresto-menu-card > .thresto-inline-panel    { grid-row: 4; }
.thresto-menu-grid--aligned > .thresto-menu-card--sans-photo > .thresto-menu-card-body {
	grid-row: 1 / span 2;
}
.thresto-menu-grid--aligned .thresto-menu-card--sans-photo .thresto-menu-card-price {
	margin-top: auto;
}

@media (max-width: 900px) {
	.thresto-menu-grid--masonry {
		column-count: 2;
	}
	.thresto-menu-grid--aligned {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.thresto-menu-grid--masonry {
		column-count: 1;
	}
	.thresto-menu-grid--aligned {
		grid-template-columns: minmax(0, 1fr);
	}
}

.thresto-menu-card {
	border: 2px solid var(--thresto-panel-border, #eee);
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	background: var(--thresto-card-bg, #fff);
	color: var(--thresto-card-text, #1e1e1e);
	box-shadow: 0 2px 14px rgba(0, 0, 0, .07);
	padding: 10px;
	transition: border-color .15s ease;
}

.thresto-menu-card:hover,
.thresto-menu-card:focus-within {
	border-color: var(--thresto-accent, #1e1e1e);
}

.thresto-menu-card-image--statique {
	cursor: default;
}

.thresto-menu-card-image {
	display: block;
	background: #f2f2f2;
	cursor: pointer;
	border-radius: 10px;
	overflow: hidden;
}
.thresto-menu-card-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}

.thresto-menu-card-body {
	padding: 14px 8px 12px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	text-align: center;
}

.thresto-menu-card .thresto-menu-card-title {
	color: var(--thresto-product-title, #1e1e1e);
	margin: 0;
	padding: 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: normal;
	text-transform: none;
	text-align: center;
}

.thresto-menu-card-excerpt {
	font-size: 13px;
	color: #767676;
	line-height: 1.4;
}
.thresto-menu-card-excerpt p {
	margin: 0;
}

.thresto-menu-card-price {
	font-weight: 700;
	font-size: 20px;
	color: var(--thresto-accent, #1e1e1e);
}

/* Bouton à contour — cohérent avec "Modifier" et "Continuer ma commande",
   couleur paramétrable dans ThResto → Apparence panier. */
.thresto-menu-card-cta {
	display: block;
	width: 100%;
	font-family: inherit;
	text-transform: none;
	box-shadow: none;
	text-decoration: none;
	background: none;
	border: 2px solid var(--thresto-contour, #1e1e1e);
	border-radius: 10px;
	color: var(--thresto-contour, #1e1e1e);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .01em;
	padding: 14px 12px;
	cursor: pointer;
	text-align: center;
	transition: filter .15s ease;
}
.thresto-menu-card-cta:hover {
	filter: brightness(.9);
}
.thresto-menu-card-cta[aria-expanded="true"] {
	background: var(--thresto-contour, #1e1e1e);
	color: #fff;
}

/* --- Dépliant inline (suppléments + formulaire d'ajout) ---
   Réutilisé sur la cartouche ET dans le panier ("Modifier"). */
.thresto-inline-panel {
	border-top: 1px solid rgba(128, 128, 128, .25);
	padding: 6px 14px 8px;
	background: color-mix(in srgb, var(--thresto-card-text, #1e1e1e) 4%, var(--thresto-card-bg, #fff));
	color: var(--thresto-card-text, #1e1e1e);
}

/* Un thème qui colore lui-même p / label / input (souvent en clair sur site
   sombre) l'emporte sur la couleur héritée du dépliant : on la fixe
   explicitement sur chaque élément de texte, sinon le groupe de suppléments,
   la description ou la quantité deviennent illisibles (texte clair sur fond clair). */
.thresto-inline-panel .thresto-supplement-groupe-nom,
.thresto-inline-panel .thresto-supplement-sous-titre,
.thresto-inline-panel .thresto-supplement-option,
.thresto-inline-panel .thresto-supplement-option-libelle,
.thresto-inline-panel .woocommerce-product-details__short-description,
.thresto-inline-panel .woocommerce-product-details__short-description p,
.thresto-inline-panel .thresto-product-infos,
.thresto-inline-panel .thresto-product-infos * {
	color: var(--thresto-card-text, #1e1e1e);
}
.thresto-inline-panel .thresto-supplement-sous-titre {
	opacity: .7;
}
.thresto-inline-panel form.cart .quantity .qty {
	color: var(--thresto-card-text, #1e1e1e);
	background: var(--thresto-card-bg, #fff);
}
.thresto-inline-panel[hidden] {
	display: none;
}

.thresto-inline-panel-loading {
	text-align: center;
	color: #666;
	padding: 16px 0;
	margin: 0;
}

.thresto-product-panel-inner .summary {
	min-width: 0;
}
.thresto-product-panel-inner .summary > *:first-child {
	margin-top: 0;
}

/* Description courte + allergènes/régime : même habillage que les
   groupes de suppléments (Accompagnement), pour une présentation homogène. */
.thresto-product-panel-inner .woocommerce-product-details__short-description,
.thresto-product-panel-inner .thresto-product-infos {
	margin: 0 0 2px;
	padding: 2px 0;
}
.thresto-product-panel-inner .woocommerce-product-details__short-description > *:last-child,
.thresto-product-panel-inner .thresto-product-infos > *:last-child {
	margin-bottom: 0;
}

/* Quantité + bouton "Ajouter au panier" sur la même ligne, bouton dans le
   même style que "Voir les suppléments" (pleine largeur restante, fond
   plein). Les suppléments (avant dans le form) restent sur leur propre
   ligne via flex-basis: 100%. */
.thresto-inline-panel form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}
.thresto-inline-panel form.cart > .thresto-supplements {
	flex: 1 1 100%;
	margin: 0 0 4px;
}
.thresto-inline-panel form.cart .quantity {
	flex: 0 0 auto;
	margin: 0;
}
.thresto-inline-panel form.cart .quantity .qty {
	width: 62px;
	padding: 12px 8px;
	border: 1px solid #ddd;
	border-radius: 10px;
	text-align: center;
}

.thresto-inline-panel form.cart .single_add_to_cart_button {
	flex: 1 1 auto;
	display: block;
	border: none;
	background: var( --thresto-accent, #1e1e1e );
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	padding: 14px 12px;
	border-radius: 10px;
	cursor: pointer;
	text-align: center;
	transition: filter .15s ease;
}
.thresto-inline-panel form.cart .single_add_to_cart_button:hover {
	filter: brightness(1.08);
	color: #fff;
}
.thresto-inline-panel form.cart .single_add_to_cart_button:disabled,
.thresto-inline-panel form.cart .single_add_to_cart_button.disabled {
	opacity: .5;
	cursor: not-allowed;
	filter: none;
}

/* "Modifier" (reconfiguration d'un article déjà au panier) — même bouton
   que "Ajouter au panier", mais en contour pour bien le distinguer d'un
   nouvel ajout. Sélecteur renforcé (mêmes 2 classes sur le même élément +
   form.cart) pour l'emporter sur la règle plus générique ci-dessus, qui a
   sinon la même spécificité et gagne par l'ordre du fichier. */
.thresto-inline-panel.thresto-cart-edit-panel form.cart .single_add_to_cart_button {
	background: none;
	border: 2px solid var( --thresto-contour, #1e1e1e );
	color: var( --thresto-contour, #1e1e1e );
}
.thresto-inline-panel.thresto-cart-edit-panel form.cart .single_add_to_cart_button:hover {
	background: var( --thresto-contour, #1e1e1e );
	color: #fff;
}

/* --- Panier --- */
.thresto-cart-toggle {
	position: relative;
	background: none;
	border: none;
	font-size: 22px;
	cursor: pointer;
	padding: 6px 10px;
}

.thresto-cart-toggle-flottant {
	position: fixed;
	right: 32px;
	bottom: 32px;
	width: 68px;
	height: 68px;
	background: #1e1e1e;
	color: #fff;
	border-radius: 50%;
	box-shadow: 0 4px 18px rgba(0, 0, 0, .28);
	z-index: 9997;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
}
.thresto-cart-toggle-flottant .thresto-cart-count {
	font-size: 12px;
	padding: 4px 7px;
}

.thresto-cart-count {
	position: absolute;
	top: -2px;
	right: -2px;
	background: #d63638;
	color: #fff;
	font-size: 11px;
	line-height: 1;
	border-radius: 50%;
	padding: 3px 6px;
	min-width: 16px;
	text-align: center;
}

.thresto-cart-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .4);
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s ease;
	z-index: 9998;
}
.thresto-cart-overlay.is-open {
	opacity: 1;
	visibility: visible;
}

.thresto-cart-panel {
	position: fixed;
	top: 0;
	right: 0;
	height: 100%;
	width: min(380px, 100vw);
	background: var(--thresto-panel-bg, #fff);
	color: var(--thresto-panel-text, inherit);
	box-shadow: -4px 0 16px rgba(0, 0, 0, .15);
	transform: translateX(100%);
	transition: transform .3s ease;
	z-index: 9999;
	display: flex;
	flex-direction: column;
}
.thresto-cart-panel.is-open {
	transform: translateX(0);
}

.thresto-cart-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px;
	border-bottom: 1px solid #eee;
}
.thresto-cart-panel-header h3 {
	margin: 0;
}
.thresto-cart-panel-header button {
	background: none;
	border: none;
	font-size: 22px;
	cursor: pointer;
	line-height: 1;
}

.thresto-cart-panel {
	font-size: 14px;
	line-height: 1.35;
}
.thresto-cart-panel-header h3 {
	font-size: 17px;
	margin: 0;
}
/* Le formulaire d'ajout/suppléments est réutilisé tel quel (mêmes classes
   que la cartouche de la grille) — on réduit polices et espaces ICI
   uniquement, pour ne pas affecter l'affichage sur la grille. */
.thresto-cart-panel .thresto-supplement-groupe-nom {
	font-size: 14px;
}
.thresto-cart-panel .thresto-supplement-options--cartes {
	grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	gap: 8px;
}
.thresto-cart-panel .thresto-supplement-options--cartes .thresto-supplement-option-img-wrap {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
}
.thresto-cart-panel .thresto-supplement-options--cartes .thresto-supplement-option-img {
	width: 100%;
	height: 100%;
}
.thresto-cart-panel .thresto-supplement-option {
	font-size: 12px;
}
.thresto-cart-panel .thresto-supplement-groupe {
	margin-bottom: 6px;
}
.thresto-cart-panel .thresto-product-panel-inner .woocommerce-product-details__short-description,
.thresto-cart-panel .thresto-product-panel-inner .thresto-product-infos {
	font-size: 13px;
	padding: 2px 0;
	margin-bottom: 2px;
}
.thresto-cart-panel .thresto-inline-panel form.cart {
	gap: 8px;
}
.thresto-cart-panel .thresto-inline-panel form.cart .quantity .qty {
	padding: 10px 6px;
}
.thresto-cart-panel .thresto-inline-panel form.cart .single_add_to_cart_button {
	padding: 12px 10px;
	font-size: 16px;
}
.thresto-cart-panel .thresto-supplement-total {
	background: none;
	border: 2px solid var(--thresto-accent, #1e1e1e);
	color: var(--thresto-accent, #1e1e1e);
}

.thresto-cart-panel-content {
	padding: 14px;
	overflow-y: auto;
	flex: 1;
}

.thresto-cart-items {
	list-style: none;
	margin: 0 0 8px;
	padding: 0;
}

.thresto-cart-item {
	padding: 8px 0;
	border-bottom: 1px solid #f0f0f0;
}

.thresto-cart-item-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.thresto-cart-item.is-being-edited .thresto-cart-item-image,
.thresto-cart-item.is-being-edited .thresto-cart-item-name {
	opacity: .5;
}

.thresto-cart-item-image img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 4px;
}

.thresto-cart-item-details {
	flex: 1;
}
.thresto-cart-item-name {
	font-weight: 600;
	font-size: 14px;
}
.thresto-cart-item-qty {
	font-size: 13px;
	color: #666;
}

.thresto-cart-item-options {
	list-style: none;
	margin: 2px 0;
	padding: 0;
	font-size: 12px;
	color: #888;
}

.thresto-cart-item-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
}

.thresto-cart-item-edit {
	background: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 11px;
	padding: 3px 8px;
	cursor: pointer;
	white-space: nowrap;
}
.thresto-cart-item-edit:hover {
	border-color: #999;
}

.thresto-cart-item-remove {
	background: none;
	border: none;
	color: #d63638;
	font-size: 18px;
	line-height: 1;
	padding: 0 4px;
	cursor: pointer;
}

.thresto-cart-edit-panel {
	margin-top: 6px;
	border-radius: 4px;
}

.thresto-cart-total {
	padding: 8px 0;
	border-top: 1px solid #eee;
	margin-bottom: 8px;
}

.thresto-cart-checkout-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	text-align: center;
	background: var(--thresto-accent, #1e1e1e);
	color: #fff;
	padding: 12px 10px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 4px;
	text-decoration: none;
}

.thresto-cart-checkout-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .25);
	font-size: 12px;
}

/* Bouton "Continuer ma commande" — ferme le panier pour reprendre la
   navigation là où on était, utile surtout sur mobile où le panier prend
   tout l'écran. Caché sur desktop (le clic hors panier ou la croix suffit). */
.thresto-cart-continue-btn {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 8px;
	text-align: center;
	background: none;
	border: 2px solid var(--thresto-contour, #1e1e1e);
	color: var(--thresto-contour, #1e1e1e);
	padding: 12px 10px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 4px;
	margin-top: 8px;
	cursor: pointer;
}

.thresto-cart-empty {
	color: #666;
}
