/* Couleurs de la favicon : fond du carré et symbole cadeau/cœur. */
body.maquette-app {
	--favicon-background: var(--bb9-green);
	--favicon-color: #ffffff;
}

:root {
	--bb9-green: #009898;
	--bb9-pink: #d3007a;
	--text: #263238;
	--muted: #6d7a80;
	--line: var(--brand-line, #dce8e8);
	--soft: var(--brand-background, #f4fbfb);
	--white: #fff;
	--radius-xl: 32px;
	--radius-lg: 26px;
	--shadow: 0 16px 40px rgba(var(--brand-primary-rgb, 0, 90, 90), .1);
	--font-ui: "Poppins", Arial, Helvetica, sans-serif;
}

body.maquette-app,
body.maquette-app * {
	box-sizing: border-box;
}

body.maquette-app {
	min-height: 100vh;
	margin: 0;
	padding-top: 110px;
	background: var(--soft);
	color: var(--text);
	font-family: var(--font-ui);
	font-feature-settings: "kern";
	text-rendering: geometricPrecision;
}

body.maquette-app a {
	color: inherit;
	text-decoration: none;
}

body.maquette-app strong,
body.maquette-app b {
	font-weight: 500;
}

body.maquette-app > .app {
	max-width: 1180px;
	margin: 0 auto;
	padding: 14px 14px 0;
}

.topbar {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1030;
	padding: 17px 14px 19px;
	background: rgba(244, 251, 251, .94);
	backdrop-filter: blur(10px);
}

.topbar-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 74px;
	max-width: 1180px;
	margin: 0 auto;
	padding: 12px 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .08);
}

.logo {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

header.topbar .logo img,
.logo img {
	display: block;
	width: 112px;
	height: 48px;
	border-radius: 0;
	flex: 0 0 auto;
	object-fit: contain;
	object-position: center;
}

.store-name {
	display: none;
	color: var(--muted);
	font-weight: 500;
	white-space: nowrap;
}

.topbar .nav {
	display: none;
	align-items: center;
	gap: 6px;
}

.topbar .nav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 16px;
	border-radius: 999px;
	color: #555;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}

.topbar .nav a.active {
	background: var(--bb9-green);
	color: var(--white);
}

.top-action {
	display: none;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 16px;
	border-radius: 999px;
	background: var(--bb9-pink);
	color: var(--white);
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}

.top-action:hover,
.top-action:focus,
.top-action.is-active {
	color: var(--white);
	text-decoration: none;
}

.topbar-caddy {
	display: none;
}

.cart-dropdown {
	position: relative;
	display: inline-flex;
}

.cart-dropdown .cart-trigger {
	border: 0;
	cursor: pointer;
	font-family: inherit;
}

.cart-trigger span + span:before {
	content: " — ";
}

.cart-dropdown-panel {
	position: absolute;
	top: calc(100% + 14px);
	right: 0;
	z-index: 1050;
	width: min(360px, calc(100vw - 28px));
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: var(--white);
	box-shadow: 0 20px 50px rgba(0, 70, 70, .18);
	color: var(--text);
	text-align: left;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-6px) scale(.98);
	transform-origin: top right;
	transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
	visibility: hidden;
}

.cart-dropdown.is-open .cart-dropdown-panel {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
	visibility: visible;
}

.cart-dropdown.is-closing .cart-dropdown-panel {
	opacity: 0;
	transform: translateY(-8px) scale(.96);
}

.cart-dropdown-panel:before {
	position: absolute;
	top: -8px;
	right: 36px;
	width: 16px;
	height: 16px;
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	background: var(--white);
	content: "";
	transform: rotate(45deg);
}

.cart-dropdown-header {
	display: grid;
	gap: 4px;
	padding: 0 2px 12px;
	border-bottom: 1px solid var(--line);
}

.cart-dropdown-header span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
}

.cart-dropdown-header strong {
	color: var(--bb9-pink);
	font-size: 17px;
	line-height: 1.25;
}

.cart-dropdown-empty {
	padding: 18px 4px;
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.35;
}

.cart-dropdown-items {
	display: grid;
	gap: 8px;
	max-height: 240px;
	overflow: auto;
	padding: 12px 0;
}

.cart-dropdown-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	width: 100%;
	padding: 10px 12px;
	border: 1px solid rgba(220, 232, 232, .9);
	border-radius: 16px;
	background: #fbffff;
	color: var(--text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	text-align: left;
}

button.cart-dropdown-item {
	cursor: pointer;
}

button.cart-dropdown-item:hover,
button.cart-dropdown-item:focus {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .35);
	background: #f2fbfb;
	outline: none;
}

.cart-dropdown-item span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cart-dropdown-item strong {
	color: var(--bb9-pink);
	white-space: nowrap;
}

.cart-dropdown-item.static {
	cursor: default;
}

.cart-dropdown-total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 4px;
	padding: 12px 2px;
	border-top: 1px solid var(--line);
	color: var(--text);
	font-size: 16px;
	font-weight: 600;
}

.cart-dropdown-total strong {
	color: var(--bb9-pink);
}

.cart-dropdown-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.cart-dropdown-actions.is-current-list .cart-dropdown-link.danger {
	grid-column: 1 / -1;
}

.cart-dropdown-link,
.cart-dropdown-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
}

.cart-dropdown-link {
	border: 1px solid var(--line);
	background: var(--white);
	color: var(--muted);
}

body.maquette-app .cart-dropdown-link {
	color: var(--muted);
}

button.cart-dropdown-link {
	cursor: pointer;
	font-family: inherit;
}

.cart-dropdown-link.danger {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .25);
	background: #fff2f8;
	color: var(--bb9-pink);
}

.cart-dropdown-primary {
	grid-column: 1 / -1;
	background: var(--bb9-green);
	color: var(--white);
}

body.maquette-app .cart-dropdown-primary {
	color: var(--white);
}

.cart-dropdown-link:hover,
.cart-dropdown-link:focus,
.cart-dropdown-primary:hover,
.cart-dropdown-primary:focus {
	text-decoration: none;
}

.mobile-nav {
	position: fixed;
	right: 14px;
	bottom: 12px;
	left: 14px;
	z-index: 1040;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
	padding: 8px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	box-shadow: 0 18px 48px rgba(0, 70, 70, .22);
}

.mobile-nav.has-mobile-cart {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mobile-nav > a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	width: 100%;
	min-height: 48px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--muted);
	font: inherit;
	font-size: 11px;
	font-weight: 600;
	cursor: pointer;
}

.mobile-nav > a.active {
	background: var(--bb9-green);
	color: var(--white);
}

.mobile-cart {
	position: relative;
	min-width: 0;
}

.mobile-cart .cart-dropdown {
	display: block;
	width: 100%;
}

.mobile-cart .cart-trigger {
	flex-direction: column;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 48px;
	padding: 0 8px;
	border: 0;
	border-radius: 999px;
	background: var(--bb9-pink);
	color: var(--white);
	font: inherit;
	font-size: 10.5px;
	font-weight: 600;
	line-height: 1.15;
	text-align: center;
	white-space: normal;
}

.mobile-cart .cart-trigger span {
	display: block;
}

.mobile-cart .cart-trigger span + span:before {
	content: "";
}

.mobile-cart .cart-trigger.is-active,
.mobile-cart .cart-trigger:hover,
.mobile-cart .cart-trigger:focus {
	background: var(--bb9-pink);
	color: var(--white);
	text-decoration: none;
}

.mobile-cart .cart-dropdown-panel {
	position: absolute;
	top: auto;
	right: 0;
	bottom: calc(100% + 14px);
	z-index: 1045;
	width: min(360px, calc(100vw - 28px));
	box-shadow: 0 20px 54px rgba(0, 70, 70, .24);
	transform: translateY(8px) scale(.98);
	transform-origin: bottom right;
}

.mobile-cart .cart-dropdown.is-open .cart-dropdown-panel {
	transform: translateY(0) scale(1);
}

.mobile-cart .cart-dropdown.is-closing .cart-dropdown-panel {
	transform: translateY(10px) scale(.96);
}

.mobile-cart .cart-dropdown-panel:before {
	display: none;
}

.mobile-cart .cart-dropdown-panel:after {
	position: absolute;
	right: 22px;
	bottom: -8px;
	width: 16px;
	height: 16px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: var(--white);
	content: "";
	transform: rotate(45deg);
}

.back-to-top {
	position: fixed;
	right: 18px;
	bottom: 118px;
	z-index: 1035;
	display: grid;
	width: 48px;
	height: 48px;
	place-items: center;
	border: 1px solid rgba(var(--brand-accent-rgb, 211, 0, 122), .35);
	border-radius: 50%;
	background: var(--bb9-pink);
	box-shadow: 0 14px 34px rgba(var(--brand-accent-rgb, 211, 0, 122), .22);
	color: var(--white);
	font-size: 24px;
	opacity: 0;
	pointer-events: none;
	transform: translateY(8px);
	transition: opacity .2s ease, transform .2s ease;
}

.back-to-top.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.app-loading {
	display: grid;
	min-height: 320px;
	place-items: center;
	align-content: center;
	padding: 40px 20px;
	text-align: center;
}

.app-loading i {
	color: var(--bb9-green);
}

.app-loading h1 {
	margin: 20px 0 6px;
	color: var(--text);
	font-size: 28px;
}

.app-loading p {
	margin: 0;
	color: var(--muted);
}

.hero {
	position: relative;
	display: grid;
	gap: 16px;
	overflow: hidden;
	margin-top: 12px;
	padding: 22px 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
	text-align: left;
}

.hero:after {
	position: absolute;
	top: -90px;
	right: -120px;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	content: "";
}

.hero > * {
	position: relative;
	z-index: 1;
}

.hero .eyebrow {
	margin: 0 0 10px;
	color: var(--muted);
	font-size: 15px;
	font-weight: 600;
	text-transform: uppercase;
}

.hero h1 {
	max-width: 760px;
	margin: 0;
	color: var(--bb9-pink);
	font-size: 32px;
	font-weight: 500;
	letter-spacing: -.03em;
	line-height: 1.08;
}

.hero-title-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
}

.hero h1.hero-parent-names {
	max-width: 820px;
}

.hero h1.hero-parent-names span {
	color: var(--bb9-green);
	font-weight: 400;
}

.hero-trust-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 40px;
	padding: 8px 15px 8px 12px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .07);
	color: var(--text);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
}

.hero-trust-badge i {
	display: inline-grid;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--bb9-green);
	color: #fff;
	font-size: 13px;
	place-items: center;
}

.hero-trust-badge {
	min-height: 34px;
	padding: 6px 13px 6px 8px;
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .16);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: #007f7f;
	font-size: 13px;
}

.hero-trust-badge i {
	width: 22px;
	height: 22px;
	background: var(--bb9-green);
	color: #fff;
	font-size: 12px;
}

.hero p:not(.eyebrow) {
	max-width: 660px;
	margin: 12px 0 0;
	color: var(--muted);
	font-size: 16px;
	line-height: 1.5;
}

.hero-parent-message {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 22px;
	max-width: 720px;
	margin-top: 22px;
	padding: 28px 30px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	border-left: 7px solid var(--bb9-green);
	border-radius: 22px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .08), rgba(255, 255, 255, .96));
	box-shadow: 0 14px 32px rgba(var(--brand-primary-rgb, 0, 90, 90), .08);
	color: var(--muted);
	font-size: 16px;
	line-height: 1.5;
}

.hero-parent-message h2 {
	margin: 0 0 8px;
	color: var(--text);
	font-size: 19px;
	font-weight: 600;
}

.hero-parent-message-icon {
	display: inline-grid;
	flex: 0 0 auto;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .12);
	color: var(--bb9-green);
	font-size: 28px;
	place-items: center;
}

.hero-parent-message p,
.hero-parent-message div {
	margin: 0;
}

.hero-actions {
	display: grid;
	gap: 10px;
	margin-top: 22px;
}

.maquette-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--text);
	font: inherit;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
}

.maquette-btn.primary {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

.maquette-btn.secondary {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

.section {
	margin-top: 20px;
}

.section-header {
	margin-bottom: 12px;
	padding: 0 4px;
}

.section-header h2 {
	margin: 0;
	color: var(--text);
	font-size: 24px;
	font-weight: 500;
	letter-spacing: -.025em;
}

.section-header p {
	margin: 5px 0 0;
	color: var(--muted);
	line-height: 1.45;
}

.intro-grid,
.action-grid {
	display: grid;
	gap: 12px;
}

/* Contact magasin */
body.maquette-app .contact-page {
	display: grid;
	gap: 20px;
	color: var(--text);
	font-family: var(--font-ui);
}

body.maquette-app .contact-page a,
body.maquette-app .contact-page a:hover,
body.maquette-app .contact-page a:focus {
	text-decoration: none;
}

body.maquette-app .contact-hero {
	align-items: center;
}

body.maquette-app .contact-layout {
	display: grid;
	gap: 16px;
}

body.maquette-app .contact-card {
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

body.maquette-app .contact-form-card,
body.maquette-app .contact-store-card,
body.maquette-app .contact-result-card {
	padding: 22px;
}

body.maquette-app .contact-card-header {
	margin-bottom: 16px;
}

body.maquette-app .contact-card-header p,
body.maquette-app .contact-result-eyebrow {
	margin: 0 0 6px;
	color: var(--muted);
	font-size: 15px;
	font-weight: 500;
}

body.maquette-app .contact-card-header h2,
body.maquette-app .contact-result-card h2 {
	margin: 0;
	color: var(--text);
	font-size: 26px;
	font-weight: 500;
	letter-spacing: -.025em;
	line-height: 1.1;
}

body.maquette-app .contact-card-header-compact h2 {
	font-size: 20px;
	letter-spacing: -.015em;
}

body.maquette-app .contact-form-grid {
	display: grid;
	gap: 10px;
}

body.maquette-app .contact-field {
	display: grid;
	align-content: center;
	gap: 8px;
	min-width: 0;
	margin: 0;
	padding: 15px 18px;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: #f9fdfd;
}

body.maquette-app .contact-field span {
	color: var(--bb9-green);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .02em;
	text-transform: uppercase;
}

body.maquette-app .contact-field input,
body.maquette-app .contact-field textarea {
	width: 100%;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 17px;
	font-weight: 400;
	outline: none;
	box-shadow: none;
}

body.maquette-app .contact-field input {
	min-height: 26px;
	padding: 0;
}

body.maquette-app .contact-field textarea {
	min-height: 132px;
	padding: 0;
	resize: vertical;
}

body.maquette-app .contact-field input::placeholder,
body.maquette-app .contact-field textarea::placeholder {
	color: rgba(109, 124, 132, .72);
	font-weight: 400;
}

body.maquette-app .contact-field:focus-within {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .45);
	background: var(--white);
}

body.maquette-app .contact-copy {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
}

body.maquette-app .contact-copy input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--bb9-green);
}

body.maquette-app .contact-copy span {
	color: var(--muted);
	font-size: 14px;
	letter-spacing: 0;
	text-transform: none;
}

body.maquette-app .contact-actions {
	display: grid;
	margin-top: 14px;
}

body.maquette-app .contact-actions .maquette-btn {
	width: 100%;
	min-width: 0;
	margin: 0;
}

body.maquette-app .maquette-btn.is-disabled {
	border-color: var(--line);
	background: rgba(109, 124, 132, .12);
	color: rgba(109, 124, 132, .75);
	pointer-events: none;
	box-shadow: none;
}

body.maquette-app .contact-info-list {
	display: grid;
}

body.maquette-app .contact-info-item {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr);
	gap: 13px;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid var(--line);
}

body.maquette-app .contact-info-item:last-child {
	border-bottom: 0;
}

body.maquette-app .contact-info-item > i {
	display: grid;
	width: 42px;
	height: 42px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 18px;
}

body.maquette-app .contact-info-item span {
	display: block;
	margin-bottom: 4px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .contact-info-item strong {
	display: block;
	color: var(--text);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

body.maquette-app .contact-store-actions {
	display: grid;
	gap: 10px;
	margin-top: 18px;
}

body.maquette-app .contact-store-actions .maquette-btn {
	gap: 8px;
	min-height: 48px;
	margin: 0;
	padding-inline: 12px;
	border-radius: 999px;
	font-size: 16px;
	font-weight: 500;
	box-shadow: none;
}

body.maquette-app .contact-store-actions .maquette-btn.primary {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .2);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

body.maquette-app .contact-store-actions .maquette-btn.secondary {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--bb9-green);
}

body.maquette-app .contact-reassurance {
	display: grid;
	gap: 0;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

body.maquette-app .contact-reassurance article {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr);
	gap: 18px;
	align-items: center;
	padding: 22px 28px;
	background: transparent;
}

body.maquette-app .contact-reassurance i {
	display: grid;
	width: 54px;
	height: 54px;
	grid-row: 1 / 3;
	place-items: center;
	border-radius: 50%;
	border: 1px solid var(--line);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
	font-size: 22px;
}

body.maquette-app .contact-reassurance h3 {
	grid-column: 2;
	margin: 0 0 6px;
	color: var(--text);
	font-size: 19px;
	font-weight: 500;
}

body.maquette-app .contact-reassurance p {
	grid-column: 2;
}

body.maquette-app .contact-reassurance p,
body.maquette-app .contact-result-card p {
	margin: 0;
	color: var(--muted);
	font-size: 16px;
	line-height: 1.45;
}

body.maquette-app .contact-result-card {
	display: grid;
	align-content: center;
	justify-items: start;
	gap: 12px;
	min-height: 360px;
}

body.maquette-app .contact-result-icon {
	display: grid;
	width: 66px;
	height: 66px;
	place-items: center;
	border-radius: 50%;
	color: var(--white);
	font-size: 26px;
}

body.maquette-app .contact-result-icon.is-success {
	background: var(--bb9-green);
	box-shadow: 0 14px 32px rgba(var(--brand-primary-rgb, 0, 152, 152), .22);
}

body.maquette-app .contact-result-icon.is-error {
	background: var(--bb9-pink);
	box-shadow: 0 14px 32px rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
}

body.maquette-app .contact-result-card > .maquette-btn {
	margin-top: 8px;
}

@media (max-width: 719px) {
	.hero-title-row {
		display: grid;
		gap: 12px;
	}

	.hero-parent-message {
		grid-template-columns: auto minmax(0, 1fr);
		align-items: start;
		gap: 14px;
		padding: 20px;
	}

	.hero-parent-message-icon {
		width: 46px;
		height: 46px;
		font-size: 22px;
	}

	.hero-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hero-stat {
		grid-template-columns: 1fr;
		justify-items: center;
		min-height: 104px;
		padding: 14px 10px;
		text-align: center;
	}

	.hero-stat > i {
		grid-row: auto;
		width: 38px;
		height: 38px;
		margin-bottom: 8px;
		font-size: 18px;
	}

	.hero-stat strong {
		font-size: 22px;
	}

	body.maquette-app .contact-form-card,
	body.maquette-app .contact-store-card,
	body.maquette-app .contact-result-card {
		padding: 18px;
	}

	body.maquette-app .contact-card-header h2,
	body.maquette-app .contact-result-card h2 {
		font-size: 26px;
	}

	body.maquette-app .contact-card-header-compact h2 {
		font-size: 20px;
	}

	body.maquette-app .contact-field {
		padding: 16px 18px;
	}

	body.maquette-app .contact-actions {
		display: grid;
	}

	body.maquette-app .contact-actions .maquette-btn {
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .contact-store-actions {
		grid-template-columns: 1fr;
	}

	body.maquette-app .contact-reassurance article {
		border-bottom: 1px solid var(--line);
	}

	body.maquette-app .contact-reassurance article:last-child {
		border-bottom: 0;
	}
}

@media (min-width: 720px) {
	body.maquette-app .contact-hero {
		grid-template-columns: minmax(0, 1fr) auto;
		padding: 34px;
	}

	body.maquette-app .contact-layout {
		grid-template-columns: minmax(0, 1fr) 340px;
		align-items: start;
	}

	body.maquette-app .contact-result-layout {
		grid-template-columns: minmax(0, 1fr) 380px;
	}

	body.maquette-app .contact-store-card {
		position: sticky;
		top: 110px;
	}

	body.maquette-app .contact-form-card,
	body.maquette-app .contact-store-card,
	body.maquette-app .contact-result-card {
		padding: 28px;
	}

	body.maquette-app .contact-form-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .contact-field-wide,
	body.maquette-app .contact-copy {
		grid-column: 1 / -1;
	}

	body.maquette-app .contact-reassurance {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body.maquette-app .contact-reassurance article {
		border-right: 1px solid var(--line);
	}

	body.maquette-app .contact-reassurance article:last-child {
		border-right: 0;
	}
}

.intro-card,
.action-card,
.search-card,
.result,
.empty-state,
.alert-card,
.store-presentation-content {
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

.intro-card,
.action-card {
	padding: 20px;
	text-align: center;
}

.intro-card h3,
.action-card h3 {
	margin: 0 0 8px;
	font-size: 19px;
}

.intro-card p,
.action-card p {
	margin: 0;
	color: var(--muted);
	line-height: 1.5;
}

.intro-icon {
	display: grid;
	width: 58px;
	height: 58px;
	margin: 0 auto 12px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 24px;
	font-weight: 600;
}

.action-card .maquette-btn {
	width: 100%;
	margin-top: 16px;
}

.hero-stats {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}

.hero-stat {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	column-gap: 16px;
	padding: 18px 22px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: #f9fdfd;
	text-align: left;
}

.hero-stat > i {
	display: grid;
	grid-row: 1 / span 2;
	width: 58px;
	height: 58px;
	margin: 0;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .12);
	color: var(--bb9-green);
	font-size: 27px;
	place-items: center;
}

.hero-stat:nth-child(2) {
	border-color: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .16);
	background: linear-gradient(180deg, #fff, rgba(var(--brand-accent-light-rgb, 255, 91, 172), .045));
}

.hero-stat:nth-child(2) > i {
	background: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .12);
	color: var(--bb9-pink);
}

.hero-stat:nth-child(2) strong {
	color: var(--bb9-pink);
}

.hero-stat strong {
	display: block;
	margin-bottom: 5px;
	color: var(--bb9-green);
	font-size: 25px;
	line-height: 1;
}

.hero-stat span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
}

.steps {
	--step-mobile-width: clamp(104px, 30vw, 124px);
	display: flex;
	gap: 12px;
	overflow-x: auto;
	padding: 0 0 4px;
	scroll-padding-inline: calc((100% - var(--step-mobile-width)) / 2);
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.steps:before,
.steps:after {
	flex: 0 0 calc((100% - var(--step-mobile-width)) / 2);
	content: "";
}

.steps::-webkit-scrollbar {
	display: none;
}

.step {
	display: grid;
	flex: 0 0 var(--step-mobile-width);
	grid-template-columns: 1fr;
	gap: 10px;
	align-items: center;
	padding: 12px 8px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
	scroll-snap-align: center;
	text-align: center;
}

.step-number {
	display: grid;
	width: 44px;
	height: 44px;
	margin: 0 auto;
	place-items: center;
	border-radius: 50%;
	background: var(--bb9-green);
	color: var(--white);
	font-weight: 600;
}

.step h3 {
	overflow: hidden;
	margin: 0;
	font-size: 13px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.step p {
	display: none;
	margin: 4px 0 0;
	color: var(--muted);
	line-height: 1.45;
}

.step.is-current {
	border-color: var(--bb9-pink);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
	box-shadow: 0 14px 34px rgba(var(--brand-accent-rgb, 211, 0, 122), .14);
}

.step.is-current .step-number {
	background: var(--bb9-pink);
}

.step.is-done {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .26);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--bb9-green);
}

.step.is-done .step-number {
	background: var(--bb9-green);
	color: var(--white);
}

.step.is-upcoming {
	border-color: #e4e9eb;
	background: #f4f7f7;
	color: #8b969b;
	opacity: .72;
}

.step.is-upcoming .step-number {
	background: #d8e1e1;
	color: #7b878c;
}

.search-card {
	display: grid;
	gap: 14px;
	padding: 16px;
}

.search-input {
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 0 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #f9fdfd;
	color: var(--bb9-green);
}

.search-input i {
	margin-right: 12px;
}

.search-input input {
	width: 100%;
	min-width: 0;
	min-height: 52px;
	border: 0;
	outline: 0;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 16px;
	font-weight: 500;
}

.search-hint {
	align-self: center;
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
	text-align: center;
}

.results {
	display: grid;
	gap: 10px;
	margin-top: 14px;
}

.result {
	display: grid;
	gap: 16px;
	align-items: center;
	padding: 24px;
	background: #f9fdfd;
	text-align: center;
}

.result strong {
	display: block;
	color: var(--bb9-green);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.result h3 {
	margin: 6px 0 8px;
	color: var(--text);
	font-size: 25px;
	line-height: 1.1;
}

.result span,
.result small {
	display: block;
	color: var(--muted);
	line-height: 1.5;
}

.result small {
	margin-top: 5px;
}

.result .maquette-btn {
	width: 100%;
}

.search-result {
	animation: searchResultIn .22s ease both;
	transform-origin: center top;
	will-change: opacity, transform, max-height, margin;
}

.search-result.is-leaving {
	animation: searchResultOut .22s ease both;
	overflow: hidden;
	pointer-events: none;
}

@keyframes searchResultIn {
	from {
		opacity: 0;
		transform: translateY(-8px) scale(.985);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes searchResultOut {
	from {
		max-height: 180px;
		opacity: 1;
		transform: translateY(0) scale(1);
	}
	to {
		max-height: 0;
		margin-top: -10px;
		padding-top: 0;
		padding-bottom: 0;
		opacity: 0;
		transform: translateY(-8px) scale(.985);
	}
}

.empty-state,
.alert-card {
	margin-top: 14px;
	padding: 22px;
	text-align: center;
}

.empty-state > i,
.alert-card > i {
	display: grid;
	width: 54px;
	height: 54px;
	margin: 0 auto 14px;
	place-items: center;
	border-radius: 50%;
	border: 1px solid var(--line);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--bb9-green);
	font-size: 22px;
}

.alert-card > i {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .09);
	color: var(--bb9-pink);
}

.empty-state h3,
.alert-card strong {
	display: block;
	margin: 0 0 5px;
	color: var(--text);
	font-size: 19px;
}

.empty-state p,
.alert-card p {
	margin: 0;
	color: var(--muted);
	line-height: 1.45;
}

.empty-state .maquette-btn {
	margin-top: 18px;
}

.alert-card {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .2);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .06);
}

