/**
 * Touchy Idea – Comptes clients
 * v0.2.0 — charte appliquée.
 *
 * Tokens repris du design system « Touchy Idea Design System » et volontairement
 * portés sur `.touchy-ui, body.touchy-account` plutôt que sur `:root` : les noms
 * (--bg, --fg, --border, --primary…) sont trop génériques pour être lâchés dans
 * la page entière sans risquer de repeindre Divi.
 */

/* ============================================================================
 * 1. TOKENS (copie du design system)
 * ========================================================================== */

.touchy-ui,
body.touchy-account .woocommerce {

	/* Prune */
	--ti-plum-900: #1f1230;
	--ti-plum-800: #2d1b47;
	--ti-plum-700: #4a2f70;
	--ti-plum-600: #66448f;
	--ti-plum-500: #8662b0;
	--ti-plum-400: #a684cc;
	--ti-plum-300: #c897ea;
	--ti-plum-200: #ddb8f0;
	--ti-plum-100: #eeddf8;
	--ti-plum-50:  #f7eefc;

	/* Cerise */
	--ti-cherry-700: #c84372;
	--ti-cherry-600: #e85890;
	--ti-cherry-500: #ff6fa5;
	--ti-cherry-400: #ff8fbb;
	--ti-cherry-300: #ffb3d0;
	--ti-cherry-200: #ffd3e2;
	--ti-cherry-100: #ffe7ee;

	/* Pêche / banane / menthe */
	--ti-peach-600: #f49680;
	--ti-peach-500: #fec6b8;
	--ti-peach-300: #ffe3dc;
	--ti-banana-600: #e8bc4a;
	--ti-banana-500: #ffdd81;
	--ti-banana-200: #fff6da;
	--ti-mint-600: #6bc9a6;
	--ti-mint-500: #98dcc1;
	--ti-mint-200: #e2f6ee;
	--ti-peach-700: #ce4918;

	/* Neutres chauds */
	--ti-cream:    #f8f7f1;
	--ti-vanilla:  #fff8ee;
	--ti-white:    #ffffff;
	--ti-mist-100: #efece3;
	--ti-mist-200: #ddd7c8;
	--ti-mist-300: #c2bba8;
	--ti-mauve-400: #a99cb7;
	--ti-mauve-500: #6b5b82;
	--ti-ink:      #2d1b47;

	/* Sémantique */
	--bg:            var(--ti-cream);
	--bg-elevated:   var(--ti-white);
	--fg:            var(--ti-ink);
	--fg-soft:       var(--ti-mauve-500);
	--fg-mute:       var(--ti-mauve-400);
	--fg-on-primary: var(--ti-cream);
	--fg-on-accent:  var(--ti-white);

	--primary:      var(--ti-plum-600);
	--primary-soft: var(--ti-plum-300);
	--primary-tint: var(--ti-plum-100);
	--accent:       var(--ti-cherry-500);
	--accent-soft:  var(--ti-cherry-200);

	--border-soft:   var(--ti-mist-100);
	--border:        var(--ti-mist-200);
	--border-strong: var(--ti-mist-300);

	--success:    #6bc9a6;
	--success-bg: var(--ti-mint-200);
	--warning:    #e8a23a;
	--warning-bg: var(--ti-banana-200);
	--danger:     #e14a6b;
	--danger-bg:  var(--ti-cherry-200);

	--focus-ring: 0 0 0 4px rgba(255, 111, 165, 0.32);

	/* Typo — --font-title est surchargée si les polices Google sont désactivées. */
	--font-body:  "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-title: "Caveat Brush", "Plus Jakarta Sans", cursive;

	/* Titres — valeurs relevées sur touchy-idea.com le 26/09/2026 :
	   H1 = titre de page (Panier, Mentions légales…), H2 et H3 = preset Divi
	   des modules texte. Le site n'emploie pas de H4 : sa taille prolonge
	   l'échelle. Interligne 1, comme Divi (line-height: 1em). */
	--ti-h1-size:   clamp(38px, 5.5vw, 62px);
	--ti-h1-weight: 900;
	--ti-h2-size:   clamp(34px, 7.5vw, 56px);
	--ti-h2-weight: 500;
	--ti-h3-size:   clamp(30px, 6vw, 44px);
	--ti-h3-weight: 500;
	--ti-h4-size:   clamp(24px, 4.5vw, 32px);
	--ti-h4-weight: 500;

	/* Rayons — Touchy Idea est ROND. Toujours. */
	--r-sm:   10px;
	--r-md:   14px;
	--r-lg:   20px;
	--r-xl:   28px;
	--r-pill: 999px;

	/* Ombres */
	--sh-1: 0 1px 2px rgba(45, 27, 71, 0.05);
	--sh-2: 0 2px 8px rgba(45, 27, 71, 0.06), 0 1px 2px rgba(45, 27, 71, 0.04);
	--sh-3: 0 8px 24px rgba(45, 27, 71, 0.08), 0 2px 4px rgba(45, 27, 71, 0.04);
	--sh-cherry: 0 8px 20px rgba(255, 111, 165, 0.35);

	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--dur-fast: 140ms;
}

/* Repli quand les polices Google ne sont pas chargées. */
.touchy-no-webfont .touchy-ui,
body.touchy-account.touchy-no-webfont .woocommerce {
	--font-body: inherit;
	--font-title: inherit;
}

/* ============================================================================
 * 2. PRIMITIVES PARTAGÉES
 * ========================================================================== */

/* Survols : toujours « all 300ms ease » (charte). Règle de base pour tout ce
   qui se survole ; les règles plus précises reprennent la même valeur. */
.touchy-ui a,
.touchy-ui button,
.touchy-ui summary,
.touchy-ui label,
.touchy-ui input,
body.touchy-account .woocommerce a,
body.touchy-account .woocommerce button,
body.touchy-account .woocommerce summary,
body.touchy-account .woocommerce label,
body.touchy-account .woocommerce input,
.ti-support-card,
.ti-wish-card {
	transition: all 300ms ease;
}

.touchy-ui,
body.touchy-account .woocommerce {
	font-family: var(--font-body);
	color: var(--fg);
}

.touchy-ui *,
body.touchy-account .woocommerce * {
	box-sizing: border-box;
}

.ti-eyebrow {
	display: block;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
	margin-bottom: 6px;
}

/* Échelle des titres du site. Le titre d'onglet de l'espace client est un H2.
   Sélecteurs doublés et !important : Divi stylise h1…h6 (police de titre,
   26 px, gris #333, padding-bottom) et ses presets de module texte ajoutent
   des règles à identifiant. */
.touchy-ui h1, body.touchy-account .woocommerce h1, .ti-h1,
.touchy-ui h2.ti-title, body.touchy-account .woocommerce h2.ti-title, .ti-title,
.touchy-ui h3.ti-h3, .ti-h3,
.touchy-ui h4.ti-h4, .ti-h4 {
	font-family: var(--font-title) !important;
	color: var(--ti-ink) !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	padding: 0 !important;
}

.touchy-ui h1, body.touchy-account .woocommerce h1, .ti-h1 {
	font-size: var(--ti-h1-size) !important;
	font-weight: var(--ti-h1-weight) !important;
	margin: 0 0 16px;
}

.touchy-ui h2.ti-title, body.touchy-account .woocommerce h2.ti-title, .ti-title {
	font-size: var(--ti-h2-size) !important;
	font-weight: var(--ti-h2-weight) !important;
	margin: 0 0 12px !important;
}

.touchy-ui h3.ti-h3, .ti-h3 {
	font-size: var(--ti-h3-size) !important;
	font-weight: var(--ti-h3-weight) !important;
	margin: 0 0 12px;
}

.touchy-ui h4.ti-h4, .ti-h4 {
	font-size: var(--ti-h4-size) !important;
	font-weight: var(--ti-h4-weight) !important;
	margin: 0 0 10px;
}

.touchy-no-webfont .ti-title,
.touchy-no-webfont .ti-h1,
.touchy-no-webfont .ti-h3,
.touchy-no-webfont .ti-h4 {
	font-weight: 800 !important;
	letter-spacing: -0.02em !important;
}

/* Intertitre d'une section d'onglet : du texte, pas un titre manuscrit.
   Plus gros et plus gras que le texte courant, jamais en Caveat.
   Vaut aussi pour les h2/h3 que WooCommerce pose lui-même dans ses écrans
   (« Adresse de facturation », « Détails de la commande »…). */
.ti-subtitle,
body.touchy-account .woocommerce-MyAccount-content h2:not(.ti-title),
body.touchy-account .woocommerce-MyAccount-content h3 {
	display: block;
	font-family: var(--font-body) !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	line-height: 1.35 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: var(--ti-ink) !important;
	margin: 32px 0 14px !important;
	padding: 0 !important;
}

.ti-card > .ti-subtitle:first-child,
body.touchy-account .woocommerce-MyAccount-content > h2:not(.ti-title):first-child,
body.touchy-account .woocommerce-MyAccount-content > h3:first-child {
	margin-top: 0 !important;
}

.ti-lede {
	font-size: 15px;
	line-height: 1.6;
	color: var(--fg-soft);
	margin: 0 0 28px;
}

.ti-card {
	background: var(--bg-elevated);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	padding: 24px;
	margin-bottom: 20px;
}

.ti-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}

.ti-card__title {
	font-weight: 700;
	font-size: 16px;
	color: var(--fg);
}

/* Icônes Lucide du site : caractères de la police ETmodules complétée par
   le plugin divi-icones (voir Touchy_Comptes_Icons). */
.ti-lucide {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
	font-family: ETmodules !important;
	font-style: normal !important;
	font-weight: 400 !important;
	font-variant: normal;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	/* Recentrage vertical : la police ETmodules de Divi place la ligne de
	   base à 0,9375 em (ascent 960/1024), les glyphes Lucide sont dessinés
	   au-dessus d'une ligne de base à 1 em → ils remontaient de 0,0625 em
	   (≈ 1 px à 18 px). `translate` est indépendant de `transform` : les
	   rotations existantes (flèche d'accordéon…) ne sont pas touchées. */
	translate: 0 0.0625em;
	text-transform: none !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	speak: never;
}

.ti-icon {
	width: 1em;
	height: 1em;
	flex: 0 0 auto;
	vertical-align: -0.125em;
}

/* --- Boutons ----------------------------------------------------------- */

.touchy-ui .ti-btn,
body.touchy-account .ti-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: none;
	border-radius: var(--r-pill) !important;
	padding: 13px 24px;
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-btn:hover,
body.touchy-account .ti-btn:hover {
	transform: translateY(-1px);
}

.touchy-ui .ti-btn:active,
body.touchy-account .ti-btn:active {
	transform: translateY(0);
}

.touchy-ui .ti-btn--accent,
body.touchy-account .ti-btn--accent {
	background: var(--accent) !important;
	color: var(--fg-on-accent) !important;
	box-shadow: var(--sh-cherry);
}

.touchy-ui .ti-btn--accent:hover,
body.touchy-account .ti-btn--accent:hover {
	background: var(--ti-cherry-600) !important;
	box-shadow: 0 10px 24px rgba(255, 111, 165, 0.45);
}

.touchy-ui .ti-btn--primary,
body.touchy-account .ti-btn--primary {
	background: var(--primary) !important;
	color: var(--fg-on-primary) !important;
}

.touchy-ui .ti-btn--primary:hover,
body.touchy-account .ti-btn--primary:hover {
	background: var(--ti-plum-700) !important;
	box-shadow: 0 8px 20px rgba(102, 68, 143, 0.28);
}

.touchy-ui .ti-btn--soft,
body.touchy-account .ti-btn--soft {
	background: var(--primary-tint) !important;
	color: var(--primary) !important;
}

.touchy-ui .ti-btn--soft:hover,
body.touchy-account .ti-btn--soft:hover {
	background: var(--ti-plum-200) !important;
}

.touchy-ui .ti-btn--dashed:hover,
body.touchy-account .ti-btn--dashed:hover {
	border-color: var(--primary) !important;
	color: var(--primary) !important;
	background: var(--primary-tint) !important;
}

.touchy-ui .ti-btn--dashed,
body.touchy-account .ti-btn--dashed {
	width: 100%;
	background: transparent !important;
	border: 2px dashed var(--border-strong) !important;
	border-radius: var(--r-xl) !important;
	padding: 18px;
	color: var(--fg-soft) !important;
	font-size: 14px;
}

