.btn-type-a {
	background-color: transparent; border: none; color: #aaa; font-size: .9rem; text-decoration: underline; cursor: pointer;
}
.btn-type-a.blue {
	color: #6d6de5;
}
.a-small {
	color: #aaa; font-size: .9rem; text-decoration: underline;
}
.btn-type-a:hover,
a:hover {
	color: var(--color-true-blue);
}
.muted {
	color: var(--color-muted) !important;
}
.container {
	margin-bottom: 1rem;;
}
.btn-save {
	background-color: var(--color-true-blue); border: none; color: #fff; font-weight: 300; font-size: 1.2rem; padding: .5rem; margin-top: .5rem; border-radius: .25rem; cursor: pointer; position: relative; overflow: hidden;
}
.btn-save.is-waiting::after,
.btn-save-account.is-waiting::after {
	content: ""; position: absolute; inset: 0; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: auto 84%; background-color: var(--color-true-blue);
}
.btn-return {
	background-color: #aaa; border: none; color: #fff; font-weight: 400; font-size: 1.2rem; padding: .5rem; margin-top: .5rem; border-radius: .25rem; cursor: pointer;
}
.btn-save-account {
	background-color: var(--color-true-blue); border: none; color: #fff!important; font-weight: 300; font-size: 1.2rem; padding: .7rem; border-radius: 2rem; cursor: pointer; text-align: center; max-width: 15rem; width: 100%; text-decoration: none; display: block; position: relative; overflow: hidden; margin: auto;
}
.a-btn-save-account {
	background-color: var(--color-true-blue); border: none; font-weight: 300; font-size: .95rem; padding: .2rem .75rem; margin-top: .5rem; border-radius: 1rem; cursor: pointer; text-decoration: none; color: #fff !important; display: block;
}
strong {
	font-weight: 600;
}
.h-with-ornmt {
	position: relative;
}
.h-with-ornmt::before {
	content: ""; color: var(--color-red); font-weight: 900; font-size: .85em; position: absolute; left: 0;
}

/* ---- HEADER ---- */
.hdr-ordering {
	background-color: var(--color-main);
}
.hdr-ordering > .inside {
	display: grid; grid-template-columns: 1fr 220px 1fr; padding: .5vw 1vw; color: #fff; height: 80px;
}
.hdr-guard-cnr {
	display: flex; align-items: center; gap: .5rem;
}
.picto-guard {
	width: 2rem; position: relative; aspect-ratio: 1; display: block;
}
.picto-guard::before {
	background-color: var(--color-yellow);
}
.hdr-logo-cnr {
	display: flex; align-items: center;
}
.hdr-logo-cnr a {
	width: 100%;
}
.hdr-hotline-cnr {
	justify-content: right; display: flex; text-align: right; align-items: center;
}
.hdr-hotline-cnr strong {
	color: var(--color-yellow);
}
.hdr-hotline-cnr ul li:first-child {
	display: flex; align-items: center; gap: .5rem; justify-content: end;
}
.picto-phone {
	width: 1.5rem; position: relative; aspect-ratio: 1; display: block;
}
.picto-phone::before {
	background-color: var(--color-yellow);
}
.hdr-hotline-cnr .picto-phone {
	display: none;
}
/* ---- MASK ---- */
.mask {
	display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #2d2825d1; z-index: 20;
}
.mask.open {
	display: block;
}
.mask-body {
	background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 1.5rem; width: 90%; max-width: 1200px; height: 94%; max-height: 940px;
}
.popslide-relais {
	height: 100%;
}
.popslide-relais-container {
	width: 100%; display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; height: 100%; grid-template-rows: auto 1fr;
}
.popslide-header {
	grid-column: span 3; border-bottom: 1px solid var(--color-main); display: flex; font-size: 1.35rem; padding-bottom: .5rem; font-weight: 600; justify-content: space-between;
}
.google-map-popslide-container {
	grid-column: span 2; position: relative;
}
.is-popslide-waiting .google-map-popslide-container::after{
    content: ""; position: absolute; inset: 0; z-index: 5; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: 80px auto; background-color: rgba(255,255,255,.35); border-radius: inherit;
}
#relay-map {
	width: 100%; height: 100%; border: 1px solid #ccc; min-height: 300px;
}
.relay-select-container {
	display: flex; flex-direction: column; min-width: 260px;
}
.relay-points-list {
	overflow: auto; flex: 1; position: relative;
}
.relay-points-list > ul {
	position: absolute; width: 100%;
}
.relay-search-box {
	display: flex; flex-wrap: wrap;
}
.relay-search-box > div {
	display: flex; border: 1px solid; margin-bottom: 1rem; width: 100%;
}
.relay-search-box input {
	flex: 1; border: none; padding: .5rem;
}
.relay-point {
	margin-bottom: .75rem;
}
.relay-point label {
	display: flex;
}
.relay-point label > div {
	border-bottom: 1px solid var(--color-old); flex: 1; padding-bottom: .5rem;
}
.relay-point:last-child label > div {
	border-bottom: none; padding-bottom: 0;
}
.relay-opening-hours-content {
	font-size: .85rem;
}
.relay-opening-hours-content ul {
	padding-top: .5rem;
}

/* ---- FORM ---- */
.checkbox-row {
	display: flex; gap: 8px;
}
.checkbox-row label {
	flex: 1;
}
input[type="checkbox"] {
	border: 1px solid var(--color-main); width: 1rem; height: 1rem; background-color: #fff; border-radius: .15rem; position: relative; margin-top: .15rem;
}
input[type="checkbox"]:checked::before {
	-webkit-mask-image: url("../../images/default/svg/picto/check-9F1LEAy.svg"); mask-image: url("../../images/default/svg/picto/check-9F1LEAy.svg"); content: ""; position: absolute; background-color: var(--color-green); width: 130%; height: 130%; bottom: 10%; left: -7%;
}
input[type="radio"] {
	width: 1rem; background-color: #ccc; height: 1rem; border-radius: 50%; margin: .15rem .5rem 0 0; position: relative;
}
input[type="radio"]:checked {
	border: 1px solid var(--color-true-blue); background-color: #fff;
}
input[type="radio"]:checked::before {
	background-color: var(--color-true-blue); content: ""; position: absolute; height: 69%; width: 69%; border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%,-50%);
}