.message-card {
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
	text-align: center;
}

.message-card h3 {
	margin: 0 0 8px;
	font-size: 19px;
}

.message-card p {
	margin: 0 0 12px;
	color: var(--muted);
	line-height: 1.5;
}

.message-card.warning {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .24);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .06);
}

.participation-card,
.gift-card,
.cart-page-item,
.order-summary,
.donor-section {
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

.participation-card {
	display: grid;
	gap: 12px;
	padding: 16px;
}

.amount-options {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.amount-options button,
.amount-field {
	min-height: 52px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #f9fdfd;
	color: var(--text);
	font: inherit;
	font-weight: 600;
	text-align: center;
}

.amount-options button.active {
	border-color: var(--bb9-pink);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

.amount-field {
	display: flex;
	align-items: center;
	padding: 0 18px;
}

.amount-field input {
	width: 100%;
	border: 0;
	outline: 0;
	background: transparent;
	font: inherit;
	font-weight: 600;
	text-align: center;
}

.sort-bar {
	display: grid;
	gap: 10px;
	margin-bottom: 14px;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

.sort-toggle {
	display: none;
}

.sort-select-wrap {
	position: relative;
	display: none;
	gap: 8px;
}

.sort-select-wrap span,
.sort-bar span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
}

.sort-select-wrap select {
	width: 100%;
	min-height: 52px;
	appearance: none;
	padding: 0 48px 0 18px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .12), rgba(var(--brand-accent-rgb, 211, 0, 122), .08)), var(--white);
	color: var(--text);
	font: inherit;
	font-weight: 600;
}

.sort-select-wrap:after {
	position: absolute;
	right: 20px;
	bottom: 21px;
	width: 10px;
	height: 10px;
	border-right: 3px solid var(--bb9-green);
	border-bottom: 3px solid var(--bb9-green);
	content: "";
	pointer-events: none;
	transform: rotate(45deg);
}

.sort-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.sort-direction {
	display: flex;
}

.sort-buttons button {
	min-height: 40px;
	padding: 0 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #f9fdfd;
	color: var(--text);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
}

.sort-buttons button.active {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

@media (max-width: 719px) {
	.sort-toggle {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		align-items: center;
		gap: 10px;
		width: 100%;
		min-height: 48px;
		margin-bottom: 10px;
		padding: 8px 12px;
		border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .2);
		border-radius: 999px;
		background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .1), rgba(var(--brand-accent-light-rgb, 255, 91, 172), .06)), var(--white);
		box-shadow: 0 10px 24px rgba(var(--brand-primary-rgb, 0, 90, 90), .08);
		color: var(--text);
		font: inherit;
		text-align: left;
	}

	.sort-toggle-main {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--bb9-green);
		font-weight: 600;
	}

	.sort-toggle-main i {
		display: inline-grid;
		width: 28px;
		height: 28px;
		border-radius: 50%;
		background: var(--bb9-green);
		color: #fff;
		font-size: 13px;
		place-items: center;
	}

	.sort-toggle-summary {
		overflow: hidden;
		color: var(--muted);
		font-size: 13px;
		font-weight: 500;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.sort-toggle-chevron {
		color: var(--bb9-green);
		font-size: 13px;
		transition: transform .22s ease;
	}

	.sort-toggle.is-open .sort-toggle-chevron {
		transform: rotate(180deg);
	}

	.sort-bar {
		gap: 12px;
		max-height: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
		overflow: hidden;
		opacity: 0;
		transform: translateY(-8px);
		transition: max-height .28s ease, opacity .22s ease, transform .22s ease, padding .22s ease, margin .22s ease;
		pointer-events: none;
	}

	.sort-bar.is-open {
		max-height: 260px;
		margin-bottom: 14px;
		padding-top: 12px;
		padding-bottom: 12px;
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}

	.sort-buttons {
		align-items: center;
	}

	.sort-buttons span {
		flex: 0 0 100%;
	}

	.sort-buttons button {
		flex: 1 1 auto;
	}
}

.gift-grid {
	display: grid;
	gap: 18px;
}

.gift-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 16px;
	height: 100%;
	overflow: visible;
	padding: 18px;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.gift-card:hover {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	box-shadow: 0 16px 38px rgba(var(--brand-primary-rgb, 0, 80, 80), .1);
	transform: translateY(-2px);
}

.gift-card.has-discount {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .3);
	background: linear-gradient(180deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .055), var(--white) 45%);
}

.gift-card.in-cart {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .28);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .035);
}

.gift-card.is-selected {
	border-color: rgba(109, 122, 128, .26);
	background: #f7fafa;
}

.archived-gifts .gift-card {
	border-color: rgba(109, 122, 128, .2);
	background: linear-gradient(180deg, rgba(109, 122, 128, .045), var(--white) 48%);
}

.archived-gifts .gift-card:hover {
	border-color: rgba(109, 122, 128, .28);
	box-shadow: 0 12px 28px rgba(var(--brand-primary-rgb, 0, 80, 80), .075);
}

.archived-gifts .gift-card.is-paid {
	background: linear-gradient(180deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .07), var(--white) 48%);
}

.archived-gifts .gift-card.is-reserved {
	background: linear-gradient(180deg, rgba(var(--brand-accent-rgb, 211, 0, 122), .045), var(--white) 48%);
}

.gift-media {
	position: relative;
	display: grid;
	width: 100%;
	height: clamp(210px, 23vw, 315px);
	min-height: 210px;
	place-items: center;
	overflow: hidden;
	border: 0;
	border-radius: 24px;
	padding: 0;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .055), rgba(var(--brand-accent-rgb, 211, 0, 122), .035));
	color: var(--bb9-green);
	font: inherit;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	appearance: none;
}

.gift-media:focus-visible {
	outline: 3px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .35);
	outline-offset: 3px;
}

.gift-media img {
	display: block;
	width: calc(100% - 24px);
	height: calc(100% - 24px);
	min-height: 0;
	object-fit: contain;
	object-position: center;
	mix-blend-mode: multiply;
}

.gift-media > span {
	display: grid;
	place-items: center;
	gap: 8px;
	width: calc(100% - 32px);
	height: calc(100% - 32px);
	border: 1px dashed rgba(var(--brand-primary-rgb, 0, 152, 152), .22);
	border-radius: 20px;
	background: rgba(255, 255, 255, .72);
	color: var(--bb9-green);
	font-size: 15px;
	line-height: 1.2;
}

.gift-media > span i {
	font-size: 28px;
}

.gift-content {
	flex: 1 1 auto;
	min-height: 98px;
}

.gift-card.is-selected .gift-media img {
	opacity: .72;
	filter: saturate(.78);
}

.archived-gifts .gift-media {
	background: rgba(109, 122, 128, .055);
}

.archived-gifts .gift-content strong {
	color: rgba(35, 48, 56, .82);
}

.archived-gifts .price-row p {
	color: rgba(35, 48, 56, .72);
}

.gift-content strong,
.gift-content span {
	display: block;
	margin: 0;
}

.gift-content strong {
	color: var(--text);
	font-size: clamp(18px, 1.55vw, 22px);
	font-weight: 500;
	line-height: 1.18;
	overflow-wrap: anywhere;
}

.gift-content span {
	margin-top: 6px;
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .01em;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}

.price-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: baseline;
	justify-content: flex-start;
	min-height: 34px;
	margin-top: auto;
}

.price-row p {
	display: block;
	margin: 0;
	color: var(--bb9-pink);
	font-size: 24px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

.price-row del {
	color: var(--muted);
	font-size: 17px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

.gift-card > .maquette-btn {
	width: 100%;
	min-height: 58px;
	margin-top: 0;
	font-size: 16px;
}

.discount-badge {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 4;
	display: grid;
	min-width: 62px;
	min-height: 42px;
	place-items: center;
	border-radius: 999px;
	background: var(--bb9-green);
	color: var(--white);
	box-shadow: 0 10px 22px rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	font-size: 16px;
	font-weight: 500;
}

.favorite-ribbon {
	position: absolute;
	top: 0;
	left: -20px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: min(142px, calc(100% - 20px));
	min-height: 48px;
	gap: 7px;
	padding: 7px 12px 8px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--bb9-pink) 0%, var(--brand-accent-light, #eb4aa3) 100%);
	color: var(--white);
	box-shadow: 0 10px 20px rgba(var(--brand-accent-rgb, 211, 0, 122), .2);
	transform: rotate(-25deg);
	transform-origin: center;
}

.favorite-ribbon span,
.favorite-ribbon strong {
	display: block;
	color: var(--white);
	line-height: 1;
	text-align: center;
	white-space: nowrap;
}

.favorite-ribbon span {
	display: none;
}

.favorite-ribbon strong {
	margin-top: 0;
	font-size: 13px;
	font-weight: 500;
}

.gift-status {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 58px;
	margin-top: 0;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .22);
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .02em;
}

.gift-status.reserved {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .22);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
	color: var(--bb9-pink);
}

@media (max-width: 719px) {
	.gift-grid {
		gap: 14px;
	}

	.gift-card {
		gap: 14px;
		padding: 14px;
	}

	.gift-card:hover {
		transform: none;
	}

	.gift-media {
		height: clamp(210px, 62vw, 300px);
		min-height: 210px;
		border-radius: 22px;
	}

	.favorite-ribbon {
		left: -10px;
		width: 128px;
		min-height: 44px;
		transform: rotate(-18deg);
	}

	.favorite-ribbon strong {
		font-size: 12px;
	}

	.discount-badge {
		top: 12px;
		right: 12px;
		min-width: 56px;
		min-height: 38px;
		font-size: 14px;
	}

	.gift-content {
		min-height: auto;
	}

	.gift-content strong {
		font-size: 20px;
		line-height: 1.15;
	}

	.price-row {
		align-items: center;
		justify-content: flex-start;
		min-height: 30px;
	}

	.price-row p {
		font-size: 24px;
	}

	.price-row del {
		font-size: 15px;
	}

	.gift-card > .maquette-btn,
	.gift-status {
		min-height: 56px;
	}
}

.maquette-modal-window .modal-dialog,
.maquette-cart-modal-window .modal-dialog {
	max-width: 680px;
	width: calc(100% - 28px);
	margin: 48px auto;
	animation: maquette-modal-origin-in .34s cubic-bezier(.18, .9, .22, 1) both;
	transform-origin: center;
	will-change: transform, opacity;
}

.modal-backdrop.in {
	animation: maquette-modal-backdrop-in .22s ease both;
}

@keyframes maquette-modal-origin-in {
	0% {
		opacity: 0;
		transform:
			translate3d(
				calc(var(--modal-origin-x, 50vw) - 50vw),
				calc(var(--modal-origin-y, 50vh) - 50vh),
				0
			)
			scale(.72);
	}

	68% {
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1.015);
	}

	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1);
	}
}

@keyframes maquette-modal-backdrop-in {
	from {
		opacity: 0;
	}

	to {
		opacity: .5;
	}
}

@media (prefers-reduced-motion: reduce) {
	.maquette-modal-window .modal-dialog,
	.maquette-cart-modal-window .modal-dialog,
	.modal-backdrop.in {
		animation: none;
	}
}

.maquette-modal-window .modal-content,
.maquette-cart-modal-window .modal-content {
	overflow: visible;
	border: 0;
	border-radius: 32px;
	background: transparent;
	box-shadow: none;
}

.maquette-cart-modal {
	position: relative;
	padding: 30px;
	border: 1px solid rgba(220, 232, 232, .95);
	border-radius: 32px;
	background: var(--white);
	box-shadow: 0 28px 80px rgba(0, 70, 70, .22);
	color: var(--text);
	font-family: var(--font-ui);
}

.maquette-cart-modal.maquette-detail-modal {
	max-height: calc(100dvh - 96px);
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-gutter: stable;
}

.maquette-modal-close {
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 2;
	display: grid;
	width: 40px;
	height: 40px;
	place-items: center;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: #f9fdfd;
	color: var(--muted);
	font: inherit;
	cursor: pointer;
}

.maquette-modal-close:hover,
.maquette-modal-close:focus {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .35);
	color: var(--bb9-green);
	outline: none;
}

.maquette-modal-loading {
	display: grid;
	min-height: 260px;
	place-items: center;
	align-content: center;
	gap: 12px;
	color: var(--muted);
	font-size: 18px;
}

.maquette-modal-loading i {
	color: var(--bb9-green);
	font-size: 34px;
}

.maquette-modal-head {
	display: grid;
	justify-items: center;
	padding: 8px 46px 22px;
	text-align: center;
}

.maquette-modal-check {
	display: grid;
	width: 58px;
	height: 58px;
	margin-bottom: 14px;
	place-items: center;
	border-radius: 50%;
	background: var(--bb9-green);
	box-shadow: 0 14px 32px rgba(var(--brand-primary-rgb, 0, 152, 152), .22);
	color: var(--white);
	font-size: 24px;
}

.maquette-modal-check.is-soft {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	box-shadow: none;
	color: var(--bb9-green);
}

.maquette-modal-check.is-warning {
	background: var(--bb9-pink);
	box-shadow: 0 14px 32px rgba(216, 0, 122, .18);
}

.maquette-modal-head h2 {
	margin: 0;
	color: var(--text);
	font-size: 30px;
	font-weight: 500;
	letter-spacing: -.025em;
	line-height: 1.1;
}

.maquette-modal-head h2 a,
.maquette-modal-head p a {
	color: inherit;
	text-decoration: none;
}

.maquette-modal-head.compact {
	padding-bottom: 18px;
}

.maquette-modal-eyebrow {
	margin: 0 0 8px !important;
	color: var(--muted) !important;
	font-size: 13px !important;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.maquette-modal-head p {
	margin: 10px 0 0;
	color: var(--muted);
	font-size: 16px;
}

.maquette-modal-product {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 18px;
	align-items: center;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .055), rgba(255, 255, 255, .96));
}

.maquette-modal-product.wide {
	grid-template-columns: minmax(220px, .85fr) minmax(0, 1fr);
	align-items: stretch;
}

.maquette-modal-media {
	display: grid;
	height: 150px;
	place-items: center;
	overflow: hidden;
	border-radius: 20px;
	background: var(--white);
	color: var(--bb9-green);
	text-align: center;
}

.maquette-modal-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.maquette-modal-media span {
	display: grid;
	gap: 8px;
	padding: 14px;
	font-size: 13px;
	line-height: 1.25;
}

.maquette-modal-media i {
	font-size: 28px;
}

.maquette-modal-product-info h3 {
	margin: 0;
	color: var(--text);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -.02em;
	line-height: 1.18;
	text-transform: uppercase;
}

.maquette-modal-product-info p {
	margin: 8px 0 16px;
	color: var(--muted);
	font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
}

.maquette-modal-price {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: baseline;
}

.maquette-modal-price del {
	color: var(--muted);
	font-size: 16px;
	font-weight: 500;
}

.maquette-modal-price span {
	color: var(--bb9-pink);
	font-size: 26px;
	font-weight: 600;
	line-height: 1;
}

.maquette-modal-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;
}

.maquette-modal-meta span {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--text);
	font-size: 14px;
	font-weight: 500;
}

.maquette-modal-total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 18px;
	padding: 18px 2px;
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: 16px;
}

.maquette-modal-total strong {
	color: var(--bb9-pink);
	font-size: 26px;
	font-weight: 600;
	white-space: nowrap;
}

.maquette-modal-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 6px;
}

.maquette-modal-actions.single {
	grid-template-columns: 1fr;
}

.maquette-modal-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 58px;
	padding: 0 18px;
	border-radius: 999px;
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
}

.maquette-modal-btn.secondary {
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .3);
	background: var(--white);
	color: var(--bb9-green);
}

.maquette-modal-btn.primary {
	border: 1px solid var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
	box-shadow: 0 14px 30px rgba(var(--brand-primary-rgb, 0, 152, 152), .2);
}

.maquette-modal-btn.danger {
	border: 1px solid var(--bb9-pink);
	background: var(--bb9-pink);
	color: var(--white);
	box-shadow: 0 14px 30px rgba(216, 0, 122, .16);
}

.maquette-modal-btn.soft-danger {
	border: 1px solid rgba(216, 0, 122, .28);
	background: rgba(216, 0, 122, .075);
	color: var(--bb9-pink);
	box-shadow: none;
}

body.maquette-app .maquette-modal-btn.primary,
body.maquette-app .maquette-modal-btn.danger {
	color: var(--white);
}

.maquette-modal-btn:hover,
.maquette-modal-btn:focus {
	text-decoration: none;
	outline: none;
}

.maquette-modal-text,
.maquette-modal-note {
	margin-top: 14px;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
	color: var(--muted);
	font-size: 15px;
	line-height: 1.45;
}

.maquette-modal-text p {
	margin: 0;
}

.maquette-modal-gallery {
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: 26px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .045), rgba(255, 255, 255, .98));
}

.maquette-detail-modal .maquette-modal-head {
	padding-bottom: 20px;
}

.maquette-detail-modal .maquette-modal-check {
	width: 58px;
	height: 58px;
	margin-bottom: 14px;
}

.maquette-detail-modal .maquette-modal-gallery {
	max-width: 560px;
	margin-inline: auto;
	border-radius: 24px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .055), rgba(255, 255, 255, .96));
}

.maquette-detail-modal .detail-price-total {
	margin-top: 18px;
	padding: 18px 2px;
}

.maquette-detail-modal .detail-actions {
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	margin-top: 6px;
}

.maquette-modal-gallery.inline-gallery {
	border: 0;
	background: var(--white);
}

.maquette-modal-gallery .carousel,
.maquette-modal-gallery .carousel-inner,
.maquette-modal-gallery .item {
	min-height: 360px;
}

.maquette-modal-gallery img {
	display: block;
	width: 100%;
	height: 360px;
	object-fit: contain;
	padding: 18px;
}

.maquette-detail-modal .maquette-modal-gallery .carousel,
.maquette-detail-modal .maquette-modal-gallery .carousel-inner,
.maquette-detail-modal .maquette-modal-gallery .item {
	min-height: 360px;
}

.maquette-detail-modal .maquette-modal-gallery img {
	height: 360px;
	padding: 18px;
}

.maquette-modal-empty-media {
	display: grid;
	min-height: 260px;
	place-items: center;
	align-content: center;
	gap: 10px;
	color: var(--bb9-green);
	text-align: center;
}

.maquette-detail-modal .maquette-modal-empty-media {
	min-height: 300px;
}

.maquette-modal-empty-media i {
	font-size: 34px;
}

.maquette-modal-quantity {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-top: 16px;
	padding: 12px 14px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
	color: var(--muted);
	font-size: 15px;
}

.maquette-modal-quantity div {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.maquette-modal-quantity button {
	display: grid;
	width: 36px;
	height: 36px;
	place-items: center;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .24);
	border-radius: 50%;
	background: #f9fdfd;
	color: var(--bb9-green);
}

.maquette-modal-quantity button:disabled {
	opacity: .45;
}

.maquette-modal-quantity strong {
	min-width: 24px;
	color: var(--text);
	font-size: 17px;
	font-weight: 500;
	text-align: center;
}

.maquette-modal-tabs {
	margin-top: 16px;
	color: var(--muted);
	font-size: 15px;
	line-height: 1.45;
}

.maquette-modal-tabs .nav-tabs {
	border: 0;
}

.maquette-modal-tabs .nav-tabs > li > a {
	border: 1px solid var(--line);
	border-radius: 999px;
	color: var(--text);
}

.maquette-modal-tabs .nav-tabs > li.active > a,
.maquette-modal-tabs .nav-tabs > li.active > a:hover,
.maquette-modal-tabs .nav-tabs > li.active > a:focus {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

.maquette-modal-tabs .tab-content {
	margin-top: 12px;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
}

.maquette-modal-list {
	display: grid;
	gap: 10px;
}

.maquette-modal-list-item {
	display: grid;
	grid-template-columns: 38px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 14px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
	color: var(--muted);
	font-size: 15px;
	line-height: 1.35;
}

.maquette-modal-list-item i {
	display: grid;
	width: 38px;
	height: 38px;
	place-items: center;
	border-radius: 50%;
	background: var(--white);
	color: var(--bb9-green);
}

.maquette-modal-table {
	display: grid;
	gap: 10px;
	margin-top: 6px;
}

.maquette-modal-table-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
}

.maquette-modal-table-row strong {
	display: block;
	color: var(--text);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.25;
	text-transform: uppercase;
}

.maquette-modal-table-row span {
	display: block;
	margin-top: 4px;
	color: var(--muted);
	font-size: 13px;
	text-transform: uppercase;
}

.maquette-modal-table-row b {
	color: var(--bb9-pink);
	font-size: 18px;
	font-weight: 600;
	white-space: nowrap;
}

.maquette-modal-status-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-top: 16px;
}

.maquette-modal-status-card {
	min-height: 96px;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
	text-align: center;
}

.maquette-modal-status-card span {
	display: block;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.3;
}

.maquette-modal-status-card strong {
	display: block;
	margin-top: 6px;
	color: var(--bb9-green);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.2;
}

.maquette-modal-status-card.danger strong {
	color: var(--bb9-pink);
}

.maquette-tracking-modal-window .modal-dialog {
	max-width: 1120px;
}

.maquette-tracking-modal {
	padding: 34px;
}

.maquette-tracking-modal .maquette-modal-head {
	padding-inline: 58px;
}

.maquette-tracking-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
	gap: 18px;
	align-items: stretch;
}

.maquette-tracking-media-card,
.maquette-tracking-panel {
	border: 1px solid var(--line);
	border-radius: 28px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .045), rgba(255, 255, 255, .98));
}

.maquette-tracking-media-card {
	display: grid;
	min-height: 500px;
	padding: 18px;
}

.maquette-tracking-gallery {
	display: grid;
	min-height: 100%;
	background: var(--white);
}

.maquette-tracking-gallery .carousel,
.maquette-tracking-gallery .carousel-inner,
.maquette-tracking-gallery .item {
	min-height: 100%;
}

.maquette-tracking-gallery img {
	height: 500px;
	padding: 24px;
}

.maquette-tracking-panel {
	display: grid;
	align-content: start;
	gap: 16px;
	padding: 18px;
}

.maquette-tracking-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tracking-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 38px;
	padding: 0 14px;
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
}

.tracking-badge.is-heart {
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

.tracking-badge.is-reserved,
.tracking-badge.is-paid,
.tracking-badge.is-ready {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .11);
	color: var(--bb9-green);
}

.maquette-tracking-timeline {
	position: relative;
	display: grid;
	gap: 12px;
}

.maquette-tracking-timeline:before {
	position: absolute;
	top: 30px;
	bottom: 30px;
	left: 24px;
	width: 4px;
	border-radius: 99px;
	background: linear-gradient(180deg, var(--bb9-green), rgba(var(--brand-primary-rgb, 0, 152, 152), .18));
	content: "";
}

.maquette-tracking-step {
	position: relative;
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
	padding: 14px;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: rgba(255, 255, 255, .86);
}

.maquette-tracking-step .tracking-dot {
	position: relative;
	z-index: 1;
	display: grid;
	width: 52px;
	height: 52px;
	place-items: center;
	border: 8px solid rgba(239, 249, 249, .98);
	border-radius: 50%;
	background: var(--bb9-green);
	box-shadow: 0 12px 24px rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	color: var(--white);
	font-size: 16px;
}

.maquette-tracking-step .tracking-dot i {
	line-height: 1;
}

.maquette-tracking-step span:not(.tracking-dot) {
	display: block;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.3;
}

.maquette-tracking-step strong {
	display: block;
	margin-top: 4px;
	color: var(--bb9-green);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2;
	overflow-wrap: anywhere;
}

.maquette-tracking-step.is-danger .tracking-dot {
	color: var(--bb9-pink);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
}

.maquette-tracking-step.is-danger .tracking-dot {
	background: var(--bb9-pink);
	color: var(--white);
	box-shadow: 0 12px 24px rgba(var(--brand-accent-rgb, 211, 0, 122), .16);
}

.maquette-tracking-step.is-danger strong {
	color: var(--bb9-pink);
}