.touchy-ui .ti-btn--sm,
body.touchy-account .ti-btn--sm {
	padding: 9px 18px;
	font-size: 13px;
}

/* --- Survol et focus : passe systématique -------------------------------
 *
 * Les boutons WooCommerce de l'espace client sont repeints en `!important`
 * plus bas ; sans redéfinir leur survol ici, ils restaient inertes. Même
 * chose pour le focus clavier, que le thème perd en supprimant les contours.
 * ---------------------------------------------------------------------- */

/* Boutons natifs uniquement : nos .ti-btn portent leurs propres variantes
   (primaire, cerise, douce, grisée), que cette règle en !important écrasait
   — d'où les « Pas encore » de la fidélité peints en prune. */
body.touchy-account .woocommerce-MyAccount-content button[type="submit"]:not(.ti-btn):not(.ti-wish-card__remove):not(.ti-wish-act):hover,
body.touchy-account .woocommerce-MyAccount-content .button:not(.ti-btn):hover {
	background: var(--ti-plum-700) !important;
	box-shadow: 0 8px 20px rgba(102, 68, 143, 0.28);
}

body.touchy-account .woocommerce-MyAccount-content .button:not(.ti-btn) {
	transition: all 300ms ease;
}

/* Liens d'action (« Détails », « Voir tout → », « Modifier »…) */
.touchy-ui .ti-link-strong,
body.touchy-account .ti-link-strong {
	transition: all 300ms ease;
}

.touchy-ui .ti-link-strong:hover,
body.touchy-account .ti-link-strong:hover {
	color: var(--accent) !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

/* Cartes cliquables */
.ti-support-card {
	transition: all 300ms ease;
}

.ti-support-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--sh-3);
}

/* Focus clavier — visible partout, et uniquement au clavier. */
body.touchy-account .woocommerce-MyAccount-content a:focus-visible,
body.touchy-account .woocommerce-MyAccount-content button:focus-visible,
body.touchy-account .woocommerce-MyAccount-navigation a:focus-visible,
.touchy-ui a:focus-visible,
.touchy-ui button:focus-visible,
.touchy-ui summary:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: var(--r-sm);
}

/* --- Champs ------------------------------------------------------------
 *
 * Carte « Form fields » du design system, appliquée partout où le plugin
 * affiche un champ — inscription, infos personnelles, adresses, parrainage :
 *   label   13 px, graisse 600, encre, 6 px au-dessus du champ ;
 *   champ   bordure 1,5 px brume, rayon 14 px, fond blanc, 12 × 14 px,
 *           texte 15 px (16 px sur mobile : iOS zoome en dessous) ;
 *   focus   bordure prune 500 + halo cerise ;
 *   erreur  bordure cerise 500, message cerise 600 ;
 *   entre deux champs : 16 px, toujours.
 * input, select et textarea partagent la même règle : un <select> ressemble
 * à un champ, jamais à un bouton.
 * ---------------------------------------------------------------------- */

.touchy-ui,
body.touchy-account .woocommerce {
	--field-gap:    16px;
	--field-border: 1.5px solid var(--border);
	--field-focus:  0 0 0 4px rgba(255, 111, 165, 0.2);
}

.ti-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--ti-ink);
	margin: 0 0 var(--field-gap);
}

.ti-field__optional,
body.touchy-account .woocommerce-MyAccount-content label .optional {
	font-weight: 500;
	color: var(--fg-mute);
}

.touchy-ui .ti-input,
body.touchy-account .ti-input,
body.touchy-account .woocommerce-MyAccount-content input[type="text"],
body.touchy-account .woocommerce-MyAccount-content input[type="email"],
body.touchy-account .woocommerce-MyAccount-content input[type="tel"],
body.touchy-account .woocommerce-MyAccount-content input[type="password"],
body.touchy-account .woocommerce-MyAccount-content input[type="number"],
body.touchy-account .woocommerce-MyAccount-content select,
body.touchy-account .woocommerce-MyAccount-content textarea,
body.touchy-account .woocommerce-MyAccount-content .select2-container .select2-selection--single {
	display: block;
	width: 100% !important;
	min-height: 48px;
	height: auto !important;
	margin: 0 !important;
	border: var(--field-border) !important;
	border-radius: var(--r-md) !important;
	padding: 12px 14px !important;
	background: var(--ti-white) !important;
	box-shadow: none !important;
	font-family: var(--font-body) !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	color: var(--ti-ink) !important;
	transition: all 300ms ease;
}

body.touchy-account .woocommerce-MyAccount-content select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 40px !important;
	background: var(--ti-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b5b82' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center !important;
}

/* select2 (pays, région) : la valeur et la flèche se calent dans le champ. */
body.touchy-account .woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0 !important;
	line-height: 1.4 !important;
	color: var(--ti-ink) !important;
}

body.touchy-account .woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__arrow {
	top: 50% !important;
	right: 10px !important;
	transform: translateY(-50%);
	height: 24px !important;
}

.touchy-ui .ti-input::placeholder,
body.touchy-account .woocommerce-MyAccount-content input::placeholder,
body.touchy-account .woocommerce-MyAccount-content textarea::placeholder {
	color: var(--fg-mute);
	opacity: 1;
}

.touchy-ui .ti-input:focus,
body.touchy-account .ti-input:focus,
body.touchy-account .woocommerce-MyAccount-content input:focus,
body.touchy-account .woocommerce-MyAccount-content select:focus,
body.touchy-account .woocommerce-MyAccount-content textarea:focus,
body.touchy-account .woocommerce-MyAccount-content .select2-container--focus .select2-selection--single,
body.touchy-account .woocommerce-MyAccount-content .select2-container--open .select2-selection--single {
	outline: none !important;
	border-color: var(--ti-plum-500) !important;
	box-shadow: var(--field-focus) !important;
}

.ti-field--error .ti-input,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-invalid input.input-text,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-invalid select {
	border-color: var(--ti-cherry-500) !important;
}

.ti-field-error {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--ti-cherry-600);
	margin: calc(-1 * var(--field-gap) + 6px) 0 var(--field-gap);
}

.ti-field-hint,
body.touchy-account .woocommerce-MyAccount-content .form-row > span > em,
body.touchy-account .woocommerce-MyAccount-content .form-row .description {
	display: block;
	margin-top: 6px;
	font-size: 12.5px;
	font-style: normal;
	font-weight: 500;
	line-height: 1.45;
	color: var(--fg-soft);
}

@media (max-width: 767px) {
	/* Même spécificité que la règle principale, placée après : elle gagne. */
	.touchy-ui .ti-input,
	body.touchy-account .ti-input,
	body.touchy-account .woocommerce-MyAccount-content input[type],
	body.touchy-account .woocommerce-MyAccount-content select[name],
	body.touchy-account .woocommerce-MyAccount-content textarea[name] {
		font-size: 16px !important;
	}
}

/* Grille prénom / nom */
.ti-field-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0 var(--field-gap);
}

/* Mot de passe + œil */
.ti-input-wrap {
	position: relative;
}

.ti-eye {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--fg-mute);
	cursor: pointer;
	font-size: 18px;
	border-radius: var(--r-pill);
}

.ti-eye:hover { color: var(--primary); }
.ti-eye__off { display: none; }
.ti-eye[aria-pressed="true"] .ti-eye__on { display: none; }
.ti-eye[aria-pressed="true"] .ti-eye__off { display: block; }

/* Cases à cocher — même case que la porte 18+ et la fenêtre de connexion :
   22 px, rayon 7 px, cochée en cerise avec la coche blanche. */
/* display en !important : WooCommerce passe les label.checkbox des
   formulaires en inline avec une spécificité égale à la nôtre. */
/* Portée limitée au plugin : le site a sa propre .ti-check (case « Retiens-le
   pour 30 jours » de la porte 18 ans, dans le pied de page Divi). Sans
   portée, cette règle la déformait sur les pages où comptes.css est chargé
   (liste d'envies partagée, compte). */
.touchy-ui .ti-check,
body.touchy-account .woocommerce .ti-check,
body.touchy-account .woocommerce-MyAccount-content label.ti-check {
	display: flex !important;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ti-ink);
	cursor: pointer;
	margin: 0 0 var(--field-gap);
	line-height: 1.55;
}

.touchy-ui .ti-check input[type="checkbox"],
body.touchy-account .ti-check input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	margin: 0 !important;
	border: var(--field-border);
	border-radius: 7px;
	background: var(--ti-white) no-repeat center / 13px 13px;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-check:hover input[type="checkbox"],
body.touchy-account .woocommerce .ti-check:hover input[type="checkbox"] {
	border-color: var(--ti-plum-400);
}