.form-container {
	display: grid; gap: 1rem;
}
.form-messages {
	color: #fff; padding: .75rem 1rem; font-weight: 600; position: relative; margin-bottom: .5rem;
}
.form-card-messages {
	color: #fff; padding: 0 1rem; font-weight: 600; flex: 1; min-height: 100%; display: flex; align-items: center;
}
.form-small-messages {
	width: 100%; padding: .25rem .75rem; color: #fff; border-radius: .25rem; font-size: .9rem; text-align: center;
}
.success-message {
	background-color: var(--color-green);
}
.error-message {
	background-color: var(--color-red);
}
.form-title {
	display: flex; justify-content: space-between; align-items: center;
}
.form-title h3 {
	color: var(--color-yellow);
}
.form-default-check {
	display: flex; gap: 1rem;
}
.form-row {
	display: grid; gap: 1rem;
}
.form-row.col2 {
	grid-template-columns: repeat(2,1fr);
}
.form-row.col5 {
	grid-template-columns: repeat(5,1fr);
}
.form-row.col6 {
	grid-template-columns: repeat(6,1fr);
}
.form-row-btn {
	display: grid; grid-template-columns: repeat(2,1fr); margin-top: 1rem; gap: 1rem;
}
.form-actions {
	margin-top: 1rem; justify-content: space-between; align-items: center; display: flex;
}
.form-address-actions {
	margin-top: 1rem; justify-content: flex-end; align-items: center; display: flex; gap: 1rem;
}
.form-address-actions button {
	padding: .5rem 1.5rem;
}
.form-col.span3 {
	grid-column: span 3;
}
.form-col.span2 {
	grid-column: span 2;
}
.form-col.span4 {
	grid-column: span 4;
}
.form-col.span5 {
	grid-column: span 5;
}
.form-col {
	position: relative;
}
.label-input-row {
	display: flex; align-items: center;
}
.label-input-row > div {
	width: 100%;
}
.label-input-row.type-write {
	border: 1px solid #ccc; border-radius: .75rem; height: 3rem; position: relative; background-color: #ffffffb2;
}
.label-input-row.type-write.is-error {
	border-color: var(--color-red);
}
.label-input-row.type-write.with-ts-control {
	padding: .5rem .25rem .5rem .75rem;
}
.label-input-row.type-write input {
	border: none; background-color: transparent; width: 100%; height: 100%; font-size: 1rem; padding-left: 1rem; padding-right: .5rem; border-radius: .5rem;
}
.label-input-row.type-write input[type=password] {
	padding-right: 2.5rem;
}
.label-input-row.type-write label {
	position: absolute; color: #aaa; left: .5rem; top: 50%; transform: translateY(-60%); padding: 0 .35rem; transition: all .5s; font-size: 1rem;
}
label.required::after {
	content: "*"; color: var(--color-red); margin-left: .2rem;
}
.label-input-row .ts-control {
	border: none; background-color: transparent!important; padding: .25rem;
}
.label-input-row .country-select {
	width: 100%;
}
.label-input-row.input-left-border input {
	border: none; border-left: 1px solid #ccc; padding-left: 1rem;
}
/*.label-input-row.type-write input:focus {
	outline-color: var(--color-yellow); outline-style: solid; outline-width: 1px; border: none;
}*/
.label-input-row.type-write .form-validate ~ label,
.label-input-row.type-write .focus ~ label,
.label-input-row.type-write .has-items ~ label,
.combined-row input:focus ~ label {
	font-size: .8rem; top: 0; left: .75rem; font-weight: 600; transition: all .5s; color: var(--color-cream); background-color: #fff;
}
.label-input-row.type-write .ts-dropdown {
	top: 10%; margin-top: 0;
}
.dial-code-select {
	width: 100%;
}
.dial-code-select .ts-control > input {
	min-width: auto;
}
.ts-control {
	padding-left: 0!important; padding-right: 0!important;
}
.ts-control, .ts-wrapper.single.input-active .ts-control {
	outline: none!important;
}
.ts-dropdown, .ts-control, .ts-control input {
	font-size: .85rem!important;
}
.ts-wrapper.single .ts-control::after {
	content: '▾'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; color: #888; font-size: 1rem;
}
.errors-row {
	font-family: "barlow Condensed"; color: var(--color-red); padding: 0 .5rem 0 1rem; font-size: .9rem; background-color: #fff;
}
.autocomplete-suggestions {
	opacity: 0; height: 0; position: absolute; z-index: 20; background-color: #fff; width: calc(100% - 2em); border: 1px solid #ccc; box-shadow: .25em .25em .5em rgba(0,0,0,.5); padding: .75em; left: 1em; top: 75%; font-size: .85rem; transition: all .5s;
}
.autocomplete-suggestions.is-active {
	opacity: 1; height: auto; transition: all .5s;
}
.autocomplete-suggestions li {
	padding: .5em; border-bottom: 1px solid #ccc;
}
.autocomplete-suggestions li:last-child {
	border-bottom: none;
}
.autocomplete-suggestions li:hover,
.autocomplete-suggestions li.is-selected,
.autocomplete-suggestions li:focus {
	background-color: var(--color-soft-cream); cursor: pointer;
}
.change-pwd-container {
	display: flex; height: 100%; align-items: center; gap: 1rem;
}
.show-pwd-btn {
	position: absolute; top: 50%; transform: translateY(-50%); right: .5rem; width: 1.75rem; aspect-ratio: 1; background-color: transparent; border: none; cursor: pointer;
}
.show-pwd-btn::before {
	background-color: #aaa;
}
.label-input-row.type-write input[type="text"] ~ .show-pwd-btn::before {
	mask-image: url("../../images/default/svg/picto/eye-hide-AU6dMmx.svg");
}
.label-input-row.type-write input[type="password"] ~ .show-pwd-btn::before {
	mask-image: url("../../images/default/svg/picto/eye-show-ZUmTYfI.svg");
}
.mask-container {
	position: fixed; background-color: #2d2825ed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999;
}
.add-container {
	position: fixed; top: 50%; left: 50%; background-color: #fff; transform: translate(-50%,-50%); z-index: 999; padding: 3vw 2.5vw; box-shadow: .5rem .5rem 1rem rgba(0,0,0,.35); border-radius: .75rem; width: 96%; max-width: 760px; max-height: 97%; overflow: auto;
}