@media (max-width: 640px) {
	.maquette-modal-window .modal-dialog,
	.maquette-cart-modal-window .modal-dialog {
		width: calc(100% - 20px);
		margin: 24px auto;
	}

	.maquette-cart-modal {
		padding: 22px 16px 18px;
		border-radius: 26px;
	}

	.maquette-cart-modal.maquette-detail-modal {
		max-height: calc(100dvh - 48px);
	}

	.maquette-tracking-modal {
		padding: 22px 14px 18px;
	}

	.maquette-modal-head {
		padding: 8px 42px 18px;
	}

	.maquette-modal-head h2 {
		font-size: 24px;
	}

	.maquette-tracking-modal .maquette-modal-head {
		padding-inline: 42px;
	}

	.maquette-tracking-modal .maquette-modal-head h2 {
		font-size: 23px;
	}

	.maquette-tracking-layout {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.maquette-tracking-media-card {
		min-height: 300px;
		padding: 10px;
		border-radius: 24px;
	}

	.maquette-tracking-gallery,
	.maquette-tracking-panel {
		border-radius: 22px;
	}

	.maquette-tracking-gallery .carousel,
	.maquette-tracking-gallery .carousel-inner,
	.maquette-tracking-gallery .item {
		min-height: 300px;
	}

	.maquette-tracking-gallery img {
		height: 300px;
		padding: 14px;
	}

	.maquette-tracking-panel {
		gap: 12px;
		padding: 12px;
	}

	.tracking-badge {
		min-height: 34px;
		padding-inline: 12px;
		font-size: 12px;
	}

	.maquette-tracking-timeline {
		gap: 10px;
	}

	.maquette-tracking-step {
		grid-template-columns: 42px minmax(0, 1fr);
		gap: 10px;
		padding: 12px;
		border-radius: 20px;
	}

	.maquette-tracking-timeline:before {
		top: 24px;
		bottom: 24px;
		left: 20px;
		width: 3px;
	}

	.maquette-tracking-step .tracking-dot {
		width: 42px;
		height: 42px;
		border-width: 6px;
		font-size: 14px;
	}

	.maquette-tracking-step strong {
		font-size: 18px;
	}

	.maquette-modal-product {
		grid-template-columns: 1fr;
	}

	.maquette-modal-product.wide {
		grid-template-columns: 1fr;
	}

	.maquette-modal-media {
		height: 190px;
	}

	.maquette-modal-product.is-cart-add {
		grid-template-columns: 92px minmax(0, 1fr);
		gap: 12px;
		align-items: center;
		padding: 12px;
	}

	.maquette-modal-product.is-cart-add .maquette-modal-media {
		width: 92px;
		height: 92px;
		border-radius: 18px;
	}

	.maquette-modal-product.is-cart-add .maquette-modal-product-info h3 {
		font-size: 17px;
		line-height: 1.18;
	}

	.maquette-modal-product.is-cart-add .maquette-modal-product-info p {
		margin: 6px 0 10px;
		font-size: 13px;
	}

	.maquette-modal-product.is-cart-add .maquette-modal-price span {
		font-size: 22px;
	}

	.maquette-modal-gallery .carousel,
	.maquette-modal-gallery .carousel-inner,
	.maquette-modal-gallery .item {
		min-height: 260px;
	}

	.maquette-modal-gallery img {
		height: 260px;
	}

	.maquette-detail-modal .maquette-modal-gallery {
		max-width: none;
	}

	.maquette-detail-modal .maquette-modal-gallery .carousel,
	.maquette-detail-modal .maquette-modal-gallery .carousel-inner,
	.maquette-detail-modal .maquette-modal-gallery .item {
		min-height: 330px;
	}

	.maquette-detail-modal .maquette-modal-gallery img {
		height: 330px;
		padding: 16px;
	}

	.maquette-detail-modal .maquette-modal-empty-media {
		min-height: 280px;
	}

	.maquette-tracking-gallery .carousel,
	.maquette-tracking-gallery .carousel-inner,
	.maquette-tracking-gallery .item {
		min-height: 300px;
	}

	.maquette-tracking-gallery img {
		height: 300px;
		padding: 14px;
	}

	.maquette-modal-total {
		align-items: flex-start;
		flex-direction: column;
		gap: 6px;
	}

	.maquette-modal-actions {
		grid-template-columns: 1fr;
	}

	.maquette-modal-status-grid {
		grid-template-columns: 1fr;
	}

	.payment-result-card {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.bank-error-card {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	body.maquette-app .client-account-tabs .nav-pills {
		flex-direction: column;
	}

	body.maquette-app .client-account-section {
		padding: 18px;
	}

	body.maquette-app .client-account-section-heading {
		align-items: flex-start;
	}

	body.maquette-app .client-sale-card {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-sale-amount {
		white-space: normal;
	}

	body.maquette-app .client-info-grid {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-info-group-wide {
		grid-row: auto;
	}

	body.maquette-app .client-fidelity-panel {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-fidelity-visual {
		width: 100%;
	}

	.payment-result-actions {
		display: grid;
	}
}

.cart-layout {
	display: grid;
	gap: 18px;
}

.checkout-layout {
	display: grid;
	gap: 18px;
}

.checkout-main {
	display: grid;
	gap: 18px;
	min-width: 0;
}

.checkout-card {
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

.section-header.compact {
	margin-bottom: 16px;
}

.section-header.compact h2 {
	margin-bottom: 6px;
}

.cart-page-list {
	display: grid;
	gap: 10px;
}

.cart-page-item {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) auto;
	gap: 10px;
	align-items: center;
	padding: 12px;
}

.cart-product-media {
	display: grid;
	width: 72px;
	height: 72px;
	min-height: 72px;
	place-items: center;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
	color: var(--bb9-green);
}

.cart-product-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.accessory-media {
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
	color: var(--bb9-pink);
	font-weight: 600;
}

.cart-product-info strong,
.cart-product-info span,
.cart-product-info p {
	display: block;
	margin: 0;
}

.cart-product-info strong {
	color: var(--text);
	font-size: 16px;
	line-height: 1.2;
}

.cart-product-info span,
.cart-product-info p {
	color: var(--muted);
	line-height: 1.45;
}

.cart-product-info span {
	margin-top: 4px;
	overflow: hidden;
	font-size: 13px;
	font-weight: 500;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cart-product-info p {
	display: none;
}

.cart-line-total {
	color: var(--bb9-pink);
	font-size: 18px;
	text-align: right;
	white-space: nowrap;
}

.cart-remove {
	width: 42px;
	height: 42px;
	border: 1px solid rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
	color: var(--bb9-pink);
}

.cart-edit-amount {
	display: flex;
	gap: 8px;
	align-items: center;
}

.cart-edit-amount input {
	width: 110px;
	min-height: 44px;
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 0 14px;
	font: inherit;
	font-weight: 600;
}

.cart-item-actions {
	display: flex;
	gap: 8px;
}

.donor-section {
	position: relative;
	overflow: hidden;
	padding: 18px;
}

.checkout-card.donor-section {
	order: -1;
	padding: 18px;
}

.donor-header {
	display: grid;
	gap: 12px;
	margin-bottom: 16px;
}

.donor-header h2 {
	margin: 0;
	font-size: 27px;
}

.donor-header p:not(.eyebrow) {
	margin: 6px 0 0;
	color: var(--muted);
	line-height: 1.45;
}

.donor-header > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 14px;
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 13px;
	font-weight: 600;
}

.privacy-details {
	margin-top: 12px;
}

.privacy-details summary {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 14px;
	border-radius: 999px;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
	color: var(--bb9-pink);
	font-weight: 600;
	cursor: pointer;
}

.privacy-details div {
	display: grid;
	gap: 8px;
	margin-top: 10px;
	padding: 12px;
	border: 1px solid rgba(var(--brand-accent-rgb, 211, 0, 122), .16);
	border-radius: 18px;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .04);
}

.donor-form {
	display: grid;
	gap: 12px;
}

.donor-form label {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
}

.donor-form span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.donor-form input {
	width: 100%;
	min-height: 28px;
	border: 0;
	padding: 0;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25;
}

.donor-form input::placeholder {
	color: #9aa5a9;
	opacity: 1;
}

.donor-form label:focus-within {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .45);
	box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
}

.donor-form input:focus {
	outline: none;
}

.donor-form small {
	color: var(--muted);
}

.force-mail {
	display: inline-flex !important;
	grid-template-columns: none !important;
	gap: 6px !important;
	align-items: center;
	margin-left: 8px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
}

.force-mail input {
	width: auto;
	min-height: auto;
}

.order-summary {
	display: grid;
	gap: 12px;
	align-self: start;
	padding: 18px;
}

.order-summary .eyebrow {
	margin-bottom: -2px;
}

.order-summary h2 {
	margin: 0 0 6px;
	color: var(--text);
}

.summary-line,
.summary-total {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	align-items: flex-start;
}

.summary-line span {
	color: var(--muted);
	line-height: 1.45;
}

.summary-line strong {
	max-width: 170px;
	overflow-wrap: anywhere;
	color: var(--text);
	text-align: right;
}

.summary-total {
	margin-top: 4px;
	padding-top: 14px;
	border-top: 1px solid var(--line);
	font-size: 22px;
	font-weight: 600;
}

.summary-total strong {
	color: var(--bb9-pink);
	text-align: right;
	white-space: nowrap;
}

.payment-actions {
	display: grid;
	gap: 10px;
}

.payment-test-selector {
	display: grid;
	gap: 6px;
	padding: 10px;
	border: 1px solid var(--line);
	border-radius: 8px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .055);
}

.payment-test-selector span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
}

.payment-test-selector select {
	width: 100%;
	min-height: 42px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: 8px;
	background: var(--white);
	color: var(--text);
	font: inherit;
}

.summary-note {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: 10px;
	align-items: start;
	margin-top: 4px;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: 18px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .055);
	color: var(--muted);
	font-size: 13px;
	line-height: 1.35;
}

.summary-note i {
	display: grid;
	width: 34px;
	height: 34px;
	place-items: center;
	border-radius: 50%;
	background: var(--white);
	color: var(--bb9-green);
}

.loading-card {
	display: grid;
	min-height: 260px;
	place-items: center;
	align-content: center;
	gap: 14px;
	padding: 30px;
	color: var(--muted);
	font-size: 18px;
	text-align: center;
}

.loading-card i {
	display: grid;
	width: 68px;
	height: 68px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 30px;
}

.loading-card p {
	margin: 0;
	color: var(--muted);
	font-size: 18px;
	line-height: 1.45;
}

.payment-result-layout {
	display: grid;
	gap: 18px;
	max-width: 920px;
	margin-inline: auto;
}

.payment-result-card {
	display: grid;
	grid-template-columns: 68px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
	padding: 24px;
}

.payment-result-card h2 {
	margin: 0;
	color: var(--text);
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 500;
	letter-spacing: -.035em;
	line-height: 1.05;
}

.payment-result-icon {
	display: grid;
	width: 68px;
	height: 68px;
	place-items: center;
	border-radius: 50%;
	background: var(--bb9-green);
	box-shadow: 0 16px 34px rgba(var(--brand-primary-rgb, 0, 152, 152), .22);
	color: var(--white);
	font-size: 30px;
}

.payment-result-card.is-error .payment-result-icon {
	background: var(--bb9-pink);
	box-shadow: 0 16px 34px rgba(216, 0, 122, .18);
}

.payment-result-copy {
	display: grid;
	gap: 8px;
	margin-top: 16px;
	color: var(--muted);
	font-size: 17px;
	line-height: 1.5;
}

.payment-result-copy p {
	margin: 0;
}

.felicitation-card {
	padding: 22px;
}

.message-form {
	display: grid;
	gap: 14px;
}

.message-form label {
	display: grid;
	gap: 8px;
	margin: 0;
}

.message-form label > span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
}

.message-form textarea {
	width: 100%;
	min-height: 150px;
	border: 1px solid var(--line);
	border-radius: 24px;
	padding: 16px 18px;
	background: #f9fdfd;
	color: var(--text);
	font: inherit;
	font-weight: 500;
	resize: vertical;
}

.message-form textarea:focus {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .45);
	box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	outline: none;
}

.copy-choice {
	display: flex !important;
	gap: 10px !important;
	align-items: center;
	color: var(--muted);
	font-size: 14px;
}

.copy-choice input {
	width: 18px;
	height: 18px;
	accent-color: var(--bb9-green);
}

.copy-choice span {
	font-size: 14px !important;
	font-weight: 500 !important;
	text-transform: none !important;
}

.payment-result-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
}

.bank-error-layout,
.bank-layout {
	display: grid;
	gap: 18px;
}

.bank-error-card {
	display: grid;
	grid-template-columns: 68px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
	max-width: 920px;
	margin-inline: auto;
	padding: 24px;
}

.bank-error-card .payment-result-icon {
	background: var(--bb9-pink);
	box-shadow: 0 16px 34px rgba(216, 0, 122, .18);
}

.bank-error-card h1 {
	margin: 0;
	color: var(--text);
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 500;
	letter-spacing: -.035em;
	line-height: 1.05;
}

.bank-error-card p:not(.eyebrow) {
	margin: 14px 0 0;
	color: var(--muted);
	font-size: 17px;
	line-height: 1.5;
}

.bank-confirm-card,
.bank-payment-card {
	padding: 22px;
	border-radius: var(--radius-xl);
}

.bank-info-grid {
	display: grid;
	gap: 12px;
}

.bank-info-grid > div {
	display: grid;
	gap: 4px;
	min-height: 86px;
	align-content: center;
	padding: 16px 18px;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
}

.bank-info-grid span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.bank-info-grid strong {
	overflow-wrap: anywhere;
	color: var(--text);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25;
}

.bank-info-grid .bank-amount strong {
	color: var(--bb9-pink);
	font-size: clamp(30px, 4vw, 42px);
	line-height: 1.05;
}

.bank-info-grid .bank-amount {
	min-height: 112px;
	justify-items: center;
	text-align: center;
}

.bank-payment-card {
	display: grid;
	gap: 18px;
	align-self: start;
}

.bank-payment-card h2 {
	margin: 0;
	color: var(--text);
	font-size: 30px;
	font-weight: 500;
	line-height: 1.1;
}

.bank-payment-card p:not(.eyebrow) {
	margin: 0;
	color: var(--muted);
	line-height: 1.45;
}

.bank-actions {
	display: grid;
	gap: 10px;
}

.bank-actions > .maquette-btn {
	width: 100%;
}

.bank-provider-form {
	display: grid;
	margin: 0;
}

.bank-provider-form .maquette-btn {
	width: 100%;
}

.account-login-layout {
	display: grid;
	gap: 18px;
}

.account-login-card,
.account-help-card {
	padding: 22px;
}

.account-login-form {
	display: grid;
	gap: 12px;
}

.account-login-form label {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
}

.account-login-form span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.account-login-form input {
	width: 100%;
	min-height: 28px;
	border: 0;
	padding: 0;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25;
}

.account-login-form input::placeholder {
	color: #9aa5a9;
	opacity: 1;
}

.account-login-form label:focus-within {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .45);
	box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
}

.account-login-form input:focus {
	outline: none;
}

.account-login-actions {
	display: grid;
	gap: 10px;
	margin-top: 18px;
}

.account-help-card {
	display: grid;
	gap: 12px;
	align-self: start;
}

.account-help-card h2 {
	margin: 0;
	color: var(--text);
	font-size: 30px;
	font-weight: 500;
	line-height: 1.1;
}

.account-help-card ul {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	color: var(--muted);
	line-height: 1.45;
	list-style: none;
}

.account-help-card li {
	position: relative;
	padding-left: 24px;
}

.account-help-card li:before {
	position: absolute;
	left: 0;
	color: var(--bb9-green);
	content: "✓";
}

.account-status-card {
	display: grid;
	grid-template-columns: 38px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	margin-top: 14px;
	padding: 14px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
	color: var(--muted);
}

.account-status-card i {
	display: grid;
	width: 38px;
	height: 38px;
	place-items: center;
	border-radius: 50%;
	background: var(--bb9-green);
	color: var(--white);
}

.account-status-card.error {
	border-color: rgba(216, 0, 122, .2);
	background: rgba(216, 0, 122, .055);
}

.account-status-card.error i {
	background: var(--bb9-pink);
}

body.maquette-app .client-account-page {
	color: var(--text);
	font-family: var(--font-ui);
	padding-top: 34px;
}

body.maquette-app .client-account-loading,
body.maquette-app .client-account-message {
	max-width: 760px;
	margin: 34px auto;
	padding: 30px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
	text-align: center;
}

body.maquette-app .client-account-loading i,
body.maquette-app .client-account-message > i {
	color: var(--bb9-green);
	font-size: 42px;
}

body.maquette-app .client-account-loading h1,
body.maquette-app .client-account-message h2 {
	margin: 14px 0 8px;
	color: var(--text);
	font-size: 30px;
	font-weight: 500;
	letter-spacing: -.025em;
}

body.maquette-app .client-account-message p {
	max-width: 620px;
	margin: 0 auto 22px;
	color: var(--muted);
	line-height: 1.5;
}

/* Validation e-mail fidélité */
body.maquette-app .email-status-page {
	display: grid;
	place-items: center;
	min-height: min(620px, calc(100vh - 190px));
	padding: clamp(22px, 4vw, 44px) 0;
	color: var(--text);
	font-family: var(--font-ui);
}

body.maquette-app .email-status-card {
	display: grid;
	justify-items: center;
	width: min(760px, 100%);
	padding: clamp(28px, 5vw, 54px);
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background:
		radial-gradient(circle at 100% 0%, rgba(var(--brand-primary-rgb, 0, 152, 152), .12) 0 78px, transparent 79px),
		var(--white);
	box-shadow: var(--shadow);
	text-align: center;
}

body.maquette-app .email-status-card.is-error {
	background:
		radial-gradient(circle at 100% 0%, rgba(var(--brand-accent-rgb, 211, 0, 122), .09) 0 78px, transparent 79px),
		var(--white);
}

body.maquette-app .email-status-icon {
	display: grid;
	width: 76px;
	height: 76px;
	margin-bottom: 18px;
	place-items: center;
	border-radius: 50%;
	background: var(--bb9-green);
	box-shadow: 0 18px 38px rgba(var(--brand-primary-rgb, 0, 152, 152), .2);
	color: var(--white);
	font-size: 32px;
}

body.maquette-app .email-status-icon.is-error {
	background: var(--bb9-pink);
	box-shadow: 0 18px 38px rgba(var(--brand-accent-rgb, 211, 0, 122), .16);
}

body.maquette-app .email-status-card h1 {
	max-width: 640px;
	margin: 6px 0 12px;
	color: var(--text);
	font-size: clamp(34px, 5vw, 54px);
	font-weight: 400;
	letter-spacing: -.045em;
	line-height: 1.02;
}

body.maquette-app .email-status-card > p:not(.eyebrow),
body.maquette-app .email-status-note p {
	max-width: 600px;
	margin: 0;
	color: var(--muted);
	font-size: 18px;
	line-height: 1.5;
}

body.maquette-app .email-status-card > .maquette-btn {
	margin-top: 26px;
}

body.maquette-app .email-status-note {
	display: grid;
	justify-items: center;
	gap: 18px;
	width: 100%;
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--line);
}

body.maquette-app .client-account-hero {
	margin-bottom: 0;
	padding: clamp(28px, 4vw, 54px);
	grid-template-columns: minmax(0, 1fr) minmax(430px, .62fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: center;
	min-height: 220px;
}

body.maquette-app .client-account-hero-content h1 {
	max-width: 650px;
	margin: 0;
	color: var(--bb9-pink);
	font-size: clamp(36px, 4.1vw, 52px);
	font-weight: 500;
	letter-spacing: -.045em;
	line-height: 1.05;
}

body.maquette-app .client-account-hero-summary {
	display: grid;
	grid-template-columns: repeat(2, minmax(126px, 1fr));
	gap: 14px;
	width: 100%;
	align-self: center;
	margin-left: auto;
}

body.maquette-app .client-account-hero-summary .client-fidelity-stat {
	grid-column: 1 / -1;
}

body.maquette-app .client-account-hero-summary .hero-stat {
	min-height: 84px;
	padding: 16px 14px;
	border-radius: 22px;
	background: rgba(255, 255, 255, .72);
}

body.maquette-app .client-account-hero-summary .hero-stat strong {
	font-size: 28px;
}

body.maquette-app .client-account-hero-summary .hero-stat span {
	font-size: 13px;
}

body.maquette-app .client-account-hero-content span {
	display: inline-block;
	margin-top: 12px;
	color: var(--muted);
	font-size: 18px;
	line-height: 1.35;
}

body.maquette-app .client-account-tabs {
	margin-top: 24px;
}

body.maquette-app #exTab1.client-account-tabs .nav-pills,
body.maquette-app .client-account-tabs .nav-pills {
	display: flex;
	gap: 14px;
	margin: 0 0 22px;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: 32px;
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

body.maquette-app #exTab1.client-account-tabs .nav-pills > li,
body.maquette-app .client-account-tabs .nav-pills > li {
	float: none;
	flex: 1;
}

body.maquette-app #exTab1.client-account-tabs .nav-pills > li + li a {
	border-left: 1px solid transparent;
}

body.maquette-app #exTab1.client-account-tabs .nav-pills > li > a,
body.maquette-app .client-account-tabs .nav-pills > li > a {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 66px;
	border: 1px solid transparent;
	border-radius: 999px;
	background: transparent;
	color: var(--text);
	font-size: 18px;
	font-weight: 500;
	text-transform: none;
	cursor: pointer;
}

body.maquette-app #exTab1.client-account-tabs .nav-pills > li > a:hover,
body.maquette-app .client-account-tabs .nav-pills > li > a:hover {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .06);
	color: var(--text);
}

body.maquette-app #exTab1.client-account-tabs .nav-pills > li.active > a,
body.maquette-app #exTab1.client-account-tabs .nav-pills > li.active > a:focus,
body.maquette-app #exTab1.client-account-tabs .nav-pills > li.active > a:hover,
body.maquette-app .client-account-tabs .nav-pills > li.active > a,
body.maquette-app .client-account-tabs .nav-pills > li.active > a:focus,
body.maquette-app .client-account-tabs .nav-pills > li.active > a:hover {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

body.maquette-app #exTab1.client-account-tabs .tab-content {
	padding: 0;
}

body.maquette-app .client-account-section {
	position: relative;
	margin-bottom: 22px;
	padding: clamp(24px, 3vw, 34px);
	border: 1px solid var(--line);
	border-radius: 34px;
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

body.maquette-app .client-account-section-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

body.maquette-app .client-account-section-heading p {
	margin: 0 0 4px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

body.maquette-app .client-account-section-heading h2 {
	margin: 0;
	color: var(--text);
	font-size: 30px;
	font-weight: 500;
	letter-spacing: -.025em;
}

body.maquette-app .client-account-count,
body.maquette-app .client-fidelity-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	min-height: 56px;
	padding: 8px;
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 22px;
	font-weight: 500;
}

body.maquette-app .client-fidelity-badge,
body.maquette-app .client-fidelity-badge-muted {
	min-width: 0;
	min-height: 0;
	padding: 8px 14px;
	font-size: 15px;
}

body.maquette-app .client-fidelity-badge-muted {
	background: rgba(109, 122, 128, .1);
	color: var(--muted);
}

body.maquette-app .client-account-empty {
	padding: 30px 20px;
	border: 1px dashed var(--line);
	border-radius: 24px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .035);
	color: var(--muted);
	text-align: center;
}

body.maquette-app .client-account-empty i {
	color: var(--bb9-green);
	font-size: 34px;
}

body.maquette-app .client-account-empty h3 {
	margin: 12px 0 6px;
	color: var(--text);
	font-size: 22px;
	font-weight: 500;
}

body.maquette-app .client-sale-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

body.maquette-app .client-sale-card {
	display: grid;
	grid-template-columns: 126px minmax(0, 1fr) 170px 146px;
	gap: 18px;
	align-items: center;
	min-height: 82px;
	padding: 16px 18px;
	border: 1px solid var(--line);
	border-radius: 28px;
	background: var(--white);
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.maquette-app .client-sale-card:hover {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .36);
	box-shadow: 0 14px 32px rgba(var(--brand-primary-rgb, 0, 152, 152), .12);
	transform: translateY(-1px);
}

body.maquette-app .client-sale-main h3 {
	margin: 0 0 6px;
	color: var(--text);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2;
}

body.maquette-app .client-sale-main p {
	margin: 0;
	color: var(--muted);
}

body.maquette-app .client-sale-status {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	min-width: 112px;
	min-height: 28px;
	padding: 0 14px;
	border-radius: 999px;
	background: rgba(216, 0, 122, .08);
	color: var(--bb9-pink);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

body.maquette-app .client-sale-status.is-closed {
	background: rgba(216, 0, 122, .08);
	color: var(--bb9-pink);
}

body.maquette-app .client-sale-amount {
	color: var(--bb9-pink);
	font-size: 22px;
	font-weight: 500;
	white-space: nowrap;
	text-align: right;
}

body.maquette-app .client-sale-action {
	width: 100%;
	min-height: 44px;
	justify-self: end;
}

body.maquette-app .client-account-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-bottom: 18px;
}

body.maquette-app .client-account-filters > span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

body.maquette-app .client-account-filters label {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	min-height: 40px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--text);
	font-weight: 500;
	cursor: pointer;
	transition: background .2s ease, border-color .2s ease, color .2s ease;
}

body.maquette-app .client-account-filters input {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

body.maquette-app .client-account-filters label.active {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
}

body.maquette-app .client-history-table {
	overflow-x: auto;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .025);
}

body.maquette-app .client-history-table .table {
	margin-bottom: 0;
}

body.maquette-app .client-history-table th {
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
}

body.maquette-app .client-history-table tbody th,
body.maquette-app .client-history-table tbody td {
	border-top: 1px solid var(--line);
	vertical-align: middle;
}

body.maquette-app .client-history-amount {
	color: var(--bb9-pink);
	font-size: 22px;
	font-weight: 500;
	white-space: nowrap;
}

body.maquette-app .client-history-list {
	display: grid;
	gap: 12px;
}

body.maquette-app .client-history-row {
	display: grid;
	grid-template-columns: 126px minmax(0, 1fr) minmax(142px, auto) 150px 146px;
	gap: 18px;
	align-items: center;
	min-height: 82px;
	padding: 16px 18px;
	border: 1px solid var(--line);
	border-radius: 28px;
	background: var(--white);
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.maquette-app .client-history-row:hover {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .36);
	box-shadow: 0 14px 32px rgba(var(--brand-primary-rgb, 0, 152, 152), .12);
	transform: translateY(-1px);
}

body.maquette-app .client-history-main h3 {
	margin: 0 0 6px;
	color: var(--text);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2;
}

body.maquette-app .client-history-main p,
body.maquette-app .client-history-closed span {
	margin: 0;
	color: var(--muted);
}