.touchy-ui .ti-check input[type="checkbox"]:checked,
body.touchy-account .ti-check input[type="checkbox"]:checked {
	border-color: transparent;
	background-color: var(--accent);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 8.5L6.5 12L13 4.5' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.touchy-ui .ti-check input[type="checkbox"]:focus-visible,
body.touchy-account .woocommerce .ti-check input[type="checkbox"]:focus-visible {
	outline: none;
	border-color: var(--ti-plum-600);
	box-shadow: var(--focus-ring);
}

.touchy-ui .ti-check strong,
body.touchy-account .woocommerce .ti-check strong { color: var(--fg); }

/* Case seule dans sa ligne de formulaire : l'aide s'aligne sur le texte. */
.touchy-ui .form-row > .ti-check,
body.touchy-account .woocommerce .form-row > .ti-check {
	margin-bottom: 0 !important;
}

.touchy-ui .form-row > .ti-check + .ti-field-hint,
body.touchy-account .woocommerce .form-row > .ti-check + .ti-field-hint {
	margin: 4px 0 0 32px;
}

/* Message d'erreur global : voir .ti-alert--error plus bas. */

/* --- Bandeaux de message ------------------------------------------------
 *
 * Le bandeau des notifications de la boutique (plugin « Alertes
 * WooCommerce », .tip-alert), en version posée dans la page : mêmes
 * couleurs, même pastille, même typo — sans position fixe, sans ombre
 * portée ni animation d'entrée.
 *
 *   erreur   fond cerise, texte blanc, « ! »
 *   succès   fond menthe, texte encre, « ✓ »
 *   info     fond banane, texte encre, « ! »
 *
 * S'applique à nos .ti-alert et aux messages que WooCommerce pose
 * directement dans ses écrans (« Aucune commande », « Aucun moyen de
 * paiement enregistré »…). Les messages de la file — ceux qui suivent une
 * action — restent confiés au plugin Alertes, qui en fait des popups.
 * ---------------------------------------------------------------------- */

.ti-alert,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-info,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner {
	/* Grille à deux colonnes : la pastille à gauche, tout le reste à droite.
	   En flex, le texte nu des messages WooCommerce (pas de balise autour)
	   devenait un bloc pleine largeur et passait sous la pastille. */
	display: grid !important;
	grid-template-columns: 24px minmax(0, 1fr);
	align-items: start;
	gap: 8px 12px;
	width: 100%;
	margin: 0 0 20px !important;
	padding: 16px 18px !important;
	border: none !important;
	border-radius: 20px !important;
	background: #fff0c2 !important;
	box-shadow: none !important;
	font-family: var(--font-body);
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.5 !important;
	text-align: left;
	color: var(--ti-ink) !important;
	list-style: none;
}

/* Messages de la file (après une action : adresse enregistrée, détails
   modifiés…) : le plugin Alertes en fait un popup et masque l'original.
   Le `display: grid !important` ci-dessus l'emportait sur son masquage —
   le même message s'affichait deux fois, en popup et dans la page. On rend
   la main à Alertes dès qu'il est actif (attribut posé sur <html>) ; sans
   lui, les messages restent visibles, habillés comme ci-dessus. */
html[data-touchy-alertes="on"] body.touchy-account .woocommerce-MyAccount-content .woocommerce-notices-wrapper > *,
html[data-touchy-alertes="on"] body.touchy-account .woocommerce-MyAccount-content .woocommerce-NoticeGroup > *,
html[data-touchy-alertes="on"] body.touchy-account .woocommerce-MyAccount-content .woocommerce-notices-wrapper .wc-block-components-notice-banner,
body.touchy-account .woocommerce-MyAccount-content [data-tip-adopted] {
	display: none !important;
}

/* Version « blocs » des messages (thèmes blocs, WooCommerce récent) : on
   remplace son icône par notre pastille. */
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner > svg {
	display: none !important;
}

body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner__content {
	grid-column: 2;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	color: inherit !important;
}

.ti-alert::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-info::before,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner::before {
	content: "!" !important;
	position: static !important;
	grid-column: 1;
	grid-row: 1;
	display: grid !important;
	place-items: center;
	width: 24px;
	height: 24px;
	margin: 0 !important;
	border-radius: 999px;
	background: #ffdd81;
	color: var(--ti-ink) !important;
	font-family: var(--font-body) !important;
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
}

.ti-alert__text {
	grid-column: 2;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.ti-alert__text li { margin: 0; padding: 0; list-style: none !important; }
.ti-alert__text li::before, .ti-alert__text li::marker { content: none !important; }
.ti-alert__text li + li { margin-top: 6px; }

/* Lien d'action : souligné, dans la couleur du texte, comme sur la boutique.
   Toujours sous le texte, aligné à gauche avec lui — y compris le bouton que
   WooCommerce glisse en tête de certains messages. */
/* Le bouton que WooCommerce glisse dans certains messages (« Parcourir les
   produits »…) garde son habit de bouton, mais passe sous le texte, aligné
   à gauche avec lui. */
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message > a.button,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-info > a.button,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error > a.button,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner__content > a.button {
	order: 2;
	grid-column: 2;
	justify-self: start;
	float: none !important;
	margin: 4px 0 0 !important;
	padding: 9px 18px !important;
	font-size: 13px !important;
}

.ti-alert .ti-alert__lien,
.ti-alert a,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message a:not(.button),
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error a:not(.button),
body.touchy-account .woocommerce-MyAccount-content .woocommerce-info a:not(.button) {
	order: 2;
	grid-column: 2;
	justify-self: start;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	color: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
	white-space: nowrap;
}

.ti-alert a:hover,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message a:not(.button):hover,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error a:not(.button):hover,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-info a:not(.button):hover {
	background: none !important;
	box-shadow: none !important;
	text-decoration-thickness: 2px !important;
}

/* Succès */
.ti-alert--success,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner.is-success {
	background: #d7f0e6 !important;
}

.ti-alert--success::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-message::before,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner.is-success::before {
	content: "\2713" !important;
	background: #b8e5d4;
	color: #3e9c79 !important;
}

/* Erreur */
.ti-alert--error,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner.is-error {
	background: var(--ti-cherry-500) !important;
	color: var(--ti-white) !important;
}

.ti-alert--error::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-error::before,
body.touchy-account .woocommerce-MyAccount-content .wc-block-components-notice-banner.is-error::before {
	background: rgba(255, 255, 255, 0.28);
	color: var(--ti-white) !important;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-error li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Le bandeau « module masqué » n'est vu que des administrateurs. */
.ti-loyalty .ti-alert {
	margin: 14px 0 0 !important;
}

/* Pot de miel */
.ti-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ============================================================================
 * 3. FORMULAIRE D'INSCRIPTION
 *
 * Le shortcode ne rend que le formulaire : l'habillage (carte, fond, titres)
 * appartient à la page qui l'accueille. On ne stylise donc plus que ce qui est
 * DANS le formulaire.
 * ========================================================================== */

.touchy-inscription__submit {
	width: 100%;
	margin-top: 8px;
}

.touchy-inscription__alt {
	text-align: center;
	font-size: 13px;
	color: var(--fg-soft);
	margin: 16px 0 0;
}

.touchy-inscription__message p {
	margin: 0 0 12px;
}

.touchy-ui a {
	color: var(--primary);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
	text-decoration-color: var(--primary-soft);
}

.touchy-ui a:hover { text-decoration-color: var(--accent); }
.touchy-ui .ti-btn { text-decoration: none; }

/* ============================================================================
 * 4. ESPACE CLIENT
 * ========================================================================== */

body.touchy-account .woocommerce {
	display: flex !important;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 32px;
	max-width: 1240px;
	margin: 0 auto;
}

/* --- Colonne de navigation --------------------------------------------- */

body.touchy-account .woocommerce-MyAccount-navigation {
	flex: 1 1 260px;
	max-width: 280px;
	width: auto !important;
	float: none !important;
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-2);
	padding: 24px;
	position: sticky;
	top: 88px;
}

.ti-identity {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--border-soft);
	margin-bottom: 16px;
}

.ti-avatar {
	width: 64px;
	height: 64px;
	border-radius: var(--r-pill);
	background: linear-gradient(140deg, var(--ti-plum-300), var(--ti-cherry-500));
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-title);
	font-size: 26px;
	color: var(--ti-white);
	margin-bottom: 10px;
}

.ti-identity__name {
	font-weight: 700;
	font-size: 16px;
	color: var(--fg);
}

.ti-identity__email {
	font-size: 13px;
	color: var(--fg-soft);
	word-break: break-word;
}

.ti-pill {
	margin-top: 10px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--primary-tint);
	color: var(--primary);
	font-size: 12px;
	font-weight: 700;
	padding: 5px 12px;
	border-radius: var(--r-pill);
}

body.touchy-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ti-nav-group { margin-bottom: 16px; }

.ti-nav-group__title {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-mute);
	padding: 0 10px 8px;
}

body.touchy-account .woocommerce-MyAccount-navigation li {
	margin: 0 0 2px;
	padding: 0;
	list-style: none;
}

body.touchy-account .woocommerce-MyAccount-navigation li a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: var(--r-md);
	font-size: 14px;
	font-weight: 500;
	color: var(--fg-soft);
	text-decoration: none !important;
	transition: all 300ms ease;
}

body.touchy-account .woocommerce-MyAccount-navigation li a:hover {
	background: var(--ti-plum-100);
	color: var(--ti-plum-700);
}

body.touchy-account .woocommerce-MyAccount-navigation li.is-active a,
body.touchy-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active a {
	background: var(--primary-tint);
	color: var(--primary);
	font-weight: 700;
}

.ti-nav-icon {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
}

/* Onglet masqué pour les clients, visible des admins : œil barré à droite. */
.ti-nav-admin {
	display: inline-flex;
	margin-left: auto;
	color: var(--ti-mauve-400);
}

.ti-nav-logout {
	border-top: 1px solid var(--border-soft);
	margin-top: 8px;
	padding-top: 14px;
}

body.touchy-account .ti-nav-logout a {
	color: var(--danger) !important;
	font-weight: 600;
}

body.touchy-account .ti-nav-logout a:hover {
	background: var(--danger-bg);
}

/* Menu déroulant mobile — 100 % CSS, une seule liste dans le document.
   La case à cocher est masquée visuellement mais reste focusable au clavier. */

.ti-nav-toggle {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	pointer-events: none;
}

.ti-nav-summary {
	display: none; /* Affiché sous 860 px. */
	align-items: center;
	justify-content: space-between;
	background: var(--ti-white);
	border-radius: var(--r-lg);
	box-shadow: var(--sh-1);
	padding: 14px 18px;
	cursor: pointer;
	font-weight: 700;
	font-size: 15px;
	color: var(--fg);
}

.ti-nav-summary__current {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ti-nav-summary__current .ti-nav-icon { color: var(--primary); }

.ti-nav-summary__caret {
	color: var(--fg-soft);
	transition: all 300ms ease;
}

.ti-nav-toggle:checked ~ .ti-nav-summary .ti-nav-summary__caret {
	transform: rotate(180deg);
}

.ti-nav-toggle:focus-visible ~ .ti-nav-summary {
	box-shadow: var(--focus-ring);
}

/* --- Colonne de contenu ------------------------------------------------- */

body.touchy-account .woocommerce-MyAccount-content {
	flex: 3 1 480px;
	min-width: 0;
	width: auto !important;
	float: none !important;
	transition: all 300ms ease;
}

/* Chargement sans rechargement de page : on estompe sans faire sauter la
   mise en page, et on neutralise les clics le temps de la réponse. */
body.touchy-account .woocommerce-MyAccount-content.is-loading {
	opacity: 0.5;
	pointer-events: none;
}

body.touchy-account .woocommerce-MyAccount-content:focus,
body.touchy-account .woocommerce-MyAccount-content :focus:not(:focus-visible) {
	outline: none;
}

/* Toutes nos listes sont des listes sémantiques, jamais des listes à puces.
   Divi impose ses puces avec des sélecteurs à ID (.et-db #et-boc .et-l ul …) :
   il faut donc `!important` pour reprendre la main, sinon les pastilles
   réapparaissent et décalent le contenu. */
body.touchy-account ul.ti-stats,
body.touchy-account ul.ti-prefs,
body.touchy-account .woocommerce-MyAccount-navigation ul,
.touchy-ui ul.ti-stats {
	list-style: none !important;
	list-style-type: none !important;
	padding-left: 0 !important;
	margin-left: 0 !important;
}

/* Attention : la remise à zéro du padding ne doit PAS toucher les <li> qui sont
   eux-mêmes des cartes — c'est le cas de .ti-stat, dont elle écrasait le
   padding gauche et déséquilibrait le contenu. */
body.touchy-account ul.ti-prefs > li,
body.touchy-account .woocommerce-MyAccount-navigation ul > li {
	list-style: none !important;
	padding-left: 0 !important;
}

body.touchy-account ul.ti-stats > li {
	list-style: none !important;
}

body.touchy-account ul.ti-stats > li::before,
body.touchy-account ul.ti-stats > li::marker,
body.touchy-account ul.ti-prefs > li::before,
body.touchy-account ul.ti-prefs > li::marker,
body.touchy-account .woocommerce-MyAccount-navigation ul > li::before,
body.touchy-account .woocommerce-MyAccount-navigation ul > li::marker {
	content: none !important;
	display: none !important;
}

/* Statistiques */
.ti-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 16px;
	margin-bottom: 28px;
	list-style: none;
	padding: 0;
}

body.touchy-account .ti-stat,
.touchy-ui .ti-stat {
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	padding: 20px !important;
}

.ti-stat__label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	color: var(--fg-mute);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: 6px;
}

.ti-stat__value {
	display: block;
	font-family: var(--font-title);
	font-size: 36px;
	line-height: 1.1;
	color: var(--fg);
}

.ti-stat--primary .ti-stat__value { color: var(--primary); }

/* Lignes de commande */
.ti-row {
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	padding: 20px 22px;
	margin-bottom: 14px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
}

.ti-row__title {
	font-weight: 700;
	font-size: 15px;
	color: var(--fg);
}

.ti-row__meta {
	color: var(--fg-mute);
	font-weight: 500;
}

.ti-row__sub {
	font-size: 13px;
	color: var(--fg-soft);
	margin-top: 2px;
}

.ti-row__side {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.ti-row__total {
	font-weight: 700;
	font-size: 15px;
}

.ti-link-icon {
	vertical-align: -0.15em;
	margin-left: 2px;
}

.ti-link-strong {
	font-size: 13px;
	font-weight: 700;
	text-decoration: none !important;
	white-space: nowrap;
	color: var(--primary);
}

.ti-badge {
	font-size: 12px;
	font-weight: 700;
	padding: 6px 14px;
	border-radius: var(--r-pill);
	white-space: nowrap;
}

.ti-badge--success { background: var(--success-bg); color: var(--success); }
.ti-badge--info    { background: var(--primary-tint); color: var(--primary); }
.ti-badge--warning { background: var(--warning-bg); color: var(--warning); }
.ti-badge--danger  { background: var(--danger-bg); color: var(--danger); }

/* Avis */
.ti-review__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 8px;
}

.ti-stars {
	display: inline-flex;
	gap: 2px;
	color: var(--ti-banana-600);
	font-size: 15px;
	letter-spacing: 1px;
}

.ti-stars .is-off { color: var(--ti-mist-200); }

.ti-review__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 10px;
}

.ti-review__display {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--border-soft);
}

.ti-review__display .ti-field {
	margin-bottom: 6px;
}

.ti-review__preview {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--fg-soft);
}

.ti-review__preview strong {
	color: var(--ti-ink);
}

.ti-reviews-form > .ti-btn {
	margin-top: 4px;
}

.ti-review__text {
	font-size: 14px;
	color: var(--fg-soft);
	margin: 0 0 6px;
	line-height: 1.5;
}