/* ---- CHECKOUT ---- */

.main-ordering {
	flex: 1; display: flex;
}
.main-ordering > div {
	width: 100%;
}
.main-ordering .max-width {
	margin: 0 auto;
}
.checkout-container {
	background-color: #fff; padding: 2.5% .5vw; height: 100%; display: flex; flex-direction: column; position: relative;
}
.checkout-layout {
	display: grid; grid-template-columns: repeat(2,1fr); flex: 1;
}
.recap-smart-checkout-container {
	display: none; width: 100% !important; background-color: #eee; padding: .75rem; position: sticky; top: 0; z-index: 20; height: 50px; box-shadow: 0px 0px .5rem rgba(0,0,0,.5); line-height: .8; justify-content: space-between; align-items: center; font-weight: 600; font-size: 1.3rem;
}
.recap-smart-checkout-container button {
	font-weight: bold; color: var(--color-true-blue);
}
.recap-smart-checkout-container .price {
	font-family: "Barlow Condensed"; font-size: 1.5em;
}
.checkout-steps {
	padding: 0 10% 0 8%; height: 100%; border-right: 1px solid #aaa; display: flex; flex-direction: column;
}
.checkout-steps > div {
	max-width: 700px; margin-left: auto; width: 100%;
}
.checkout-step {
	position: relative;
}
.checkout-step.is-disabled {
	height: 0; pointer-events: none; overflow: hidden;
}
.checkout-step .header {
	display: flex; justify-content: space-between; align-items: end; line-height: 1; flex-wrap: wrap; margin-bottom: .75rem;
}
.checkout-step .picto-checked {
	position: relative; width: 1.15rem; margin-right: .25rem; display: none;
}
.checkout-step .picto-checked::before {
	background-color: var(--color-green);
}
.checkout-step.checked .picto-checked {
	display: block;
}
.checkout-step .title {
	font-size: 1.65rem; font-weight: 600; display: flex;
}
.step-title-progress {
	color: var(--color-dark-cream); display: none; min-width: 100%; margin-top: .25rem;
}
.checkout-step.check .step-title-progress {
	display: block;
}
.checkout-step p {
	margin-bottom: 1rem;
}
.checkout-step .form-guest {
	display: flex; flex-direction: column; gap: 1rem;
}
.checkout-step h2 {
	font-size: 1.1rem; font-weight: 500;
}
.checkout-summary-box {
	margin-bottom: 1.5rem; display: grid; grid-template-columns: repeat(2,1fr);
}
.checkout-summary {
	padding: 0 10%;
}
.right.for-sticky {
	position: sticky; top: 2rem;
}
.right.for-sticky > .inside {
	max-width: 640px; display: flex; flex-direction: column; max-height: 100%;
}
.btn-checkout-next-step {
	background-color: var(--color-true-blue); border: 2px solid var(--color-true-blue); font-size: 1.5rem; border-radius: .5rem; padding: .5rem; font-weight: 300; color: #fff; width: 100%; cursor: pointer; position: relative;
}
.btn-checkout-next-step:not(:disabled):hover {
	box-shadow: 0 0 .5rem rgba(0,0,0,.5); border: 2px solid #fff;
}
.btn-checkout-next-step:disabled {
	opacity: .5; background-color: #aaa; cursor: default; border-color: #aaa;
}
.btn-checkout-next-step.is-waiting::after {
	content: ""; position: absolute; inset: 0; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: auto 84%; background-color: var(--color-true-blue);
}
.step-choices {
	display: flex; flex-direction: column; gap: .75rem;
}
.step-choices li {
	border: 1px solid #cec9c3; border-radius: .25rem;
}
.step-choices li:has(input[type="radio"]:checked) {
	border-width: 2px; border-color: var(--color-main);
}
.step-choices li label {
	display: flex; gap: .5rem; align-items: flex-start; padding: .75rem 1rem; cursor: pointer; user-select: none;
}
.step-choices li label span {
	flex: 1; min-width: 0; position: relative;
}
.step-choices li label span > div:first-child {
	display: flex; justify-content: space-between;
}
.step-choices li label .price {
	font-family: "Barlow Condensed"; font-size: 1.2rem; font-weight: 500;
}
.checkout-step.is-waiting::after,
.checkout-step:has(.login-account-container.is-waiting)::after,
.address-container.is-waiting::after,
.add-container.is-waiting::after {
    content: ""; position: absolute; inset: 0; z-index: 5; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: 80px auto; background-color: rgba(255,255,255,.55); border-radius: inherit;
}
.checkout-step.is-waiting,
.checkout-step:has(.login-account-container.is-waiting) {
	pointer-events: none;
}
.checkout-step.is-waiting .btn-primary{
	pointer-events: none;
}
.checkout-step .msg {
	background-color: #eee; margin-bottom: 1rem; padding: .5rem .75rem; font-weight: 500; font-size: .9rem;
}
.addressbook-add-wrap {
	text-align: right; margin-top: .5rem;
}
.form-address-title {
	font-size: 1.3rem; font-weight: 500; margin-bottom: 1rem;
}
.checkout-summary-box.col2 {
	display: grid; grid-template-columns: repeat(2,1fr);
}
.summary-step2-title {
	display: none; text-transform: uppercase; margin-bottom: .25rem; color: var(--color-dark-cream); font-weight: 200;
}
.checkout-summary-box.col2 .summary-step2-title {
	display: block;
}
.relay-summary-container {
	display: flex; gap: 1rem; align-items: center; margin-top: .5rem;
}
.relay-summary-container > div {
	flex: 1; text-align: center;
}
.relay-address {
	width: 100%; padding: .5rem 1rem; border: 1px solid; display: flex; flex-direction: column; text-align: left !important;
}
.relay-address strong {
	font-weight: 600; color: #333;
}
.checkout-payment-title {
	display: flex; align-items: flex-start; justify-content: space-between;
}
.checkout-payment-label {
	font-weight: 600; width: 70%;
}
.picto-payment-container {
	height: 1.8rem; flex: 1; background-repeat: no-repeat; background-size: auto 90%; background-position: right center; margin-top: -.25rem; max-width: 8rem; min-width: 7.2rem;
}
.info-payment-container {
	font-size: .9rem; font-weight: 500; color: #aaa !important; margin-top: .5rem;
}
.oney-checkout-wrapper {
	background-color: #edf9db; padding: .5rem; border-radius: .5rem; margin-top: .75rem; margin-bottom: .5rem;
}
.payplug-checkout-wrapper {
	margin-top: 1rem;
}
.payplug-card__section-title {
    font-size: 1rem; font-weight: 600; margin-bottom: 1rem;
}
.payplug-form-group {
	margin-bottom: 1rem;
}
.payplug-form-label {
    display: block; font-size: .85rem; font-weight: 500; margin-bottom: .3rem;
}
.payplug-schemes {
	display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; height: 100%;
}
.payplug-schemes div {
	width: 27%; height: 100%;
}
.payplug-schemes img {
	height: 100%; width: 100%;
}
.payplug-input-shell {
    border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; padding: 0 .6rem; background: #fff; height: 40px; box-sizing: border-box; display: flex; align-items: center;
}
.payplug-input-shell iframe {
    width: 100%; height: 100%;
}
.payplug-input-row {
    display: grid; grid-template-columns: 2fr 1fr 1fr; gap: .75rem;
}
.payplug-helper {
    font-size: .8rem; color: #777; margin-top: .25rem;
}
.payplug-error {
    background: #ffe3e3; border: 1px solid #ff6b6b; color: #8b0000; padding: 10px 12px; border-radius: 6px; margin-top: 12px; font-size: 0.9rem;
}
.payplug-submit {
	margin-top: 1rem;
}
.payplug-submit button {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem; background: #151181; color: #fff; border: none; border-radius: 999px; padding: .65rem 1.6rem; font-size: .95rem; font-weight: 600; cursor: pointer;
}
.payplug-submit button:hover {
	background: #211fb2;
}
.checkout-links ul {
	display: flex; flex-wrap: wrap; gap: .5rem 1rem; justify-content: center;
}