body.maquette-app .client-history-closed {
	display: grid;
	gap: 4px;
}

body.maquette-app .client-history-closed span {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

body.maquette-app .client-history-closed strong {
	color: var(--text);
	font-weight: 500;
	white-space: nowrap;
}

body.maquette-app .client-history-action {
	width: 100%;
	min-height: 44px;
	justify-self: end;
}

body.maquette-app .client-icon-button {
	display: grid;
	width: 40px;
	height: 40px;
	place-items: center;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	border-radius: 50%;
	background: var(--white);
	color: var(--bb9-green);
}

body.maquette-app .client-info-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

body.maquette-app .client-info-group {
	display: grid;
	gap: 10px;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .035);
}

body.maquette-app .client-info-group-wide {
	grid-row: span 2;
}

body.maquette-app .client-info-group h3 {
	margin: 0 0 4px;
	color: var(--bb9-green);
	font-size: 18px;
	font-weight: 500;
}

body.maquette-app .client-info-field {
	display: grid;
	gap: 4px;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
}

body.maquette-app .client-info-field span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

body.maquette-app .client-info-field strong {
	overflow-wrap: anywhere;
	color: var(--text);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25;
	text-align: left;
}

body.maquette-app .client-account-note {
	margin-bottom: 18px;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
	color: var(--muted);
	line-height: 1.45;
}

body.maquette-app .client-fidelity-panel {
	display: grid;
	grid-template-columns: 128px minmax(0, 1fr);
	gap: 20px;
	align-items: center;
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .035);
}

body.maquette-app .client-fidelity-visual {
	display: grid;
	width: 128px;
	height: 128px;
	place-items: center;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: var(--white);
}

body.maquette-app .client-fidelity-visual img {
	max-width: 86px;
	max-height: 86px;
}

body.maquette-app .client-fidelity-text h3 {
	margin: 0 0 8px;
	color: var(--text);
	font-size: 22px;
	font-weight: 500;
}

body.maquette-app .client-fidelity-text p {
	margin-bottom: 16px;
	color: var(--muted);
	line-height: 1.55;
}

body.maquette-app .client-fidelity-text small {
	display: block;
	margin-top: 12px;
	color: var(--muted);
}

@media (max-width: 980px) {
	body.maquette-app .client-account-hero {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-account-hero-summary {
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-left: 0;
	}

	body.maquette-app .client-sale-card,
	body.maquette-app .client-history-row {
		grid-template-columns: 126px minmax(0, 1fr) 150px;
	}

	body.maquette-app .client-sale-action,
	body.maquette-app .client-history-action {
		grid-column: 2 / -1;
	}
}

@media (max-width: 640px) {
	body.maquette-app .client-account-page {
		padding-top: 18px;
	}

	body.maquette-app .client-account-hero {
		grid-template-columns: 1fr;
		gap: 20px;
		min-height: 0;
	}

	body.maquette-app .client-account-hero-content h1 {
		max-width: none;
		font-size: clamp(30px, 10vw, 40px);
	}

	body.maquette-app .client-account-hero-summary {
		grid-template-columns: 1fr;
		width: 100%;
		margin-left: 0;
	}

	body.maquette-app .client-account-tabs .nav-pills {
		flex-direction: column;
	}

	body.maquette-app .client-account-section {
		padding: 18px;
	}

	body.maquette-app .client-account-section-heading {
		align-items: flex-start;
	}

	body.maquette-app .client-sale-card {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-sale-status {
		justify-self: start;
	}

	body.maquette-app .client-sale-amount {
		white-space: normal;
	}

	body.maquette-app .client-sale-action,
	body.maquette-app .client-history-action {
		justify-self: stretch;
	}

	body.maquette-app .client-history-row {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	body.maquette-app .client-history-closed strong,
	body.maquette-app .client-history-amount {
		white-space: normal;
	}

	body.maquette-app .client-info-grid {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-info-group-wide {
		grid-row: auto;
	}

	body.maquette-app .client-fidelity-panel {
		grid-template-columns: 1fr;
	}

	body.maquette-app .client-fidelity-visual {
		width: 100%;
	}
}

.footer {
	margin: 28px auto 92px;
	padding: 0 0 24px;
}

.footer-card {
	display: grid;
	gap: 18px;
	padding: 22px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

.footer-logo img {
	display: block;
	width: 96px;
	max-height: 52px;
	margin-bottom: 10px;
	object-fit: contain;
}

.footer h2 {
	margin: 0 0 6px;
	color: var(--bb9-green);
	font-size: 18px;
}

.footer p {
	margin: 0;
	color: var(--muted);
	line-height: 1.45;
}

.footer .footer-contact {
	margin-top: 10px;
	font-weight: 600;
}

.footer-links {
	display: grid;
	gap: 8px;
}

.footer-links a {
	color: var(--muted);
	font-weight: 600;
}

.footer-bottom {
	margin-top: 14px;
	color: #8b969b;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
}

/* Compte client — reprise directe de maquette/08-compte-client.html + maquette/styles.css */
body.maquette-app .account-reference {
	padding-top: 0;
	color: var(--text);
	font-family: var(--font-ui);
}

body.maquette-app .account-reference a {
	color: inherit;
	text-decoration: none;
}

body.maquette-app .account-reference .hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
	margin-top: 12px;
	padding: 22px 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

body.maquette-app .account-reference .hero-main h1 {
	max-width: 760px;
	margin: 0;
	color: var(--bb9-pink);
	font-size: 32px;
	font-weight: 500;
	letter-spacing: -.03em;
	line-height: 1.08;
}

body.maquette-app .account-reference .hero-main > span,
body.maquette-app .account-reference .hero-main > p:not(.eyebrow) {
	display: block;
	margin: 12px 0 0;
	color: var(--muted);
	font-size: 16px;
	line-height: 1.5;
}

body.maquette-app .account-reference .account-logout {
	width: max-content;
	min-height: 42px;
	margin-top: 18px;
	padding-inline: 18px;
	font-size: 14px;
}

body.maquette-app .account-reference .hero-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	position: relative;
	z-index: 1;
	width: auto;
	margin: 0;
}

body.maquette-app .account-reference .client-account-hero-summary {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	width: 100%;
	gap: 14px;
}

body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
	grid-column: 1 / -1;
}

body.maquette-app .account-reference .hero-stat {
	padding: 14px 10px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: #f9fdfd;
	text-align: center;
}

body.maquette-app .account-reference .hero-stat strong {
	display: block;
	margin-bottom: 6px;
	color: var(--bb9-green);
	font-size: 28px;
	font-weight: 500;
	line-height: 1;
}

body.maquette-app .account-reference .hero-stat span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
}

body.maquette-app .account-reference .tab-select-wrap {
	display: none;
	position: relative;
	gap: 8px;
	margin: 14px 0;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

body.maquette-app .account-reference .tab-select-wrap span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .account-reference .tab-select-wrap select {
	width: 100%;
	min-height: 52px;
	appearance: none;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	border-radius: 999px;
	padding: 0 48px 0 18px;
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .12), rgba(var(--brand-accent-rgb, 211, 0, 122), .08)), var(--white);
	color: var(--text);
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
}

body.maquette-app .account-reference .tab-select-wrap:after {
	position: absolute;
	right: 32px;
	bottom: 33px;
	width: 10px;
	height: 10px;
	border-right: 3px solid var(--bb9-green);
	border-bottom: 3px solid var(--bb9-green);
	content: "";
	pointer-events: none;
	transform: rotate(45deg);
}

body.maquette-app .account-reference .content-tabs {
	display: grid;
}

body.maquette-app .account-reference .tabs {
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 14px 0;
	padding: 6px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .06);
}

body.maquette-app .account-reference .tab {
	display: grid;
	min-height: 46px;
	place-items: center;
	border-radius: 999px;
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	white-space: nowrap;
}

body.maquette-app .account-reference .tab.active {
	background: var(--bb9-green);
	color: var(--white);
}

@media (max-width: 420px) {
	body.maquette-app .account-reference .tabs {
		gap: 6px;
		padding: 5px;
	}

	body.maquette-app .account-reference .tab {
		min-height: 42px;
		padding-inline: 8px;
		font-size: 13px;
	}
}

body.maquette-app .account-reference #exTab1 .tab-content,
body.maquette-app .account-reference .tab-content {
	padding: 0;
}

body.maquette-app .account-reference .section {
	margin-top: 14px;
	padding: 20px 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

body.maquette-app .account-reference .section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
	padding: 0 4px;
}

body.maquette-app .account-reference .section-header h2 {
	margin: 0;
	color: var(--text);
	font-size: 29px;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -.025em;
}

body.maquette-app .account-reference .section-header p,
body.maquette-app .account-reference .sale-card p,
body.maquette-app .account-reference .info-field span {
	margin: 0;
	color: var(--muted);
	line-height: 1.45;
}

body.maquette-app .account-reference .counter {
	display: grid;
	width: 56px;
	min-width: 56px;
	height: 56px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 24px;
	font-weight: 500;
}

body.maquette-app .account-reference .sale-grid,
body.maquette-app .account-reference .history-list,
body.maquette-app .account-reference .info-grid {
	display: grid;
	gap: 12px;
}

body.maquette-app .account-reference .sale-card,
body.maquette-app .account-reference .info-card,
body.maquette-app .account-reference .message-card,
body.maquette-app .account-reference .fidelity-card {
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: #f9fdfd;
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .05);
}

body.maquette-app .account-reference .sale-card {
	padding: 18px;
	text-align: center;
}

body.maquette-app .account-reference .status {
	display: inline-block;
	margin-bottom: 10px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .account-reference .sale-card h3,
body.maquette-app .account-reference .info-card h3,
body.maquette-app .account-reference .message-card h3,
body.maquette-app .account-reference .fidelity-card h3 {
	margin: 0 0 8px;
	color: var(--text);
	font-size: 19px;
	font-weight: 500;
}

body.maquette-app .account-reference .amount {
	display: block;
	margin-top: 14px;
	color: var(--bb9-pink);
	font-size: 24px;
	font-weight: 500;
	white-space: nowrap;
}

body.maquette-app .account-reference .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--text);
	font: inherit;
	font-weight: 500;
	text-align: center;
}

body.maquette-app .account-reference .btn.primary {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

body.maquette-app .account-reference .btn.secondary {
	margin-top: 14px;
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

body.maquette-app .account-reference .filter-inline {
	width: 100%;
	margin-bottom: 16px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

body.maquette-app .account-reference .filter-inline > div {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

body.maquette-app .account-reference .filter-inline > div > span {
	display: inline;
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .account-reference .filter-inline .filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	overflow: visible;
}

body.maquette-app .account-reference .filter-inline .filter-pill {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	gap: 0;
	padding: 0 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--muted);
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	user-select: none;
}

body.maquette-app .account-reference .filter-inline .filter-pill input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

body.maquette-app .account-reference .filter-inline .filter-pill.active,
body.maquette-app .account-reference .filter-inline .filter-pill:has(input:checked) {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .36);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .history-main {
	grid-column: 1;
	grid-row: 2;
	min-width: 0;
}

body.maquette-app .account-reference .history-main h3,
body.maquette-app .account-reference .history-main p {
	margin: 0;
}

body.maquette-app .account-reference .history-main h3 {
	font-size: 19px;
}

body.maquette-app .account-reference .history-main p {
	margin-top: 4px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
}

body.maquette-app .account-reference .history-close {
	grid-column: 1;
	grid-row: 3;
}

body.maquette-app .account-reference .history-close span {
	display: block;
	color: var(--muted);
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .account-reference .history-close strong {
	color: var(--text);
	font-weight: 500;
}

body.maquette-app .account-reference .history-close.is-empty {
	display: none;
}

body.maquette-app .account-reference .info-note {
	margin-bottom: 12px;
	padding: 15px;
	border-left: 5px solid var(--bb9-green);
	border-radius: var(--radius-md);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--muted);
	line-height: 1.45;
	font-weight: 500;
}

body.maquette-app .account-reference .info-card {
	padding: 18px;
}

body.maquette-app .account-reference .info-card h3 {
	color: var(--bb9-green);
}

body.maquette-app .account-reference .info-field {
	display: grid;
	gap: 4px;
	padding: 10px 0;
	border-top: 1px solid var(--line);
}

body.maquette-app .account-reference .info-field span {
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .account-reference .info-field strong {
	overflow-wrap: anywhere;
	color: var(--text);
	font-weight: 500;
}

body.maquette-app .account-reference .fidelity-card,
body.maquette-app .account-reference .message-card {
	margin-top: 12px;
	padding: 18px;
	text-align: center;
}

body.maquette-app .account-reference .fidelity-icon {
	display: grid;
	width: 72px;
	height: 72px;
	margin: 0 auto 12px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 28px;
	font-weight: 500;
}

body.maquette-app .account-reference .fidelity-icon img {
	display: block;
	max-width: 48px;
	max-height: 48px;
	object-fit: contain;
}

/* Compte client — architecture ecommerce */
body.maquette-app .account-reference .client-account-hero {
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	padding: 28px;
}

body.maquette-app .account-reference .client-account-hero-content {
	position: relative;
}

body.maquette-app .account-reference .client-account-hero-content h1 {
	max-width: 900px;
	font-size: clamp(34px, 5vw, 64px);
}

body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
	max-width: 700px;
	margin-top: 14px;
	font-size: 18px;
}

body.maquette-app .account-reference .client-account-hero-content > span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: max-content;
	margin-top: 16px;
	padding: 8px 14px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--bb9-green);
	font-size: 14px;
	font-weight: 500;
}

body.maquette-app .account-reference .account-logout {
	gap: 8px;
}

body.maquette-app .account-reference .client-account-hero-summary {
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 14px;
}

body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
	grid-column: auto;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 4px 16px;
	align-items: center;
	min-height: 118px;
	padding: 20px;
	text-align: left;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
	grid-row: 1 / span 3;
	width: 66px;
	height: 66px;
	margin: 0;
	font-size: 30px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat strong {
	margin: 0;
	font-size: 38px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat span {
	font-size: 15px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat small {
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
}

body.maquette-app .account-reference .account-dashboard {
	display: grid;
	gap: 18px;
	margin-top: 18px;
}

body.maquette-app .account-reference .account-sidebar.tabs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 8px;
	border-radius: var(--radius-xl);
}

body.maquette-app .account-reference .account-sidebar .tab {
	display: flex;
	justify-content: flex-start;
	gap: 10px;
	min-height: 50px;
	padding: 0 14px;
}

body.maquette-app .account-reference .account-sidebar .tab i {
	display: grid;
	width: 32px;
	min-width: 32px;
	height: 32px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .account-sidebar .tab.active i {
	background: rgba(255, 255, 255, .22);
	color: var(--white);
}

body.maquette-app .account-reference .account-section-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}

body.maquette-app .account-reference .account-section-actions .filter-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

body.maquette-app .account-reference .account-section-actions .filter-pill.active {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .36);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .account-dashboard .section {
	margin-top: 0;
}

body.maquette-app .account-reference .account-dashboard .section + .section {
	margin-top: 18px;
}

body.maquette-app .account-reference .account-dashboard .sale-card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 18px;
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.maquette-app .account-reference .account-dashboard .sale-card:hover {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .34);
	box-shadow: 0 16px 34px rgba(var(--brand-primary-rgb, 0, 80, 80), .12);
	transform: translateY(-1px);
}

body.maquette-app .account-reference .sale-card-icon {
	display: grid;
	grid-row: 1 / span 4;
	width: 62px;
	height: 62px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 25px;
}

body.maquette-app .account-reference .account-dashboard .history-main {
	grid-column: 2;
	grid-row: auto;
}

body.maquette-app .account-reference .account-dashboard .status {
	margin: 0 0 8px;
}

body.maquette-app .account-reference .account-dashboard .history-close {
	grid-column: 2;
	grid-row: auto;
	padding: 10px 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius-md);
	background: var(--white);
}

body.maquette-app .account-reference .account-dashboard .history-close.is-empty {
	display: none;
}

body.maquette-app .account-reference .account-dashboard .amount {
	grid-column: 2;
	grid-row: auto;
	margin: 0;
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	grid-column: 2;
	grid-row: auto;
	width: 100%;
	margin: 0;
}

@media (min-width: 880px) {
	body.maquette-app .account-reference .client-account-hero {
		grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
		padding: 40px;
	}

	body.maquette-app .account-reference .account-dashboard {
		grid-template-columns: 260px minmax(0, 1fr);
		align-items: start;
		gap: 22px;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		position: sticky;
		top: 116px;
		grid-template-columns: 1fr;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 72px minmax(0, 1fr) minmax(150px, auto) 150px max-content;
		gap: 12px 18px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-column: 3;
		grid-row: 1 / span 2;
	}

	body.maquette-app .account-reference .account-dashboard .history-close.is-empty {
		display: block;
		visibility: hidden;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 4;
		grid-row: 1 / span 2;
		justify-self: end;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 5;
		grid-row: 1 / span 2;
		width: auto;
		min-width: 132px;
	}
}

@media (max-width: 620px) {
	body.maquette-app .account-reference .client-account-hero {
		padding: 22px 18px;
	}

	body.maquette-app .account-reference .client-account-hero-content h1 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: 1 / -1;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
		grid-template-columns: 1fr;
		text-align: center;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
		grid-row: auto;
		margin: 0 auto;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab {
		min-width: max-content;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .section-header {
		align-items: flex-start;
		flex-direction: column;
	}

	body.maquette-app .account-reference .account-section-actions {
		justify-content: flex-start;
	}
}

/* Détail vente client — reprise de maquette/09-Detail-vente-client.html */
body.maquette-app .sale-detail-page {
	color: var(--text);
	font-family: var(--font-ui);
}

body.maquette-app .sale-detail-page .hero {
	grid-template-columns: 1fr;
	gap: 20px;
	padding: 22px 18px;
}

body.maquette-app .sale-detail-page .hero-main h1 {
	font-size: 30px;
	line-height: 1.08;
}

body.maquette-app .sale-detail-page .hero-main > p:not(.eyebrow) {
	max-width: 560px;
	font-size: 16px;
}

body.maquette-app .sale-detail-page a,
body.maquette-app .sale-detail-page a:hover,
body.maquette-app .sale-detail-page a:focus {
	color: inherit;
	text-decoration: none;
}

body.maquette-app .sale-detail-page .btn,
body.maquette-app .sale-detail-page button.btn,
body.maquette-app .sale-detail-page a.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--text);
	font: inherit;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
	text-transform: none;
	box-shadow: none;
}

body.maquette-app .sale-detail-page .btn.primary,
body.maquette-app .sale-detail-page a.btn.primary,
body.maquette-app .sale-detail-page button.btn.primary {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

body.maquette-app .sale-detail-page .btn.secondary,
body.maquette-app .sale-detail-page a.btn.secondary,
body.maquette-app .sale-detail-page button.btn.secondary {
	border-color: rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .1);
	color: var(--bb9-pink);
}

body.maquette-app .sale-detail-page .detail-hero-state {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	justify-content: center;
}

body.maquette-app .sale-detail-page .detail-hero-state .status {
	margin: 0;
	padding: 6px 13px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 12px;
	font-weight: 500;
}

body.maquette-app .sale-detail-page .detail-hero-state.is-closed {
	display: grid;
	justify-items: start;
	gap: 6px;
	padding: 18px;
	border: 1px solid rgba(var(--brand-accent-rgb, 211, 0, 122), .18);
	border-radius: var(--radius-lg);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .06);
	color: var(--muted);
}

body.maquette-app .sale-detail-page .detail-hero-state.is-closed strong {
	color: var(--bb9-pink);
	font-size: 22px;
	font-weight: 500;
}

body.maquette-app .sale-detail-page .detail-summary {
	max-width: none;
}

body.maquette-app .sale-detail-page .detail-summary .section-header {
	display: block;
	margin-bottom: 18px;
}

body.maquette-app .sale-detail-page .detail-summary .section-header h2 {
	font-size: 30px;
}

body.maquette-app .sale-detail-page .detail-info {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

body.maquette-app .sale-detail-page .detail-summary .info-card {
	display: grid;
	align-content: start;
	padding: 14px;
	text-align: center;
}

body.maquette-app .sale-detail-page .detail-summary .info-card h3 {
	margin-bottom: 8px;
	color: var(--bb9-green);
	font-size: 16px;
}

body.maquette-app .sale-detail-page .detail-summary .info-field {
	padding: 8px 0;
}

body.maquette-app .sale-detail-page .detail-summary .info-field span {
	font-size: 10px;
	line-height: 1.2;
}

body.maquette-app .sale-detail-page .detail-summary .info-field strong {
	font-size: 16px;
}

body.maquette-app .sale-detail-page .detail-info .amount {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--bb9-pink);
	font-size: 18px;
	line-height: inherit;
}

body.maquette-app .sale-detail-page .share-actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 10px;
}

body.maquette-app .sale-detail-page .share-actions .btn,
body.maquette-app .sale-detail-page .participant-link {
	min-height: 44px;
	width: 100%;
	margin-top: 0;
	padding-inline: 12px;
}

body.maquette-app .sale-detail-page .share-actions .btn {
	gap: 8px;
}

body.maquette-app .sale-detail-page .share-actions .btn i {
	font-size: 16px;
}

body.maquette-app .sale-detail-page .share-actions .btn span {
	display: none;
}

body.maquette-app .sale-detail-page .share-actions .btn {
	width: 100%;
	min-width: 0;
	height: 38px;
	min-height: 38px;
	padding: 0 8px;
}

body.maquette-app .sale-detail-page .participant-link {
	min-height: 44px;
	padding-inline: 10px;
	font-size: 14px;
	line-height: 1.15;
	white-space: normal;
}

body.maquette-app .sale-detail-page .sale-detail-tabs {
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	overflow-x: auto;
	scrollbar-width: none;
}

body.maquette-app .sale-detail-page .sale-detail-tabs::-webkit-scrollbar {
	display: none;
}

body.maquette-app .sale-detail-page .article-filter-panel {
	display: grid;
	gap: 12px;
	margin-bottom: 16px;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: #f9fdfd;
}

body.maquette-app .sale-detail-page .article-filter-panel > div {
	display: grid;
	gap: 8px;
}

.status-filter-toggle {
	display: none;
}

body.maquette-app .sale-detail-page .article-filter-panel > div > span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .sale-detail-page .article-filter-panel .filters,
body.maquette-app .sale-detail-page .detail-settings .filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
}

body.maquette-app .sale-detail-page .article-filter-panel .filter-pill,
body.maquette-app .sale-detail-page .detail-settings .filter-pill {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--muted);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	user-select: none;
}

body.maquette-app .sale-detail-page .article-filter-panel .filter-pill input,
body.maquette-app .sale-detail-page .detail-settings .filter-pill input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

body.maquette-app .sale-detail-page .article-filter-panel .filter-pill.active,
body.maquette-app .sale-detail-page .detail-settings .filter-pill.active {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .36);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

@media (max-width: 719px) {
	body.maquette-app .sale-detail-page .status-filter-toggle {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		align-items: center;
		gap: 10px;
		width: 100%;
		min-height: 48px;
		margin-bottom: 10px;
		padding: 8px 12px;
		border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .2);
		border-radius: 999px;
		background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .1), rgba(var(--brand-accent-light-rgb, 255, 91, 172), .06)), var(--white);
		box-shadow: 0 10px 24px rgba(var(--brand-primary-rgb, 0, 90, 90), .08);
		color: var(--text);
		font: inherit;
		text-align: left;
	}

	body.maquette-app .sale-detail-page .status-filter-toggle-main {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--bb9-green);
		font-weight: 600;
	}

	body.maquette-app .sale-detail-page .status-filter-toggle-main i {
		display: inline-grid;
		width: 28px;
		height: 28px;
		border-radius: 50%;
		background: var(--bb9-green);
		color: #fff;
		font-size: 13px;
		place-items: center;
	}

	body.maquette-app .sale-detail-page .status-filter-toggle-summary {
		overflow: hidden;
		color: var(--muted);
		font-size: 13px;
		font-weight: 500;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	body.maquette-app .sale-detail-page .status-filter-toggle-chevron {
		color: var(--bb9-green);
		font-size: 13px;
		transition: transform .22s ease;
	}

	body.maquette-app .sale-detail-page .status-filter-toggle.is-open .status-filter-toggle-chevron {
		transform: rotate(180deg);
	}

	body.maquette-app .sale-detail-page .article-filter-panel {
		max-height: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
		overflow: hidden;
		opacity: 0;
		transform: translateY(-8px);
		transition: max-height .28s ease, opacity .22s ease, transform .22s ease, padding .22s ease, margin .22s ease;
		pointer-events: none;
	}

	body.maquette-app .sale-detail-page .article-filter-panel.is-open {
		max-height: 360px;
		margin-bottom: 14px;
		padding-top: 12px;
		padding-bottom: 12px;
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}
}

body.maquette-app .sale-detail-page .detail-article-list,
body.maquette-app .sale-detail-page .payment-list,
body.maquette-app .sale-detail-page .detail-message-list {
	display: grid;
	gap: 12px;
}

body.maquette-app .sale-detail-page .detail-article,
body.maquette-app .sale-detail-page .payment-row {
	display: grid;
	gap: 14px;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: #f9fdfd;
	box-shadow: 0 8px 24px rgba(var(--brand-primary-rgb, 0, 80, 80), .05);
}

body.maquette-app .sale-detail-page .detail-article {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	cursor: pointer;
}

body.maquette-app .sale-detail-page .detail-article img,
body.maquette-app .sale-detail-page .detail-article-no-image {
	grid-column: 1 / -1;
	width: 150px;
	height: 150px;
	justify-self: center;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: var(--white);
	object-fit: contain;
}

body.maquette-app .sale-detail-page .detail-article-no-image {
	display: grid;
	place-items: center;
	color: var(--bb9-green);
	font-size: 26px;
}