.ti-review__date {
	font-size: 12px;
	color: var(--fg-mute);
}

.ti-callout {
	background: var(--accent-soft);
	border-radius: var(--r-xl);
	padding: 18px 22px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 22px;
	flex-wrap: wrap;
	font-size: 14px;
	font-weight: 600;
}

/* Préférences */
.ti-prefs {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ti-pref {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 0;
	border-bottom: 1px solid var(--border-soft);
}

.ti-prefs li:last-child .ti-pref { border-bottom: none; }

.ti-pref__main {
	display: flex;
	align-items: center;
	gap: 14px;
}

.ti-pref__main .ti-nav-icon {
	width: 20px;
	height: 20px;
	color: var(--primary);
}

/* Libellé et description sur deux lignes : en ligne, ils se collaient
   (« NewsletterNouveautés… »). */
.ti-pref__label {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: var(--fg);
}

.ti-pref__desc {
	display: block;
	margin-top: 2px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--fg-soft);
}

/* Interrupteur sans JavaScript : une vraie case à cocher déguisée. */
.ti-switch {
	position: relative;
	flex: 0 0 auto;
	width: 46px;
	height: 26px;
	cursor: pointer;
}

.ti-switch input {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
}

.ti-switch__track {
	display: block;
	width: 46px;
	height: 26px;
	border-radius: var(--r-pill);
	background: var(--border);
	transition: all 300ms ease;
	pointer-events: none;
}

.ti-switch__knob {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 20px;
	height: 20px;
	border-radius: var(--r-pill);
	background: var(--ti-white);
	box-shadow: var(--sh-1);
	transition: all 300ms ease;
	pointer-events: none;
}

.ti-switch input:checked ~ .ti-switch__track { background: var(--accent); }
.ti-switch input:checked ~ .ti-switch__knob { left: 23px; }
.ti-switch input:focus-visible ~ .ti-switch__track { box-shadow: var(--focus-ring); }

/* Support */
.ti-support-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}

.ti-support-card {
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	color: var(--fg) !important;
	text-decoration: none !important;
}

.ti-support-card svg { width: 26px; height: 26px; }
.ti-support-card--accent .ti-lucide { color: var(--accent); }
.ti-support-card--primary .ti-lucide { color: var(--primary); }
.ti-support-card--mint .ti-lucide { color: var(--ti-mint-600); }
.ti-support-card__title { font-weight: 700; font-size: 15px; }
.ti-support-card__sub { font-size: 13px; color: var(--fg-soft); }

.ti-support-card--accent svg { color: var(--accent); }
.ti-support-card--primary svg { color: var(--primary); }
.ti-support-card--mint svg { color: var(--ti-mint-600); }

/* --- Fidélité ---------------------------------------------------------- */

.ti-loyalty {
	background: linear-gradient(135deg, var(--ti-plum-600), var(--ti-plum-500));
	border-radius: var(--r-xl);
	box-shadow: 0 12px 28px rgba(102, 68, 143, 0.22);
	padding: 28px;
	color: var(--ti-cream);
	margin-bottom: 24px;
}

.ti-loyalty__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 14px;
}

.ti-loyalty__right { text-align: right; }

.ti-loyalty__label {
	display: block;
	font-size: 13px;
	opacity: 0.8;
}

.ti-loyalty__value {
	display: block;
	font-family: var(--font-title);
	font-size: 32px;
	line-height: 1.1;
}

.ti-loyalty__note {
	font-size: 13px;
	margin: 8px 0 0;
	opacity: 0.9;
}

.ti-progress {
	height: 10px;
	border-radius: var(--r-pill);
	background: rgba(255, 255, 255, 0.25);
	overflow: hidden;
}

.ti-progress__bar {
	display: block;
	height: 100%;
	border-radius: var(--r-pill);
	background: var(--ti-banana-500);
	transition: all 300ms ease;
}

.ti-rewards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 14px;
	margin-bottom: 28px;
}

.ti-reward {
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	padding: 18px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ti-reward__emoji { font-size: 26px; line-height: 1; }

.ti-reward__label {
	font-weight: 700;
	font-size: 14px;
	flex: 1;
	color: var(--fg);
}

.ti-reward__points {
	font-size: 13px;
	color: var(--fg-soft);
}

body.touchy-account .ti-btn--muted {
	background: var(--border-soft) !important;
	color: var(--fg-mute) !important;
	cursor: not-allowed;
}

body.touchy-account .ti-btn--muted:hover { transform: none; }

/* Bons de réduction */

.ti-coupon {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: 14px 0;
	border-bottom: 1px solid var(--border-soft);
}

.ti-coupon:last-child { border-bottom: none; }

.ti-code {
	font-family: var(--font-title);
	font-size: 22px;
	color: var(--primary);
	background: var(--primary-tint);
	padding: 4px 16px;
	border-radius: var(--r-pill);
	letter-spacing: 0.04em;
}

/* Historique de points */

.ti-history {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--border-soft);
}

.ti-history:last-child { border-bottom: none; }

.ti-history__label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--fg);
}

.ti-history__date {
	display: block;
	font-size: 12px;
	color: var(--fg-mute);
}

.ti-history__points {
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
}

.ti-history__points.is-positive { color: var(--success); }
.ti-history__points.is-negative { color: var(--fg-soft); }

/* --- Commandes : accordéon + détail ------------------------------------ */

.ti-orders { display: flex; flex-direction: column; gap: 12px; }

/* Ouverte par un lien (?commande=…#commande-…) : pas sous l'en-tête fixe. */
.ti-order {
	scroll-margin-top: 140px;
}

.ti-order {
	background: var(--ti-white);
	border-radius: var(--r-xl);
	box-shadow: var(--sh-1);
	overflow: hidden;
	transition: all 300ms ease;
}

.ti-order[open] { box-shadow: var(--sh-3); }

.ti-order__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding: 18px 22px;
	cursor: pointer;
	list-style: none;
	transition: all 300ms ease;
}

.ti-order__head::-webkit-details-marker { display: none; }
.ti-order__head:hover { background: var(--ti-cream); }

.ti-order__id {
	font-weight: 700;
	font-size: 15px;
	color: var(--fg);
}

.ti-order__date {
	font-weight: 500;
	color: var(--fg-mute);
	margin-left: 6px;
}

.ti-order__side {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}

.ti-order__count {
	font-size: 13px;
	color: var(--fg-soft);
}

.ti-order__total {
	font-weight: 700;
	font-size: 15px;
	color: var(--fg);
}

.ti-order__caret {
	color: var(--fg-soft);
	transition: all 300ms ease;
}

.ti-order[open] .ti-order__caret { transform: rotate(180deg); }

.ti-order__body {
	padding: 4px 22px 22px;
	border-top: 1px solid var(--border-soft);
}


.ti-orders__pagination {
	display: flex;
	gap: 10px;
	margin-top: 18px;
}

/* --- Récap d'une commande — maquette « Récap Commande » ----------------
 *
 * Utilisé dans l'accordéon « Mes commandes », sur la page d'une commande et
 * sur la page de remerciement. Trois blocs : le récap (tuiles), le colis
 * (articles + totaux + « Total »), les adresses (tuiles identiques).
 * ---------------------------------------------------------------------- */

.ti-recap {
	display: flex;
	flex-direction: column;
	gap: 18px;
	font-family: var(--font-body);
	color: var(--ti-ink);
}

.ti-recap__card {
	background: var(--ti-white);
	border: 1px solid var(--ti-mist-100);
	border-radius: 32px;
	padding: clamp(18px, 4.5vw, 28px);
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.06), 0 1px 2px rgba(45, 27, 71, 0.04);
}

/* Titre de bloc : Plus Jakarta Sans (pas Caveat, choix de Lucas). Un <p>
   et pas un <h2>, pour ne pas hériter de l'échelle des titres d'onglet. */
.ti-recap__title {
	margin: 0 0 18px !important;
	padding: 0 !important;
	font-family: var(--font-body) !important;
	font-size: clamp(19px, 4.5vw, 22px) !important;
	font-weight: 800 !important;
	letter-spacing: -0.01em !important;
	line-height: 1.2 !important;
	color: var(--ti-ink) !important;
}

.ti-recap__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 18px;
}

.ti-recap__head .ti-recap__title {
	margin: 0 !important;
}

.ti-recap__count {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ti-mauve-500);
	white-space: nowrap;
}

/* Tuiles */
.ti-recap__facts,
.ti-recap__addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
}

.ti-recap__fact {
	min-width: 0;
	margin: 0;
	padding: 14px 16px;
	border-radius: 20px;
	background: var(--ti-cream);
}

.ti-recap__fact dt,
.ti-recap__label {
	display: block;
	margin: 0 0 6px;
	padding: 0;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--ti-mauve-500);
}

.ti-recap__fact dd {
	margin: 0;
	padding: 0;
	font-size: 15.5px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--ti-ink);
	overflow-wrap: anywhere;
}

.ti-recap__address {
	display: flex;
	flex-direction: column;
}

.ti-recap__address address {
	flex: 1 1 auto;
	margin: 0;
	font-size: 14.5px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.6;
	color: var(--ti-ink);
	overflow-wrap: anywhere;
}

.ti-recap__empty {
	font-weight: 500;
	color: var(--ti-mauve-500);
}

/* Onglet « Mon adresse » : lien Modifier / Ajouter en pied de tuile. */
.touchy-ui .ti-recap__edit {
	align-self: flex-start;
	margin-top: 12px;
	font-size: 13.5px;
}

.ti-recap__callout {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	margin-top: 20px;
	padding: 15px 17px;
	border-radius: 20px;
	background: var(--ti-plum-50);
}

.ti-recap__callout-icon {
	margin-top: 1px;
	color: var(--ti-plum-600);
}

.ti-recap__callout p {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ti-plum-700);
}

/* Articles */
.ti-recap__items {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ti-recap__item {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 12px;
}

.ti-recap__thumb {
	display: block;
	width: 56px;
	height: 56px;
	overflow: hidden;
	border-radius: 14px;
	background: var(--ti-cream);
}

.ti-recap__thumb img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	object-fit: cover;
	border-radius: 0 !important;
}

.ti-recap__item-main {
	min-width: 0;
}

.ti-recap__item-name,
.ti-recap__item-name a {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ti-ink) !important;
	text-decoration: none !important;
}

.ti-recap__item-name a:hover {
	color: var(--ti-plum-600) !important;
}

.ti-recap__item-sub {
	margin-top: 3px;
	font-size: 13px;
	color: var(--ti-mauve-500);
}

.ti-recap__item-note {
	margin-top: 6px;
	font-size: 12.5px;
	color: var(--fg-soft);
}

.ti-recap__item-note p { margin: 0; }

.ti-recap__item-price {
	font-size: 15px;
	font-weight: 700;
	color: var(--ti-ink);
	white-space: nowrap;
}

/* Totaux */
.ti-recap__rule {
	height: 1px;
	margin: 20px 0 16px;
	background: var(--ti-mist-100);
}

.ti-recap__totals {
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.ti-recap__total {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 14.5px;
}

.ti-recap__total-label {
	font-weight: 600;
	color: var(--ti-mauve-500);
}

.ti-recap__total-value {
	font-weight: 700;
	color: var(--ti-ink);
	white-space: nowrap;
	text-align: right;
}

.ti-recap__total-value.is-good {
	color: #2e8a68;
}

.ti-recap__total-value small {
	display: block;
	font-size: 12px;
	font-weight: 500;
	color: var(--ti-mauve-500);
}

.ti-recap__paid {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-top: 18px;
	padding-top: 18px;
	border-top: 2px dashed var(--ti-mist-200);
}

.ti-recap__paid-label {
	font-family: var(--font-body);
	font-size: 18px;
	font-weight: 800;
	color: var(--ti-ink);
}

.ti-recap__paid-value {
	font-size: 27px;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--ti-cherry-500);
	white-space: nowrap;
}

.ti-recap__tax {
	margin-top: 7px;
	font-size: 12.5px;
	text-align: right;
	color: var(--ti-mauve-500);
}

.ti-recap__note {
	margin-top: 18px;
	padding: 14px 16px;
	border-radius: 20px;
	background: var(--ti-cream);
}