.step-basket-title {
	display: flex; justify-content: space-between; margin-bottom: 1.25rem; align-items: first baseline;
}
.step-basket-title > div:first-child {
	font-size: 1.3rem; font-weight: 600;
}
.step-checkout-products-container {
	overflow: auto; max-height: 14rem; position: relative;
}
.scroll-hint {
	position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background-color: #fff3c9; border: none; padding: .5rem 1rem; border-radius: .5rem .5rem 0 0; font-weight: 500; font-size: .95rem; display: flex; gap: .5rem; align-items: center; color: var(--color-dark-cream);
}
.scroll-hint span {
	font-size: 1.5rem; line-height: 0;
}
.step-checkout-products-container article {
	display: grid; grid-template-columns: 18% auto; align-items: center;
}
.step-checkout-products-container article:not(:last-child) {
	margin-bottom: .65rem; border-bottom: 1px solid var(--color-soft-cream); padding-bottom: .65rem;
}
.step-checkout-products-container figure {
	position: relative; aspect-ratio: 16/10; overflow: hidden;
}
.step-checkout-products-container img {
	position: absolute; object-fit: contain; width: 100%; height: 100%;
}
/*.step-checkout-products-container .type-guitare img {
	object-position: left; width: 200%;
}
.step-checkout-products-container .type-guitare.left-handed img {
	right: 0;
}*/
.step-checkout-products-container article > div {
	display: grid; grid-template-columns: 1.8rem 1fr auto; gap: .5rem; text-align: right;
}
.step-checkout-products-container .infos {
	text-align: left;
}
.step-checkout-products-container .qty,
.step-checkout-products-container .brand,
.step-checkout-products-container .price {
	font-family: "Barlow Condensed"; font-size: 1.1rem; font-weight: 500;
}
.step-checkout-products-container .ref {
	height: 2.1rem; overflow: hidden; line-height: 1;
}
.step-checkout-products-container .delivery {
	font-family: "Barlow Condensed"; font-size: .9rem; line-height: 1.1; font-weight: 500;
}
.step-checkout-summary-container {
	border-bottom: .1rem solid; border-top: .1rem solid; padding: 1rem 0; display: flex; flex-direction: column; gap: 1rem;
}
.step-checkout-summary-container > div {
	display: flex; justify-content: space-between; align-items: center;
}
.step-checkout-summary-container strong {
	font-weight: 600; color: var(--color-main);
}
.step-checkout-summary-container .price {
	font-weight: 500; font-size: 1.4rem; color: var(--color-main); font-family: "Barlow Condensed";
}
.order-code-container {
	width: 100%;
}
.step-checkout-form-discount {
	display: grid; grid-template-columns: 1fr minmax(auto,170px); gap: 2%;
}
.step-checkout-form-discount input {
	border: 1px solid #aaa; padding: .65rem 1rem;
}
.step-checkout-form-discount button {
	font-size: 1.1rem; font-weight: 600; border: none; background-color: #d2cdc7; color: #fff; padding: 0 .5rem; cursor: pointer; position: relative;
}
.is-waiting .step-checkout-form-discount button::after {
	content: ""; position: absolute; inset: 0; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: auto 84%; background-color: var(--color-true-blue);
}
.is-waiting .code-actif::after {
	content: ""; position: absolute; inset: 0; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: auto 84%; background-color: #ffffff80;
}
.step-checkout-form-discount button:hover {
	background-color: var(--color-true-blue);
}
.order-code-container .code-actif {
	background-color: #efefef; display: flex; border: 1px solid #aaa; padding: .25rem .5rem; flex-direction: column;
}
.order-code-container .promo-offer-details {
	width: 100%; border-top: 1px dashed var(--color-old); padding-top: .2rem; margin-top: .2rem;
}
.order-code-container .code-ul {
	display: grid; align-items: baseline; width: 100%; gap: 0 .5rem; grid-template-columns: auto 1fr auto;
}
.order-code-container .code-ul > li:nth-child(1) {
	color: var(--color-muted); font-weight: 500;
}
.order-code-container .code-ul > li:nth-child(2) {
	flex: inherit;
}
.order-code-container .code-ul > li:nth-child(3) {
	text-align: right;
}
.order-code-container .code-ul > li:nth-child(4) {
	grid-column: span 2; display: flex; gap: .5rem;
}
.order-code-container .price-type {
	font-family: "Barlow Condensed"; font-size: 1.2rem; text-align: right; font-weight: 500;
}
.hint.promo-card__message {
	margin-top: .25rem; color: var(--color-red); font-weight: 500; font-family: "Barlow Condensed";
}
.step-checkout-final-price {
	display: flex; margin-top: 1rem; justify-content: space-between; align-items: first baseline; color: #aaa;
}
.step-checkout-final-price > div {
	display: flex; flex-direction: column; gap: .25rem;
}
.step-checkout-final-price > div:last-child {
	text-align: right;
}
.step-checkout-final-price .price {
	font-weight: 500; font-size: 1.8rem; font-family: "Barlow Condensed"; color: var(--color-main);
}
.step-checkout-final-price strong {
	font-size: 1.4rem; font-weight: 600; color: var(--color-main);
}
.checkout-reassurance {
	font-size: 1.15rem; line-height: 1.3; color: var(--color-dark-cream); margin-top: 1.5rem; font-family: "Barlow Condensed";
}
.checkout-reassurance ul {
	display: grid; line-height: 1; border-top: 1px solid #aaa; text-align: center; grid-template-columns: repeat(3,1fr); padding: .35rem 0; border-bottom: 1px solid #aaa;
}
.checkout-reassurance ul li:not(:last-child) {
	border-right: 1px solid #aaa;
}
.checkout-reassurance span {
	display: block;
}
.checkout-reassurance strong {
	font-weight: 600; white-space: nowrap; font-size: 1.15em;
}