body.maquette-app .sale-detail-page .detail-article .article-main {
	grid-column: 1 / -1;
}

body.maquette-app .sale-detail-page .detail-article h3 {
	margin: 0 0 4px;
	color: var(--text);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.2;
}

body.maquette-app .sale-detail-page .detail-article p {
	margin: 0;
	color: var(--muted);
	font-size: 14px;
}

body.maquette-app .sale-detail-page .article-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 10px;
}

body.maquette-app .sale-detail-page .article-badges .status {
	margin: 0;
}

body.maquette-app .sale-detail-page .payment-status {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
}

body.maquette-app .sale-detail-page .article-meta,
body.maquette-app .sale-detail-page .article-price {
	display: grid;
	gap: 4px;
	align-content: center;
	justify-items: center;
	padding: 12px 14px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
	text-align: center;
}

body.maquette-app .sale-detail-page .article-meta span,
body.maquette-app .sale-detail-page .article-price span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .sale-detail-page .article-meta strong,
body.maquette-app .sale-detail-page .article-price strong {
	font-weight: 500;
}

body.maquette-app .sale-detail-page .article-price-values {
	display: grid;
	gap: 2px;
	justify-items: center;
}

body.maquette-app .sale-detail-page .article-price del {
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
	text-decoration-thickness: 2px;
}

body.maquette-app .sale-detail-page .article-price .amount,
body.maquette-app .sale-detail-page .payment-row .amount {
	margin: 0;
	color: var(--bb9-pink);
	font-size: 20px;
	font-weight: 500;
}

body.maquette-app .sale-detail-page .payment-person,
body.maquette-app .sale-detail-page .payment-content {
	display: grid;
	gap: 5px;
}

body.maquette-app .sale-detail-page .payment-person strong,
body.maquette-app .sale-detail-page .payment-content > strong {
	color: var(--text);
	font-weight: 500;
}

body.maquette-app .sale-detail-page .payment-person b,
body.maquette-app .sale-detail-page .payment-person span,
body.maquette-app .sale-detail-page .payment-content {
	color: var(--muted);
	font-weight: 500;
}

body.maquette-app .sale-detail-page .reservation-row {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .045);
}

body.maquette-app .sale-detail-page .detail-subheader {
	margin-top: 24px;
}

body.maquette-app .sale-detail-page .detail-settings {
	display: grid;
	gap: 12px;
}

body.maquette-app .sale-detail-page .state-description-list {
	display: grid;
	gap: 12px;
	margin-top: 16px;
}

body.maquette-app .sale-detail-page .state-description {
	padding: 16px 18px;
	border: 1px solid var(--line);
	border-radius: 22px;
	color: var(--muted);
	font-size: 16px;
	line-height: 1.35;
}

body.maquette-app .sale-detail-page .state-description strong {
	color: inherit;
	font-weight: 500;
}

body.maquette-app .sale-detail-page .state-description.is-success {
	border-color: rgba(73, 156, 73, .18);
	background: rgba(73, 156, 73, .14);
	color: #36743a;
}

body.maquette-app .sale-detail-page .state-description.is-warning {
	border-color: rgba(229, 160, 40, .22);
	background: rgba(229, 160, 40, .12);
	color: #8a6726;
}

body.maquette-app .sale-detail-page .state-description.is-danger {
	border-color: rgba(190, 44, 44, .18);
	background: rgba(190, 44, 44, .12);
	color: #a33a3a;
}

body.maquette-app .sale-detail-page .detail-field {
	display: grid;
	gap: 8px;
	margin-top: 12px;
}

body.maquette-app .sale-detail-page .detail-field span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

body.maquette-app .sale-detail-page .detail-field input,
body.maquette-app .sale-detail-page .detail-field textarea {
	width: 100%;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: var(--white);
	color: var(--text);
	font: inherit;
	font-weight: 500;
}

body.maquette-app .sale-detail-page .detail-field input {
	min-height: 52px;
	padding: 0 16px;
}

body.maquette-app .sale-detail-page .detail-field textarea {
	min-height: 128px;
	padding: 14px 16px;
	resize: vertical;
}

body.maquette-app .sale-detail-page .detail-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}

body.maquette-app .sale-detail-page .detail-actions .btn {
	min-width: 150px;
	margin-top: 0;
}

body.maquette-app .sale-detail-page .message-card .message-meta {
	margin-bottom: 8px;
	color: var(--muted);
	font-size: 13px;
}

@media (min-width: 760px) {
	body.maquette-app .account-reference .hero {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
		align-items: center;
		padding: 34px;
	}

	body.maquette-app .account-reference .hero-main h1 {
		font-size: 42px;
	}

	body.maquette-app .account-reference .hero-main > span,
	body.maquette-app .account-reference .hero-main > p:not(.eyebrow) {
		font-size: 18px;
	}

	body.maquette-app .account-reference .content-tabs {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}

	body.maquette-app .account-reference .section {
		margin-top: 22px;
		padding: 34px;
	}

	body.maquette-app .account-reference .section-header h2 {
		font-size: 36px;
	}

	body.maquette-app .account-reference .counter {
		width: 64px;
		min-width: 64px;
		height: 64px;
		font-size: 26px;
	}

	body.maquette-app .account-reference .sale-grid {
		grid-template-columns: 1fr;
	}

	body.maquette-app .account-reference .sale-card {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr) minmax(140px, .55fr) 140px max-content;
		gap: 6px 18px;
		align-items: center;
		text-align: left;
	}

	body.maquette-app .account-reference .sale-card .status,
	body.maquette-app .account-reference .sale-card .amount,
	body.maquette-app .account-reference .sale-card .btn {
		margin: 0;
	}

	body.maquette-app .account-reference .sale-card h3,
	body.maquette-app .account-reference .sale-card p {
		margin: 0;
	}

	body.maquette-app .account-reference .sale-card .status {
		grid-column: 1;
		grid-row: 1 / span 2;
		align-self: center;
	}

	body.maquette-app .account-reference .history-main {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	body.maquette-app .account-reference .history-close {
		grid-column: 3;
		grid-row: 1 / span 2;
		align-self: center;
	}

	body.maquette-app .account-reference .history-close.is-empty {
		display: block;
	}

	body.maquette-app .account-reference .sale-card .amount {
		grid-column: 4;
		grid-row: 1 / span 2;
		justify-self: end;
	}

	body.maquette-app .account-reference .sale-card .btn {
		grid-column: 5;
		grid-row: 1 / span 2;
		justify-self: end;
	}

	body.maquette-app .account-reference .info-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	body.maquette-app .account-reference .fidelity-card {
		display: grid;
		grid-template-columns: auto 1fr auto;
		gap: 18px;
		align-items: center;
		text-align: left;
	}

	body.maquette-app .account-reference .fidelity-icon {
		margin: 0;
	}

	body.maquette-app .sale-detail-page .detail-info {
		grid-template-columns: repeat(4, 1fr);
	}

	body.maquette-app .sale-detail-page .detail-info.is-short {
		width: min(100%, 1030px);
		margin-inline: auto;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-content: center;
	}

	body.maquette-app .sale-detail-page .hero {
		grid-template-columns: minmax(0, 1fr) auto;
		min-height: 184px;
		padding: 34px;
	}

	body.maquette-app .sale-detail-page .hero-main h1 {
		font-size: 42px;
	}

	body.maquette-app .sale-detail-page .hero-main > p:not(.eyebrow) {
		font-size: 17px;
	}

	body.maquette-app .sale-detail-page .detail-hero-state {
		justify-content: flex-end;
		min-width: 300px;
	}

	body.maquette-app .sale-detail-page .detail-summary .section-header h2 {
		font-size: 36px;
	}

	body.maquette-app .sale-detail-page .detail-summary .info-card {
		padding: 18px;
		text-align: left;
	}

	body.maquette-app .sale-detail-page .detail-summary .info-card h3 {
		font-size: 19px;
	}

	body.maquette-app .sale-detail-page .detail-summary .info-field {
		padding: 10px 0;
	}

	body.maquette-app .sale-detail-page .detail-summary .info-field span {
		font-size: 12px;
	}

	body.maquette-app .sale-detail-page .detail-summary .info-field strong {
		font-size: 16px;
	}

	body.maquette-app .sale-detail-page .detail-info .amount {
		font-size: 20px;
	}

	body.maquette-app .sale-detail-page .share-actions .btn i {
		display: inline-block;
	}

	body.maquette-app .sale-detail-page .share-actions .btn {
		width: 100%;
		min-width: 0;
		height: auto;
		min-height: 44px;
		padding-inline: 12px;
	}

	body.maquette-app .sale-detail-page .share-actions .btn span {
		display: none;
	}

	body.maquette-app .sale-detail-page .participant-link {
		min-height: 44px;
		padding-inline: 12px;
		font-size: inherit;
		white-space: normal;
	}

	body.maquette-app .sale-detail-page .detail-info.is-closed {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: min(100%, 620px);
	}

	body.maquette-app .sale-detail-page .sale-detail-tabs {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	}

	body.maquette-app .sale-detail-page .article-filter-panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .sale-detail-page .detail-article {
		grid-template-columns: 92px minmax(0, 1fr) auto auto;
		align-items: center;
	}

	body.maquette-app .sale-detail-page .detail-article img,
	body.maquette-app .sale-detail-page .detail-article-no-image,
	body.maquette-app .sale-detail-page .detail-article .article-main {
		grid-column: auto;
	}

	body.maquette-app .sale-detail-page .detail-article img,
	body.maquette-app .sale-detail-page .detail-article-no-image {
		width: 86px;
		height: 86px;
		justify-self: auto;
	}

	body.maquette-app .sale-detail-page .article-meta,
	body.maquette-app .sale-detail-page .article-price {
		min-width: 118px;
	}

	body.maquette-app .sale-detail-page .payment-row {
		grid-template-columns: minmax(180px, .75fr) minmax(0, 1fr) auto;
		align-items: center;
	}

	body.maquette-app .sale-detail-page .payment-row .amount {
		justify-self: end;
		white-space: nowrap;
	}

	body.maquette-app .sale-detail-page .detail-settings {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .sale-detail-page .detail-actions {
		grid-column: 1 / -1;
	}
}

@media (min-width: 720px) {
	body.maquette-app > .app {
		padding: 18px 24px 0;
	}

	.topbar-inner {
		position: relative;
	}

	.topbar-inner .logo {
		position: absolute;
		left: 14px;
	}

	.store-name,
	.topbar .nav {
		display: flex;
	}

	.topbar-caddy {
		position: absolute;
		right: 14px;
		display: block;
	}

	.topbar-caddy .top-action {
		display: inline-flex;
	}

	.mobile-nav {
		display: none;
	}

	.back-to-top {
		bottom: 28px;
	}

	.hero {
		grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
		align-items: start;
		padding: 34px;
	}

	.hero-stats {
		align-self: start;
		margin-top: 120px;
	}

	.hero h1 {
		font-size: 42px;
	}

	.hero h1.hero-parent-names {
		font-size: 48px;
	}

	.hero p:not(.eyebrow) {
		font-size: 18px;
	}

	.hero-actions {
		grid-template-columns: auto auto;
		justify-content: start;
	}

	.section {
		margin-top: 24px;
	}

	.section-header h2 {
		font-size: 30px;
	}

	.intro-grid,
	.action-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.steps {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		overflow: visible;
		padding-bottom: 0;
		scroll-snap-type: none;
	}

	.steps:before,
	.steps:after {
		display: none;
	}

	.step {
		display: block;
	}

	.step-number {
		margin-bottom: 12px;
	}

	.step h3 {
		overflow: visible;
		font-size: 16px;
		text-overflow: clip;
		white-space: normal;
	}

	.step p {
		display: block;
	}

	.search-card {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
	}

	.search-hint {
		padding-right: 10px;
	}

	.results {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sort-bar {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
	}

	.sort-direction {
		justify-content: flex-end;
	}

	.gift-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.participation-card {
		grid-template-columns: minmax(310px, 1fr) minmax(220px, .75fr) auto;
		align-items: center;
	}

	.donor-section {
		padding: 26px;
	}

	.donor-header {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: start;
	}

	.donor-form {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.cart-page-item {
		grid-template-columns: 92px minmax(0, 1fr) auto auto;
		gap: 16px;
		padding: 16px;
	}

	.cart-product-media {
		width: 92px;
		height: 92px;
	}

	.cart-product-info p {
		display: block;
		margin-top: 4px;
	}

	.footer {
		margin-bottom: 28px;
	}

	.footer-card {
		grid-template-columns: 1.1fr 1fr .9fr;
		align-items: start;
		padding: 28px;
	}
}

@media (min-width: 992px) {
	.gift-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.result {
		grid-template-columns: minmax(0, 1fr) auto;
		text-align: left;
	}

	.result .maquette-btn {
		width: auto;
		min-width: 150px;
	}

	.cart-layout {
		grid-template-columns: minmax(0, 1fr) 320px;
		align-items: start;
	}

	.checkout-layout {
		grid-template-columns: minmax(0, 1fr) 340px;
		align-items: start;
	}

	.checkout-layout .order-summary {
		position: sticky;
		top: 118px;
	}

	.bank-layout {
		grid-template-columns: minmax(0, 1fr) 340px;
		align-items: start;
	}

	.bank-info-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bank-info-grid .bank-amount {
		grid-column: 1 / -1;
	}

	.bank-payment-card {
		position: sticky;
		top: 118px;
	}

	.account-login-layout {
		grid-template-columns: minmax(0, 1fr) 340px;
		align-items: start;
	}

	.account-login-layout .account-login-card:only-child {
		grid-column: 1 / -1;
		max-width: 760px;
		width: 100%;
		margin-inline: auto;
	}

	.account-help-card {
		position: sticky;
		top: 118px;
	}
}

@media (max-width: 1050px) and (min-width: 720px) {
	.store-name {
		display: none;
	}

	.topbar .nav a {
		padding: 0 10px;
		font-size: 13px;
	}
}

/* Shared product status icons */
body.maquette-app .sale-detail-page .article-badges .status,
body.maquette-app .gift-status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

body.maquette-app .favorite-ribbon i,
body.maquette-app .gift-status i,
body.maquette-app .sale-detail-page .article-badges .status i {
	font-size: .9em;
	line-height: 1;
}

/* BB9 dark mode */
body.maquette-app.theme-dark {
	--bb9-green: #2bd1c9;
	--bb9-pink: #ff5bac;
	--text: #f7fbfb;
	--muted: #b7c6ca;
	--line: #29474b;
	--soft: #101f22;
	--white: #17292d;
	--shadow: 0 20px 48px rgba(0, 0, 0, .36);
	background:
		radial-gradient(circle at 10% 0%, rgba(var(--brand-primary-rgb, 0, 152, 152), .16), transparent 34rem),
		radial-gradient(circle at 100% 14%, rgba(var(--brand-accent-light-rgb, 255, 91, 172), .1), transparent 28rem),
		linear-gradient(180deg, #0d191c 0%, #12282b 100%);
	color: var(--text);
}

body.maquette-app.theme-dark .topbar {
	background: linear-gradient(180deg, rgba(13, 25, 28, .96), rgba(13, 25, 28, .86));
}

body.maquette-app.theme-dark .topbar-inner,
body.maquette-app.theme-dark .mobile-nav,
body.maquette-app.theme-dark .hero,
body.maquette-app.theme-dark .contact-card,
body.maquette-app.theme-dark .contact-form-card,
body.maquette-app.theme-dark .contact-store-card,
body.maquette-app.theme-dark .search-card,
body.maquette-app.theme-dark .result,
body.maquette-app.theme-dark .intro-card,
body.maquette-app.theme-dark .action-card,
body.maquette-app.theme-dark .step,
body.maquette-app.theme-dark .participation-card,
body.maquette-app.theme-dark .gift-card,
body.maquette-app.theme-dark .cart-page-item,
body.maquette-app.theme-dark .checkout-card,
body.maquette-app.theme-dark .order-summary,
body.maquette-app.theme-dark .donor-section,
body.maquette-app.theme-dark .account-login-card,
body.maquette-app.theme-dark .account-help-card,
body.maquette-app.theme-dark .client-account-section,
body.maquette-app.theme-dark .account-reference .section,
body.maquette-app.theme-dark .sale-detail-page .section,
body.maquette-app.theme-dark .maquette-modal-window .modal-content,
body.maquette-app.theme-dark .maquette-cart-modal-window .modal-content {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
	background: rgba(23, 41, 45, .94);
	box-shadow: var(--shadow);
}

body.maquette-app.theme-dark .hero h1,
body.maquette-app.theme-dark .client-account-hero-content h1,
body.maquette-app.theme-dark .account-reference .hero-main h1,
body.maquette-app.theme-dark .sale-detail-page .hero-main h1,
body.maquette-app.theme-dark .section-header h2,
body.maquette-app.theme-dark h1,
body.maquette-app.theme-dark h2,
body.maquette-app.theme-dark h3,
body.maquette-app.theme-dark .gift-content strong,
body.maquette-app.theme-dark .result h3,
body.maquette-app.theme-dark .cart-product-info strong {
	color: var(--text);
}

body.maquette-app.theme-dark .hero .eyebrow,
body.maquette-app.theme-dark .eyebrow,
body.maquette-app.theme-dark p,
body.maquette-app.theme-dark .section-header p,
body.maquette-app.theme-dark .gift-content span,
body.maquette-app.theme-dark .cart-product-info span,
body.maquette-app.theme-dark .cart-product-info p,
body.maquette-app.theme-dark .result span,
body.maquette-app.theme-dark .result small {
	color: var(--muted);
}

body.maquette-app.theme-dark .hero h1.hero-parent-names span {
	color: #55e1dc;
}

body.maquette-app.theme-dark .hero-trust-badge {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .26);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .1);
	color: #d9eeee;
}

body.maquette-app.theme-dark .hero-trust-badge i {
	background: #55e1dc;
	color: #102326;
}

body.maquette-app.theme-dark .hero-trust-badge {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .12);
	color: #d9eeee;
}

body.maquette-app.theme-dark .hero-trust-badge i {
	background: #55e1dc;
	color: #102326;
}

body.maquette-app.theme-dark .search-input,
body.maquette-app.theme-dark .contact-field,
body.maquette-app.theme-dark .donor-form label,
body.maquette-app.theme-dark .account-login-form label,
body.maquette-app.theme-dark .amount-field,
body.maquette-app.theme-dark .amount-options button,
body.maquette-app.theme-dark .sort-buttons button,
body.maquette-app.theme-dark .cart-dropdown-item,
body.maquette-app.theme-dark .maquette-modal-product,
body.maquette-app.theme-dark .maquette-modal-status-card,
body.maquette-app.theme-dark .maquette-modal-list-item,
body.maquette-app.theme-dark input,
body.maquette-app.theme-dark textarea,
body.maquette-app.theme-dark select {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
	background: #102326;
	color: var(--text);
}

body.maquette-app.theme-dark .sort-buttons button.active {
	border-color: #55e1dc;
	background: linear-gradient(135deg, #55e1dc 0%, #2bd1c9 100%);
	box-shadow: 0 10px 24px rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
	color: #102326;
}

body.maquette-app.theme-dark .sort-buttons button.active:hover,
body.maquette-app.theme-dark .sort-buttons button.active:focus {
	border-color: #7ff1ec;
	background: linear-gradient(135deg, #7ff1ec 0%, #55e1dc 100%);
	color: #102326;
}

body.maquette-app.theme-dark .sort-toggle {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: linear-gradient(135deg, rgba(var(--brand-primary-light-rgb, 43, 209, 201), .14), rgba(255, 117, 185, .08)), #102326;
	box-shadow: 0 14px 30px rgba(0, 0, 0, .22);
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sort-toggle-main,
body.maquette-app.theme-dark .sort-toggle-chevron {
	color: #55e1dc;
}

body.maquette-app.theme-dark .sort-toggle-main i {
	background: #55e1dc;
	color: #102326;
}

body.maquette-app.theme-dark .sort-toggle-summary {
	color: #c2dadd;
}

body.maquette-app.theme-dark .sale-detail-page .status-filter-toggle {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: linear-gradient(135deg, rgba(var(--brand-primary-light-rgb, 43, 209, 201), .14), rgba(255, 117, 185, .08)), #102326;
	box-shadow: 0 14px 30px rgba(0, 0, 0, .22);
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .status-filter-toggle-main,
body.maquette-app.theme-dark .sale-detail-page .status-filter-toggle-chevron {
	color: #55e1dc;
}

body.maquette-app.theme-dark .sale-detail-page .status-filter-toggle-main i {
	background: #55e1dc;
	color: #102326;
}

body.maquette-app.theme-dark .sale-detail-page .status-filter-toggle-summary {
	color: #c2dadd;
}

body.maquette-app.theme-dark input::placeholder,
body.maquette-app.theme-dark textarea::placeholder {
	color: #81979c;
}

body.maquette-app.theme-dark .gift-media,
body.maquette-app.theme-dark .cart-product-media,
body.maquette-app.theme-dark .maquette-modal-media,
body.maquette-app.theme-dark .maquette-tracking-gallery {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .18);
	background: #102326;
}

body.maquette-app.theme-dark .gift-media img,
body.maquette-app.theme-dark .cart-product-media img,
body.maquette-app.theme-dark .maquette-modal-media img,
body.maquette-app.theme-dark .maquette-tracking-gallery img {
	background: #fff;
}

body.maquette-app.theme-dark .price-row p,
body.maquette-app.theme-dark .cart-line-total,
body.maquette-app.theme-dark .summary-total strong,
body.maquette-app.theme-dark .cart-dropdown-total strong,
body.maquette-app.theme-dark .cart-dropdown-header strong,
body.maquette-app.theme-dark .maquette-modal-price span,
body.maquette-app.theme-dark .maquette-modal-total strong {
	color: #ff75b9;
}

body.maquette-app.theme-dark .favorite-ribbon {
	background: linear-gradient(135deg, #df1682 0%, #ff5bac 100%);
	box-shadow: 0 14px 30px rgba(var(--brand-accent-light-rgb, 255, 91, 172), .22);
}

body.maquette-app.theme-dark .maquette-btn.secondary,
body.maquette-app.theme-dark .top-action,
body.maquette-app.theme-dark .mobile-cart .cart-trigger,
body.maquette-app.theme-dark .back-to-top,
body.maquette-app.theme-dark .cart-dropdown-link.danger,
body.maquette-app.theme-dark .maquette-modal-btn.danger,
body.maquette-app.theme-dark .maquette-modal-btn.soft-danger,
body.maquette-app.theme-dark .gift-status,
body.maquette-app.theme-dark .gift-status.reserved,
body.maquette-app.theme-dark .step.is-current {
	border-color: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .28);
	background: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .12);
	color: #ff9acc;
}

body.maquette-app.theme-dark .hero-parent-message {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	border-left-color: #2bd1c9;
	background: linear-gradient(135deg, rgba(25, 55, 58, .98), rgba(18, 40, 43, .98));
	box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
	color: #d5e5e8;
}

body.maquette-app.theme-dark .hero-parent-message h2 {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .hero-parent-message-icon {
	background: #55e1dc;
	color: #102326;
}

body.maquette-app.theme-dark .hero-parent-message p,
body.maquette-app.theme-dark .hero-parent-message div {
	color: #d5e5e8;
}

body.maquette-app.theme-dark .hero-stat,
body.maquette-app.theme-dark .hero-stats .hero-stat,
body.maquette-app.theme-dark .account-reference .hero-stat,
body.maquette-app.theme-dark .client-account-hero-summary .hero-stat {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: linear-gradient(180deg, rgba(25, 55, 58, .96), rgba(18, 40, 43, .96));
	box-shadow: 0 12px 28px rgba(0, 0, 0, .2);
}

body.maquette-app.theme-dark .hero-stat strong,
body.maquette-app.theme-dark .account-reference .hero-stat strong,
body.maquette-app.theme-dark .client-account-hero-summary .hero-stat strong {
	color: #55e1dc;
}

body.maquette-app.theme-dark .hero-stat > i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
	color: #55e1dc;
}

body.maquette-app.theme-dark .hero-stat:nth-child(2) {
	border-color: rgba(255, 117, 185, .24);
	background: linear-gradient(180deg, rgba(48, 31, 44, .96), rgba(34, 27, 36, .96));
}

body.maquette-app.theme-dark .hero-stat:nth-child(2) > i {
	background: rgba(255, 117, 185, .16);
	color: #ff75b9;
}

body.maquette-app.theme-dark .hero-stat:nth-child(2) strong {
	color: #ff75b9;
}

body.maquette-app.theme-dark .hero-stat span,
body.maquette-app.theme-dark .account-reference .hero-stat span,
body.maquette-app.theme-dark .client-account-hero-summary .hero-stat span {
	color: #c2dadd;
}

body.maquette-app.theme-dark .theme-switcher {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(16, 35, 38, .94);
	box-shadow: 0 18px 42px rgba(0, 0, 0, .34);
}

body.maquette-app.theme-dark .theme-switcher button {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .26);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .1);
	color: #93f0eb;
}

body.maquette-app.theme-dark .theme-switcher button.is-active,
body.maquette-app.theme-dark .theme-switcher button:hover,
body.maquette-app.theme-dark .theme-switcher button:focus {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #0d191c;
}

/* BB9 dark readability sweep */
body.maquette-app.theme-dark .client-sale-card,
body.maquette-app.theme-dark .client-history-row,
body.maquette-app.theme-dark .client-history-table,
body.maquette-app.theme-dark .client-history-table .table,
body.maquette-app.theme-dark .account-reference .sale-card,
body.maquette-app.theme-dark .account-reference .history-close,
body.maquette-app.theme-dark .account-reference .info-card,
body.maquette-app.theme-dark .account-reference .message-card,
body.maquette-app.theme-dark .account-reference .fidelity-card,
body.maquette-app.theme-dark .sale-detail-page .detail-summary .info-card,
body.maquette-app.theme-dark .sale-detail-page .article-filter-panel,
body.maquette-app.theme-dark .sale-detail-page .detail-article,
body.maquette-app.theme-dark .sale-detail-page .payment-row,
body.maquette-app.theme-dark .sale-detail-page .detail-settings,
body.maquette-app.theme-dark .sale-detail-page .message-card,
body.maquette-app.theme-dark .sale-detail-page .info-card,
body.maquette-app.theme-dark .sale-detail-page .fidelity-card,
body.maquette-app.theme-dark .sale-detail-page .info-note,
body.maquette-app.theme-dark .sale-detail-page .detail-field,
body.maquette-app.theme-dark .cart-dropdown-panel,
body.maquette-app.theme-dark .summary-note,
body.maquette-app.theme-dark .maquette-tracking-media-card,
body.maquette-app.theme-dark .maquette-tracking-panel,
body.maquette-app.theme-dark .maquette-tracking-step,
body.maquette-app.theme-dark .maquette-modal-status-card {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .26);
}