.ti-recap__note p {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

/* Dans l'accordéon « Mes commandes » : déjà dans une carte, les blocs
   deviennent de simples sections séparées d'un filet. */
.ti-order__body .ti-recap {
	gap: 0;
}

.ti-order__body .ti-recap__card {
	padding: 22px 0 0;
	border: none;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
}

.ti-order__body .ti-recap__card + .ti-recap__card {
	margin-top: 22px;
	border-top: 1px solid var(--ti-mist-100);
}

.ti-order__body .ti-recap__title {
	font-size: 19px !important;
}

@media (max-width: 640px) {
	.ti-order__head { padding: 16px; }
	.ti-order__body { padding: 4px 16px 18px; }
}

/* Page de remerciement : WooCommerce y pose sa propre liste « numéro, date,
   e-mail, total, paiement », que le récap reprend déjà en tuiles. */
.woocommerce-order:has(.ti-recap) .woocommerce-order-overview {
	display: none !important;
}

/* --- Parrainage --------------------------------------------------------- */

.ti-referral {
	background: linear-gradient(135deg, var(--ti-cherry-500), var(--ti-peach-500));
	border-radius: var(--r-xl);
	box-shadow: var(--sh-cherry);
	padding: 28px;
	color: var(--ti-white);
	margin-bottom: 24px;
}

.ti-referral__title { font-weight: 700; font-size: 16px; margin-bottom: 6px; }

.ti-referral__lede { font-size: 14px; margin: 0 0 16px; opacity: 0.95; }

.ti-referral__code {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: rgba(255, 255, 255, 0.22);
	border-radius: var(--r-pill);
	padding: 6px 6px 6px 18px;
}

.ti-referral__value {
	font-family: var(--font-title);
	font-size: 22px;
	letter-spacing: 0.04em;
}

body.touchy-account .ti-referral__copy {
	background: var(--ti-white) !important;
	color: var(--ti-cherry-700) !important;
}

body.touchy-account .ti-referral__copy:hover {
	background: var(--ti-cherry-100) !important;
}

.ti-referral__link {
	font-size: 13px;
	margin: 16px 0 0;
	opacity: 0.95;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.ti-referral__url {
	font-family: var(--font-mono, monospace);
	font-size: 12px;
	background: rgba(255, 255, 255, 0.18);
	padding: 6px 12px;
	border-radius: var(--r-sm);
	word-break: break-all;
}

/* Carte fidélité sans les paliers : le solde prend toute la largeur. */
.ti-loyalty--solo .ti-loyalty__row { justify-content: flex-start; }
.ti-loyalty--solo .ti-loyalty__right { text-align: left; }
.ti-loyalty--solo .ti-loyalty__value { font-size: 40px; }

/* --- Wishlist ---------------------------------------------------------- */

.ti-wishlist-form {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.ti-wishlist-form.is-busy { opacity: 0.6; pointer-events: none; }

/* Pilule « Ajouter à ma Wishlist » / « Ajouté à la Wishlist ».
   Non sélectionnée : fond blanc, liseré brume 1,5 px, encre, cœur.
   Sélectionnée : fond prune 600, texte crème, coche — le prune est la
   couleur de sélection du design system (la cerise est réservée aux
   appels à l'action et aux offres). */
.touchy-ui .ti-wishlist-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 11px 20px 11px 16px !important;
	border: 1.5px solid var(--border) !important;
	border-radius: var(--r-pill) !important;
	background: var(--ti-white) !important;
	box-shadow: none !important;
	color: var(--ti-ink) !important;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-wishlist-btn::after,
.touchy-ui .ti-wishlist-btn::before {
	content: none !important;
}

.touchy-ui .ti-wishlist-btn:hover {
	border-color: var(--ti-plum-400) !important;
	background: var(--ti-plum-50) !important;
}

.touchy-ui .ti-wishlist-btn.is-in,
.touchy-ui .ti-wishlist-btn.is-in:hover {
	border-color: var(--ti-plum-600) !important;
	background: var(--ti-plum-600) !important;
	color: var(--ti-cream) !important;
}

.touchy-ui .ti-wishlist-btn:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring) !important;
}

.ti-wishlist-btn__icon {
	display: inline-flex;
	color: var(--ti-plum-600);
}

.ti-wishlist-btn.is-in .ti-wishlist-btn__icon {
	color: var(--ti-cream);
}

.ti-wishlist-btn__on { display: none !important; }
.ti-wishlist-btn.is-in .ti-wishlist-btn__off { display: none !important; }
.ti-wishlist-btn.is-in .ti-wishlist-btn__on { display: inline-flex !important; }

/* Cœur des cartes produit : voir assets/heart.css (servi en ligne avec le cœur). */

.ti-wishlist-feedback {
	font-size: 13px;
	color: var(--fg-soft);
}

.ti-wishlist-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: var(--r-pill);
	background: var(--accent);
	color: var(--fg-on-accent) !important;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none !important;
}

/* Grille de la wishlist — cartes identiques à celles de la page Boutique
   (relevé du 26/09/2026) :
   carte    blanche, rayon 24 px, ombre 0 1px 4px rgba(0,0,0,.05) ;
            au survol ombre 0 2px 8px rgba(0,0,0,.15) et montée de 8 px ;
   image    carrée, pleine largeur, sans voile ni masque ;
   corps    4 / 16 / 16 px ;
   catégorie 12 px 600 capitales, brume 300, une ligne ;
   titre    20 px 700 prune 700 → prune 500 au survol ;
   texte    14 px 400 prune 600, 2 lignes (3 sous 980 px) ;
   attribut pastilles 12 px 600 prune 600 sur crème, liseré menthe ;
   pied     prix barré centré au-dessus du prix, Plus Jakarta 30 px 800
            cerise ; bouton rond cerise 46 px à droite. */

.ti-wishlist-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 24px;
}

.ti-wish-card {
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: 24px;
	background: var(--ti-white);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
	overflow: hidden;
	transition: all 300ms ease;
}

.ti-wish-card:hover {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	transform: translateY(-8px);
}

/* L'image remplit toute sa zone : positionnée en absolu dans un carré, et
   débarrassée de tout ce que le thème ou un plugin pourrait y poser
   (voile, filtre, masque, marge, arrondi, hauteur automatique). */
.ti-wish-card__image,
.touchy-ui a.ti-wish-card__image {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
	background: none !important;
	line-height: 0;
}

.ti-wish-card__image::before,
.ti-wish-card__image::after {
	content: none !important;
	display: none !important;
}

.touchy-ui .ti-wish-card__image img {
	position: absolute !important;
	inset: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: cover !important;
	opacity: 1 !important;
	filter: none !important;
	-webkit-mask-image: none !important;
	mask-image: none !important;
	clip-path: none !important;
	transform: none !important;
	box-shadow: none !important;
}

.ti-wish-card__body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	padding: 4px 16px 16px;
	background: var(--ti-white);
	font-family: var(--font-body);
}

.ti-wish-card__cat {
	display: block;
	margin-top: 8px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 12px;
	font-weight: 600;
	line-height: 23.8px;
	text-transform: uppercase;
	color: var(--ti-mist-300);
}

.touchy-ui .ti-wish-card__title {
	display: block;
	font-family: var(--font-body);
	font-size: 20px;
	font-weight: 700;
	line-height: 23.8px;
	color: var(--ti-plum-700) !important;
	text-decoration: none !important;
	transition: all 300ms ease;
}

.touchy-ui .ti-wish-card__title:hover {
	color: var(--ti-plum-500) !important;
}

.ti-wish-card__variation {
	margin-top: 4px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fg-soft);
}

.ti-wish-card__desc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin: 8px 0 0 !important;
	padding: 0 !important;
	font-size: 14px;
	font-weight: 400;
	line-height: 23.8px;
	color: var(--ti-plum-600);
}

@media (max-width: 980px) {
	.ti-wish-card__desc { -webkit-line-clamp: 3; }
}

.ti-wish-card__tags {
	display: flex;
	flex-wrap: wrap;
	margin-top: 16px;
}

.touchy-ui .ti-wish-card__tag {
	display: inline-block;
	margin: 0 6px 6px 0;
	padding: 4px 12px;
	border: 1px solid #cfeee2;
	border-radius: 999px;
	background: var(--ti-cream);
	font-size: 12px;
	font-weight: 600;
	line-height: 23.8px;
	color: var(--ti-plum-600) !important;
	text-decoration: none !important;
	transition: all 300ms ease;
}

.touchy-ui a.ti-wish-card__tag:hover {
	border-color: var(--ti-plum-600);
	background: var(--ti-plum-50);
}

.ti-wish-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 24px;
}

/* Prix barré centré au-dessus du prix, comme sur la boutique. */
.ti-wish-card__prices {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 0;
}

.ti-wish-card__regular {
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	line-height: 23.8px;
	color: var(--ti-peach-600);
	text-decoration: line-through;
}

.ti-wish-card__price {
	font-family: var(--font-body);
	font-size: 30px;
	font-weight: 800;
	line-height: 23.8px;
	color: var(--ti-cherry-500);
	white-space: nowrap;
}

.ti-wish-card__from {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	color: var(--fg-soft);
}

/* Produit en rupture : voile crème sur toute la carte, comme sur la boutique
   (plugin Filtres, --tif-rupture-voile). Le macaron et le cœur restent
   au-dessus ; le voile laisse passer les clics. */
.ti-wish-card.is-out::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: inherit;
	background: var(--tif-rupture-voile, rgba(248, 247, 241, 0.62));
	pointer-events: none;
}

.ti-wish-card.is-out .ti-wish-card__macaron,
.ti-wish-card.is-out .ti-wish-card__remove-form {
	z-index: 3;
}

/* Macaron en coin, couleurs de la boutique. */
.ti-wish-card__macaron {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 1;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--ti-cherry-500);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 800;
	line-height: 23.8px;
	color: var(--ti-ink);
}

.ti-wish-card__macaron--rupture { background: var(--ti-cream); }
.ti-wish-card__macaron--nouveau { background: var(--ti-banana-500); }

/* Cœur plein en coin : retire de la wishlist. */
.ti-wish-card__remove-form {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 1;
}

/* Sélecteur renforcé : la règle des boutons d'envoi de l'espace client
   (fond prune, padding en !important) le visait aussi. */
.touchy-ui .ti-wish-card__remove,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-card__remove[type="submit"] {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	min-height: 0;
	padding: 0 !important;
	border: none !important;
	border-radius: 999px !important;
	background: var(--ti-white) !important;
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.12);
	color: var(--ti-cherry-500) !important;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-wish-card__remove:hover,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-card__remove[type="submit"]:hover {
	background: var(--ti-cherry-100) !important;
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.12) !important;
	transform: scale(1.06);
}

/* Bouton rond de repli, si le shortcode [ti_ajout_panier] n'est pas posé. */
.touchy-ui .ti-wish-card__cta {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 999px;
	background: var(--ti-cherry-500);
	box-shadow: 0 1px 2px rgba(45, 27, 71, 0.05);
	color: var(--ti-white) !important;
	text-decoration: none !important;
	transition: all 300ms ease;
}

.touchy-ui .ti-wish-card__cta:hover {
	transform: translateY(-2px);
	box-shadow: var(--sh-2);
}

.touchy-ui .ti-wish-card__cta--voir {
	background: var(--ti-cream);
	border: 1px solid var(--border);
	color: var(--ti-plum-600) !important;
	box-shadow: none;
}

/* --- Formulaires WooCommerce natifs dans l'espace client ---------------- */

body.touchy-account .woocommerce-MyAccount-content form .form-row,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields .form-row {
	float: none;
	width: 100%;
	padding: 0 !important;
	margin: 0 0 var(--field-gap) !important;
}