/* ---- ACCOUNT ---- */
.account-container {
	background-color: #fff; padding: 4% 2.5% 0; min-height: 100%; display: flex; flex-direction: column; position: relative;
}
.account-container > .inside {
	flex: 1;
}
.account-container a,
.account-container .btn-type-a {
	color: #6c86c1;
}
.popup-log-account-container {
	width: 100%; max-width: 560px; border: 1px solid var(--color-soft-cream); box-shadow: .25rem .25rem .5rem rgba(0,0,0,.25); padding: 2rem 2rem 4rem; margin: auto; position: absolute; left: 50%; top: 5vw; transform: translate(-50%,0); background-color: #fff;
}
.title-popup-account {
	font-size: 2rem; font-weight: 200; margin-bottom: 1.5rem;
}
.register-cta {
	text-align: center; margin-top: 2rem; border-top: 1px solid #aaa; padding-top: 1.5rem;
}
.reset-pwd-container {
	display: flex; flex-direction: column; gap: 1rem; border: 1px solid #aaa; padding: 1rem; border-radius: .5rem;
}
.reset-pwd-container h2 {
	font-size: 1.3rem; font-weight: 600;
}

.account-tabs-container {
	margin: 1rem auto 2rem; max-width: 1200px;
}
.account-tabs-container h1 {
	font-weight: 200;
}
.account-tabs-top {
	display: flex;
}
.account-tabs-top > div:first-child {
	flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: .75rem; gap: .5rem;
}
.account-tabs-top .user-info {
	display: flex; gap: 1rem; align-items: baseline;
}
.account-tabs-top .user-info strong {
	font-size: 1.1rem;
}
.account-tabs-top .user-info a {
	font-size: .9rem;
}
.account-tab-nav {
	list-style: none; display: flex; position: relative; z-index: 2; gap: .25rem; justify-content: end; overflow: hidden;
}
.account-tab-nav li {
	margin-right: 0;
}
.account-tab-nav li a {
	display: flex; padding: .5rem .5rem calc(.5rem - 3px) .5rem; color: #fff; align-items: center; border-radius: .25rem .25rem 0 0; background-color: #ddd; height: calc(100% - 4px); flex-direction: column; text-decoration: none; font-weight: 500; aspect-ratio: 16/12;
}
.account-tab-nav li.active a {
	border: 1px solid var(--color-main); border-bottom-color: #fff; height: 100%; padding-bottom: .5rem; color: var(--color-main); background-color: #fff;
}
.account-tab-nav li:not(.active) a:hover {
	background-color: var(--color-yellow); color: #fff;
}
.account-tab-nav li:not(.active) a:hover .for-tab::before {
	background-color: #fff;
}
.for-tab {
	width: 6.5rem; flex: 1; position: relative;
}
.for-tab::before {
	background-color: #fff; width: 100%; height: 100%; aspect-ratio: auto;
}
.for-tab.svg-ident::before {
	height: 52%;
}
.for-tab.svg-order::before {
	height: 77%;
}
.for-tab.svg-address::before {
	height: 85%;
}
.active .for-tab::before {
	background-color: var(--color-yellow);
}
.account-tab-content {
	border: 1px solid var(--color-main); margin-top: -1px; position: relative; min-height: 400px; display: flex; justify-content: center;
}
.account-tab-content #idents,
.account-tab-content #addresses {
	padding: 5% 7%; width: 100%; background-color: #fffffff0;
}
.account-tab-content #orders {
	padding: 2% 3%; width: 100%; background-color: #fffffff0;
}
.account-inside-title {
	font-weight: 500;
}
.account-ident-container {
	gap: 5%; display: flex; position: relative;
}
.account-ident-container > div:first-child {
	flex: .7; padding: 1.5rem 5% 1.5rem 0;
}
.account-ident-container > div:last-child {
	flex: .3; display: flex; flex-direction: column; padding: 1.5rem 0; justify-content: end;
}
/*.top-adresses-live-container {
	display: flex; align-items: start; justify-content: space-between;
}*/
.addresses-live-component {
	display: grid; grid-template-columns: .7fr .3fr; gap: 1rem;
}
.addresses-live-component.is-waiting::after,
.address-card-edit.is-waiting::after {
    content: ""; position: absolute; inset: 0; z-index: 5; background-image: url("../../images/default/gif/wait-nZ-HHc7.gif"); background-repeat: no-repeat; background-position: center; background-size: 80px auto; background-color: rgba(255,255,255,.55); border-radius: inherit;
}
.addresses-live-component .right {
	justify-content: end; display: flex; align-items: end;
}
.addresses-default-container {
	border-bottom: 3px solid var(--color-main); padding-bottom: 1rem;
}
.addresses-default-container > div {
	flex: 1; display: flex; flex-direction: column;
}
.addresses-default-container h3 {
	font-size: 1.2rem; margin-bottom: .5rem; color: var(--color-dark-cream); text-transform: uppercase; font-weight: 200;
}
.addresses-default-container h3 strong {
	font-weight: bold;
}
.addresses-list {
	display: flex; flex-direction: column; gap: 1rem; padding-top: 1rem;
}
.addresses-list > div:not(:last-child) {
	border-bottom: 1px solid var(--color-main); padding-bottom: 1rem;
}
/*.address-card-edit {
	width: 100%; position: relative; padding: 2.5% 4% 2%; border-radius: 1rem; height: 100%;
}*/
.address-card-options {
	display: flex; gap: .25rem 1rem; border-top: 1px solid var(--color-soft-cream); padding-top: .5rem; margin-top: 1rem; justify-content: right; font-size: .9rem; align-items: center; order: 3; flex-wrap: wrap;
}
.address-card-edit p {
	line-height: 1.5; margin-bottom: .5rem; flex: 1;
}
.random {
	position: absolute; bottom: 0; font-size: .7rem; right: 0; transform: translateY(250%); color: #ccc; display: none;
}
.address-card-container {
	display: flex; justify-content: space-between;
}
.address-card-container li {
	display: flex; margin-bottom: .25rem; gap: .5rem; align-items: center;
}
.address-card-container li.society {
	padding-bottom: .25rem; gap: 1rem;
}
.address-card-container li.society > div {
	display: flex; flex-direction: column; background-color: #eee; padding: .25rem .5rem; border-radius: .25rem; border: 1px solid #aaa;
}
.address-card-container li.society > div span {
	text-transform: uppercase; font-size: .8rem;
}
.form-account-address-actions {
	display: flex; flex-direction: column; align-items: end; gap: .5rem;
}
.new-address-container {
	position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: #2d2825e8; z-index: -1; opacity: 0; transition: opacity .25s, z-index 0s .25s; max-width: none !important;
}
.new-address-container.is-open {
	opacity: 1; z-index: 50; transition: opacity .25s, z-index 0s;
}
.new-address-container > div {
	background-color: #fff; border-radius: .75rem; width: 96%; max-width: 760px; top: 50%; position: absolute; padding: 3vw 2.5vw; left: 50%; transform: translate(-50%,-50%); max-height: 97%; overflow: auto;
}
.new-address-container .address-card-edit {
	padding: 0; margin-top: 1rem;
}
.new-address-container .address-card-options {
	border: none; margin-top: 0; justify-content: left; order: inherit; margin-bottom: .5rem;
}
.account-orders-header {
	font-weight: 700; font-size: .9rem; display: grid; align-items: end; padding-top: .5rem; grid-template-columns: 1.5rem 5.5rem 10% 6rem 16% 1fr;
}
.account-orders-header > li:nth-child(1),
.account-ul-order > li:nth-child(1) {
	position: relative;
}
.account-ul-order > li:nth-child(4) {
	text-align: right;
}
.account-ul-order > li:nth-child(6) {
	display: flex; align-items: center;
}
.account-orders-header > li span {
	border-bottom: .15rem solid; display: block; margin-left: .15rem; padding: 0 .35rem .2rem;
}
.account-order-container:not(:last-child) {
	border-bottom: 1px solid var(--color-main);
}
.account-order-line {
	display: flex; position: relative;
}
.account-ul-order {
	display: grid; align-items: center; cursor: pointer; font-size: .95rem; font-weight: 500; flex-wrap: wrap; width: 100%; grid-template-columns: 1.5rem 5.5rem 10% 6rem 16% 1fr;
}
/*.open .account-ul-order {
	background-color: var(--color-light-cream);
}*/
.account-ul-order:hover {
	background-color: var(--color-light-yellow)!important;
}
.toggle-arrow::before {
	content: ""; height: 0; width: 0; display: block; border-left: .35rem solid var(--color-true-blue); border-top: .35rem solid transparent; border-bottom: .35rem solid transparent; left: 60%; position: absolute; top: 50%; transform: translate(-50%,-50%); transition: all .25s;
}
.account-ul-order > li > span {
	margin-left: .15rem; padding: 1rem .35rem 1rem; display: block;
}
.account-ul-order > li > span strong {
	font-weight: 700;
}
.account-ul-order > li > span:first-child:not(.toggle-arrow) {
	display: none;
}
.account-ul-action {
	position: absolute; height: 100%; display: flex; align-items: center; right: 1rem;
}
.account-detail-order {
	max-height: 0; overflow: hidden; transition: max-height .5s;
}
.account-detail-order .inside {
	display: flex; flex-direction: column; border-top: 1px solid #fff; padding: 0 0 0 1.95rem; font-size: .9rem; /*background-color: var(--color-light-cream);*/ border-radius: 0 0 .5rem .5rem; margin-bottom: 1rem;
}
.open .toggle-arrow::before {
	transform: translate(-50%,-50%) rotate(90deg); transition: all .25s;
}
.open .account-detail-order {
	max-height: 800px; transition: max-height .5s;
}
.account-detail-order .top {
	margin-bottom: 1rem; display: grid; grid-template-columns: 1fr 1fr minmax(12rem,1fr); gap: 1rem;
}
.account-detail-order .top > div {
	display: flex; flex-direction: column;
}
.account-detail-order .top > div:first-child {
	grid-column: span 2;
}
.account-order-container .title {
	font-weight: bold; text-transform: uppercase; margin-bottom: .35rem; font-size: .9em;
}
.account-detail-order ul {
	background-color: #fff; padding: .5rem .75rem; border-radius: .25rem; border: 1px solid #aaa; background-color: var(--color-light-yellow); flex: 1;
}
.inside-order li {
	display: grid; padding: .25rem 0; flex-wrap: wrap; grid-template-columns: 1.5rem 1fr auto auto;
}
.inside-order li span:nth-child(2) strong {
	margin-right: .25rem;
}
.inside-order li span:nth-child(3) {
	padding-right: 1rem; text-align: right;
}
.account-invoices-list {
	display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid #aaa; padding-top: .5rem; gap: .5rem 0; margin-bottom: .5rem;
}
.account-invoices-list a {
	display: flex; align-items: center; gap: .5rem; color: var(--color-main); text-decoration: none;
}
.account-invoices-list a .picto-pdf {
	width: 1.5rem; aspect-ratio: 1; position: relative;
}
.account-invoices-list a .picto-pdf:before {
	background-color: var(--color-red);
}
.no-result-message {
	display: flex; flex-direction: column; max-width: 1000px; margin: 3% auto; box-shadow: .25rem .25rem .35rem rgba(0,0,0,.25); padding: 3% 4%; gap: 1rem; background-color: var(--color-light-cream); border-radius: 1rem;
}
.help-result-message {
	background-color: #fff; padding: 1rem 1.5rem; border-radius: .5rem;
}
.help-result-message hr {
	width: 25%; margin: 1rem 0; border-color: var(--color-red);
}
.account-bottom-links {
	border-top: 1px solid #ccc; padding: 2% 0;
}
.account-bottom-links ul {
	display: flex; justify-content: center; gap: .5rem 2rem; flex-wrap: wrap;
}
.reset-password-form-section {
	display: flex; flex-direction: column; gap: 1rem;
}