body.maquette-app.theme-dark .client-sale-main h3,
body.maquette-app.theme-dark .client-history-main h3,
body.maquette-app.theme-dark .account-reference .sale-card h3,
body.maquette-app.theme-dark .account-reference .info-card h3,
body.maquette-app.theme-dark .sale-detail-page .detail-summary .info-card h3,
body.maquette-app.theme-dark .sale-detail-page .detail-article h3,
body.maquette-app.theme-dark .sale-detail-page .detail-settings h3,
body.maquette-app.theme-dark .sale-detail-page .detail-field strong,
body.maquette-app.theme-dark .maquette-tracking-step strong {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .client-sale-main p,
body.maquette-app.theme-dark .client-history-main p,
body.maquette-app.theme-dark .client-history-closed span,
body.maquette-app.theme-dark .account-reference .sale-card p,
body.maquette-app.theme-dark .account-reference .info-card p,
body.maquette-app.theme-dark .account-reference .info-card span,
body.maquette-app.theme-dark .sale-detail-page .detail-summary .info-card p,
body.maquette-app.theme-dark .sale-detail-page .detail-article p,
body.maquette-app.theme-dark .sale-detail-page .payment-row,
body.maquette-app.theme-dark .sale-detail-page .detail-field span,
body.maquette-app.theme-dark .sale-detail-page .info-note,
body.maquette-app.theme-dark .maquette-tracking-step span:not(.tracking-dot),
body.maquette-app.theme-dark .summary-note p,
body.maquette-app.theme-dark .cart-dropdown-empty {
	color: #c2dadd;
}

body.maquette-app.theme-dark .client-sale-card,
body.maquette-app.theme-dark .client-history-row,
body.maquette-app.theme-dark .sale-detail-page .detail-article,
body.maquette-app.theme-dark .sale-detail-page .payment-row {
	background: #f7fbfb;
	color: #273437;
}

body.maquette-app.theme-dark .client-sale-card h3,
body.maquette-app.theme-dark .client-history-row h3,
body.maquette-app.theme-dark .sale-detail-page .detail-article h3,
body.maquette-app.theme-dark .client-sale-card .client-sale-main h3,
body.maquette-app.theme-dark .client-history-row .client-history-main h3 {
	color: #273437;
}

body.maquette-app.theme-dark .client-sale-card p,
body.maquette-app.theme-dark .client-history-row p,
body.maquette-app.theme-dark .sale-detail-page .detail-article p,
body.maquette-app.theme-dark .client-sale-card span,
body.maquette-app.theme-dark .client-history-row span {
	color: #6b7e83;
}

body.maquette-app.theme-dark .sale-detail-page .detail-article .article-metric,
body.maquette-app.theme-dark .sale-detail-page .detail-article .article-price,
body.maquette-app.theme-dark .sale-detail-page .detail-article .article-quantity {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .detail-article .article-price strong,
body.maquette-app.theme-dark .sale-detail-page .payment-row .amount,
body.maquette-app.theme-dark .client-sale-amount,
body.maquette-app.theme-dark .client-history-amount,
body.maquette-app.theme-dark .account-reference .amount,
body.maquette-app.theme-dark .sale-detail-page .amount {
	color: #ff75b9;
}

body.maquette-app.theme-dark .sale-detail-page .article-filter-panel .filter-pill,
body.maquette-app.theme-dark .sale-detail-page .detail-settings .filter-pill,
body.maquette-app.theme-dark .account-reference .filter-inline .filter-pill,
body.maquette-app.theme-dark .client-account-filters button,
body.maquette-app.theme-dark .client-account-filters a,
body.maquette-app.theme-dark .client-account-tabs .nav-pills > li > a {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .1);
	color: #9eece8;
}

body.maquette-app.theme-dark .sale-detail-page .article-filter-panel .filter-pill.active,
body.maquette-app.theme-dark .sale-detail-page .detail-settings .filter-pill.active,
body.maquette-app.theme-dark .account-reference .filter-inline .filter-pill.active,
body.maquette-app.theme-dark .account-reference .filter-inline .filter-pill:has(input:checked),
body.maquette-app.theme-dark .client-account-tabs .nav-pills > li.active > a,
body.maquette-app.theme-dark .client-account-tabs .nav-pills > li.active > a:focus,
body.maquette-app.theme-dark .client-account-tabs .nav-pills > li.active > a:hover {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #0d191c;
}

body.maquette-app.theme-dark .info-field,
body.maquette-app.theme-dark .account-reference .info-field,
body.maquette-app.theme-dark .sale-detail-page .info-field,
body.maquette-app.theme-dark .contact-field,
body.maquette-app.theme-dark .donor-form label,
body.maquette-app.theme-dark .account-login-form label,
body.maquette-app.theme-dark .sale-detail-page .detail-field input,
body.maquette-app.theme-dark .sale-detail-page .detail-field textarea {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .26);
	background: #102326;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .info-field strong,
body.maquette-app.theme-dark .info-field b,
body.maquette-app.theme-dark .contact-field span,
body.maquette-app.theme-dark .donor-form label span,
body.maquette-app.theme-dark .account-login-form label span {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .info-field small,
body.maquette-app.theme-dark .info-field span,
body.maquette-app.theme-dark .contact-field small,
body.maquette-app.theme-dark .donor-form label small,
body.maquette-app.theme-dark .account-login-form label small {
	color: #b7c6ca;
}

body.maquette-app.theme-dark .gift-card,
body.maquette-app.theme-dark .archived-gifts .gift-card,
body.maquette-app.theme-dark .gift-card.is-selected,
body.maquette-app.theme-dark .gift-card.in-cart {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .gift-card .gift-content strong,
body.maquette-app.theme-dark .archived-gifts .gift-card .gift-content strong {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .gift-card .gift-content span,
body.maquette-app.theme-dark .archived-gifts .gift-card .gift-content span {
	color: #c2dadd;
}

body.maquette-app.theme-dark .gift-media,
body.maquette-app.theme-dark .archived-gifts .gift-media {
	background: #102326;
}

body.maquette-app.theme-dark .gift-media img,
body.maquette-app.theme-dark .archived-gifts .gift-media img,
body.maquette-app.theme-dark .gift-card.is-selected .gift-media img,
body.maquette-app.theme-dark .gift-card.in-cart .gift-media img,
body.maquette-app.theme-dark .maquette-tracking-gallery img {
	opacity: 1;
	filter: none;
	mix-blend-mode: normal;
}

body.maquette-app.theme-dark .gift-media > span,
body.maquette-app.theme-dark .detail-article-no-image {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .24);
	background: #f7fbfb;
	color: var(--bb9-green);
}

body.maquette-app.theme-dark .cart-dropdown-item,
body.maquette-app.theme-dark .cart-dropdown-total,
body.maquette-app.theme-dark .cart-dropdown-header,
body.maquette-app.theme-dark .cart-dropdown-actions {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
	color: #f7fbfb;
}

body.maquette-app.theme-dark .cart-dropdown-item strong,
body.maquette-app.theme-dark .cart-dropdown-total span {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .maquette-modal-close,
body.maquette-app.theme-dark .modal-close,
body.maquette-app.theme-dark button.close {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .24);
	background: #f7fbfb;
	color: #53696d;
}

body.maquette-app.theme-dark .sale-detail-page .state-description.is-success {
	border-color: rgba(102, 190, 126, .26);
	background: rgba(102, 190, 126, .18);
	color: #bdebc9;
}

body.maquette-app.theme-dark .sale-detail-page .state-description.is-warning {
	border-color: rgba(229, 187, 93, .3);
	background: rgba(229, 187, 93, .16);
	color: #f0d79c;
}

body.maquette-app.theme-dark .sale-detail-page .state-description.is-danger {
	border-color: rgba(237, 112, 112, .3);
	background: rgba(237, 112, 112, .15);
	color: #ffc0c0;
}

@media (min-width: 720px) {
	body.maquette-app.theme-dark .topbar .nav a {
		color: #d8eaed;
	}

	body.maquette-app.theme-dark .topbar .nav a:hover,
	body.maquette-app.theme-dark .topbar .nav a:focus {
		background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .14);
		color: #f7fbfb;
	}

	body.maquette-app.theme-dark .topbar .nav a.active {
		border-color: #2bd1c9;
		background: #2bd1c9;
		color: #0d191c;
	}

	body.maquette-app.theme-dark .top-action,
	body.maquette-app.theme-dark .topbar-caddy .cart-trigger {
		border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
		background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .12);
		color: #d8eaed;
	}
}

body.maquette-app.theme-dark .sale-detail-page .participant-link,
body.maquette-app.theme-dark .sale-detail-page .detail-info .participant-link,
body.maquette-app.theme-dark .sale-detail-page .info-card .participant-link {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #0d191c !important;
}

body.maquette-app.theme-dark .sale-detail-page .participant-link:hover,
body.maquette-app.theme-dark .sale-detail-page .participant-link:focus {
	background: #55e1dc;
	color: #0d191c !important;
}

body.maquette-app.theme-dark .sale-detail-page .participant-link span,
body.maquette-app.theme-dark .sale-detail-page .participant-link i {
	color: #0d191c !important;
}

body.maquette-app.theme-dark .sale-detail-page .detail-article {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .detail-article h3,
body.maquette-app.theme-dark .sale-detail-page .detail-article .article-main h3 {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .detail-article p,
body.maquette-app.theme-dark .sale-detail-page .detail-article .article-main p {
	color: #c2dadd;
}

body.maquette-app.theme-dark .sale-detail-page .article-meta,
body.maquette-app.theme-dark .sale-detail-page .article-price {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .32);
	background: #102326;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .article-meta span,
body.maquette-app.theme-dark .sale-detail-page .article-price span {
	color: #c2dadd;
}

body.maquette-app.theme-dark .sale-detail-page .article-meta strong,
body.maquette-app.theme-dark .sale-detail-page .article-price strong,
body.maquette-app.theme-dark .sale-detail-page .article-price .amount {
	color: #ff75b9;
}

body.maquette-app.theme-dark .sale-detail-page .article-price del {
	color: #b7c6ca;
}

body.maquette-app.theme-dark .sale-detail-page .payment-row {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .payment-person strong,
body.maquette-app.theme-dark .sale-detail-page .payment-person b,
body.maquette-app.theme-dark .sale-detail-page .payment-content strong,
body.maquette-app.theme-dark .sale-detail-page .payment-content b {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .sale-detail-page .payment-person span,
body.maquette-app.theme-dark .sale-detail-page .payment-content,
body.maquette-app.theme-dark .sale-detail-page .payment-content div,
body.maquette-app.theme-dark .sale-detail-page .payment-content p {
	color: #c2dadd;
}

body.maquette-app.theme-dark .sale-detail-page .payment-row .amount {
	color: #ff75b9;
}

body.maquette-app.theme-dark .sale-detail-page .detail-settings .status {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .32);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .14);
	color: #9eece8 !important;
}

body.maquette-app.theme-dark .sale-detail-page .detail-settings .status:first-of-type,
body.maquette-app.theme-dark .sale-detail-page .detail-settings .status.active {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #0d191c !important;
}

/* BB9 closed-sale state: left aligned */
body.maquette-app .sale-detail-page .detail-hero-state.is-closed {
	justify-items: start;
	align-items: start;
	text-align: left;
}

body.maquette-app.theme-dark .sale-detail-page .detail-hero-state.is-closed {
	border-color: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .28);
	background: rgba(var(--brand-accent-light-rgb, 255, 91, 172), .12);
	color: #d5e5e8;
}

body.maquette-app.theme-dark .sale-detail-page .detail-hero-state.is-closed strong {
	color: #ff9acc;
}

body.maquette-app .sale-detail-page .hero .detail-hero-state.is-closed {
	width: min(300px, 100%);
	max-width: 100%;
	justify-self: center;
	grid-template-columns: minmax(0, 1fr);
	justify-items: start;
	align-items: start;
	text-align: left !important;
}

body.maquette-app .sale-detail-page .hero .detail-hero-state.is-closed strong,
body.maquette-app .sale-detail-page .hero .detail-hero-state.is-closed span {
	display: block;
	width: 100%;
	justify-self: stretch;
	text-align: left !important;
}

@media (min-width: 760px) {
	body.maquette-app .sale-detail-page .hero > .detail-hero-state.is-closed {
		justify-self: end !important;
		width: 300px !important;
	}
}

/* Header theme/mode dropdown */
body.maquette-app .topbar-tools {
	position: absolute;
	right: 14px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

body.maquette-app .topbar-theme-switcher {
	position: relative;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	z-index: 1060;
}

body.maquette-app .theme-switcher-trigger {
	display: inline-grid;
	width: 32px;
	height: 32px;
	place-items: center;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--bb9-green);
	font: inherit;
	font-size: 20px;
	cursor: pointer;
}

body.maquette-app .theme-switcher-trigger i {
	display: none;
}

body.maquette-app[data-color-mode="light"] .theme-switcher-trigger .theme-icon-light,
body.maquette-app[data-color-mode="dark"] .theme-switcher-trigger .theme-icon-dark,
body.maquette-app[data-color-mode="auto"] .theme-switcher-trigger .theme-icon-auto {
	display: inline-block;
}

body.maquette-app .theme-switcher-panel {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	display: grid;
	gap: 8px;
	min-width: 158px;
	padding: 8px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: var(--white);
	box-shadow: 0 20px 48px rgba(0, 70, 70, .16);
	color: var(--text);
	opacity: 0;
	pointer-events: none;
	transform: translateY(-6px) scale(.98);
	transform-origin: top right;
	transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
	visibility: hidden;
}

body.maquette-app .theme-switcher-panel:before {
	position: absolute;
	top: -7px;
	right: 15px;
	width: 14px;
	height: 14px;
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	background: var(--white);
	content: "";
	transform: rotate(45deg);
}

body.maquette-app .theme-switcher.is-open .theme-switcher-panel {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
	visibility: visible;
}

body.maquette-app .theme-switcher.is-closing .theme-switcher-panel {
	opacity: 0;
	transform: translateY(-8px) scale(.96);
}

body.maquette-app .theme-switcher-group {
	display: grid;
	gap: 6px;
}

body.maquette-app .theme-switcher-group + .theme-switcher-group {
	padding-top: 8px;
	border-top: 1px solid var(--line);
}

body.maquette-app .theme-switcher-group span {
	color: var(--muted);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

body.maquette-app .theme-switcher-group button {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 30px;
	padding: 0 9px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .08);
	color: var(--bb9-green);
	font: inherit;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}

body.maquette-app .theme-switcher-group button.is-active,
body.maquette-app .theme-switcher-group button:hover,
body.maquette-app .theme-switcher-group button:focus {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: #fff;
}

body.maquette-app .theme-switcher-group button.is-selecting {
	border-color: var(--bb9-pink);
	background: var(--bb9-pink);
	box-shadow: 0 0 0 4px rgba(var(--brand-accent-rgb, 211, 0, 122), .12);
	color: #fff;
	transform: scale(.96);
	transition: transform .12s ease, box-shadow .12s ease, background .12s ease, color .12s ease;
}

body.maquette-app .theme-switcher-trigger:hover,
body.maquette-app .theme-switcher-trigger:focus {
	color: var(--bb9-pink);
	outline: none;
}

body.maquette-app.theme-dark .theme-switcher-trigger,
body.maquette-app.theme-dark .theme-switcher-group button {
	color: #9eece8;
}

body.maquette-app.theme-dark .theme-switcher-trigger {
	border: 0;
	background: transparent;
}

body.maquette-app.theme-dark .theme-switcher-group button {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .12);
}

body.maquette-app.theme-dark .theme-switcher-group button.is-selecting {
	border-color: #2bd1c9;
	background: #2bd1c9;
	box-shadow: 0 0 0 4px rgba(var(--brand-primary-light-rgb, 43, 209, 201), .14);
	color: #0d191c;
}

body.maquette-app.theme-dark .topbar-theme-switcher {
	border: 0;
	background: transparent;
	box-shadow: none;
}

body.maquette-app.theme-dark .theme-switcher-panel,
body.maquette-app.theme-dark .theme-switcher-panel:before {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .theme-switcher-group + .theme-switcher-group {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .22);
}

@media (min-width: 720px) {
	body.maquette-app .topbar-tools .topbar-caddy {
		position: static;
		right: auto;
		display: block;
		justify-self: auto;
	}

	body.maquette-app .topbar-tools .topbar-caddy .top-action {
		display: inline-flex;
	}
}

@media (max-width: 719px) {
	body.maquette-app .topbar-tools {
		right: 24px;
	}

	body.maquette-app .topbar-tools .topbar-caddy {
		display: none;
	}

	body.maquette-app .theme-switcher-trigger {
		width: 30px;
		height: 30px;
		font-size: 19px;
	}

	body.maquette-app .theme-switcher-panel {
		right: -8px;
		min-width: 150px;
	}

	body.maquette-app .page-detail .hero-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Compte client ecommerce — dark mode */
body.maquette-app.theme-dark .account-reference .account-sidebar.tabs,
body.maquette-app.theme-dark .account-reference .client-account-hero-content > span,
body.maquette-app.theme-dark .account-reference .account-dashboard .history-close {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
	color: #f7fbfb;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab {
	color: #c2dadd;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab i,
body.maquette-app.theme-dark .account-reference .sale-card-icon {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
	color: #55e1dc;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab.active {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #102326;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab.active i {
	background: rgba(16, 35, 38, .16);
	color: #102326;
}

body.maquette-app.theme-dark .account-reference .account-section-actions .filter-pill {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .1);
	color: #9eece8;
}

body.maquette-app.theme-dark .account-reference .account-section-actions .filter-pill.active {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #102326;
}

/* Compte client — mobile final */
@media (max-width: 760px) {
	body.maquette-app .account-reference.client-account-page {
		padding-inline: 0;
	}

	body.maquette-app .account-reference .client-account-hero {
		padding: 18px 18px 20px;
		border-radius: 28px;
	}

	body.maquette-app .account-reference .client-account-hero-content h1 {
		max-width: 100%;
		margin: 6px 0 0;
		font-size: clamp(30px, 8vw, 38px);
		line-height: 1.08;
	}

	body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
		margin-top: 8px;
		font-size: 15px;
		line-height: 1.35;
	}

	body.maquette-app .account-reference .account-logout {
		position: static;
		min-height: 38px;
		margin-top: 12px;
		padding-inline: 16px;
		font-size: 14px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
		margin-top: 16px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: auto;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		min-height: 82px;
		padding: 10px 6px;
		border-radius: 18px;
		text-align: center;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
		grid-row: auto;
		width: 34px;
		height: 34px;
		margin: 0;
		font-size: 18px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat strong {
		margin-top: 4px;
		font-size: 24px;
		line-height: 1;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat span,
	body.maquette-app .account-reference .client-account-hero-summary .hero-stat small {
		font-size: 11px;
		line-height: 1.15;
	}

	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		position: static;
		display: flex;
		gap: 10px;
		width: 100%;
		min-width: 0;
		min-height: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active {
		border-left-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .tab-content,
	body.maquette-app .account-reference .account-dashboard .section {
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .section {
		padding: 22px 18px;
		border-radius: 24px;
		overflow: hidden;
	}

	body.maquette-app .account-reference .account-dashboard .section-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
	}

	body.maquette-app .account-reference .account-dashboard .section-header h2 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .account-sale-type-filters > div {
		align-items: flex-start;
		flex-direction: column;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 54px minmax(0, 1fr);
		gap: 12px 14px;
		width: 100%;
		min-height: 0;
		padding: 16px;
		align-items: start;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 52px;
		height: 52px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card h3 {
		margin: 0;
		font-size: 21px;
		line-height: 1.08;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-column: 1 / -1;
		display: grid;
		gap: 3px;
		padding: 12px 14px;
		border: 1px solid var(--line);
		border-radius: 14px;
		background: rgba(var(--brand-primary-rgb, 0, 152, 152), .05);
	}

	body.maquette-app .account-reference .sale-card-status {
		grid-row: 2;
	}

	body.maquette-app .account-reference .sale-card-business-date {
		grid-row: 3;
	}

	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-row: 3;
	}

	body.maquette-app .account-reference .sale-card-status .status {
		width: max-content;
		margin: 0 0 4px;
	}

	body.maquette-app .account-reference .account-dashboard .amount,
	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		justify-self: start;
		margin-top: 2px;
		font-size: 22px;
		text-align: left;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		width: 100%;
		min-height: 48px;
		justify-self: stretch;
	}
}

/* Compte client — cadrage mobile final */
@media (max-width: 760px) {
	body.maquette-app .account-reference .client-account-hero {
		padding: 24px 20px;
	}

	body.maquette-app .account-reference .client-account-hero-content h1 {
		display: flex;
		max-width: 100%;
		margin: 8px 0 0;
		font-size: clamp(32px, 9vw, 42px);
		line-height: 1.08;
	}

	body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
		font-size: 18px;
		line-height: 1.35;
	}

	body.maquette-app .account-reference .account-logout {
		position: static;
		width: max-content;
		margin-top: 18px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
		margin-top: 24px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: 1 / -1;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		min-height: 132px;
		padding: 18px 10px;
		text-align: center;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
		grid-row: auto;
		width: 62px;
		height: 62px;
		margin: 0;
	}

	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		display: grid;
		grid-template-columns: 1fr;
		gap: 14px;
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		position: static;
		display: flex;
		gap: 10px;
		width: 100%;
		min-width: 0;
		min-height: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active {
		border-left-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .tab-content,
	body.maquette-app .account-reference .account-dashboard .section {
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .section {
		padding: 22px 18px;
		border-radius: 24px;
		overflow: hidden;
	}

	body.maquette-app .account-reference .account-dashboard .section-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
	}

	body.maquette-app .account-reference .account-dashboard .section-header h2 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .account-section-actions {
		gap: 10px;
		margin-top: 0;
	}

	body.maquette-app .account-reference .account-section-actions .filter-pill {
		min-height: 42px;
		padding: 0 18px;
	}

	body.maquette-app .account-reference .account-sale-type-filters {
		margin: 0 0 16px;
	}

	body.maquette-app .account-reference .account-sale-type-filters > div {
		align-items: flex-start;
		flex-direction: column;
	}

	body.maquette-app .account-reference .account-sale-type-filters .filters {
		width: 100%;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 54px minmax(0, 1fr);
		gap: 12px 14px;
		width: 100%;
		min-height: 0;
		padding: 16px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 52px;
		height: 52px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card h3 {
		margin-bottom: 4px;
		font-size: 22px;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-column: 1 / -1;
		display: block;
		padding: 12px 14px;
		border: 1px solid var(--line);
		border-radius: 14px;
		background: rgba(var(--brand-primary-rgb, 0, 152, 152), .05);
	}

	body.maquette-app .account-reference .sale-card-status {
		grid-row: 2;
	}

	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-row: auto;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 1 / -1;
		grid-row: auto;
		justify-self: start;
		font-size: 22px;
		text-align: left;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 1 / -1;
		grid-row: auto;
		width: 100%;
		min-height: 48px;
		justify-self: stretch;
	}
}

/* Compte client — mobile */
@media (max-width: 760px) {
	body.maquette-app .account-reference .client-account-hero {
		padding: 24px 20px;
	}

	body.maquette-app .account-reference .client-account-hero-content h1 {
		max-width: 100%;
		margin: 8px 0 0;
		font-size: clamp(32px, 9vw, 42px);
		line-height: 1.08;
	}

	body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
		font-size: 18px;
		line-height: 1.35;
	}

	body.maquette-app .account-reference .account-logout {
		position: static;
		width: max-content;
		margin-top: 18px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
		margin-top: 24px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: 1 / -1;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		min-height: 132px;
		padding: 18px 10px;
		text-align: center;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
		grid-row: auto;
		width: 62px;
		height: 62px;
		margin: 0;
	}

	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		display: grid;
		grid-template-columns: 1fr;
		gap: 14px;
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		position: static;
		display: flex;
		gap: 10px;
		width: 100%;
		min-width: 0;
		min-height: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active {
		border-left-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .tab-content,
	body.maquette-app .account-reference .account-dashboard .section {
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .section {
		padding: 22px 18px;
		border-radius: 24px;
		overflow: hidden;
	}

	body.maquette-app .account-reference .account-dashboard .section-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
	}

	body.maquette-app .account-reference .account-dashboard .section-header h2 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .account-section-actions {
		gap: 10px;
		margin-top: 0;
	}

	body.maquette-app .account-reference .account-section-actions .filter-pill {
		min-height: 42px;
		padding: 0 18px;
	}

	body.maquette-app .account-reference .account-sale-type-filters {
		margin: 0 0 16px;
	}

	body.maquette-app .account-reference .account-sale-type-filters > div {
		align-items: flex-start;
		flex-direction: column;
	}

	body.maquette-app .account-reference .account-sale-type-filters .filters {
		width: 100%;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 54px minmax(0, 1fr);
		gap: 12px 14px;
		width: 100%;
		min-height: 0;
		padding: 16px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 52px;
		height: 52px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card h3 {
		margin-bottom: 4px;
		font-size: 22px;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-column: 1 / -1;
		display: block;
		padding: 12px 14px;
		border: 1px solid var(--line);
		border-radius: 14px;
		background: rgba(var(--brand-primary-rgb, 0, 152, 152), .05);
	}

	body.maquette-app .account-reference .sale-card-status {
		grid-row: 2;
	}

	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-row: auto;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 1 / -1;
		grid-row: auto;
		justify-self: start;
		font-size: 22px;
		text-align: left;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 1 / -1;
		grid-row: auto;
		width: 100%;
		min-height: 48px;
		justify-self: stretch;
	}
}

body.maquette-app.theme-dark .account-reference .account-dashboard .sale-card:hover {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .45);
	box-shadow: 0 18px 40px rgba(0, 0, 0, .3);
}

/* Compte client ecommerce — affinage maquette */
body.maquette-app .account-reference .client-account-hero {
	display: block;
	position: relative;
	padding: 34px 34px 30px;
}

body.maquette-app .account-reference .client-account-hero-content h1 {
	margin-right: 220px;
	color: var(--text);
	font-size: clamp(34px, 3.8vw, 54px);
	letter-spacing: 0;
}

body.maquette-app .account-reference .account-title-hello {
	color: var(--text);
}

body.maquette-app .account-reference .account-parent-name {
	color: var(--bb9-pink);
}

body.maquette-app .account-reference .account-title-amp {
	color: var(--bb9-green);
}

body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
	max-width: 820px;
	font-size: 17px;
}

body.maquette-app .account-reference .account-logout {
	position: absolute;
	top: 34px;
	right: 34px;
	margin: 0;
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .3);
	background: var(--white);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .client-account-hero-summary {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: 30px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
	min-height: 112px;
	padding: 18px 22px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat strong {
	font-size: 34px;
}

body.maquette-app .account-reference .account-dashboard {
	grid-template-columns: minmax(210px, 260px) minmax(0, 1fr);
}

body.maquette-app .account-reference .account-sidebar.tabs {
	gap: 10px;
	padding: 14px;
	border-radius: 26px;
	background: var(--white);
}

body.maquette-app .account-reference .account-sidebar .tab {
	border: 1px solid transparent;
	background: transparent;
	color: var(--muted);
}

body.maquette-app .account-reference .account-sidebar .tab.active {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	border-left: 5px solid var(--bb9-green);
	background: linear-gradient(135deg, rgba(var(--brand-primary-rgb, 0, 152, 152), .1), rgba(var(--brand-primary-rgb, 0, 152, 152), .03));
	color: var(--bb9-green);
}

body.maquette-app .account-reference .account-sidebar .tab.active i {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .16);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .account-dashboard .section {
	padding: 28px;
}

body.maquette-app .account-reference .account-dashboard .section-header {
	align-items: flex-start;
	margin-bottom: 18px;
}

body.maquette-app .account-reference .account-dashboard .section-header h2 {
	max-width: 680px;
	font-size: clamp(28px, 3vw, 42px);
	line-height: 1.12;
}

body.maquette-app .account-reference .account-dashboard .sale-card {
	min-height: 104px;
	padding: 16px 18px;
}

body.maquette-app .account-reference .account-dashboard .sale-card h3 {
	font-size: 19px;
	line-height: 1.08;
}

body.maquette-app .account-reference .account-dashboard .amount {
	font-size: 25px;
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	min-height: 48px;
	padding-inline: 20px;
}

body.maquette-app .account-reference .account-quick-info {
	display: none;
	padding: 28px;
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: var(--white);
	box-shadow: var(--shadow);
}

body.maquette-app .account-reference .account-quick-info h2 {
	margin: 0 0 22px;
	color: var(--text);
	font-size: 20px;
	font-weight: 500;
}

body.maquette-app .account-reference .quick-info-row {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 14px;
	align-items: start;
	padding: 16px 0;
	border-top: 1px solid var(--line);
}

body.maquette-app .account-reference .quick-info-row:first-of-type {
	border-top: 0;
	padding-top: 0;
}

body.maquette-app .account-reference .quick-info-row > i {
	display: grid;
	width: 44px;
	height: 44px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font-size: 20px;
}

body.maquette-app .account-reference .quick-info-row strong,
body.maquette-app .account-reference .quick-info-row span {
	display: block;
}

body.maquette-app .account-reference .quick-info-row strong {
	margin-bottom: 4px;
	color: var(--text);
	font-size: 14px;
}

body.maquette-app .account-reference .quick-info-row span {
	color: var(--muted);
	font-size: 14px;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

body.maquette-app .account-reference .quick-info-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	color: var(--bb9-green);
	font-weight: 500;
}

@media (min-width: 1180px) {
	body.maquette-app .account-reference .account-dashboard {
		grid-template-columns: 260px minmax(0, 1fr);
	}

	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		grid-template-columns: 260px minmax(0, 1fr) minmax(260px, 320px);
	}

	body.maquette-app .account-reference .account-quick-info {
		display: block;
	}
}

@media (max-width: 900px) {
	body.maquette-app .account-reference .client-account-hero-content h1 {
		margin-right: 0;
	}

	body.maquette-app .account-reference .account-logout {
		position: static;
		margin-top: 16px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: 1 / -1;
	}
}

@media (max-width: 620px) {
	body.maquette-app .account-reference .account-dashboard {
		grid-template-columns: 1fr;
	}

	body.maquette-app .account-reference .client-account-hero {
		padding: 22px 18px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

body.maquette-app.theme-dark .account-reference .account-title-hello,
body.maquette-app.theme-dark .account-reference .account-quick-info h2,
body.maquette-app.theme-dark .account-reference .quick-info-row strong {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .account-reference .account-parent-name {
	color: #ff75b9;
}

body.maquette-app.theme-dark .account-reference .account-title-amp {
	color: #55e1dc;
}

body.maquette-app.theme-dark .account-reference .account-logout,
body.maquette-app.theme-dark .account-reference .account-sidebar.tabs,
body.maquette-app.theme-dark .account-reference .account-quick-info {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab.active {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .24);
	border-left-color: #55e1dc;
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .12);
	color: #55e1dc;
}

/* Compte client ecommerce — cadrage final */
body.maquette-app .account-reference .client-account-hero {
	padding: 30px 34px 26px;
}

body.maquette-app .account-reference .client-account-hero-content h1 {
	margin: 6px 220px 0 0;
	font-size: clamp(40px, 4vw, 58px);
	line-height: 1.05;
}

body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
	margin-top: 10px;
	font-size: 16px;
}

body.maquette-app .account-reference .account-logout {
	top: 38px;
	right: 34px;
	min-height: 44px;
	margin: 0;
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .34);
	background: var(--white);
	color: var(--bb9-green);
	box-shadow: none;
}

body.maquette-app .account-reference .client-account-hero-summary {
	gap: 18px;
	margin-top: 28px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
	min-height: 96px;
	padding: 16px 22px;
	border-radius: 20px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
	width: 58px;
	height: 58px;
	font-size: 27px;
}

body.maquette-app .account-reference .client-account-hero-summary .hero-stat strong {
	font-size: 32px;
}

body.maquette-app .account-reference .account-sidebar.tabs,
body.maquette-app .account-reference .account-dashboard .section,
body.maquette-app .account-reference .account-quick-info {
	border-radius: 22px;
}

body.maquette-app .account-reference .account-sidebar.tabs {
	padding: 12px;
}

body.maquette-app .account-reference .account-sidebar .tab {
	min-height: 54px;
	padding-inline: 12px;
}

body.maquette-app .account-reference .account-sidebar .tab.active {
	border-left-width: 4px;
}

body.maquette-app .account-reference .account-dashboard {
	gap: 16px;
	margin-top: 16px;
}

body.maquette-app .account-reference .account-dashboard .tab-content {
	min-width: 0;
}

body.maquette-app .account-reference .account-dashboard .section {
	min-width: 0;
	padding: 24px;
	overflow: hidden;
}

body.maquette-app .account-reference .account-dashboard .section-header {
	align-items: center;
	flex-direction: row;
	margin-bottom: 18px;
}

body.maquette-app .account-reference .account-dashboard .section-header h2 {
	font-size: 30px;
	line-height: 1.1;
}

body.maquette-app .account-reference .account-dashboard .sale-grid,
body.maquette-app .account-reference .account-dashboard .history-list {
	min-width: 0;
}

body.maquette-app .account-reference .account-dashboard .sale-card {
	min-width: 0;
	min-height: 92px;
	padding: 14px 16px;
	border-radius: 18px;
}

body.maquette-app .account-reference .sale-card-icon {
	width: 54px;
	height: 54px;
	font-size: 23px;
}

body.maquette-app .account-reference .account-dashboard .status {
	margin-bottom: 6px;
	padding: 5px 10px;
	font-size: 11px;
}

body.maquette-app .account-reference .account-dashboard .sale-card h3 {
	font-size: 18px;
}

body.maquette-app .account-reference .account-dashboard .history-main p,
body.maquette-app .account-reference .account-dashboard .history-close span {
	font-size: 12px;
}

body.maquette-app .account-reference .account-dashboard .amount {
	font-size: 22px;
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	min-height: 44px;
	padding-inline: 18px;
}

@media (min-width: 1180px) {
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		grid-template-columns: 240px minmax(0, 1fr) minmax(260px, 300px);
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 58px minmax(0, 1fr) minmax(112px, auto) minmax(100px, auto) minmax(128px, auto);
		gap: 10px 14px;
	}
}