/* Prénom / nom, code postal / ville : côte à côte, même écart que la pile. */
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper,
body.touchy-account .woocommerce-MyAccount-content form.edit-account {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--field-gap);
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > *,
body.touchy-account .woocommerce-MyAccount-content form.edit-account > * {
	grid-column: 1 / -1;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > .form-row-first,
body.touchy-account .woocommerce-MyAccount-content form.edit-account > .form-row-first {
	grid-column: 1;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > .form-row-last,
body.touchy-account .woocommerce-MyAccount-content form.edit-account > .form-row-last {
	grid-column: 2;
}

body.touchy-account .woocommerce-MyAccount-content form.edit-account > .clear {
	display: none;
}

@media (max-width: 560px) {
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > .form-row-first,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > .form-row-last,
	body.touchy-account .woocommerce-MyAccount-content form.edit-account > .form-row-first,
	body.touchy-account .woocommerce-MyAccount-content form.edit-account > .form-row-last {
		grid-column: 1 / -1;
	}
}

/* « Mon adresse » → Modifie : place et ordre fixés champ par champ, sans
   dépendre des classes ni de l'ordre que WooCommerce (et son script
   d'adresse, qui retrie les champs pays par pays) laisse dans la page.
   Prénom | nom, rue, code postal | ville, pays, mail | téléphone. */
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > * {
	order: 20;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_first_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_first_name_field {
	order: 1;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_last_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_last_name_field {
	order: 2;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_company_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_company_field {
	order: 3;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_address_1_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_address_1_field {
	order: 4;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_address_2_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_address_2_field {
	order: 5;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_postcode_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_postcode_field {
	order: 6;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_city_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_city_field {
	order: 7;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_state_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_state_field {
	order: 8;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_country_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_country_field {
	order: 9;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_email_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_email_field {
	order: 10;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_phone_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_phone_field {
	order: 11;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_first_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_first_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_postcode_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_postcode_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_email_field {
	grid-column: 1;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_last_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_last_name_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_city_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_city_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_phone_field {
	grid-column: 2;
}

/* Toute la ligne — dont le téléphone de livraison, sans mail à côté. */
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_company_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_company_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_address_1_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_address_1_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_address_2_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_address_2_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_state_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_state_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_country_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_country_field,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_phone_field {
	grid-column: 1 / -1;
}

@media (max-width: 560px) {
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_first_name_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_first_name_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_last_name_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_last_name_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_postcode_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_postcode_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_city_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_city_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_phone_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #shipping_phone_field,
	body.touchy-account .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > #billing_email_field {
		grid-column: 1 / -1;
	}
}

/* Pays, région : la liste habillée du tunnel de commande (select2). La liste
   déroulante est posée à la fin du document, hors du contenu du compte. */
body.touchy-account .woocommerce-MyAccount-content .select2-container {
	width: 100% !important;
}

body.touchy-account .woocommerce-MyAccount-content .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: var(--ti-mauve-500, #6f6580) transparent transparent;
}

body.touchy-account .woocommerce-MyAccount-content .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent var(--ti-mauve-500, #6f6580);
}

body.touchy-account .select2-container--default .select2-dropdown {
	border: 1.5px solid var(--ti-plum-500, #8662b0);
	border-radius: 14px;
	background: var(--bg-elevated, #ffffff);
	box-shadow: 0 12px 28px rgba(45, 27, 71, 0.12);
	overflow: hidden;
}

body.touchy-account .select2-container--default .select2-search--dropdown {
	padding: 8px;
}

body.touchy-account .select2-container--default .select2-search--dropdown .select2-search__field {
	padding: 10px 12px;
	border: 1.5px solid var(--ti-mist-200, #ddd7c8);
	border-radius: 12px;
	font-family: var(--font-body);
	font-size: 15px;
	color: var(--ti-ink, #2d1b47);
	outline: none;
}

body.touchy-account .select2-container--default .select2-results__option {
	padding: 10px 14px;
	color: var(--ti-ink, #2d1b47);
	font-family: var(--font-body);
	font-size: 14.5px;
	transition: all 300ms ease;
}

body.touchy-account .select2-container--default .select2-results__option--highlighted[aria-selected],
body.touchy-account .select2-container--default .select2-results__option--highlighted[data-selected] {
	background: var(--ti-plum-50, #f7eefc);
	color: var(--ti-plum-700, #4a2f70);
}

body.touchy-account .select2-container--default .select2-results__option[aria-selected="true"] {
	background: var(--ti-plum-100, #eeddf8);
	color: var(--ti-plum-700, #4a2f70);
	font-weight: 700;
}

body.touchy-account .woocommerce-MyAccount-content .form-row label:not(.ti-check):not(.checkbox),
body.touchy-account .woocommerce-MyAccount-content fieldset label:not(.ti-check) {
	display: block;
	margin: 0 0 6px !important;
	padding: 0 !important;
	font-family: var(--font-body);
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: var(--ti-ink) !important;
}

body.touchy-account .woocommerce-MyAccount-content label .required {
	color: var(--ti-cherry-600);
	text-decoration: none;
	border: none;
}

/* Le champ mot de passe de WooCommerce et son œil. */
body.touchy-account .woocommerce-MyAccount-content .password-input {
	display: block;
	position: relative;
}

body.touchy-account .woocommerce-MyAccount-content .show-password-input {
	top: 50% !important;
	right: 12px !important;
	transform: translateY(-50%);
}

body.touchy-account .woocommerce-MyAccount-content button[type="submit"]:not(.ti-btn):not(.ti-wish-card__remove):not(.ti-wish-act),
body.touchy-account .woocommerce-MyAccount-content .button:not(.ti-btn) {
	border: none !important;
	border-radius: var(--r-pill) !important;
	padding: 12px 24px !important;
	font-family: var(--font-body) !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	background: var(--primary) !important;
	color: var(--fg-on-primary) !important;
	text-transform: none !important;
	line-height: 1.2 !important;
}

body.touchy-account .woocommerce-MyAccount-content fieldset {
	border: none;
	margin: 16px 0 0;
	padding: 0;
	min-width: 0;
}

body.touchy-account .woocommerce-MyAccount-content fieldset legend {
	font-family: var(--font-body);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.35;
	color: var(--ti-ink);
	padding: 0;
	margin: 0 0 14px;
}

body.touchy-account .woocommerce-MyAccount-content table {
	border-radius: var(--r-lg);
	overflow: hidden;
	border-collapse: collapse;
	width: 100%;
	background: var(--ti-white);
}

body.touchy-account .woocommerce-MyAccount-content table th,
body.touchy-account .woocommerce-MyAccount-content table td {
	border: none !important;
	border-bottom: 1px solid var(--border-soft) !important;
	padding: 14px 16px !important;
	font-size: 14px;
}

/* --- Écran « Mon adresse » de WooCommerce ------------------------------ */

body.touchy-account .woocommerce-MyAccount-content > p:has(+ .woocommerce-Addresses),
body.touchy-account .woocommerce-MyAccount-content > p:has(+ .u-columns) {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--fg-soft);
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	width: 100%;
	margin: 0;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Addresses::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-Addresses::after {
	display: none;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 22px !important;
	border-radius: var(--r-xl);
	background: var(--ti-white);
	box-shadow: var(--sh-1);
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 12px;
	margin: 0 0 12px;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title::before,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title::after {
	display: none;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title h2,
body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title h3 {
	float: none !important;
	margin: 0 !important;
	font-size: 16px !important;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title .edit {
	float: none !important;
	font-size: 13px;
	font-weight: 700;
	color: var(--primary) !important;
	text-decoration: none !important;
	white-space: nowrap;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address-title .edit:hover {
	color: var(--accent) !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

body.touchy-account .woocommerce-MyAccount-content .woocommerce-Address address {
	margin: 0;
	font-size: 14px;
	font-style: normal;
	line-height: 1.6;
	color: var(--fg-soft);
}

/* --- Champs du plugin sur la page de commande -------------------------- */

.touchy-comptes-checkout-fields {
	margin-top: 12px;
}

/* ============================================================================
 * 5. RESPONSIVE
 * ========================================================================== */

@media (max-width: 860px) {

	body.touchy-account .woocommerce .woocommerce {
		gap: 20px;
	}

	body.touchy-account .woocommerce-MyAccount-navigation {
		flex: 1 0 100%;
		max-width: none;
		position: static;
		background: transparent;
		box-shadow: none;
		padding: 0;
	}

	.ti-identity { display: none; }

	.ti-nav-summary { display: flex; }

	.ti-nav-panel { display: none; }

	.ti-nav-toggle:checked ~ .ti-nav-panel {
		display: block;
		background: var(--ti-white);
		border-radius: var(--r-xl);
		box-shadow: var(--sh-3);
		padding: 16px;
		margin-top: 4px;
	}
}

@media (min-width: 861px) {
	/* Au-delà de 860 px, le panneau est toujours ouvert et le déclencheur
	   disparaît — quel que soit l'état de la case à cocher. */
	.ti-nav-summary { display: none; }
	.ti-nav-panel { display: block; }
}

/* ============================================================================
 * 6. WISHLIST PARTAGÉE — maquette « Page Wishlist Partagée »
 * ========================================================================== */

/* --- Onglet « Ma wishlist » : en-tête -------------------------------------- */

.ti-wish-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

/* Liste privée : pas d'aperçu (attribut hidden, plus fort que .ti-btn). */
.ti-share__preview[hidden] {
	display: none !important;
}

.touchy-ui .ti-share__preview,
body.touchy-account .ti-share__preview {
	gap: 8px;
	background: var(--ti-plum-50) !important;
	color: var(--ti-plum-700) !important;
	font-family: var(--font-title);
	font-size: 16px;
	font-weight: 400;
}

.ti-wish-count {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	margin: 28px 0 14px;
}

.ti-wish-count .ti-subtitle {
	margin: 0 !important;
	font-family: var(--font-title) !important;
	font-size: 26px !important;
	font-weight: 400 !important;
}

.ti-wish-count__shared {
	font-size: 13px;
	font-weight: 600;
	color: var(--ti-mauve-500);
}

.ti-wish-help {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 18px 0 0;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--fg-mute);
}

/* --- Panneau « Partage ta liste » ------------------------------------------ */

/* En haut de l'onglet, au-dessus des envies. */
.ti-share {
	position: relative;
	margin: 24px 0 0;
	padding: 24px;
	border: 1px solid var(--ti-mist-100);
	border-radius: 28px;
	background: var(--ti-white);
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.06), 0 1px 2px rgba(45, 27, 71, 0.04);
}

/* Repli quand la liste est privée : grille 0fr ↔ 1fr, pas de hauteur à
   calculer. visibility suit la transition : rien de focalisable une fois
   replié. */
.ti-share__fold {
	display: grid;
	grid-template-rows: 1fr;
	opacity: 1;
	visibility: visible;
	transition: all 300ms ease;
}

.ti-share:not(.is-on) .ti-share__fold {
	grid-template-rows: 0fr;
	opacity: 0;
	visibility: hidden;
}

.ti-share__body {
	min-height: 0;
	overflow: hidden;
	/* Marge pour l'anneau de focus des champs, que overflow rognerait. */
	margin: -4px;
	padding: 4px;
}

.ti-share:not(.is-on) .ti-share__state {
	margin-bottom: 0 !important;
}

.ti-share__head {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.ti-share__title {
	margin: 0 !important;
	font-family: var(--font-title);
	font-size: 26px;
	line-height: 1.1;
	color: var(--ti-ink);
}

/* Interrupteur : une vraie case à cocher déguisée, menthe quand actif. */
.ti-share__switch {
	position: relative;
	flex: 0 0 auto;
	width: 52px;
	height: 30px;
	cursor: pointer;
}

.ti-share__switch input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.ti-share__track {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 999px;
	background: var(--ti-mist-200);
	transition: all 300ms ease;
	pointer-events: none;
}

.ti-share__knob {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 24px;
	height: 24px;
	border-radius: 999px;
	background: var(--ti-white);
	box-shadow: var(--sh-1);
	transition: all 300ms ease;
	pointer-events: none;
}

.ti-share__switch input:checked ~ .ti-share__track { background: var(--ti-mint-500); }
.ti-share__switch input:checked ~ .ti-share__knob { left: 25px; }
.ti-share__switch input:focus-visible ~ .ti-share__track { box-shadow: var(--focus-ring); }

.ti-share__state {
	position: relative;
	margin: 0 0 16px !important;
	font-size: 14px;
	line-height: 1.55;
	color: var(--ti-mauve-500);
}

.ti-share .ti-share__state--on,
.ti-share.is-on .ti-share__state--off {
	display: none;
}

.ti-share.is-on .ti-share__state--on {
	display: block;
}

.ti-share__label {
	display: block;
	margin: 0 0 8px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--ti-mauve-500);
}

.ti-share__link {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 6px 6px 16px;
	border: 1.5px solid var(--border);
	border-radius: 999px;
	background: var(--ti-cream);
}

.touchy-ui .ti-share__link input,
body.touchy-account .woocommerce-MyAccount-content .ti-share__link input[type="text"] {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: var(--font-body);
	min-height: 0 !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--ti-ink) !important;
	text-overflow: ellipsis;
}

.touchy-ui .ti-share__copy {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	padding: 9px 16px !important;
	border: none !important;
	border-radius: 999px !important;
	background: var(--ti-plum-600) !important;
	color: var(--ti-cream) !important;
	font-family: var(--font-title);
	font-size: 16px;
	cursor: pointer;
}

.ti-share__apps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 14px 0 0;
}

.touchy-ui .ti-share__app {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 12px 4px !important;
	border: 1px solid var(--ti-peach-300) !important;
	border-radius: 18px !important;
	background: var(--ti-vanilla) !important;
	color: var(--ti-ink) !important;
	font-family: var(--font-body);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.4;
	text-decoration: none !important;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-share__app:hover {
	border-color: var(--ti-plum-400) !important;
	background: var(--ti-plum-50) !important;
}

.ti-share__app .ti-lucide,
.ti-share__app svg {
	color: var(--ti-plum-600);
}

/* Copié : coche à la place de l'icône, bouton menthe (comme le prototype). */
.ti-share .ti-share__ico--done,
.ti-share .is-copied .ti-share__ico--idle {
	display: none !important;
}

.ti-share .is-copied .ti-share__ico--done {
	display: inline-block !important;
}

.touchy-ui .ti-share__copy.is-copied {
	background: var(--ti-mint-500) !important;
	color: var(--ti-plum-800) !important;
}

.touchy-ui .ti-share__app.is-copied {
	border-color: var(--ti-mint-500) !important;
	background: var(--ti-mint-200) !important;
}

.ti-share__rule {
	height: 0;
	margin: 20px 0;
	border: 0;
	border-top: 1.5px dashed var(--ti-mist-200);
	background: none;
}

.ti-share .ti-field {
	margin-bottom: 6px;
}

.ti-share__hint {
	margin: 0 0 var(--field-gap);
}

.ti-share textarea.ti-input {
	resize: vertical;
	min-height: 84px;
}

.ti-share__counter {
	display: block;
	margin: 0 0 var(--field-gap);
	font-size: 12px;
	text-align: right;
	color: var(--fg-mute);
}

.ti-share__surprise {
	padding: 16px;
	border: 1px solid var(--ti-peach-300);
	border-radius: 18px;
	background: var(--ti-vanilla);
	font-size: 13.5px !important;
	color: var(--ti-mauve-500) !important;
}

.ti-share__surprise strong {
	font-size: 15px;
	color: var(--ti-ink);
}

.ti-share__saved {
	display: block;
	min-height: 18px;
	margin-top: 10px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ti-mauve-500);
}

.ti-share__promises {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 20px 0 0 !important;
	padding: 0 4px !important;
	list-style: none !important;
}

.ti-share__promises li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 0 !important;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--ti-mauve-500);
	list-style: none !important;
}

.ti-share__promises li::before,
.ti-share__promises li::marker {
	content: none !important;
}

.ti-share__promises .ti-lucide,
.ti-share__promises svg {
	margin-top: 2px;
	color: var(--ti-plum-400);
}

@media (max-width: 480px) {
	.ti-share { padding: 20px 16px; }
	.ti-share__apps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Cartes de la wishlist : coup de cœur, œil, corbeille ------------------ */

.ti-wish-card__fav {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: none;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--ti-cherry-500);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	font-family: var(--font-title);
	font-size: 15px;
	line-height: 1.3;
	color: var(--ti-white);
}

.ti-wish-card.is-fav .ti-wish-card__fav,
.ti-envie .ti-wish-card__fav {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

/* Macaron promo/rupture repoussé sous le coup de cœur. */
.ti-wish-card.is-fav .ti-wish-card__macaron {
	top: 46px;
}

.ti-wish-card.is-hidden .ti-wish-card__image img {
	opacity: 0.45 !important;
	filter: grayscale(0.4) !important;
}

.ti-wish-card__vis {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	font-size: 13px;
	font-weight: 600;
	color: #2e8a68;
}

.ti-wish-card__vis .ti-wish-card__vis-off,
.ti-wish-card.is-hidden .ti-wish-card__vis .ti-wish-card__vis-on {
	display: none;
}

.ti-wish-card.is-hidden .ti-wish-card__vis {
	color: var(--fg-mute);
}

.ti-wish-card.is-hidden .ti-wish-card__vis .ti-wish-card__vis-off {
	display: inline-flex;
}

.ti-wish-card__acts {
	display: flex;
	justify-content: flex-end;
	gap: 6px;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid var(--ti-mist-100);
}

.ti-wish-act-form,
.ti-wish-card__acts .ti-wishlist-form {
	margin: 0 !important;
	position: static;
}

.touchy-ui .ti-wish-act,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-act[type="submit"] {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	min-height: 0;
	padding: 0 !important;
	border: none !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--fg-mute) !important;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-wish-act:hover,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-act[type="submit"]:hover {
	background: var(--ti-plum-50) !important;
	color: var(--ti-plum-600) !important;
}

.touchy-ui .ti-wish-act--favorite.is-on,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-act--favorite.is-on {
	background: var(--ti-cherry-100) !important;
	color: var(--ti-cherry-500) !important;
}

.touchy-ui .ti-wish-act--hide.is-on,
body.touchy-account .woocommerce-MyAccount-content button.ti-wish-act--hide.is-on {
	background: var(--ti-mist-100) !important;
	color: var(--ti-ink) !important;
}

.ti-wish-act.is-busy {
	opacity: 0.5;
	pointer-events: none;
}

/* L'ancien cœur « retirer » en coin laisse la place à la corbeille. */
.ti-wish-card__acts .ti-wish-card__remove-form {
	position: static !important;
}

/* --- Page publique /envies/… ------------------------------------------------ */

/* Fond crème sur toute la page publique : Divi peint #main-content en blanc.
   Couleur en dur — les jetons ne sont définis que sous .touchy-ui. */
body.touchy-envies,
body.touchy-envies #page-container,
body.touchy-envies #et-main-area,
body.touchy-envies #main-content {
	background-color: #f8f7f1 !important;
}

.ti-envies {
	width: min(1180px, calc(100% - 32px));
	margin: 0 auto;
	padding: 0 0 72px;
	font-family: var(--font-body);
	color: var(--ti-ink);
}

/* Lien éteint (liste remise en privé, supprimée) — /envies/… */
.ti-envies__gone {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 620px;
	margin: clamp(40px, 8vw, 88px) auto 0;
	padding: clamp(28px, 6vw, 52px) clamp(20px, 5vw, 48px);
	border: 1px solid var(--ti-mist-100);
	border-radius: 32px;
	background: var(--ti-white);
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.06), 0 1px 2px rgba(45, 27, 71, 0.04);
	text-align: center;
}

.ti-envies__gone-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin: 0 0 20px;
	border-radius: 50%;
	background: var(--ti-plum-50);
	color: var(--ti-plum-600);
}

.ti-envies__gone .ti-eyebrow {
	margin: 0 0 8px;
}

.ti-envies__gone-title {
	margin: 0 0 12px !important;
	color: var(--ti-ink) !important;
	text-wrap: balance;
}

.ti-envies__gone-text {
	max-width: 460px;
	margin: 0 0 28px !important;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--ti-mauve-500);
	text-wrap: pretty;
}

.ti-envies__gone-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

@media (max-width: 480px) {
	.ti-envies__gone-actions {
		flex-direction: column;
		align-self: stretch;
	}

	.ti-envies__gone-actions .ti-btn {
		justify-content: center;
		width: 100%;
	}
}

.ti-envies__preview {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin: 20px 0 0;
	padding: 12px 12px 12px 20px;
	border-radius: 20px;
	background: var(--ti-ink);
	font-size: 14px;
	font-weight: 600;
	color: var(--ti-cream);
}

.ti-envies__preview > span {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.touchy-ui .ti-envies__preview-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	border: 1px solid rgba(248, 247, 241, 0.25);
	border-radius: 999px;
	background: rgba(248, 247, 241, 0.08);
	color: var(--ti-cream) !important;
	text-decoration: none !important;
}

.ti-envies__hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	align-items: center;
	gap: 32px;
	margin: 24px 0 28px;
	/* Pas de fond : directement sur le crème de la page (le dégradé
	   vanille d'avant jurait légèrement avec le fond du site). */
	padding: clamp(16px, 4vw, 40px) 0;
}


.ti-envies__hero-text,
.ti-envies__quote {
	position: relative;
	z-index: 1;
}

.ti-envies__hero .ti-eyebrow {
	color: var(--ti-plum-600);
}

.ti-envies__lede {
	margin: 12px 0 0 !important;
	max-width: 52ch;
	font-size: 16px;
	line-height: 1.65;
	color: var(--ti-mauve-500);
}

.ti-envies__quote {
	margin: 0;
	padding: 26px 26px 22px;
	border-radius: 26px;
	background: var(--ti-white);
	box-shadow: 0 8px 24px rgba(45, 27, 71, 0.1);
	transform: rotate(-1.5deg);
}

.ti-envies__quote-mark {
	display: block;
	height: 26px;
	font-family: var(--font-title);
	font-size: 44px;
	line-height: 1;
	color: var(--ti-cherry-300);
}

.ti-envies__quote blockquote {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	font-family: var(--font-title);
	font-size: clamp(20px, 2.6vw, 24px);
	font-style: normal;
	line-height: 1.35;
	color: var(--ti-ink);
}

.ti-envies__quote figcaption {
	margin-top: 12px;
	font-size: 14px;
	font-weight: 700;
	color: var(--ti-plum-600);
}

.ti-envies__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 0 0 40px !important;
	padding: 0 !important;
	list-style: none !important;
}

.ti-envies__steps li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 18px !important;
	border: 1px solid var(--ti-mist-100);
	border-radius: 22px;
	background: var(--ti-white);
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--ti-mauve-500);
	list-style: none !important;
}

.ti-envies__steps li::before,
.ti-envies__steps li::marker {
	content: none !important;
}

.ti-envies__steps strong {
	display: block;
	margin-bottom: 2px;
	font-size: 15px;
	color: var(--ti-ink);
}

.ti-envies__step-icon {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	background: var(--ti-plum-50);
	color: var(--ti-plum-600);
}

.ti-envies__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 18px;
}

.ti-envies__head .ti-title {
	margin: 0 !important;
}

/* « Ce qui lui ferait plaisir » : Plus Jakarta Sans — Caveat est déjà
   dans l'en-tête juste au-dessus. */
.ti-envies .ti-title.ti-envies__head-title {
	font-family: var(--font-body) !important;
	font-size: clamp(22px, 3.4vw, 30px) !important;
	font-weight: 800 !important;
	letter-spacing: -0.015em !important;
	line-height: 1.15 !important;
}

.ti-envies__count {
	font-size: 14px;
	font-weight: 600;
	color: var(--ti-mauve-500);
}

.ti-envies__grid {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.ti-envie__foot {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-top: auto;
	padding-top: 20px;
}

.ti-envie__foot .ti-wish-card__prices {
	align-items: flex-start;
}

.ti-envie__form {
	margin: 0 !important;
}

/* Bouton d'offre : pilule cerise pleine largeur (c'est l'appel à l'action). */
.touchy-ui .ti-envie__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 10px 18px !important;
	border: none !important;
	border-radius: 999px !important;
	background: var(--ti-cherry-500) !important;
	box-shadow: var(--sh-cherry);
	color: var(--ti-white) !important;
	font-family: var(--font-title);
	font-size: 19px;
	line-height: 1.1;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-envie__cta:hover {
	background: var(--ti-cherry-600) !important;
	transform: translateY(-1px);
}

.touchy-ui .ti-envie__cta.is-busy {
	opacity: 0.6;
	pointer-events: none;
}

.touchy-ui .ti-envie__cta--done,
.touchy-ui .ti-envie__cta--done:hover {
	border: 1.5px dashed var(--ti-mist-300) !important;
	background: var(--ti-cream) !important;
	box-shadow: none;
	color: var(--ti-mauve-500) !important;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 600;
	cursor: default;
	transform: none;
}

.touchy-ui .ti-envie__cta--mine,
.touchy-ui .ti-envie__cta--mine:hover {
	background: var(--ti-plum-600) !important;
	box-shadow: none;
	color: var(--ti-cream) !important;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 700;
}

.touchy-ui .ti-envie__cta--preview {
	cursor: default;
	opacity: 0.75;
}

.ti-envie__msg {
	display: block;
	min-height: 0;
	margin-top: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--ti-cherry-700);
}

.ti-envie__msg:empty {
	display: none;
}

/* Envie prise : voile sur l'image et badge au centre. */
.ti-envie.is-taken .ti-wish-card__image::after {
	content: "" !important;
	display: block !important;
	position: absolute;
	inset: 0;
	background: rgba(248, 247, 241, 0.62);
}

.ti-envie__taken {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--ti-white);
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.12);
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	color: var(--ti-plum-700);
}

/* Page publique : badge au centre de l'image, au-dessus du voile. */
.ti-wish-card__image .ti-envie__taken {
	top: 50%;
	right: auto;
	left: 50%;
	transform: translate(-50%, -50%);
}

.ti-envie.is-taken .ti-wish-card__title,
.ti-envie.is-taken .ti-wish-card__desc {
	opacity: 0.7;
}

.ti-envies__band,
.ti-envies__cta {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	align-items: center;
	gap: 24px;
	margin-top: 40px;
	padding: clamp(22px, 4vw, 36px);
	border-radius: 32px;
	background: var(--ti-white);
	border: 1px solid var(--ti-mist-100);
}

.ti-envies__band-title {
	margin: 0 0 8px !important;
	font-family: var(--font-body) !important;
	font-size: clamp(20px, 3vw, 24px) !important;
	font-weight: 800 !important;
	letter-spacing: -0.01em;
	line-height: 1.1 !important;
	color: var(--ti-ink) !important;
}

.ti-envies__band p,
.ti-envies__cta p {
	margin: 0 !important;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ti-mauve-500);
}

.ti-envies__band ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.ti-envies__band li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0 !important;
	font-size: 14.5px;
	font-weight: 600;
	list-style: none !important;
}

.ti-envies__band li::before,
.ti-envies__band li::marker {
	content: none !important;
}

.ti-envies__band li .ti-lucide,
.ti-envies__band li svg {
	flex: 0 0 auto;
	color: #2e8a68;
}

.ti-envies__cta {
	grid-template-columns: minmax(0, 1fr) auto;
	background: var(--ti-plum-50);
	border-color: transparent;
}

@media (max-width: 860px) {
	.ti-envies__hero,
	.ti-envies__band,
	.ti-envies__cta {
		grid-template-columns: minmax(0, 1fr);
	}

	.ti-envies__steps {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ============================================================================
 * ENVOI TDS — cadeaux livrés directement chez la TDS, adresse jamais en ligne
 * ========================================================================== */

/* Pseudo obligatoire, au-dessus de la bascule (visible même liste privée). */
.ti-share .ti-share__pseudo {
	margin: 4px 0 6px;
}

.ti-tds__title {
	margin: 0 0 6px !important;
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 800;
	color: var(--ti-ink);
}

.ti-tds__lede {
	margin: 0 0 16px !important;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--ti-mauve-500);
}

.ti-tds .ti-field {
	margin-bottom: var(--field-gap);
}

.ti-tds__choice {
	margin: 0 0 var(--field-gap);
	padding: 0;
	border: 0;
}

.ti-tds__choice legend {
	margin: 0 0 8px;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--ti-ink);
}

.touchy-ui .ti-tds__radio {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 8px;
	font-size: 14px;
	color: var(--ti-ink);
	cursor: pointer;
}

.touchy-ui .ti-tds__radio input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--ti-plum-600);
}

/* Carte de la liste : déclinaison à choisir. */
.touchy-ui .ti-tds-card-note {
	margin: 10px 0 0 !important;
	padding: 10px 12px;
	border-radius: 14px;
	background: var(--ti-banana-200);
	font-size: 13px;
	line-height: 1.5;
	color: var(--ti-ink);
}

.touchy-ui .ti-tds-card-note a {
	font-weight: 700;
	color: var(--ti-plum-600) !important;
}

/* Tunnel : bandeau cadeau, rappel « facturation seulement ». */
.ti-tds-banner {
	margin: 0 0 18px;
}

.ti-tds-hint {
	margin: 0 0 12px !important;
	font-size: 13.5px;
	font-weight: 600;
	color: #66448f;
}

/* Macaron pêche : cadeau livré directement à une TDS (récap de commande). */
.ti-tds-pill {
	display: inline-flex;
	align-items: center;
	margin-top: 6px;
	padding: 3px 10px;
	border-radius: 999px;
	background: #fec6b8;
	color: #2d1b47;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
}

/* Aperçu de la liste partagée : état du mode TDS (admins et TDS). */
.ti-envies__preview-tds {
	flex: 1 1 100%;
	font-size: 13px;
	font-weight: 500;
	opacity: 0.85;
}

/* --- Envoi TDS : panneau de partage (charte) ------------------------------ */

/* Pilules à choix unique (radio masqué, libellé en pilule). */
.touchy-ui .ti-seg {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.touchy-ui .ti-seg__opt {
	position: relative;
	margin: 0;
	cursor: pointer;
}

.touchy-ui .ti-seg__opt input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.touchy-ui .ti-seg__opt span {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 9px 18px;
	border: 1.5px solid var(--ti-mist-200);
	border-radius: 999px;
	background: var(--ti-white);
	font-size: 14px;
	font-weight: 600;
	color: var(--ti-ink);
	transition: all 300ms ease;
}

.touchy-ui .ti-seg__opt:hover span {
	border-color: var(--ti-plum-400);
	background: var(--ti-plum-50);
}

.touchy-ui .ti-seg__opt input:checked + span {
	border-color: var(--ti-plum-600);
	background: var(--ti-plum-600);
	color: var(--ti-cream);
}

.touchy-ui .ti-seg__opt input:focus-visible + span {
	box-shadow: var(--focus-ring);
}

.ti-tds .ti-share__label {
	margin-top: 4px;
}

.ti-tds .ti-tds__lede {
	margin: 0 0 16px !important;
}

.ti-tds .ti-share__surprise {
	margin-bottom: 10px;
}

.ti-tds__legend {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--ti-ink);
}

/* Photo de profil. */
.ti-tds__photo {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin: 0 0 var(--field-gap);
	transition: all 300ms ease;
}

.ti-tds__photo.is-busy {
	opacity: 0.6;
	pointer-events: none;
}

.ti-tds__avatar {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: 84px;
	height: 84px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--ti-plum-50);
	color: var(--ti-plum-400);
}

.ti-tds__avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ti-tds__photo-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}

.touchy-ui .ti-tds__upload {
	cursor: pointer;
}

.touchy-ui .ti-tds__remove,
.touchy-ui .ti-tds__add {
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 700;
	color: var(--ti-plum-600) !important;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
	transition: all 300ms ease;
}

.touchy-ui .ti-tds__remove:hover,
.touchy-ui .ti-tds__add:hover {
	color: var(--ti-cherry-600) !important;
}

.ti-tds__photo-msg {
	min-height: 16px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ti-mauve-500);
}

/* Liens. */
.ti-tds__links {
	margin: 0 0 var(--field-gap);
}

.ti-tds__link {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
	gap: 8px;
	margin: 0 0 8px;
}

.ti-tds__link[hidden] {
	display: none !important;
}

@media (max-width: 480px) {
	.ti-tds__link {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Nom affiché manquant : le champ se signale. */
.touchy-ui .ti-input.is-error {
	border-color: var(--ti-cherry-500) !important;
}

/* --- Envoi TDS : page publique, en-tête « personnalité » ----------------- */

.ti-envies__hero--profil {
	align-items: center;
}

.ti-envies__profil {
	display: flex;
	align-items: center;
	gap: clamp(18px, 3vw, 32px);
	min-width: 0;
}

.ti-envies__avatar {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: clamp(110px, 16vw, 168px);
	height: clamp(110px, 16vw, 168px);
	overflow: hidden;
	border: 5px solid var(--ti-white);
	border-radius: 50%;
	background: var(--ti-plum-100);
	box-shadow: 0 8px 24px rgba(45, 27, 71, 0.12);
	font-family: var(--font-title);
	font-size: clamp(48px, 7vw, 72px);
	color: var(--ti-plum-600);
}

.ti-envies__avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ti-envies__profil-text {
	min-width: 0;
}

.ti-envies__links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 16px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.ti-envies__links li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ti-envies__links li::before {
	content: none !important;
}

.touchy-ui .ti-envies__links a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--ti-white);
	box-shadow: 0 2px 8px rgba(45, 27, 71, 0.08);
	font-size: 14px;
	font-weight: 700;
	color: var(--ti-plum-700) !important;
	text-decoration: none !important;
	transition: all 300ms ease;
}

.touchy-ui .ti-envies__links a:hover {
	background: var(--ti-plum-600);
	color: var(--ti-cream) !important;
}

@media (max-width: 640px) {
	.ti-envies__profil {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* --- « Mon adresse » : livraison préférée --------------------------------- */

.ti-addresses .ti-shippref,
.woocommerce-MyAccount-content > .ti-shippref {
	margin-top: 18px;
}

.ti-shippref__lede {
	margin: -10px 0 16px !important;
}

.ti-shippref__methods {
	margin: 0 0 16px;
}

.ti-shippref__relay {
	margin: 0 0 16px;
}

.ti-shippref__relay[hidden] {
	display: none !important;
}

.ti-shippref__point {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0 0 10px;
}

.ti-shippref__point strong {
	font-size: 15px;
	color: var(--ti-ink);
}

.ti-shippref__point span {
	font-size: 13.5px;
	color: var(--ti-mauve-500);
}

.ti-shippref__map {
	margin: 12px 0;
	min-height: 420px;
}

.ti-shippref__relay .ti-tds__remove {
	display: block;
	margin-top: 10px;
}

.ti-shippref__save {
	margin-top: 4px;
}


/* « Infos personnelles » : la date de majorité ne colle plus au bouton. */
.touchy-comptes-account-fields {
	margin-bottom: 24px;
}

/* Compte pas encore confirmé : l'invitation remplace « Mon compte ». */
.ti-verify-gate form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin-top: 20px;
}


/* « Infos personnelles » : prénom et nom facultatifs (v0.22.4). L'étoile
   du gabarit WooCommerce est remplacée par la mention habituelle. */
body.touchy-account .woocommerce-MyAccount-content form.edit-account label[for="account_first_name"] .required,
body.touchy-account .woocommerce-MyAccount-content form.edit-account label[for="account_last_name"] .required {
	display: none !important;
}

body.touchy-account .woocommerce-MyAccount-content form.edit-account label[for="account_first_name"]::after,
body.touchy-account .woocommerce-MyAccount-content form.edit-account label[for="account_last_name"]::after {
	content: " (facultatif)";
	font-weight: 500;
	color: var(--fg-mute);
}

/* --- « Infos personnelles » : suppression du compte (v0.22.4) ------------- */

.ti-delete {
	margin: 40px 0 0;
	padding: 18px 22px;
	border: 1px solid var(--ti-mist-100);
	border-radius: 24px;
	background: var(--ti-white);
}

.ti-delete__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 15px;
	font-weight: 700;
	color: var(--ti-mauve-500);
	cursor: pointer;
	list-style: none;
	transition: all 300ms ease;
}

.ti-delete__summary::-webkit-details-marker {
	display: none;
}

.ti-delete__summary::after {
	content: "";
	width: 9px;
	height: 9px;
	margin-right: 4px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-3px);
	transition: all 300ms ease;
}

.ti-delete[open] .ti-delete__summary::after {
	transform: rotate(-135deg) translateY(-1px);
}

.ti-delete__summary:hover,
.ti-delete[open] .ti-delete__summary {
	color: var(--ti-ink);
}

.ti-delete[open] .ti-delete__summary {
	margin-bottom: 14px;
}

.ti-delete__text {
	margin: 0 0 10px !important;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ti-mauve-500);
}

.ti-delete__form {
	margin-top: 18px;
}

.touchy-ui .ti-delete__submit {
	border: 1.5px solid var(--ti-cherry-500) !important;
	background: var(--ti-white) !important;
	color: var(--ti-cherry-700) !important;
	transition: all 300ms ease;
}

.touchy-ui .ti-delete__submit:hover {
	background: var(--ti-cherry-500) !important;
	color: var(--ti-white) !important;
}