/*--- VALIDATION ---*/
.box-validation {
	max-width: 1000px; width: 100%; border: 1px solid #aaa; border-radius: 1rem; padding: 3rem 5%; margin: 5% auto auto; position: relative;
}
.box-validation h1 {
	position: absolute; font-size: 1.3rem; background-color: #fff; top: 0; transform: translateY(-50%); padding: .25rem 1rem; border-radius: 2rem; border: 1px solid #aaa; left: 4%; width: 92%; max-width: 22rem; text-align: center;
}
.box-validation h2 {
	font-weight: 300; margin-bottom: 1rem; font-size: 1.6rem;
}
.box-validation h2 strong {
	font-weight: 600;
}
.box-validation ul {
	list-style: disc inside none; margin: 1rem;
}
.thanks {
	font-size: 1.2rem; font-weight: 600; margin-bottom: 1rem;
}
/*--- 404 et 500 ---*/
.error-404 .main-ordering,
.error-500 .main-ordering {
	background-image: image-set(url("../../images/stars/bkg/bkg-404-500-AYmFuZL.webp") type("image/webp"),url("../../images/stars/bkg/bkg-404-500-_DGbiZw.jpg") type("image/jpeg")); background-repeat: no-repeat; background-color: #d0d6db; background-position: center top; background-size: auto 43rem;
}
.error-404-container,
.error-500-container {
	float: right; width: 45%; height: 25rem; display: flex; flex-direction: column; padding: 1rem; justify-content: center; container-type: inline-size;
}
.btn-404,
.btn-500 {
	background-color: var(--color-true-blue); color: #fff!important; text-transform: uppercase; padding: .5rem 1rem; display: inline-block; text-decoration: none; border-radius: .25rem; margin-top: 1rem;
}
.error-404-number,
.error-500-number {
	font-family: "Barlow Condensed"; font-weight: 600; font-size: 15cqh; line-height: 1; display: inline-block; color: #000; opacity: .5;
}