@media (max-width: 900px) {
	body.maquette-app .account-reference .client-account-hero-content h1 {
		margin-right: 0;
	}
}

@media (max-width: 620px) {
	body.maquette-app .account-reference .client-account-hero-content h1 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .account-dashboard .section-header {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* Compte client — sans panneau rapide */
body.maquette-app .account-reference .account-dashboard {
	grid-template-columns: minmax(210px, 260px) minmax(0, 1fr);
}

body.maquette-app .account-reference .account-dashboard.has-quick-info {
	grid-template-columns: minmax(210px, 260px) minmax(0, 1fr);
}

body.maquette-app .account-reference .account-quick-info {
	display: none;
}

body.maquette-app .account-reference .client-account-hero-content h1 {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0 14px;
	max-width: calc(100% - 320px);
	margin: 10px 320px 0 0;
	color: var(--text);
	font-size: clamp(42px, 3.1vw, 62px);
	line-height: 1.08;
	letter-spacing: 0;
}

body.maquette-app .account-reference .client-account-hero-content h1 span {
	display: inline;
	margin: 0;
	font-size: inherit;
	line-height: inherit;
}

body.maquette-app .account-reference .account-title-hello {
	color: var(--text);
	font-size: 1em;
	font-weight: 500;
}

body.maquette-app .account-reference .account-parent-name,
body.maquette-app .account-reference .account-title-amp {
	font-weight: 500;
}

body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
	margin-top: 10px;
	font-size: 16px;
}

@media (min-width: 1180px) {
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		grid-template-columns: 260px minmax(0, 1fr);
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 64px minmax(0, 1fr) minmax(150px, auto) minmax(150px, auto) max-content;
	}
}

@media (max-width: 900px) {
	body.maquette-app .account-reference .client-account-hero-content h1 {
		max-width: 100%;
		margin-right: 0;
	}
}

@media (max-width: 620px) {
	body.maquette-app .account-reference .client-account-hero-content h1 {
		font-size: 36px;
		gap: 0 10px;
	}
}

/* Compte client — listing achats proche maquette */
body.maquette-app .account-reference .account-dashboard .section {
	padding: 28px;
}

body.maquette-app .account-reference .account-dashboard .section-header {
	align-items: flex-start;
	margin-bottom: 18px;
}

body.maquette-app .account-reference .account-dashboard .section-header h2 {
	font-size: 30px;
	line-height: 1.08;
}

body.maquette-app .account-reference .account-section-actions {
	justify-content: flex-start;
	margin-top: 12px;
}

body.maquette-app .account-reference .account-section-actions .filter-pill {
	min-height: 36px;
	padding: 0 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--white);
	color: var(--muted);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

body.maquette-app .account-reference .account-section-actions .filter-pill.active {
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

body.maquette-app .account-reference .account-sale-type-filters {
	margin: -4px 0 18px;
}

body.maquette-app .account-reference .account-sale-type-filters .filter-pill {
	min-height: 34px;
	padding: 0 14px;
	font-size: 12px;
}

body.maquette-app .account-reference .account-dashboard .sale-grid,
body.maquette-app .account-reference .account-dashboard .history-list {
	gap: 14px;
}

body.maquette-app .account-reference .account-dashboard .sale-card {
	display: grid;
	grid-template-columns: 68px minmax(0, 1.35fr) minmax(126px, .75fr) minmax(118px, .65fr) minmax(118px, .65fr) max-content;
	gap: 12px 18px;
	align-items: center;
	min-height: 108px;
	padding: 16px 18px;
	border-radius: 18px;
	background: rgba(255, 255, 255, .72);
	text-align: left;
}

body.maquette-app .account-reference .sale-card-icon {
	grid-column: 1;
	grid-row: 1;
	width: 58px;
	height: 58px;
	font-size: 28px;
}

body.maquette-app .account-reference .account-dashboard .history-main {
	grid-column: 2;
	grid-row: 1;
}

body.maquette-app .account-reference .account-dashboard .sale-card h3 {
	margin: 0 0 6px;
	font-size: 18px;
	line-height: 1.1;
}

body.maquette-app .account-reference .account-dashboard .history-main p {
	margin: 0;
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.35;
}

body.maquette-app .account-reference .sale-card-status {
	grid-column: 3;
	grid-row: 1;
	min-width: 0;
}

body.maquette-app .account-reference .account-dashboard .status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	width: max-content;
	margin: 0 0 8px;
	padding: 6px 12px;
	background: rgba(35, 184, 93, .16);
	color: #078b38;
	font-size: 12px;
	line-height: 1;
	text-transform: none;
}

/* Les statuts de produits et de règlement possèdent déjà leur icône. */
body.maquette-app .account-reference .account-dashboard .status:not(.article-status):not(.payment-status)::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

body.maquette-app .account-reference .history-list .is-history-sale .status {
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .12);
	color: var(--bb9-pink);
}

body.maquette-app .account-reference .sale-card-status p,
body.maquette-app .account-reference .sale-card-business-date {
	margin: 0;
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.35;
}

body.maquette-app .account-reference .sale-card-status span,
body.maquette-app .account-reference .sale-card-business-date span {
	display: block;
}

body.maquette-app .account-reference .sale-card-status strong,
body.maquette-app .account-reference .sale-card-business-date strong {
	display: block;
	margin-top: 3px;
	color: var(--bb9-green);
	font-size: 15px;
	font-weight: 600;
}

body.maquette-app .account-reference .sale-card-business-date {
	grid-column: 4;
	grid-row: 1;
	min-width: 0;
}

body.maquette-app .account-reference .account-dashboard .history-close {
	grid-column: 4;
	grid-row: 1;
	padding: 0;
	border: 0;
	background: transparent;
}

body.maquette-app .account-reference .account-dashboard .history-close span {
	font-size: 12px;
	text-transform: none;
}

body.maquette-app .account-reference .account-dashboard .history-close strong {
	display: block;
	margin-top: 3px;
	color: var(--bb9-green);
	font-size: 15px;
	font-weight: 600;
}

body.maquette-app .account-reference .account-dashboard .amount {
	grid-column: 5;
	grid-row: 1;
	justify-self: end;
	margin: 0;
	color: var(--bb9-pink);
	font-size: 18px;
	line-height: 1.15;
	text-align: right;
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	grid-column: 6;
	grid-row: 1;
	gap: 10px;
	min-height: 44px;
	padding: 0 18px;
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
	box-shadow: 0 10px 22px rgba(var(--brand-primary-rgb, 0, 152, 152), .18);
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn.secondary {
	margin-top: 0;
	border-color: var(--bb9-green);
	background: var(--bb9-green);
	color: var(--white);
}

@media (max-width: 1180px) {
	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 62px minmax(0, 1fr) max-content;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close,
	body.maquette-app .account-reference .account-dashboard .amount,
	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 2 / -1;
	}

	body.maquette-app .account-reference .account-dashboard .amount,
	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		justify-self: start;
	}
}

@media (max-width: 620px) {
	body.maquette-app .account-reference .account-dashboard .section {
		padding: 22px 18px;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 54px minmax(0, 1fr);
		gap: 10px 14px;
		padding: 14px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 50px;
		height: 50px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main,
	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close,
	body.maquette-app .account-reference .account-dashboard .amount,
	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 2;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		width: auto;
	}
}

body.maquette-app.theme-dark .account-reference .account-dashboard .sale-card {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: #17292d;
}

body.maquette-app.theme-dark .account-reference .account-dashboard .sale-card h3 {
	color: #f7fbfb;
}

body.maquette-app.theme-dark .account-reference .sale-card-status p,
body.maquette-app.theme-dark .account-reference .sale-card-business-date,
body.maquette-app.theme-dark .account-reference .account-dashboard .history-main p,
body.maquette-app.theme-dark .account-reference .account-dashboard .history-close span {
	color: #9fbfc4;
}

body.maquette-app.theme-dark .account-reference .account-dashboard .sale-card .btn {
	box-shadow: none;
}

body.maquette-app.theme-dark .account-reference .account-section-actions .filter-pill {
	border-color: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .28);
	background: rgba(var(--brand-primary-light-rgb, 43, 209, 201), .08);
	color: #c2dadd;
}

body.maquette-app.theme-dark .account-reference .account-section-actions .filter-pill.active {
	border-color: #2bd1c9;
	background: #2bd1c9;
	color: #102326;
}

/* Compte client — mobile final */
@media (max-width: 760px) {
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-sidebar.tabs {
		position: static;
		display: flex;
		gap: 10px;
		width: 100%;
		min-width: 0;
		min-height: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active {
		border-left-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .tab-content,
	body.maquette-app .account-reference .account-dashboard .section {
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-dashboard .section {
		padding: 22px 18px;
		border-radius: 24px;
		overflow: hidden;
	}

	body.maquette-app .account-reference .account-dashboard .section-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
	}

	body.maquette-app .account-reference .account-dashboard .section-header h2 {
		font-size: 34px;
	}

	body.maquette-app .account-reference .account-sale-type-filters > div {
		align-items: flex-start;
		flex-direction: column;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 54px minmax(0, 1fr);
		gap: 12px 14px;
		width: 100%;
		min-height: 0;
		padding: 16px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 52px;
		height: 52px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-column: 1 / -1;
		display: block;
		padding: 12px 14px;
		border: 1px solid var(--line);
		border-radius: 14px;
		background: rgba(var(--brand-primary-rgb, 0, 152, 152), .05);
	}

	body.maquette-app .account-reference .account-dashboard .amount,
	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		justify-self: start;
		font-size: 22px;
		text-align: left;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		width: 100%;
		min-height: 48px;
		justify-self: stretch;
	}
}

/* Compte client — compact mobile final */
@media (max-width: 760px) {
	body.maquette-app .account-reference .client-account-hero {
		padding: 18px 18px 20px;
		border-radius: 28px;
	}

	body.maquette-app .account-reference .client-account-hero-content h1 {
		max-width: 100%;
		margin: 6px 0 0;
		font-size: clamp(30px, 8vw, 38px);
		line-height: 1.08;
	}

	body.maquette-app .account-reference .client-account-hero-content > p:not(.eyebrow) {
		margin-top: 8px;
		font-size: 15px;
		line-height: 1.35;
	}

	body.maquette-app .account-reference .account-logout {
		position: static;
		min-height: 38px;
		margin-top: 12px;
		padding-inline: 16px;
		font-size: 14px;
	}

	body.maquette-app .account-reference .client-account-hero-summary {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
		margin-top: 16px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .client-fidelity-stat {
		grid-column: auto;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		min-height: 82px;
		padding: 10px 6px;
		border-radius: 18px;
		text-align: center;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat > i {
		grid-row: auto;
		width: 34px;
		height: 34px;
		margin: 0;
		font-size: 18px;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat strong {
		margin-top: 4px;
		font-size: 24px;
		line-height: 1;
	}

	body.maquette-app .account-reference .client-account-hero-summary .hero-stat span,
	body.maquette-app .account-reference .client-account-hero-summary .hero-stat small {
		font-size: 11px;
		line-height: 1.15;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		align-items: start;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card h3 {
		margin: 0;
		font-size: 21px;
		line-height: 1.08;
	}

	body.maquette-app .account-reference .sale-card-status,
	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		display: grid;
		gap: 3px;
	}

	body.maquette-app .account-reference .sale-card-status {
		grid-row: 2;
	}

	body.maquette-app .account-reference .sale-card-business-date,
	body.maquette-app .account-reference .account-dashboard .history-close {
		grid-row: 3;
	}

	body.maquette-app .account-reference .sale-card-status .status {
		width: max-content;
		margin: 0 0 4px;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		margin-top: 2px;
	}
}

/* Compte client — cartes mobiles compactes */
body.maquette-app .account-reference .sale-card-title-row {
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: space-between;
	min-width: 0;
}

body.maquette-app .account-reference .sale-card-title-row h3 {
	min-width: 0;
}

body.maquette-app .account-reference .sale-card-title-row .status {
	flex: 0 0 auto;
	margin: 0;
}

body.maquette-app .account-reference .sale-card-title-row .mobile-status {
	display: none;
}

body.maquette-app .account-reference .sale-card-status .desktop-status {
	display: inline-flex;
	width: max-content;
	margin: 0 0 6px;
}

body.maquette-app .account-reference .sale-card-dates {
	display: contents;
}

body.maquette-app .account-reference .account-sidebar button.tab {
	width: 100%;
	border: 0;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

body.maquette-app .account-reference .account-sidebar .account-sidebar-logout {
	color: var(--bb9-pink);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .08);
}

body.maquette-app .account-reference .account-sidebar .account-sidebar-logout i {
	color: var(--bb9-pink);
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .12);
}

body.maquette-app.theme-dark .account-reference .account-sidebar .account-sidebar-logout {
	color: #ff7fc1;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .16);
}

body.maquette-app.theme-dark .account-reference .account-sidebar .account-sidebar-logout i {
	color: #ff7fc1;
	background: rgba(var(--brand-accent-rgb, 211, 0, 122), .22);
}

@media (max-width: 760px) {
	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 44px minmax(0, 1fr);
		gap: 10px 12px;
		padding: 12px;
		border-radius: 18px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		width: 44px;
		height: 44px;
		font-size: 21px;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card h3 {
		font-size: 19px;
		line-height: 1.08;
	}

	body.maquette-app .account-reference .sale-card-title-row .mobile-status {
		display: inline-flex;
		padding: 5px 10px;
		font-size: 11px;
	}

	body.maquette-app .account-reference .sale-card-status .desktop-status {
		display: none;
	}

	body.maquette-app .account-reference .sale-card-dates {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-status,
	body.maquette-app .account-reference .sale-card-dates .sale-card-business-date,
	body.maquette-app .account-reference .sale-card-dates .history-close {
		grid-column: auto !important;
		grid-row: auto !important;
		padding: 10px;
		border: 1px solid var(--line);
		border-radius: 13px;
		background: rgba(var(--brand-primary-rgb, 0, 152, 152), .05);
	}

	body.maquette-app .account-reference .sale-card-dates span {
		font-size: 11px;
		line-height: 1.2;
	}

	body.maquette-app .account-reference .sale-card-dates strong {
		font-size: 16px;
		line-height: 1.15;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		font-size: 20px;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		min-height: 44px;
	}
}

/* Responsive foundation — 4 tailles d'ecran */
body.maquette-app {
	--screen-mobile-max: 767px;
	--screen-tablet-portrait-min: 768px;
	--screen-tablet-landscape-min: 1024px;
	--screen-desktop-min: 1366px;
	--page-max: 1920px;
	--page-gutter: 14px;
	--section-gap: 18px;
}

body.maquette-app > .app {
	width: min(calc(100% - (var(--page-gutter) * 2)), var(--page-max));
	max-width: var(--page-max);
	margin-inline: auto;
	padding: 14px 0 0;
}

body.maquette-app .topbar {
	padding-inline: var(--page-gutter);
}

body.maquette-app .topbar-inner {
	width: 100%;
	max-width: var(--page-max);
}

body.maquette-app .hero,
body.maquette-app .section,
body.maquette-app .search-card,
body.maquette-app .sort-bar,
body.maquette-app .client-account-page,
body.maquette-app .account-reference.client-account-page,
body.maquette-app .contact-page,
body.maquette-app .cart-layout,
body.maquette-app .checkout-layout,
body.maquette-app .bank-layout,
body.maquette-app .account-login-layout {
	width: 100%;
	max-width: none;
}

body.maquette-app .results,
body.maquette-app .gift-grid,
body.maquette-app .sale-grid,
body.maquette-app .history-list,
body.maquette-app .info-grid,
body.maquette-app .contact-reassurance,
body.maquette-app .donor-form,
body.maquette-app .cart-page-list {
	width: 100%;
}

@media (max-width: 767px) {
	body.maquette-app {
		--page-gutter: 10px;
		--section-gap: 14px;
	}

	body.maquette-app > .app {
		padding-top: 10px;
	}

	body.maquette-app .hero,
	body.maquette-app .section,
	body.maquette-app .search-card,
	body.maquette-app .sort-bar,
	body.maquette-app .account-reference .account-dashboard .section {
		border-radius: 24px;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	body.maquette-app {
		--page-gutter: 20px;
		--section-gap: 22px;
	}

	body.maquette-app > .app {
		padding-top: 18px;
	}

	body.maquette-app .hero {
		grid-template-columns: minmax(0, 1fr);
		padding: 34px;
	}

	body.maquette-app .hero-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-top: 10px;
	}

	body.maquette-app .results,
	body.maquette-app .gift-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .cart-layout,
	body.maquette-app .checkout-layout,
	body.maquette-app .bank-layout,
	body.maquette-app .account-login-layout,
	body.maquette-app .contact-layout,
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (min-width: 1024px) and (max-width: 1365px) {
	body.maquette-app {
		--page-gutter: 28px;
		--section-gap: 24px;
	}

	body.maquette-app > .app {
		padding-top: 20px;
	}

	body.maquette-app .hero {
		grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
		padding: 38px;
	}

	body.maquette-app .hero-stats {
		margin-top: 72px;
	}

	body.maquette-app .results {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.maquette-app .gift-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body.maquette-app .cart-layout {
		grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
	}

	body.maquette-app .checkout-layout,
	body.maquette-app .bank-layout {
		grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
	}
}

@media (min-width: 1366px) {
	body.maquette-app {
		--page-gutter: clamp(36px, 3vw, 56px);
		--section-gap: 28px;
	}

	body.maquette-app > .app {
		padding-top: 24px;
	}

	body.maquette-app .hero {
		grid-template-columns: minmax(0, 1.35fr) minmax(420px, .65fr);
		gap: 28px;
		padding: clamp(38px, 3vw, 56px);
	}

	body.maquette-app .hero h1 {
		max-width: 1060px;
	}

	body.maquette-app .hero p:not(.eyebrow) {
		max-width: 860px;
	}

	body.maquette-app .hero-parent-message {
		max-width: 980px;
	}

	body.maquette-app .hero-stats {
		margin-top: clamp(42px, 5vw, 110px);
	}

	body.maquette-app .results {
		grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
		gap: 18px;
	}

	body.maquette-app .gift-grid {
		grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
		gap: 18px;
	}

	body.maquette-app .cart-layout {
		grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
		gap: 24px;
	}

	body.maquette-app .checkout-layout,
	body.maquette-app .bank-layout {
		grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
		gap: 24px;
	}

	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info {
		grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
		gap: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 76px minmax(220px, 1fr) minmax(170px, .52fr) minmax(170px, .52fr) minmax(170px, .42fr) max-content;
	}
}

@media (min-width: 1600px) {
	body.maquette-app .topbar-inner .logo {
		left: 18px;
	}

	body.maquette-app .topbar-caddy {
		right: 18px;
	}

	body.maquette-app .gift-grid {
		grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
	}
}

@media (min-width: 1921px) {
	body.maquette-app > .app,
	body.maquette-app .topbar-inner {
		max-width: var(--page-max);
	}
}

/* Liste cote parents — navigation laterale */
body.maquette-app .sale-detail-page .sale-detail-dashboard {
	display: grid;
	gap: 16px;
	margin-top: 20px;
}

body.maquette-app .sale-detail-page .sale-detail-content {
	min-width: 0;
}

body.maquette-app .sale-detail-page .sale-detail-content > .section {
	margin-top: 0;
}

body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
	margin: 0;
}

body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
	gap: 10px;
}

body.maquette-app .sale-detail-page .sale-detail-sidebar .tab i {
	display: grid;
	width: 32px;
	min-width: 32px;
	height: 32px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
}

body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active i {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

body.maquette-app .sale-detail-page .sale-detail-sidebar .sale-detail-back-link {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .2);
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .07);
	color: var(--bb9-green);
}

body.maquette-app .sale-detail-page .sale-detail-sidebar .sale-detail-back-link i {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .tab i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
	color: #55e1dc;
}

body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .tab.active i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .18);
	color: #55e1dc;
}

body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .sale-detail-back-link {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .28);
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .1);
	color: #55e1dc;
}

body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .sale-detail-back-link i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
	color: #55e1dc;
}

@media (max-width: 1023px) {
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(0, 1fr);
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
		position: static;
		display: flex;
		gap: 10px;
		width: 100%;
		min-width: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs::-webkit-scrollbar {
		display: none;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active {
		border-left-width: 0;
	}
}

@media (min-width: 1024px) {
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(250px, 300px) minmax(0, 1fr);
		align-items: start;
		gap: 22px;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
		position: sticky;
		top: 116px;
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 12px;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
		justify-content: flex-start;
		min-height: 54px;
		padding-inline: 12px;
	}

	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active {
		border-left-width: 4px;
	}
}

@media (min-width: 1600px) {
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
		gap: 26px;
	}
}

/* Prix barres — toujours sur une ligne separee */
body.maquette-app .price-row {
	align-items: flex-start;
	gap: 6px;
}

body.maquette-app .price-row del,
body.maquette-app .price-row p {
	flex: 0 0 100%;
	max-width: 100%;
}

body.maquette-app .price-row del,
body.maquette-app .sale-detail-page .article-price del,
body.maquette-app .maquette-modal-price del {
	display: block;
	width: 100%;
	white-space: normal;
}

body.maquette-app .sale-detail-page .article-price-values,
body.maquette-app .maquette-modal-price {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr);
	grid-auto-flow: row;
	justify-items: center;
	gap: 4px;
}

body.maquette-app .sale-detail-page .article-price-values del,
body.maquette-app .sale-detail-page .article-price-values .amount,
body.maquette-app .maquette-modal-price del,
body.maquette-app .maquette-modal-price span,
body.maquette-app .maquette-modal-price strong {
	display: block;
	width: 100%;
	text-align: center;
}

body.maquette-app .sale-detail-page .article-price-values {
	display: flex !important;
	flex-direction: column !important;
	align-items: center;
	justify-content: center;
	width: 100%;
}

body.maquette-app .sale-detail-page .article-price-values .price-line {
	display: block !important;
	width: 100%;
	text-align: center;
	line-height: 1.15;
}

body.maquette-app .sale-detail-page .article-price-values .price-line del,
body.maquette-app .sale-detail-page .article-price-values .price-line .amount {
	display: inline-block !important;
	width: auto;
	max-width: 100%;
	white-space: nowrap;
}

/* Navigation compte/liste — objet commun */
body.maquette-app .account-reference .account-dashboard,
body.maquette-app .sale-detail-page .sale-detail-dashboard {
	display: grid;
	gap: 16px;
}

body.maquette-app .account-reference .account-sidebar.tabs,
body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
	margin: 0;
	scrollbar-width: none;
}

body.maquette-app .account-reference .account-sidebar.tabs::-webkit-scrollbar,
body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs::-webkit-scrollbar {
	display: none;
}

body.maquette-app .account-reference .account-sidebar .tab,
body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
	gap: 10px;
}

body.maquette-app .account-reference .account-sidebar .tab i,
body.maquette-app .sale-detail-page .sale-detail-sidebar .tab i {
	display: grid;
	width: 32px;
	min-width: 32px;
	height: 32px;
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
}

body.maquette-app .account-reference .account-sidebar .tab.active i,
body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active i {
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .14);
	color: var(--bb9-green);
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab i,
body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .tab i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
	color: #55e1dc;
}

body.maquette-app.theme-dark .account-reference .account-sidebar .tab.active i,
body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar .tab.active i {
	background: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .18);
	color: #55e1dc;
}

body.maquette-app.theme-dark .account-reference .account-sidebar.tabs,
body.maquette-app.theme-dark .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
	background: rgba(13, 39, 42, .94);
}

@media (max-width: 1023px) {
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info,
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
		width: 100%;
		min-width: 0;
	}

	body.maquette-app .account-reference .account-sidebar.tabs,
	body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
		position: sticky;
		top: 110px;
		z-index: 20;
		display: flex;
		grid-template-columns: none;
		gap: 10px;
		width: 100%;
		min-width: 0;
		min-height: 0;
		padding: 10px;
		overflow-x: auto;
		border-radius: 24px;
		background: rgba(255, 255, 255, .94);
		backdrop-filter: blur(10px);
		scroll-snap-type: x proximity;
	}

	body.maquette-app .account-reference .account-sidebar .tab,
	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
		flex: 0 0 auto;
		min-width: max-content;
		min-height: 52px;
		padding: 0 16px;
		scroll-snap-align: start;
	}

	body.maquette-app .account-reference .account-sidebar button.tab {
		width: auto;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active,
	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active {
		border-left-width: 0;
	}
}

@media (min-width: 1024px) {
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info,
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(250px, 300px) minmax(0, 1fr);
		align-items: start;
		gap: 22px;
	}

	body.maquette-app .account-reference .account-sidebar.tabs,
	body.maquette-app .sale-detail-page .sale-detail-sidebar.account-sidebar.tabs {
		position: sticky;
		top: 116px;
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 12px;
	}

	body.maquette-app .account-reference .account-sidebar .tab,
	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab {
		justify-content: flex-start;
		min-height: 54px;
		padding-inline: 12px;
	}

	body.maquette-app .account-reference .account-sidebar button.tab {
		width: 100%;
	}

	body.maquette-app .account-reference .account-sidebar .tab.active,
	body.maquette-app .sale-detail-page .sale-detail-sidebar .tab.active {
		border-left-width: 4px;
	}
}

@media (min-width: 1600px) {
	body.maquette-app .account-reference .account-dashboard,
	body.maquette-app .account-reference .account-dashboard.has-quick-info,
	body.maquette-app .sale-detail-page .sale-detail-dashboard {
		grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
		gap: 26px;
	}
}

/* Compte client — listing achats fluide */
body.maquette-app .account-reference .account-dashboard .sale-card {
	width: 100%;
	min-width: 0;
	overflow: hidden;
}

body.maquette-app .account-reference .sale-card-title-row,
body.maquette-app .account-reference .history-main,
body.maquette-app .account-reference .sale-card-status,
body.maquette-app .account-reference .sale-card-business-date,
body.maquette-app .account-reference .account-dashboard .history-close,
body.maquette-app .account-reference .account-dashboard .amount,
body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	min-width: 0;
}

body.maquette-app .account-reference .account-dashboard .sale-card .btn {
	justify-self: stretch;
	max-width: 100%;
}

@media (max-width: 767px) {
	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 48px minmax(0, 1fr);
		gap: 12px;
		padding: 14px;
	}

	body.maquette-app .account-reference .sale-card-icon {
		grid-column: 1;
		grid-row: 1;
		width: 48px;
		height: 48px;
		font-size: 22px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}

	body.maquette-app .account-reference .sale-card-title-row {
		align-items: center;
		gap: 8px;
	}

	body.maquette-app .account-reference .sale-card-title-row .mobile-status {
		display: inline-flex;
	}

	body.maquette-app .account-reference .sale-card-status .desktop-status {
		display: none;
	}

	body.maquette-app .account-reference .sale-card-dates {
		display: grid;
		grid-column: 1 / -1;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-status,
	body.maquette-app .account-reference .sale-card-dates .sale-card-business-date,
	body.maquette-app .account-reference .sale-card-dates .history-close {
		grid-column: auto;
		grid-row: auto;
		padding: 10px;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 1 / -1;
		justify-self: start;
		margin: 2px 0 0;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 1 / -1;
		width: 100%;
	}
}

@media (min-width: 768px) and (max-width: 1599px) {
	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 58px minmax(170px, 1fr) minmax(250px, 1fr);
		gap: 14px 18px;
		align-items: center;
	}

	body.maquette-app .account-reference .sale-card-icon {
		grid-column: 1;
		grid-row: 1 / span 2;
		width: 58px;
		height: 58px;
		font-size: 24px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
	}

	body.maquette-app .account-reference .sale-card-dates {
		display: grid;
		grid-column: 3;
		grid-row: 1;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
		align-items: stretch;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-status,
	body.maquette-app .account-reference .sale-card-dates .sale-card-business-date,
	body.maquette-app .account-reference .sale-card-dates .history-close {
		grid-column: auto;
		grid-row: auto;
		padding: 10px;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 2;
		grid-row: 2;
		justify-self: start;
		margin: 0;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 3;
		grid-row: 2;
		width: 100%;
		min-width: 0;
	}
}

@media (min-width: 1600px) {
	body.maquette-app .account-reference .account-dashboard .sale-card {
		grid-template-columns: 70px minmax(230px, 1.15fr) minmax(150px, .6fr) minmax(180px, .68fr) minmax(135px, auto) minmax(170px, auto);
		gap: 14px 22px;
		min-height: 122px;
		padding: 22px 24px;
		align-items: center;
	}

	body.maquette-app .account-reference .sale-card-icon {
		grid-column: 1;
		grid-row: 1;
		width: 64px;
		height: 64px;
	}

	body.maquette-app .account-reference .account-dashboard .history-main {
		grid-column: 2;
		grid-row: 1;
	}

	body.maquette-app .account-reference .sale-card-dates {
		display: contents;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-status {
		grid-column: 3;
		grid-row: 1;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-business-date,
	body.maquette-app .account-reference .sale-card-dates .history-close {
		grid-column: 4;
		grid-row: 1;
	}

	body.maquette-app .account-reference .sale-card-dates .sale-card-status,
	body.maquette-app .account-reference .sale-card-dates .sale-card-business-date,
	body.maquette-app .account-reference .sale-card-dates .history-close {
		display: block;
		min-height: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	body.maquette-app .account-reference .account-dashboard .amount {
		grid-column: 5;
		grid-row: 1;
		justify-self: end;
		margin: 0;
		text-align: right;
	}

	body.maquette-app .account-reference .account-dashboard .sale-card .btn {
		grid-column: 6;
		grid-row: 1;
		width: 100%;
		min-width: 170px;
		min-height: 56px;
	}
}

/* Recherche de liste — colonnes progressives desktop */
body.maquette-app .results {
	grid-template-columns: minmax(0, 1fr);
}

body.maquette-app .results .result {
	min-width: 0;
}

@media (min-width: 768px) {
	body.maquette-app .results {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1366px) {
	body.maquette-app .results {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1760px) {
	body.maquette-app .results {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Liste participant : les colonnes vides conservent la largeur des cartes cadeaux. */
body.maquette-app .gift-grid {
	grid-template-columns: minmax(0, 1fr);
}

body.maquette-app .gift-grid .gift-card {
	min-width: 0;
}

@media (min-width: 768px) {
	body.maquette-app .gift-grid {
		grid-template-columns: repeat(auto-fill, minmax(min(100%, 430px), 1fr));
	}
}

@media (min-width: 1366px) {
	body.maquette-app .gift-grid {
		grid-template-columns: repeat(auto-fill, minmax(430px, 1fr));
	}
}

/* Recherche de liste : toute la carte est interactive. */
body.maquette-app .search-result {
	cursor: pointer;
	translate: 0;
	transition: border-color .2s ease, box-shadow .2s ease, translate .2s ease, background .2s ease;
}

body.maquette-app .search-result:hover {
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .34);
	box-shadow: 0 16px 34px rgba(var(--brand-primary-rgb, 0, 80, 80), .12);
	translate: 0 -1px;
}

body.maquette-app .search-result:focus-visible {
	outline: 0;
	border-color: rgba(var(--brand-primary-rgb, 0, 152, 152), .48);
	box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb, 0, 152, 152), .12), 0 16px 34px rgba(var(--brand-primary-rgb, 0, 80, 80), .12);
	translate: 0 -1px;
}

body.maquette-app.theme-dark .search-result:hover,
body.maquette-app.theme-dark .search-result:focus-visible {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .45);
	box-shadow: 0 18px 40px rgba(0, 0, 0, .3);
}

/* Recherche de liste : champ et résultats dans un panneau unique. */
body.maquette-app .search-results-panel {
	display: grid;
	gap: 18px;
	padding: clamp(18px, 2vw, 28px);
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: rgba(255, 255, 255, .92);
	box-shadow: var(--shadow);
	backdrop-filter: blur(10px);
}

body.maquette-app .search-results-panel .section-header {
	margin: 0;
}

body.maquette-app .search-results-panel .search-card {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	backdrop-filter: none;
}

body.maquette-app .search-results-panel .results,
body.maquette-app .search-results-panel .empty-state,
body.maquette-app .search-results-panel .alert-card {
	margin-top: 0;
}

@media (min-width: 1366px) {
	body.maquette-app .search-results-panel {
		gap: 18px;
	}
}

body.maquette-app.theme-dark .search-results-panel {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .18);
	background: rgba(15, 40, 42, .88);
	box-shadow: 0 18px 42px rgba(0, 0, 0, .3);
}

/* Consultation liste : participation et cadeaux dans un panneau commun. */
body.maquette-app .participation-selection-panel {
	display: grid;
	gap: 18px;
	padding: clamp(18px, 2vw, 28px);
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: rgba(255, 255, 255, .92);
	box-shadow: var(--shadow);
	backdrop-filter: blur(10px);
}

body.maquette-app .participation-selection-panel .participation-panel-section {
	display: grid;
	gap: 16px;
	margin: 0;
}

body.maquette-app .participation-selection-panel .participation-panel-section + .participation-panel-section {
	padding-top: 18px;
	border-top: 1px solid var(--line);
}

body.maquette-app .participation-selection-panel .section-header {
	margin: 0;
}

body.maquette-app .participation-selection-panel .sort-bar,
body.maquette-app .participation-selection-panel .gift-grid {
	margin-top: 0;
}

body.maquette-app.theme-dark .participation-selection-panel {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .18);
	background: rgba(15, 40, 42, .88);
	box-shadow: 0 18px 42px rgba(0, 0, 0, .3);
}

body.maquette-app.theme-dark .participation-selection-panel .participation-panel-section + .participation-panel-section {
	border-top-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .16);
}

/* Consultation liste : panneaux separes. */
body.maquette-app .list-section-panel {
	display: grid;
	gap: 18px;
	padding: clamp(18px, 2vw, 28px);
	border: 1px solid var(--line);
	border-radius: var(--radius-xl);
	background: rgba(255, 255, 255, .92);
	box-shadow: var(--shadow);
	backdrop-filter: blur(10px);
}

body.maquette-app .list-section-panel .section-header {
	margin: 0;
}

body.maquette-app .list-section-panel .sort-bar,
body.maquette-app .list-section-panel .gift-grid {
	margin-top: 0;
}

body.maquette-app .archived-gifts-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

body.maquette-app .archived-gifts-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 0 16px;
	border: 1px solid rgba(var(--brand-primary-rgb, 0, 152, 152), .28);
	border-radius: 999px;
	background: rgba(var(--brand-primary-rgb, 0, 152, 152), .1);
	color: var(--bb9-green);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
}

body.maquette-app .archived-gifts-toggle i {
	transition: transform .22s ease;
}

body.maquette-app .archived-gifts-panel.is-open .archived-gifts-toggle i {
	transform: rotate(180deg);
}

@media (max-width: 767px) {
	body.maquette-app .archived-gifts-toggle {
		display: inline-flex;
	}

	body.maquette-app .archived-gifts-content {
		display: none;
	}

	body.maquette-app .archived-gifts-panel.is-open .archived-gifts-content {
		display: grid;
	}
}

body.maquette-app.theme-dark .list-section-panel {
	border-color: rgba(var(--brand-primary-light-rgb, 85, 225, 220), .18);
	background: rgba(15, 40, 42, .88);
	box-shadow: 0 18px 42px rgba(0, 0, 0, .3);
}

/* Accordéons mobiles des blocs de consultation. */
body.maquette-app .list-section-content {
	display: grid;
	gap: 16px;
}

body.maquette-app .collapsible-section-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

body.maquette-app .section-panel-toggle,
body.maquette-app .archived-gifts-toggle {
	display: none;
	width: 42px;
	min-width: 42px;
	height: 42px;
	min-height: 42px;
	place-items: center;
	border: 1px solid var(--line);
	border-radius: 50%;
	padding: 0;
	background: #fff;
	color: #1f2a30;
	box-shadow: 0 8px 20px rgba(var(--brand-primary-rgb, 0, 80, 80), .08);
	font: inherit;
}

body.maquette-app .section-panel-toggle i,
body.maquette-app .archived-gifts-toggle i {
	font-size: 14px;
	transition: transform .22s ease;
}

@media (max-width: 767px) {
	body.maquette-app .section-panel-toggle,
	body.maquette-app .archived-gifts-toggle {
		display: grid;
	}

	body.maquette-app .participation-free-panel:not(.is-closed) .section-panel-toggle i,
	body.maquette-app .available-gifts-panel:not(.is-closed) .section-panel-toggle i,
	body.maquette-app .archived-gifts-panel.is-open .section-panel-toggle i {
		transform: rotate(180deg);
	}

	body.maquette-app .participation-free-panel.is-closed .list-section-content,
	body.maquette-app .available-gifts-panel.is-closed .list-section-content,
	body.maquette-app .archived-gifts-content {
		display: none;
	}

	body.maquette-app .archived-gifts-panel.is-open .archived-gifts-content {
		display: grid;
	}
}

body.maquette-app.theme-dark .section-panel-toggle,
body.maquette-app.theme-dark .archived-gifts-toggle {
	border-color: rgba(255, 255, 255, .16);
	background: rgba(255, 255, 255, .92);
	color: #102124;
}

/* Mobile list summary: readable label/value rows instead of narrow cards. */
@media (max-width: 719px) {
 body.maquette-app .page-detail .list-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
 }
 body.maquette-app .page-detail .list-overview .hero-stat {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 64px;
  padding: 12px;
  text-align: left;
 }
 body.maquette-app .page-detail .list-overview .hero-stat > i {
  grid-column: 1;
  grid-row: 1;
  width: 32px;
  height: 32px;
  margin: 0;
  font-size: 17px;
 }
 body.maquette-app .page-detail .list-overview .hero-stat span {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  font-size: 13px;
  line-height: 1.35;
 }
 body.maquette-app .page-detail .list-overview .hero-stat strong {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  font-size: 17px;
  line-height: 1.3;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  text-align: right;
 }
}

/* Consultation liste : la présentation reste pleine largeur sur tablette. */
@media (max-width: 1199px) {
 body.maquette-app .page-detail .hero {
  grid-template-columns: minmax(0, 1fr);
 }
 body.maquette-app .page-detail .hero-main {
  min-width: 0;
 }
 body.maquette-app .page-detail .list-overview {
  margin-top: 0;
 }
}

@media (min-width: 720px) and (max-width: 1199px) {
 body.maquette-app .page-detail .list-overview {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 body.maquette-app .page-detail .list-overview .hero-stat {
  min-width: 0;
  padding: 16px;
  column-gap: 12px;
 }
 body.maquette-app .page-detail .list-overview .hero-stat > i {
  width: 42px;
  height: 42px;
  font-size: 22px;
 }
 body.maquette-app .page-detail .list-overview .hero-stat strong {
  font-size: 22px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
 }
}

/* Panier mobile : suppression sous le montant de chaque cadeau. */
@media (max-width: 719px) {
 body.maquette-app .cart-gift-item .cart-product-media {
  grid-column: 1;
  grid-row: 1 / span 2;
 }
 body.maquette-app .cart-gift-item .cart-product-info {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-width: 0;
 }
 body.maquette-app .cart-gift-item .cart-line-total {
  grid-column: 3;
  grid-row: 1;
  align-self: end;
 }
 body.maquette-app .cart-gift-item > .cart-remove {
  grid-column: 3;
  grid-row: 2;
  align-self: start;
  justify-self: end;
 }
}

/* Confirmation bancaire : intitulé puis noms sur une nouvelle ligne. */
body.maquette-app .bank-confirm-card .payment-list-title {
 white-space: pre-line;
}

/* Complementary login information stays together in the existing side column. */
.account-help-stack {
 display: grid;
 gap: 18px;
 align-self: start;
 min-width: 0;
}
.account-help-stack .account-help-card { position: static; }
.account-login-card .account-remember {
 display: flex;
 align-items: center;
 gap: 10px;
 margin: 14px 0 0;
 cursor: pointer;
 font-weight: 400;
}
.account-login-card .account-remember input {
 width: 18px;
 height: 18px;
 min-height: 18px;
 flex: 0 0 18px;
 margin: 0;
 accent-color: var(--primary);
}

.account-response-card .account-response-icon {
 display: flex;
 align-items: center;
 justify-content: center;
 width: 60px;
 height: 60px;
 margin-bottom: 18px;
 border-radius: 50%;
 color: var(--bb9-green);
 background: var(--soft);
 font-size: 26px;
}
.account-response-card .account-response-hint { color: var(--muted); margin-top: 12px; }

/* Même formulaire de coordonnées pour la modification et la demande au magasin. */
.client-profile-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.client-profile-form .info-card { min-width: 0; }
.client-profile-form .info-field label { display: block; color: var(--muted); font-weight: 600; margin-bottom: 6px; }
.client-profile-form .info-field input { display: block; width: 100%; min-width: 0; box-sizing: border-box; border: 1px solid var(--line); border-radius: 12px; background: var(--white); color: var(--text); padding: 12px; font: inherit; }
.client-profile-form .info-field input:focus { outline: 2px solid var(--bb9-green); outline-offset: 2px; }
.client-profile-form .profile-email { margin-top: 18px; overflow-wrap: anywhere; }
.client-profile-form .profile-email strong { display: block; }
.client-profile-section .profile-error { border-left: 4px solid var(--bb9-pink); }
.client-profile-section .profile-error button { margin-top: 12px; }
.client-profile-section .profile-logout { margin-top: 20px; }
.client-profile-section button:disabled { opacity: .55; cursor: not-allowed; }

body.maquette-app .account-reference .client-profile-form .info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 767px) {
 body.maquette-app .account-reference .client-profile-form .info-grid { grid-template-columns: minmax(0, 1fr); }
 .client-profile-section .maquette-btn { width: 100%; }
}

.client-profile-section .profile-edit-toggle { margin-bottom: 20px; gap: 8px; }
.client-profile-section .profile-edit-actions { display: flex; flex-wrap: wrap; gap: 12px; }