@media (max-width: 1980px) {
	:root {
		--desktop-max-width: 1700px;
	}
	html {
		font-size: 17px;
	}
}
@media (max-width: 1700px) {
	html {
		font-size: 16px;
	}
}
@media (max-width: 1500px) {
	html {
		font-size: 15px;
	}
}
@media (max-width: 1350px) {
	.max-width {
		padding: 0;
	}
	.hdr-ordering > .inside {
		grid-template-columns: 1fr 142px 1fr; height: 60px; padding: 0 1vw;
	}
	.checkout-steps {
	padding: 0 6% 0 4%;
}
	.checkout-summary {
		padding: .25rem 4% 0 6%;
	}
}
@media (max-width: 850px) {
	html {
		font-size: 16px;
	}
	.hdr-ordering > .inside {
		height: 50px; grid-template-columns: 40px 124px 1fr; padding: 0 .5rem;
	}
	.hdr-guard-cnr span:last-child {
		display: none;
	}
	.hdr-hotline-cnr .picto-phone {
		display: block;
	}
	.hdr-hotline-cnr strong {
		display: none;
	}
	.hdr-hotline-cnr ul li:last-child {
		display: none;
	}
	.mask-body {
		padding: 1rem; width: calc(100% - 1rem); height: calc(100% - 1rem);
	}
	.popslide-relais {
		height: 100%;
	}
	.popslide-relais-container {
		display: flex; flex-direction: column; height: 100%; gap: 1rem;
	}
	.relay-select-container {
		flex: 1;
	}
	/*---- FORM ----*/
	.form-container {
		gap: .75rem;
	}
	.form-row {
		grid-template-columns: repeat(5,1fr) !important; gap: .75rem;
	}
	.form-col {
		grid-column: span 5 !important;
	}
	.form-col.zipcode {
		grid-column: span 2 !important;
	}
	.form-col.city {
		grid-column: span 3 !important;
	}
	.form-col.dialcode {
		grid-column: span 2 !important;
	}
	.form-col.phone {
		grid-column: span 3 !important;
	}
	.checkout-container {
		padding: 0 0 4rem;
	}
	.checkout-layout {
		display: flex; flex-direction: column;
	}
	.recap-smart-checkout-container {
		display: flex;
	}
	.checkout-steps {
		width: 100%; padding: 0; border: none;
	}
	.checkout-steps > div {
		max-width: 600px; margin: 0 auto; padding: 0 .75rem;
	}
	.checkout-step .header {
		padding-top: 1rem;
	}
	.checkout-step.is-waiting::after, .checkout-step:has(.login-account-container.is-waiting)::after {
		position: fixed;
	}
	.checkout-summary-box.col2 {
		grid-template-columns: auto; gap: 1rem;
	}
	.checkout-summary-box {
		grid-template-columns: auto; gap: .5rem; margin-bottom: .5rem;
	}
	.relay-summary-container {
		display: flex; flex-direction: column; align-items: start; gap: .5rem;
	}
	.checkout-summary {
		position: fixed; top: .25rem; width: calc(100% - .5rem); background-color: #fff; right: -100%; padding: .75rem; box-shadow: 0 0 .5rem rgba(0,0,0,.5); z-index: 99; height: calc(100% - .5rem); transition: all .5s;
	}
	.checkout-summary.open {
		right: .25rem; transition: all .5s;
	}
	.step-basket-title {
		align-items: center;
	}
	.step-basket-title .a-small {
		display: none;
	}
	.step-basket-title .btn-svg {
		height: 2rem;
	}
	.checkout-reassurance {
		scale: 1.05; font-size: .9rem; display: block!important;
	}
	.account-tabs-container {
		margin: 0;
	}
	.account-tabs-top {
		flex-direction: column;
	}
	.account-tabs-top .user-info {
		flex-direction: column; gap: .5rem;
	}
	.account-tab-nav {
		justify-content: start;
	}
	.account-tab-nav li {
		width: calc(100% / 3); max-width: 120px; display: flex;
	}
	.account-tab-nav li a {
		padding-left: 0; padding-right: 0; width: 100%;
	}
	.account-tab-content #idents,
	.account-tab-content #addresses {
		padding: 3%;
	}
	.account-ident-container {
		flex-direction: column;
	}
	.account-ident-container > div:first-child {
		padding: 1rem 0 0;
	}
	.account-ident-container > div:last-child {
		align-items: center;
	}
	.account-bottom-links {
		padding: 1rem 3rem;
	}

	.account-order-line {
		padding-left: 1.5rem; margin-bottom: .5rem;
	}
	.account-orders-header {
		display: none;
	}
	.account-ul-order {
		padding: .5rem 0 0; display: flex;
	}
	.account-ul-order:hover {
		background-color: inherit!important;
	}
	.account-ul-action {
		height: auto; bottom: 0; right: .5rem;
	}
	.account-ul-order > li:first-child {
		position: absolute; top: 16px; left: 8px; padding: 0;
	}
	.account-ul-order li {
		display: flex; flex-direction: column; gap: 0; padding: 0 1rem .5rem 0; align-items: baseline!important;
	}
	.account-ul-order > li:nth-child(6) {
		min-width: 100%; padding-bottom: 0;
	}
	.account-ul-order > li > span {
		padding: 0;
	}
	.account-ul-order > li > span:first-child:not(.toggle-arrow) {
		display: block; color: var(--color-old); font-size: .85rem;
	}
	.account-ul-order > li > span:last-child:not(.toggle-arrow) {
		font-weight: 500; 
	}
	.account-detail-order {
		padding-left: 1.5rem;
	}
	.account-detail-order .inside {
		padding: .5rem 0 0;	border-top: 1px dashed;
	}
	.account-detail-order .top {
		display: flex; flex-direction: column; gap: .5rem;
	}
	.account-detail-order .top > div:nth-child(2) {
  		order: 4;
	}
	.addresses-live-component {
		display: flex; flex-direction: column;
	}
	.address-card-container {
		flex-direction: column;
	}
	.form-account-address-actions {
		flex-direction: row; justify-content: space-between; margin-top: .5rem;
	}
	.addresses-live-component .right {
		justify-content: center; padding: .5rem 0 1rem;
	}
	.new-address-container > div,
	.add-container {
		height: 97%;
	}
	.error-404 .main-ordering, .error-500 .main-ordering {
		background-position: 40% top; background-size: auto 26rem;
	}
	.error-404-container, .error-500-container {
		margin: 18rem auto 0; width: 100%; height: 20rem; max-width: 500px; float: none;
	}
	.error-404-number, .error-500-number {
		font-size: 35cqw;
	}
}

@media (max-width: 700px) {
    .payplug-input-row {
		grid-template-columns: 1fr;
	}
}