:root {
  
  
  --rf-ink: #161a1f;
  --rf-paper: #ffffff;
  --rf-surface: #f2f4f6;
  --rf-line: #e5e8ee;
  --rf-muted: #8292a9;
  
  --rf-success: #16a34a;
  --rf-success-bg: #dff9dc;
  --rf-danger: #e53935;
  --rf-radius: 12px;
  --rf-radius-input: 6px;      
  --rf-radius-pill: 999px;
  --rf-input-bd: #cbd2dd;      
  --rf-header-h: 80px;
  --rf-split: 43vw;            
  --rf-content-max: 560px;     
  --rf-shadow-card: 0 8px 24px rgba(0, 0, 0, 0.08);
}

body {
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  font-size: 16px;
}

#loader,
#loader:before {
  border-top-color: var(--main-color, var(--rf-ink));
}

select:hover,
button:hover,
a:hover {
  outline: none;
  box-shadow: none;
}

input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
button:focus:not(:focus-visible),
a:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

input:focus:focus-visible,
select:focus:focus-visible,
textarea:focus:focus-visible,
button:focus:focus-visible,
a:focus:focus-visible,
[tabindex]:focus:focus-visible {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
  box-shadow: none;
}

.btn:focus-visible,
a.btn:focus-visible,
#cartBox a:focus-visible {
  outline-offset: 3px;
}

.promoBanner a:focus-visible,
.promoBanner button:focus-visible {
  outline-color: #ffffff;
}

input[type="text"]:focus-visible,
input[type="email"]:focus-visible,
input[type="tel"]:focus-visible,
input[type="password"]:focus-visible,
input[type="number"]:focus-visible,
textarea:focus-visible {
  outline: none;
  border-color: var(--rf-ink);
}

@media (min-width: 992px) {
  body:has(#topSection) #header,
  body:has(#topSection) main#main-content,
  body:has(#topSection) footer,
  body:has(#topSection) .footer {
    margin-left: var(--rf-split);
  }

  #topSection {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--rf-split);
    margin: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    background-size: cover !important;
    background-position: center;
  }

  #topSection .overlayBox {
    padding: 0;
    width: 100%;
  }

  
  #topSection > .overlayBox > .wrapper {
    background-color: transparent !important;
    max-width: none;
    padding: 0 56px;
  }

  #topSection .headContent {
    text-align: left;
    width: auto;
    margin: 0;
    padding: 0;
    font-size: 34px;
    line-height: 1.25;
    font-weight: 700;
  }

  #topSection .showMoreBox {
    text-align: left;
    margin-top: 16px;
  }

  
  #topSection + .mainContent {
    margin-top: 0;
  }
}

@media (max-width: 991px) {
  #topSection .overlayBox {
    padding: 24px 0;
  }

  #topSection + .mainContent {
    margin-top: 0;
  }
}

.mainContent {
  padding: 80px 0;
}

@media (max-width: 991px) {
  .mainContent {
    padding: 24px 0 48px;
  }
}

.mainContent .wrapper {
  max-width: var(--rf-content-max);
  padding: 0 24px;
}

#header {
  background-color: var(--rf-paper);
  
  position: sticky;
  top: 0;
  z-index: 20;
}

#header .wrapper {
  max-width: none;
  min-height: var(--rf-header-h);
  padding: 12px 32px; 
  justify-content: space-between;
  overflow: visible;
}

#header .logo img {
  max-height: 40px; 
}

#stepsNav {
  display: none;
}

#header .headerRight {
  display: flex;
  align-items: center;
  gap: 16px;
}

#header .languageSelector {
  margin: 0;
}

#header .languageSelector .nav {
  margin: 0;
}

#header .languageSelector .dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

#header .languageSelector #imgNavSel,
#header .languageSelector .dropdown-toggle .caret {
  display: none;
}

#header .languageSelector #lanNavSel {
  position: static;
  top: auto;
  margin: 0;
}

#header .languageSelector .langGlobe {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a13.5 13.5 0 0 1 0 18M12 3a13.5 13.5 0 0 0 0 18'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a13.5 13.5 0 0 1 0 18M12 3a13.5 13.5 0 0 0 0 18'/%3E%3C/svg%3E") no-repeat center / contain;
}

#header .languageSelector .languages.open > .dropdown-menu {
  display: block;
}

#header .languageSelector .dropdown-menu {
  left: auto;
  right: 0;
  min-width: 180px;
  margin-top: 8px;
  padding: 8px;
  background-color: var(--rf-paper);
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  box-shadow: var(--rf-shadow-card);
}

#header .languageSelector .dropdown-menu .language {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 4px;
  font-size: 14px;
  color: var(--rf-ink);
  text-decoration: none;
}

#header .languageSelector .dropdown-menu .language:hover,
#header .languageSelector .dropdown-menu .language:focus {
  background-color: var(--rf-surface);
}

#header .languageSelector .dropdown-menu .language.active {
  font-weight: 600;
}

#header .languageSelector .dropdown-menu .language > span {
  position: static;
  top: auto;
  margin: 0;
}

.cookie-acceptance-container.cookieCard {
  position: fixed;
  bottom: 24px;
  left: 24px;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 16px;
  width: min(432px, calc(100vw - 48px));
  padding: 24px;
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  border-radius: var(--rf-radius-input);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
}

.cookie-acceptance-container.cookieCard .cookieSkip {
  align-self: flex-start;
  padding: 0;
  border: none;
  background: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.cookie-acceptance-container.cookieCard .cookieTitle {
  margin: 0;
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  color: var(--rf-ink);
}

.cookie-acceptance-container.cookieCard .cookieText {
  flex: none;
  font-size: 14px;
  line-height: 20px;
  color: #4b5563;
}

.cookie-acceptance-container.cookieCard .cookieText p {
  margin: 0 0 8px;
}

.cookie-acceptance-container.cookieCard .cookieText a {
  color: inherit;
  text-decoration: underline;
}

.cookie-acceptance-container.cookieCard .cookieActions {
  display: flex;
  gap: 12px;
}

.cookie-acceptance-container.cookieCard .cookieActions .btn {
  flex: 1;
  margin: 0;
  min-height: 44px;
  padding: 10px 16px;
  font-size: 14px;
  border-radius: var(--rf-radius-input);
}

.cookie-acceptance-container.cookieCard .cookieActions .btn.buyOther {
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  border: 1.5px solid var(--rf-ink);
}

.promoBanner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 64px; 
  padding: 12px 32px;
  background-color: var(--main-color, var(--rf-ink));
  color: #fff;
  font-size: 18px; 
  text-align: left;
}

.promoBanner .promoBannerText p {
  margin: 0;
}

.promoBanner a {
  color: inherit;
  text-decoration: underline;
}

.promoBannerClose {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; 
  height: 32px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 22px;
  line-height: 1;
  color: inherit;
  cursor: pointer;
}

#cartBox {
  margin: 0;
  padding: 0;
  background-color: transparent;
}

#cartBox a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
  min-height: 0;
  padding: 5px 5px 5px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--rf-paper);
  background-color: var(--rf-ink);
  border: 1px solid var(--rf-ink);
  border-radius: var(--rf-radius-pill);
}

#cartBox a:hover {
  text-decoration: none;
  background-color: #000000;
  border-color: #000000;
}

#cartBox .icon-panier {
  display: none;
}

#cartBox a .countPanier {
  position: static;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  line-height: 1;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 600;
  color: var(--rf-ink);
  background-color: var(--rf-paper);
}

body #cartBox a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--rf-paper);
  background-color: var(--rf-ink);
}

body #cartBox a .countPanier {
  width: 24px;
  height: 24px;
  color: var(--rf-ink) !important;
  background-color: var(--second-color, var(--rf-paper));
}

.btn,
a.btn,
.btn.defaultBtn,
.btn.sendOrder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background-color: var(--rf-ink);
  color: var(--rf-paper);
  border: 1px solid var(--rf-ink);
  border-radius: var(--rf-radius-pill);
  min-height: 48px;
  line-height: 1.2;
  padding: 12px 28px;
  font-size: 16px;
  font-weight: 600;
  box-shadow: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease,
    color 0.15s ease, opacity 0.15s ease;
}

.btn:hover,
a.btn:hover,
.btn.sendOrder:hover {
  background-color: #000000;
  border-color: #000000;
  color: var(--rf-paper);
}

.btn.buyOther,
a.returnToHome,
.btnsArea .buyCard,
.btn.btnOutline {
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  border: 1.5px solid var(--rf-ink); 
  border-radius: var(--rf-radius-pill);
  box-shadow: none !important;
}

.btn.buyOther:hover,
a.returnToHome:hover,
.btnsArea .buyCard:hover,
.btn.btnOutline:hover {
  background-color: var(--rf-surface);
  color: var(--rf-ink);
  border-color: var(--rf-ink);
}

.btn:disabled,
.btn.disabled,
a.btn.disabled {
  
  background-color: #e5e8ee;
  border-color: #e5e8ee;
  color: #b1bccd;
  cursor: not-allowed;
}

.btn.btnOutline:disabled,
.btn.btnOutline.disabled {
  background-color: var(--rf-paper);
  border-color: var(--rf-line);
  color: #b1bccd;
  cursor: not-allowed;
}

.btn.isLoading,
a.btn.isLoading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}

.btn.isLoading::after,
a.btn.isLoading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: rf-spin 0.7s linear infinite;
}

.btn.btnOutline.isLoading::after,
.btn.buyOther.isLoading::after {
  border-color: rgba(35, 35, 35, 0.2);
  border-top-color: var(--rf-ink);
}

@keyframes rf-spin {
  to {
    transform: rotate(360deg);
  }
}

.montant,
.montant.manual {
  position: static;
  top: auto;
  bottom: auto;
  overflow: visible;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 16px; 
  padding: 0;
}

.montantItem {
  margin: 0;
  flex: 1 1 0;
  min-width: 96px;
  display: flex;
}

.montantItem input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  visibility: visible;
}

.montantItem input:focus-visible + .montantValue {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.montantValue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  min-height: 48px;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-pill);
  background-color: var(--rf-paper);
  
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  color: #4b5563;
  text-align: center;
}

.montantValue.x-small,
.montantValue.small,
.montantValue.medium {
  font-size: 18px;
}

.montantItem:has(input[value="custom"]) .montantValue {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: #4b5563;
}

.montantValue:hover {
  border-color: var(--rf-ink);
}

input:checked + .montantValue {
  border-width: 2px;
  border-color: var(--rf-ink);
  
  background-color: var(--rf-surface);
  color: var(--rf-ink);
  padding: 5px 9px; 
}

.montant .montantItem:has(.custommontant) {
  flex: 2 1 220px;
}

.montantItem .custommontant {
  padding: 5px 9px;
  border-width: 2px;
  border-color: var(--rf-ink);
  
  background-color: var(--rf-surface) !important;
  color: var(--rf-ink) !important;
}

.montantItem .custommontant input {
  
  position: static;
  width: 100%;
  height: auto;
  opacity: 1;
  min-width: 0;
  caret-color: var(--rf-ink);
  border: 0 !important;
  border-radius: 0;
  padding: 0;
  background: none;
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  color: var(--rf-ink);
  outline: none;
  appearance: textfield;
  -moz-appearance: textfield;
}

.montantItem .custommontant input::-webkit-outer-spin-button,
.montantItem .custommontant input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.montantItem .custommontant input::placeholder {
  font-size: 12px;
  font-weight: 400;
  color: var(--rf-muted);
}

.montant .field-error {
  flex-basis: 100%;
}

.formBox input[type="text"],
.formBox input[type="email"],
.formBox input[type="number"],
.formBox input[type="tel"],
.formBox select,
.formBox textarea,
.formBox2 input[type="text"],
.formBox2 input[type="email"],
.formBox2 input[type="number"],
.formBox2 input[type="tel"],
.formBox2 select,
.formBox2 textarea {
  border: 1px solid var(--rf-input-bd); 
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  padding: 12px 16px;
  font-size: 16px; 
  color: var(--rf-ink);
}

.formBox input[type="text"],
.formBox input[type="email"],
.formBox input[type="number"],
.formBox input[type="tel"],
.formBox select,
.formBox2 input[type="text"],
.formBox2 input[type="email"],
.formBox2 input[type="number"],
.formBox2 input[type="tel"],
.formBox2 select {
  height: 55px;
}

.step1Form .fieldsGroup .formField {
  margin: 0 0 16px;
}

.formBox input:focus,
.formBox select:focus,
.formBox textarea:focus,
.formBox2 input:focus,
.formBox2 select:focus,
.formBox2 textarea:focus {
  outline: none;
  border-color: var(--rf-ink);
}

.infoContentContainer {
  display: none;
}

.cartDrawerOverlay {
  position: fixed;
  inset: 0;
  z-index: 1050;
  background-color: rgba(22, 26, 31, 0.75); 
  display: flex;
  justify-content: flex-end;
}

.cartDrawer {
  display: flex;
  flex-direction: column;
  width: 512px; 
  max-width: 100%;
  height: calc(100% - 48px);
  margin: 24px 24px 24px 0;
  background-color: var(--rf-paper);
  border-radius: 16px;
  box-shadow: var(--rf-shadow-card);
  overflow: hidden;
  animation: rf-drawer-in 0.3s ease-out;
}

@keyframes rf-drawer-in {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

.cartDrawerHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 80px; 
  padding: 16px 24px;
  border-bottom: 1px solid var(--rf-line);
  flex-shrink: 0;
}

.cartDrawerHead h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}

.cartDrawerClose {
  background: none;
  border: none;
  padding: 0;
  width: 32px;
  height: 32px;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  color: #4b5563; 
}

.cartDrawerBody {
  flex: 1;
  
  min-height: 0;
  overflow-y: auto;
  background-color: var(--rf-surface);
  
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cartDrawer .emtyCart {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 24px;
  text-align: center;
}

.cartDrawer .emtyCart .emtyCartHead .icon-panier {
  font-size: 34px;
  color: var(--rf-ink);
}

.cartDrawer .emtyCart p {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
}

.cartDrawer .emtyCart .btn {
  width: 100%;
  max-width: 360px;
}

.cartDrawer .cartItem2 {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin: 0;
  padding: 24px;
  background-color: var(--rf-paper);
  border-bottom: 0;
  flex-shrink: 0; 
}

.cartDrawer .cartItem2 .itemPreviewBox {
  position: relative;
  width: 72px;
  height: 114px;
  flex-shrink: 0;
}

.cartDrawer .cartItem2 .itemPreview {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 114px;
  height: auto;
  transform: translate(-50%, -50%) rotate(90deg);
  border-radius: 6px;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.18));
}

.cartDrawer .cartItem2 .itemData {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  
  margin-left: 0;
  max-width: none;
}

.cartDrawer .cartItem2 .iSender {
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cartDrawer .cartItem2 .iSender.typoBold {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
}

.cartDrawer .cartItem2 .cardComment {
  font-size: 14px;
  font-weight: 600; 
  color: var(--rf-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cartDrawer .sendBadge {
  align-self: flex-start;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: var(--main-color, var(--rf-success));
  background-color: var(--rf-surface);
  background-color: color-mix(in srgb, var(--main-color, var(--rf-success)) 12%, white);
}

.cartDrawer .cartItem2 .itemSide {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  align-self: stretch;
  gap: 10px;
  flex-shrink: 0;
}

.cartDrawer .cartItem2 .deleteItem {
  
  position: static;
  margin: 0;
  width: 40px; 
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 4px;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  color: var(--rf-paper);
  background-color: #f54b4b;
}

.cartDrawer .cartItem2 .iPrice {
  font-size: 24px; 
  font-weight: 500;
}

.cartDrawerTotals {
  flex-shrink: 0;
  padding: 24px; 
  background-color: var(--rf-paper);
  border-top: 1px solid var(--rf-line);
}

.cartDrawer.myCart {
  float: none;
  
  display: flex;
  flex-direction: column;
}

.cartDrawerTotals.cartTotal {
  float: none;
  display: block;
  width: auto;
}

.cartDrawerTotals .totalRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 16px;
}

.cartDrawerTotals .totalRow > span:last-child {
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
}

.cartDrawerTotals .subTotal {
  
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-muted);
  border-bottom: 1px solid var(--rf-line);
}

.cartDrawerTotals .grandTotal {
  
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  border-top: 1px solid var(--rf-line);
  margin-top: 12px;
}

.cartDrawerTotals .grandTotal > span:last-child {
  font-weight: 600;
}

.promoBox {
  padding: 12px 0 0;
}

.promoBox .promoRow {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

.promoBox .promoField {
  position: relative;
  flex: 1;
  min-width: 0;
}

.promoBox .promoRow input {
  width: 100%;
  min-width: 0;
  height: 55px; 
  border: 1.5px solid var(--rf-input-bd);
  border-radius: var(--rf-radius-input);
  padding: 12px 16px;
  font-size: 15px;
}

.promoBox .promoField .flLabel {
  position: absolute;
  top: 5px;
  left: 17px;
  font-size: 12px;
  line-height: 16px;
  color: var(--rf-muted);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.promoBox .promoField input:not(:placeholder-shown) ~ .flLabel {
  opacity: 1;
}

.promoBox .promoField:has(> input:not(:placeholder-shown)) > input {
  padding-top: 18px;
  padding-bottom: 4px;
}

.promoBox .promoRow input:focus {
  outline: none;
  border-color: var(--rf-ink);
}

.promoBox .promoRow .btn {
  flex: 0 0 auto;
  width: auto;
  border-radius: var(--rf-radius-input); 
  border-width: 1.5px;
}

.promoBox .promoToggle {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  border: 0;
  background: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
  cursor: pointer;
}

.promoBox .promoTogglePlus {
  font-size: 20px;
  line-height: 1;
}

.promoBox .promoToggle[aria-expanded="true"] {
  width: 100%;
  justify-content: space-between;
}

.promoBox .field-error {
  margin-top: 8px;
  font-size: 13px;
  color: var(--rf-danger);
}

.cartDrawer .discountRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  padding: 12px 16px;
  border-radius: 6px;
  color: var(--rf-success);
  background-color: var(--rf-success-bg);
}

.cartDrawerFooter {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px; 
  padding: 24px;
}

.cartDrawerFooter .btn {
  width: 100%;
}

@media (max-width: 767px) {
  .cartDrawer {
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 0;
  }
}

.step1Form {
  display: flex;
  flex-direction: column;
  row-gap: 0;
  column-gap: 0;
}

.step1Form .cardSection {
  width: auto;
  padding: 0;
}

.step1Form .cardInfoSection {
  width: auto;
  padding: 0;
  margin-bottom: 0;
}

.step1Form .mainCol {
  min-height: 0;
}

.step1Form .cardPart {
  padding-bottom: 40px; 
  border-bottom: 1px solid var(--rf-line);
  margin-bottom: 40px;
}

.cardPreview {
  width: 100%;
  margin: 0 auto;
  text-align: left; 
}

.cardPreview img {
  max-width: 400px;
  border-radius: 16px; 
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
}

.step1Form .cardPart,
.step1Form .cardPart .cardBox,
.step1Form .cardPart .slick-slide,
.step1Form .cardPreview .cardBox,
.step1Form .cardPreview .slick-slide {
  background-image: none !important;
}

.topBox {
  box-shadow: none !important;
  background-color: transparent;
  border-radius: 0;
}

.step1Form .rfAccroche {
  margin: 8px 0 40px; 
  text-align: left;
  
  color: var(--rf-ink);
}

.step1Form .rfAccroche h2 {
  margin: 0 0 16px;
  font-size: 32px;
  line-height: 40px;
  font-weight: 700;
}

.step1Form .rfAccroche p {
  margin: 0 0 4px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
}

.step1Form .cardLabel {
  display: none;
}

.cardThumbnails {
  justify-content: center;
  gap: 10px;
  margin: 20px 0 8px;
  background-color: transparent;
}

.cardThumbnails img {
  width: 104px;
  height: 64px;
  border-radius: 8px;
}

.whiteBox,
.mainWhiteBox {
  background-color: transparent;
  border-radius: 0;
  min-height: 0;
  padding-top: 0;
  color: var(--rf-ink);
  box-shadow: none !important;
}

.fieldsGroupHead,
.step1Form .fieldsGroupHead,
.step1Form h2.fieldsGroupHead {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  margin: 0 0 8px; 
  color: var(--rf-ink);
  text-align: left;
}

.step1Form .formBox .blockOptions.customCheckbox {
  position: relative;
  display: inline-flex;
  align-items: center;
  vertical-align: top;
  width: calc(50% - 8px);
  min-height: 64px; 
  margin: 0 0 16px;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  padding: 15px 16px;
  text-align: left;
}

.step1Form .formBox .blockOptions.customCheckbox:has(#selfDestination) {
  margin-right: 16px; 
}

.step1Form .formBox .blockOptions.customCheckbox:has(input:checked) {
  border: 2px solid var(--rf-ink);
  padding: 14px 15px;
}

.step1Form .blockOptions.customCheckbox .optionItem {
  margin: 0;
}

.step1Form .blockOptions.customCheckbox .checkboxRadio {
  position: static;
}

.step1Form .customCheckbox .checkboxRadio input[type="checkbox"] {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.step1Form .customCheckbox .checkboxRadio label {
  width: auto;
  padding: 0 !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
}

.step1Form .customCheckbox .checkboxRadio label:before {
  display: none;
}

.step1Form .customCheckbox .checkboxRadio input[type="checkbox"]:checked + label:not([for="emailDestination"]):not([for="selfDestination"])::before {
  display: none;
}

.step1Form .formBox .blockOptions.customCheckbox.rf-untouched:has(input:checked) {
  border: 1px solid var(--rf-line);
  padding: 15px 16px;
}

.step1Form .blockOptions.customCheckbox:has(input:focus-visible) {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step1Form .customCheckbox .checkboxRadio label[for="emailDestination"],
.step1Form .customCheckbox .checkboxRadio label[for="selfDestination"] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start; 
  gap: 12px;
}

.step1Form .customCheckbox .checkboxRadio label[for="emailDestination"]::before,
.step1Form .customCheckbox .checkboxRadio label[for="selfDestination"]::before {
  content: "";
  display: inline-block;
  position: static;
  flex: 0 0 auto;
  width: 32px; 
  height: 32px;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  
  border-radius: 0 !important;
  box-shadow: none;
}

.step1Form .customCheckbox .checkboxRadio label[for="emailDestination"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M5.46653 25.9761C4.89342 25.9761 4.40253 25.7717 3.99386 25.3631C3.58519 24.9544 3.38086 24.4635 3.38086 23.8904V8.06174C3.38086 7.48863 3.58519 6.99774 3.99386 6.58907C4.40253 6.18041 4.89342 5.97607 5.46653 5.97607H26.6285C27.2016 5.97607 27.6925 6.18041 28.1012 6.58907C28.5099 6.99774 28.7142 7.48863 28.7142 8.06174V23.8904C28.7142 24.4635 28.5099 24.9544 28.1012 25.3631C27.6925 25.7717 27.2016 25.9761 26.6285 25.9761H5.46653ZM27.0389 9.16407L16.6192 15.9871C16.5259 16.0362 16.4336 16.0774 16.3425 16.1107C16.2512 16.1441 16.1529 16.1607 16.0475 16.1607C15.9422 16.1607 15.8439 16.1441 15.7525 16.1107C15.6614 16.0774 15.572 16.0362 15.4842 15.9871L5.05619 9.16407V23.8904C5.05619 24.0102 5.09464 24.1085 5.17153 24.1854C5.24842 24.2623 5.34675 24.3007 5.46653 24.3007H26.6285C26.7483 24.3007 26.8466 24.2623 26.9235 24.1854C27.0004 24.1085 27.0389 24.0102 27.0389 23.8904V9.16407ZM16.0475 14.6067L26.7705 7.65141H5.34653L16.0475 14.6067ZM5.05619 9.43074V8.22441V8.26008V7.65141V8.24874V8.20574V9.43074Z' fill='%23161A1F'/%3E%3C/svg%3E");
}

.step1Form .customCheckbox .checkboxRadio label[for="selfDestination"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M18.6077 27.9959C18.6504 28.013 18.6903 28.0216 18.7274 28.0216C18.7645 28.0216 18.8015 28.013 18.8384 27.9959L26.8444 25.5046C26.8331 25.0788 26.6875 24.7452 26.4077 24.5039C26.128 24.2626 25.8035 24.1465 25.4344 24.1556H18.7917C18.3329 24.1705 17.9023 24.1497 17.5001 24.0932C17.0979 24.0368 16.6942 23.938 16.2891 23.7969L14.0481 23.0986C13.8232 23.0237 13.656 22.8742 13.5464 22.6502C13.4369 22.426 13.4203 22.2021 13.4967 21.9786C13.573 21.7548 13.7156 21.5907 13.9247 21.4862C14.1336 21.3816 14.3553 21.372 14.5897 21.4576L16.6837 22.1779C17.0211 22.2915 17.3852 22.3706 17.7761 22.4152C18.167 22.4599 18.6185 22.4817 19.1307 22.4806H20.2224C20.2224 22.0423 20.1053 21.6742 19.8711 21.3762C19.6369 21.0782 19.3425 20.8617 18.9881 20.7266L11.5137 17.9352C11.4824 17.9268 11.4575 17.9203 11.4391 17.9159C11.4204 17.9117 11.3983 17.9096 11.3727 17.9096H8.58107V25.0702L18.6077 27.9959ZM18.2224 29.6162L8.58107 26.8259C8.49507 27.3928 8.23385 27.8373 7.79741 28.1596C7.36096 28.4818 6.92707 28.6429 6.49574 28.6429H4.40174C3.83263 28.6429 3.34285 28.4376 2.93241 28.0269C2.52174 27.6162 2.31641 27.1263 2.31641 26.5572V18.3199C2.31641 17.7463 2.52174 17.2553 2.93241 16.8469C3.34285 16.4387 3.83263 16.2346 4.40174 16.2346H11.3357C11.4622 16.2346 11.5863 16.2477 11.7081 16.2739C11.8299 16.3001 11.9477 16.3309 12.0617 16.3662L19.5557 19.1506C20.26 19.4168 20.8332 19.834 21.2754 20.4022C21.7174 20.9707 21.9384 21.6635 21.9384 22.4806H25.4344C26.4015 22.4806 27.1899 22.812 27.7994 23.4749C28.409 24.138 28.7137 24.9461 28.7137 25.8992C28.7137 26.1597 28.6467 26.385 28.5127 26.5752C28.379 26.7657 28.1847 26.9028 27.9301 26.9866L19.4164 29.6096C19.2286 29.6631 19.0313 29.692 18.8244 29.6962C18.6173 29.7005 18.4166 29.6738 18.2224 29.6162ZM3.99141 26.5572C3.99141 26.677 4.02996 26.7753 4.10707 26.8522C4.18396 26.9291 4.28218 26.9676 4.40174 26.9676H6.47341C6.59318 26.9676 6.69152 26.9356 6.76841 26.8716C6.8453 26.8073 6.88374 26.7026 6.88374 26.5572V17.9096H4.40174C4.28218 17.9096 4.18396 17.948 4.10707 18.0249C4.02996 18.1018 3.99141 18.2001 3.99141 18.3199V26.5572ZM20.5137 15.6712C20.2611 15.5708 20.0317 15.4277 19.8257 15.2419L16.0247 11.5686C15.4072 10.9772 14.8879 10.3189 14.4667 9.59357C14.0456 8.86846 13.8351 8.07868 13.8351 7.22424C13.8351 6.14801 14.2016 5.22646 14.9347 4.45957C15.6681 3.6929 16.5687 3.30957 17.6367 3.30957C18.3747 3.30957 19.0499 3.50413 19.6621 3.89324C20.2743 4.28257 20.8117 4.76213 21.2744 5.3319C21.7371 4.76213 22.2731 4.28257 22.8824 3.89324C23.492 3.50413 24.1685 3.30957 24.9121 3.30957C25.9801 3.30957 26.8807 3.6929 27.6141 4.45957C28.3472 5.22646 28.7137 6.14801 28.7137 7.22424C28.7137 8.07713 28.5017 8.86568 28.0777 9.5899C27.6535 10.3139 27.1351 10.9735 26.5224 11.5686L22.7231 15.2419C22.5113 15.4277 22.2824 15.5708 22.0364 15.6712C21.7906 15.7715 21.5385 15.8216 21.2801 15.8216C21.0216 15.8216 20.7662 15.7715 20.5137 15.6712ZM21.5564 14.0576L25.2661 10.4306C25.723 9.98635 26.1326 9.50179 26.4951 8.9769C26.8573 8.45202 27.0384 7.86779 27.0384 7.22424C27.0384 6.60935 26.8355 6.08235 26.4297 5.64324C26.0237 5.20435 25.5179 4.9849 24.9121 4.9849C24.4214 4.9849 23.9766 5.12446 23.5777 5.40357C23.1789 5.6829 22.8242 6.02024 22.5137 6.41557L22.0394 7.00157C21.849 7.24335 21.5966 7.36424 21.2824 7.36424C20.9682 7.36424 20.7097 7.24335 20.5071 7.00157L20.0267 6.41557C19.7219 6.02024 19.37 5.6829 18.9711 5.40357C18.5722 5.12446 18.1274 4.9849 17.6367 4.9849C17.031 4.9849 16.5251 5.20435 16.1191 5.64324C15.7133 6.08235 15.5104 6.60935 15.5104 7.22424C15.5104 7.86779 15.6902 8.45202 16.0497 8.9769C16.4091 9.50179 16.821 9.98735 17.2854 10.4336L20.9924 14.0576C21.0693 14.1345 21.1633 14.1729 21.2744 14.1729C21.3855 14.1729 21.4795 14.1345 21.5564 14.0576Z' fill='%23161A1F'/%3E%3C/svg%3E");
}

.step1Form .textareainfo {
  float: none;
  width: 100% !important;
  border: 1px solid var(--rf-input-bd);
  border-radius: var(--rf-radius-input);
  padding: 12px 14px !important;
  font-size: 15px;
  color: var(--rf-ink);
  resize: vertical;
}

.step1Form .textareainfo:focus {
  outline: none;
  border-color: var(--rf-ink);
}

.limitCardMsg {
  margin-top: 4px;
  font-size: 12px;
  font-style: normal;
  color: var(--rf-muted);
}

.step1Form .sendDateField {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 55px; 
  padding: 6px 16px;
  border: 1px solid var(--rf-input-bd);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  text-align: left;
  cursor: pointer;
}

.step1Form .sendDateField::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4.66675 22C4.21675 22 3.82642 21.8348 3.49575 21.5043C3.16525 21.1736 3 20.7833 3 20.3333V5.33325C3 4.88325 3.16525 4.493 3.49575 4.1625C3.82642 3.832 4.21675 3.66675 4.66675 3.66675H6.08325V2.86675C6.08325 2.62108 6.16525 2.41525 6.32925 2.24925C6.49308 2.08308 6.70008 2 6.95025 2C7.20042 2 7.41017 2.08308 7.5795 2.24925C7.74867 2.41525 7.83325 2.62108 7.83325 2.86675V3.66675H16.1668V2.86675C16.1668 2.62108 16.2487 2.41525 16.4125 2.24925C16.5763 2.08308 16.7834 2 17.0338 2C17.2839 2 17.4936 2.08308 17.6628 2.24925C17.8321 2.41525 17.9168 2.62108 17.9168 2.86675V3.66675H19.3333C19.7833 3.66675 20.1736 3.832 20.5043 4.1625C20.8348 4.493 21 4.88325 21 5.33325V20.3333C21 20.7833 20.8348 21.1736 20.5043 21.5043C20.1736 21.8348 19.7833 22 19.3333 22H4.66675ZM4.66675 20.3333H19.3333V9.83325H4.66675V20.3333ZM4.66675 8.16675H19.3333V5.33325H4.66675V8.16675ZM12 14C11.7167 14 11.4792 13.9042 11.2875 13.7125C11.0958 13.5208 11 13.2833 11 13C11 12.7167 11.0958 12.4792 11.2875 12.2875C11.4792 12.0958 11.7167 12 12 12C12.2833 12 12.5208 12.0958 12.7125 12.2875C12.9042 12.4792 13 12.7167 13 13C13 13.2833 12.9042 13.5208 12.7125 13.7125C12.5208 13.9042 12.2833 14 12 14ZM7.2875 13.7125C7.09583 13.5208 7 13.2833 7 13C7 12.7167 7.09583 12.4792 7.2875 12.2875C7.47917 12.0958 7.71667 12 8 12C8.28333 12 8.52083 12.0958 8.7125 12.2875C8.90417 12.4792 9 12.7167 9 13C9 13.2833 8.90417 13.5208 8.7125 13.7125C8.52083 13.9042 8.28333 14 8 14C7.71667 14 7.47917 13.9042 7.2875 13.7125ZM16 14C15.7167 14 15.4792 13.9042 15.2875 13.7125C15.0958 13.5208 15 13.2833 15 13C15 12.7167 15.0958 12.4792 15.2875 12.2875C15.4792 12.0958 15.7167 12 16 12C16.2833 12 16.5208 12.0958 16.7125 12.2875C16.9042 12.4792 17 12.7167 17 13C17 13.2833 16.9042 13.5208 16.7125 13.7125C16.5208 13.9042 16.2833 14 16 14ZM12 18C11.7167 18 11.4792 17.9042 11.2875 17.7125C11.0958 17.5208 11 17.2833 11 17C11 16.7167 11.0958 16.4792 11.2875 16.2875C11.4792 16.0958 11.7167 16 12 16C12.2833 16 12.5208 16.0958 12.7125 16.2875C12.9042 16.4792 13 16.7167 13 17C13 17.2833 12.9042 17.5208 12.7125 17.7125C12.5208 17.9042 12.2833 18 12 18ZM7.2875 17.7125C7.09583 17.5208 7 17.2833 7 17C7 16.7167 7.09583 16.4792 7.2875 16.2875C7.47917 16.0958 7.71667 16 8 16C8.28333 16 8.52083 16.0958 8.7125 16.2875C8.90417 16.4792 9 16.7167 9 17C9 17.2833 8.90417 17.5208 8.7125 17.7125C8.52083 17.9042 8.28333 18 8 18C7.71667 18 7.47917 17.9042 7.2875 17.7125ZM16 18C15.7167 18 15.4792 17.9042 15.2875 17.7125C15.0958 17.5208 15 17.2833 15 17C15 16.7167 15.0958 16.4792 15.2875 16.2875C15.4792 16.0958 15.7167 16 16 16C16.2833 16 16.5208 16.0958 16.7125 16.2875C16.9042 16.4792 17 16.7167 17 17C17 17.2833 16.9042 17.5208 16.7125 17.7125C16.5208 17.9042 16.2833 18 16 18Z' fill='%23161A1F'/%3E%3C/svg%3E") no-repeat center / contain;
}

.step1Form .sendDateField:hover {
  border-color: var(--rf-ink);
}

.step1Form .sendDateField::before {
  align-self: stretch;
  width: 40px;
  height: auto;
  border-right: 1px solid var(--rf-line);
  background-position: left center;
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.step1Form .sendDateField:focus-visible {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step1Form .sendDateMeta {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.step1Form .sendDateLabel {
  font-size: 12px;
  color: var(--rf-muted);
}

.step1Form .sendDateValue {
  font-size: 14px; 
  font-weight: 600;
}

.dateModalOverlay {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background-color: rgba(0, 0, 0, 0.5); 
}

.dateModal {
  width: 100%;
  max-width: 432px; 
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 24px;
  border-radius: var(--rf-radius);
  background-color: var(--rf-paper);
  color: var(--rf-ink);
}

.dateModalHead {
  display: flex;
  justify-content: flex-end;
}

.dateModalClose {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 26px;
  line-height: 1;
  color: #4b5563; 
  cursor: pointer;
}

.dateModalBody {
  margin-bottom: 16px;
}

.dateModalImmediate {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 auto 16px;
  padding: 4px;
  border: 0;
  background: none;
  font-size: 16px; 
  font-weight: 600;
  color: var(--rf-ink);
  cursor: pointer;
}

.dateModalImmediate::before {
  content: "";
  flex: 0 0 auto;
  width: 24px; 
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4.66675 22C4.21675 22 3.82642 21.8348 3.49575 21.5043C3.16525 21.1736 3 20.7833 3 20.3333V5.33325C3 4.88325 3.16525 4.493 3.49575 4.1625C3.82642 3.832 4.21675 3.66675 4.66675 3.66675H6.08325V2.86675C6.08325 2.62108 6.16525 2.41525 6.32925 2.24925C6.49308 2.08308 6.70008 2 6.95025 2C7.20042 2 7.41017 2.08308 7.5795 2.24925C7.74867 2.41525 7.83325 2.62108 7.83325 2.86675V3.66675H16.1668V2.86675C16.1668 2.62108 16.2487 2.41525 16.4125 2.24925C16.5763 2.08308 16.7834 2 17.0338 2C17.2839 2 17.4936 2.08308 17.6628 2.24925C17.8321 2.41525 17.9168 2.62108 17.9168 2.86675V3.66675H19.3333C19.7833 3.66675 20.1736 3.832 20.5043 4.1625C20.8348 4.493 21 4.88325 21 5.33325V20.3333C21 20.7833 20.8348 21.1736 20.5043 21.5043C20.1736 21.8348 19.7833 22 19.3333 22H4.66675ZM4.66675 20.3333H19.3333V9.83325H4.66675V20.3333ZM4.66675 8.16675H19.3333V5.33325H4.66675V8.16675ZM12 14C11.7167 14 11.4792 13.9042 11.2875 13.7125C11.0958 13.5208 11 13.2833 11 13C11 12.7167 11.0958 12.4792 11.2875 12.2875C11.4792 12.0958 11.7167 12 12 12C12.2833 12 12.5208 12.0958 12.7125 12.2875C12.9042 12.4792 13 12.7167 13 13C13 13.2833 12.9042 13.5208 12.7125 13.7125C12.5208 13.9042 12.2833 14 12 14ZM7.2875 13.7125C7.09583 13.5208 7 13.2833 7 13C7 12.7167 7.09583 12.4792 7.2875 12.2875C7.47917 12.0958 7.71667 12 8 12C8.28333 12 8.52083 12.0958 8.7125 12.2875C8.90417 12.4792 9 12.7167 9 13C9 13.2833 8.90417 13.5208 8.7125 13.7125C8.52083 13.9042 8.28333 14 8 14C7.71667 14 7.47917 13.9042 7.2875 13.7125ZM16 14C15.7167 14 15.4792 13.9042 15.2875 13.7125C15.0958 13.5208 15 13.2833 15 13C15 12.7167 15.0958 12.4792 15.2875 12.2875C15.4792 12.0958 15.7167 12 16 12C16.2833 12 16.5208 12.0958 16.7125 12.2875C16.9042 12.4792 17 12.7167 17 13C17 13.2833 16.9042 13.5208 16.7125 13.7125C16.5208 13.9042 16.2833 14 16 14ZM12 18C11.7167 18 11.4792 17.9042 11.2875 17.7125C11.0958 17.5208 11 17.2833 11 17C11 16.7167 11.0958 16.4792 11.2875 16.2875C11.4792 16.0958 11.7167 16 12 16C12.2833 16 12.5208 16.0958 12.7125 16.2875C12.9042 16.4792 13 16.7167 13 17C13 17.2833 12.9042 17.5208 12.7125 17.7125C12.5208 17.9042 12.2833 18 12 18ZM7.2875 17.7125C7.09583 17.5208 7 17.2833 7 17C7 16.7167 7.09583 16.4792 7.2875 16.2875C7.47917 16.0958 7.71667 16 8 16C8.28333 16 8.52083 16.0958 8.7125 16.2875C8.90417 16.4792 9 16.7167 9 17C9 17.2833 8.90417 17.5208 8.7125 17.7125C8.52083 17.9042 8.28333 18 8 18C7.71667 18 7.47917 17.9042 7.2875 17.7125ZM16 18C15.7167 18 15.4792 17.9042 15.2875 17.7125C15.0958 17.5208 15 17.2833 15 17C15 16.7167 15.0958 16.4792 15.2875 16.2875C15.4792 16.0958 15.7167 16 16 16C16.2833 16 16.5208 16.0958 16.7125 16.2875C16.9042 16.4792 17 16.7167 17 17C17 17.2833 16.9042 17.5208 16.7125 17.7125C16.5208 17.9042 16.2833 18 16 18Z' fill='%23161A1F'/%3E%3C/svg%3E") no-repeat center / contain;
}

.dateModalImmediate:hover {
  text-decoration: underline;
}

.dateModal .dateModalConfirm {
  width: 100%;
}

.dateModalFields {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
}

.dateModalFieldGroup {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 0;
}

.dateModalFieldGroup:last-child {
  flex: 0 0 120px; 
}

.dateModalFieldGroup label {
  font-size: 12px;
  color: var(--rf-muted);
}

.dateModalDateInput,
.dateModalTimeSelect {
  width: 100%;
  height: 40px; 
  padding: 0 12px;
  border: 1.5px solid var(--rf-input-bd);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  font-size: 14px;
  color: var(--rf-ink);
}

.dateModalTimeSelect {
  cursor: pointer;
}

.timeListbox {
  position: relative;
}

.timeListboxToggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  text-align: left;
}

.timeListboxToggle::after {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-right: 1.5px solid var(--rf-ink);
  border-bottom: 1.5px solid var(--rf-ink);
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.15s ease;
}

.timeListboxToggle[aria-expanded="true"]::after {
  transform: rotate(-135deg) translateY(-2px);
}

.timeListboxList {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 10;
  max-height: 208px;
  overflow-y: auto;
  margin: 0;
  padding: 4px;
  list-style: none;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  box-shadow: var(--rf-shadow-card);
}

.timeListboxList li {
  padding: 10px 12px;
  border-radius: 4px;
  font-size: 14px;
  color: var(--rf-ink);
  cursor: pointer;
}

.timeListboxList li:hover,
.timeListboxList li[aria-selected="true"] {
  background-color: var(--rf-surface);
}

.timeListboxList li[aria-selected="true"] {
  font-weight: 600;
}

.dateModal .momentPickerInline {
  width: 100%;
}

.dateModal .momentPickerInline .moment-picker-container {
  position: static;
  width: 100%;
  border: 0;
  box-shadow: none;
  background: none;
}

.dateModal .inlineCalHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  padding: 4px 2px;
}

.dateModal .inlineCalTitle {
  font-size: 20px; 
  line-height: 28px;
  font-weight: 500;
  color: var(--rf-ink);
  text-transform: capitalize;
}

.dateModal .inlineCalNav {
  display: flex;
  gap: 2px;
}

.dateModal .inlineCalNavBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; 
  height: 40px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 22px;
  line-height: 1;
  color: var(--main-color, var(--rf-ink));
  cursor: pointer;
}

.dateModal .inlineCalNavBtn:disabled {
  color: var(--rf-line);
  cursor: default;
}

.dateModal .momentPickerInline .moment-picker-calendar {
  width: 100%;
  border-collapse: collapse;
}

.dateModal .momentPickerInline .moment-picker-calendar thead th {
  padding: 8px 0;
  font-size: 14px; 
  line-height: 20px;
  font-weight: 400;
  color: #4b5563;
  text-align: center;
}

.dateModal .momentPickerInline .moment-picker-calendar td {
  position: relative;
  z-index: 0;
  height: 40px;
  padding: 0;
  font-size: 18px; 
  text-align: center;
  border-radius: 0;
}

.dateModal .momentPickerInline .moment-picker-calendar td::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border-radius: 50%;
  z-index: -1;
}

.dateModal .momentPickerInline .moment-picker-calendar td:hover {
  background: none !important;
  color: var(--rf-ink);
}

.dateModal .momentPickerInline .moment-picker-calendar td:hover::after {
  background-color: var(--rf-surface);
}

.dateModal .momentPickerInline .moment-picker-calendar td.disabled,
.dateModal .momentPickerInline .moment-picker-calendar td.other-month {
  color: #b1bccd; 
}

.dateModal .momentPickerInline .moment-picker-calendar td.disabled:hover,
.dateModal .momentPickerInline .moment-picker-calendar td.other-month:hover {
  background: none !important;
  color: #b1bccd;
}

.dateModal .momentPickerInline .moment-picker-calendar td.disabled:hover::after,
.dateModal .momentPickerInline .moment-picker-calendar td.other-month:hover::after {
  background-color: transparent;
}

.dateModal .momentPickerInline .moment-picker-calendar td.selected {
  background: none !important;
  box-shadow: none;
  color: var(--rf-ink);
  font-weight: 400;
}

.dateModal .momentPickerInline .moment-picker-calendar td.selected::after {
  border: 2px solid var(--main-color, var(--rf-ink));
  background-color: var(--rf-surface);
  background-color: color-mix(in srgb, var(--main-color, var(--rf-ink)) 10%, white);
}

.step1Form .langueMail {
  margin: 0 0 8px; 
}

.step1Form .langueMailLabel {
  margin: 0 0 12px;
  font-size: 15px;
  color: var(--rf-ink);
}

.step1Form .langCards {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.step1Form .langCard {
  flex: 1 1 0;
  min-width: 140px;
  min-height: 64px; 
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  font-size: 14px; 
  font-weight: 600;
  color: var(--rf-ink);
  cursor: pointer;
}

.step1Form .langCard:hover {
  border-color: var(--rf-ink);
}

.step1Form .langCard:focus-visible {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step1Form .langCard.selected {
  border: 2px solid var(--rf-ink);
  padding: 13px 15px;
  background-color: var(--rf-surface);
}

.step1Form .langCard img {
  width: 34px; 
  height: auto;
  border: 0;
  padding: 0;
}

.step1Form .destSection {
  transition: opacity 0.25s ease;
}

.step1Form .zoneDisabled {
  opacity: 0.3; 
  pointer-events: none;
}

.step1Form .msgControl {
  display: block;
}

.step1Form .msgChoiceCards {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  
  margin-top: 0;
}

.step1Form .choiceCard {
  flex: 1 1 0;
  min-width: 140px;
  min-height: 64px; 
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  font-size: 14px; 
  font-weight: 600;
  color: var(--rf-ink);
  cursor: pointer;
}

.step1Form .msgChoiceCards .choiceCard::before {
  content: "";
  flex: 0 0 auto;
  width: 32px; 
  height: 32px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M8.34495 23.5938L5.40062 26.5381C5.0724 26.8663 4.69473 26.9414 4.26762 26.7634C3.84051 26.5854 3.62695 26.2644 3.62695 25.8004V5.67942C3.62695 5.10631 3.83129 4.61542 4.23995 4.20675C4.64862 3.79808 5.13951 3.59375 5.71262 3.59375H26.8746C27.4477 3.59375 27.9386 3.79808 28.3473 4.20675C28.756 4.61542 28.9603 5.10631 28.9603 5.67942V21.5081C28.9603 22.0812 28.756 22.5721 28.3473 22.9807C27.9386 23.3894 27.4477 23.5938 26.8746 23.5938H8.34495ZM7.62029 21.9184H26.8746C26.9773 21.9184 27.0714 21.8758 27.157 21.7904C27.2423 21.7049 27.285 21.6108 27.285 21.5081V5.67942C27.285 5.57675 27.2423 5.48264 27.157 5.39708C27.0714 5.31175 26.9773 5.26908 26.8746 5.26908H5.71262C5.60995 5.26908 5.51584 5.31175 5.43029 5.39708C5.34495 5.48264 5.30229 5.57675 5.30229 5.67942V24.3288L7.62029 21.9184ZM9.46462 18.6074H17.6766C17.9144 18.6074 18.1134 18.5269 18.2736 18.3658C18.4338 18.2046 18.514 18.0046 18.514 17.7658C18.514 17.5269 18.4338 17.3282 18.2736 17.1698C18.1134 17.0113 17.9144 16.9321 17.6766 16.9321H9.46462C9.22684 16.9321 9.02784 17.0126 8.86762 17.1738C8.70718 17.3349 8.62695 17.5349 8.62695 17.7738C8.62695 18.0126 8.70718 18.2113 8.86762 18.3698C9.02784 18.5282 9.22684 18.6074 9.46462 18.6074ZM9.46462 14.4451H23.1226C23.3604 14.4451 23.5594 14.3645 23.7196 14.2034C23.8801 14.0423 23.9603 13.8423 23.9603 13.6034C23.9603 13.3645 23.8801 13.1659 23.7196 13.0074C23.5594 12.849 23.3604 12.7698 23.1226 12.7698H9.46462C9.22684 12.7698 9.02784 12.8503 8.86762 13.0114C8.70718 13.1725 8.62695 13.3725 8.62695 13.6114C8.62695 13.8503 8.70718 14.049 8.86762 14.2074C9.02784 14.3659 9.22684 14.4451 9.46462 14.4451ZM9.46462 10.2828H23.1226C23.3604 10.2828 23.5594 10.2022 23.7196 10.0411C23.8801 9.87997 23.9603 9.67997 23.9603 9.44108C23.9603 9.20219 23.8801 9.00353 23.7196 8.84508C23.5594 8.68664 23.3604 8.60742 23.1226 8.60742H9.46462C9.22684 8.60742 9.02784 8.68797 8.86762 8.84908C8.70718 9.01019 8.62695 9.21019 8.62695 9.44908C8.62695 9.68797 8.70718 9.88664 8.86762 10.0451C9.02784 10.2035 9.22684 10.2828 9.46462 10.2828Z' fill='%23161A1F'/%3E%3C/svg%3E") no-repeat center / contain;
}

.step1Form .msgChoiceCards .choiceCard:last-child::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M16.3786 14.7731L19.2682 17.6501C19.4289 17.8108 19.6234 17.889 19.8516 17.8848C20.0798 17.8805 20.2742 17.7981 20.4349 17.6374C20.5956 17.4768 20.6759 17.2844 20.6759 17.0604C20.6759 16.8364 20.5956 16.6441 20.4349 16.4834L17.5579 13.5938L20.4349 10.7041C20.5956 10.5434 20.6738 10.349 20.6696 10.1208C20.6654 9.89253 20.5829 9.69808 20.4222 9.53742C20.2616 9.37675 20.0692 9.29642 19.8452 9.29642C19.6212 9.29642 19.4289 9.37675 19.2682 9.53742L16.3786 12.4144L13.4889 9.53742C13.3282 9.37675 13.1338 9.29853 12.9056 9.30275C12.6774 9.30697 12.4829 9.38942 12.3222 9.55008C12.1616 9.71075 12.0812 9.90308 12.0812 10.1271C12.0812 10.3511 12.1616 10.5434 12.3222 10.7041L15.1992 13.5938L12.3222 16.4834C12.1616 16.6441 12.0834 16.8385 12.0876 17.0668C12.0918 17.295 12.1742 17.4894 12.3349 17.6501C12.4956 17.8108 12.6879 17.8911 12.9119 17.8911C13.1359 17.8911 13.3282 17.8108 13.4889 17.6501L16.3786 14.7731ZM8.42991 23.5938L5.48558 26.5381C5.15736 26.8663 4.77969 26.9414 4.35258 26.7634C3.92547 26.5854 3.71191 26.2644 3.71191 25.8004V5.67942C3.71191 5.10631 3.91625 4.61542 4.32491 4.20675C4.73358 3.79808 5.22447 3.59375 5.79758 3.59375H26.9596C27.5327 3.59375 28.0236 3.79808 28.4322 4.20675C28.8409 4.61542 29.0452 5.10631 29.0452 5.67942V21.5081C29.0452 22.0812 28.8409 22.5721 28.4322 22.9807C28.0236 23.3894 27.5327 23.5938 26.9596 23.5938H8.42991ZM7.70525 21.9184H26.9596C27.0622 21.9184 27.1564 21.8758 27.2419 21.7904C27.3272 21.7049 27.3699 21.6108 27.3699 21.5081V5.67942C27.3699 5.57675 27.3272 5.48264 27.2419 5.39708C27.1564 5.31175 27.0622 5.26908 26.9596 5.26908H5.79758C5.69491 5.26908 5.6008 5.31175 5.51525 5.39708C5.42991 5.48264 5.38725 5.57675 5.38725 5.67942V24.3288L7.70525 21.9184Z' fill='%23161A1F'/%3E%3C/svg%3E");
}

.step1Form .choiceCard:hover {
  border-color: var(--rf-ink);
}

.step1Form .choiceCard:focus-visible {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step1Form .choiceCard.selected {
  border: 2px solid var(--rf-ink);
  padding: 13px 15px;
  background-color: var(--rf-surface);
}

.step1Form .msgPreviewCard {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  margin-top: 12px;
  padding: 14px 16px;
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius-input);
  background-color: var(--rf-paper);
  font-size: 14px; 
  line-height: 20px;
  color: var(--rf-ink);
  text-align: left;
  cursor: pointer;
}

.step1Form .msgPreviewCard::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23232323' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3Cline x1='8' y1='9' x2='16' y2='9'/%3E%3Cline x1='8' y1='13' x2='13' y2='13'/%3E%3C/svg%3E") no-repeat center / contain;
}

.step1Form .msgPreviewCard:hover {
  border-color: var(--rf-ink);
}

.step1Form .msgPreviewText {
  white-space: pre-wrap;
  word-break: break-word;
}

.step1Form .msgEditLink {
  display: inline-block;
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 16px; 
  font-weight: 500;
  color: var(--rf-ink);
  text-decoration: underline;
  cursor: pointer;
}

.msgModalOverlay {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background-color: rgba(0, 0, 0, 0.5); 
}

.msgModal {
  width: 100%;
  max-width: 480px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 32px; 
  border-radius: var(--rf-radius);
  background-color: var(--rf-paper);
  color: var(--rf-ink);
}

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

.msgModalHead h2 {
  margin: 0;
  font-size: 16px; 
  font-weight: 600;
}

.msgModalClose {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 26px;
  line-height: 1;
  color: #4b5563; 
  cursor: pointer;
}

.msgModalField {
  min-height: 160px; 
  padding: 16px;
  border: 1.5px solid var(--rf-input-bd);
  border-radius: var(--rf-radius-input);
}

.msgModalField:focus-within {
  border-color: var(--rf-ink);
}

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

.msgModalFieldMeta label {
  font-size: 12px;
  color: var(--rf-muted);
}

.msgCounter {
  font-size: 11px; 
  line-height: 14px;
  color: var(--rf-muted);
}

.msgModalField textarea {
  display: block;
  width: 100%;
  min-height: 100px;
  border: 0;
  padding: 0;
  resize: none;
  font: inherit;
  font-size: 16px; 
  line-height: 20px;
  color: var(--rf-ink);
  background: none;
  outline: none;
}

.msgModalField textarea::placeholder {
  color: var(--rf-muted);
}

.msgModalHint {
  margin: 16px 0 32px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--rf-muted);
}

.msgModal .msgModalSave {
  width: 100%;
}

.msgModalLink {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin: 8px 0 0;
  padding: 0;
  border: 0;
  background: none;
  font-size: 16px;
  font-weight: 600;
  color: var(--rf-ink);
  text-decoration: none;
  cursor: pointer;
}

.errorBox {
  text-align: left;
  padding: 12px 16px;
  margin: 16px 0;
  border: 1px solid #f3c2c0;
  border-radius: var(--rf-radius-input);
  background-color: #fdecea;
  color: var(--rf-danger);
}

.errorBox ul {
  margin: 6px 0 0;
  padding-left: 18px;
}

.formBox.rf-gate-msg
  > *:not(:first-child):not(#row_customMsg):not(#row_personalsMsgs):not(.cardAmexSection) {
  opacity: 0.3; 
}

.step1Form .actionsRow,
.whiteBox .actionsRow {
  position: static;
  left: auto;
  right: auto;
}

.step1Form .actionsRow {
  background-color: var(--rf-surface);
  border-radius: 6px; 
  padding: 24px;
  margin: 40px 0 8px;
  text-align: center;
}

.step1Form .actionsRow .bottomSection2 {
  max-width: 464px;
  margin: 24px auto 0;
  text-align: left;
}

.step1Form .actionsRow .btn {
  width: 100%;
  max-width: 464px; 
}

.step1Form .cartRecap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin: 0 auto 24px;
  max-width: 464px;
  text-align: left;
}

.step1Form .recapCardImg {
  display: block;
  width: 100%; 
  border-radius: 16px;
  margin-bottom: 6px;
}

.step1Form .recapAmount {
  font-size: 24px; 
  line-height: 32px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step1Form .recapBadge {
  display: inline-block;
  padding: 4px 8px; 
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  
  color: var(--main-color, var(--rf-success));
  background-color: var(--rf-surface);
  background-color: color-mix(in srgb, var(--main-color, var(--rf-success)) 12%, white);
}

.step1Form .recapName {
  font-size: 18px; 
  line-height: 26px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step1Form .recapEmail {
  font-size: 14px;
  color: var(--rf-muted);
}

.step1Form .recapMsg {
  width: 100%;
  padding-top: 12px;
  border-top: 1px solid var(--rf-line);
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
  overflow-wrap: anywhere;
}

.step1Form .recapPreviewLink {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  min-height: 48px;
  padding: 12px 28px;
  background: none;
  border: 1.5px solid var(--rf-ink);
  border-radius: var(--rf-radius-pill);
  font-size: 16px;
  font-weight: 600;
  color: var(--rf-ink);
  text-decoration: none;
  cursor: pointer;
}

.step1Form .recapPreviewLink:hover {
  background-color: var(--rf-paper);
}

.cardInfoSection .bottomSection {
  display: none;
}

.step1Form .formControl {
  position: relative;
}

.step1Form .flLabel {
  position: absolute;
  top: 5px;
  left: 13px;
  font-size: 12px; 
  line-height: 16px;
  color: var(--rf-muted);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.step1Form .formControl input:not(:placeholder-shown) ~ .flLabel {
  opacity: 1;
}

.step1Form .formControl:has(> input:not(:placeholder-shown)) > input {
  padding-top: 18px;
  padding-bottom: 4px;
}

.step1Form .fieldNote {
  margin: 6px 0 0;
  font-size: 11px;
  line-height: 1.5;
  color: var(--rf-muted);
}

.step1Form .amountRangeNote {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--rf-muted);
}

.step1Form .formBox > .formField,
.step1Form .formBox > .langueMail,
.step1Form .formBox > .destSection {
  margin-top: 40px; 
  padding-top: 40px;
  border-top: 1px solid var(--rf-line);
}

.step1Form .senderSection {
  margin-bottom: 8px;
}

.step1Form .selfCheck {
  margin: 0 0 16px;
}

.step1Form .selfCheck .optionItem {
  display: flex;
  align-items: center;
  gap: 12px; 
}

.step1Form .selfCheck.customCheckbox .checkboxRadio input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  position: static;
  opacity: 1;
  width: 20px;
  height: 20px;
  margin: 0;
  border: 1.5px solid var(--rf-input-bd); 
  border-radius: 3px;
  background: var(--rf-paper);
  cursor: pointer;
  flex: 0 0 auto;
}

.step1Form .selfCheck.customCheckbox .checkboxRadio input[type="checkbox"]:checked {
  background-color: var(--rf-ink);
  border-color: var(--rf-ink);
}

.step1Form .selfCheck.customCheckbox .checkboxRadio input[type="checkbox"]:checked::after {
  content: "\2713";
  display: block;
  color: #fff;
  font-size: 13px;
  line-height: 18px;
  text-align: center;
}

.step1Form .selfCheck.customCheckbox .checkboxRadio input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step1Form .selfCheck.customCheckbox .checkboxRadio label {
  margin: 0;
  padding: 0 !important;
  font-size: 14px; 
  font-weight: 600;
  color: var(--rf-ink);
  cursor: pointer;
  white-space: nowrap;
}

.bottomSection2 {
  font-size: 12px; 
  line-height: 16px;
  color: #4b5563;
}

.footer a {
  font-size: 12px;
  line-height: 20px;
  text-decoration: underline;
  color: var(--rf-ink);
}

.orderConfirmation {
  display: flex;
  flex-direction: column;
  gap: 40px;
  max-width: var(--rf-content-max);
  margin: 0 auto;
}

.mainContent.step-result .authorized .mainCol {
  max-width: none;
  margin-left: 0;
}

.orderConfirmation .confirmationIntro {
  background: none;
  box-shadow: none;
  padding: 0;
  width: auto;
}

.orderConfirmation .confirmationIntro .confirmationTitle {
  margin: 0 0 16px;
  font-size: 32px;
  line-height: 40px;
  font-weight: 700;
  color: var(--rf-ink);
  text-align: left;
}

.orderConfirmation .confirmationIntro .confirmationMessage {
  margin: 0;
  font-size: 16px;
  line-height: 20px;
  color: var(--rf-ink);
}

.orderConfirmation .confirmationIntro .confirmationRef {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 16px;
  color: #4b5563;
}

.orderConfirmation .cardsCountHead {
  margin: 0;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--rf-line);
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: var(--rf-ink);
}

.orderConfirmation .orderDetails {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.orderConfirmation .card-item {
  background-color: var(--rf-surface);
  border-radius: var(--rf-radius-input);
  padding: 40px;
}

.orderConfirmation .payment-card-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 0;
}

.orderConfirmation .payment-card-image-container {
  margin: 0;
  text-align: center;
}

.orderConfirmation .payment-card-image {
  width: 100%;
  max-width: none;
  min-height: 0;
  border-radius: 16px;
  box-shadow: 0 16px 12px rgba(0, 0, 0, 0.2);
}

.orderConfirmation .payment-card-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 0 16px;
}

.orderConfirmation .payment-card-value {
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--rf-ink);
}

.orderConfirmation .badge-offerte {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  border-radius: var(--rf-radius-pill);
  background-color: var(--rf-success-bg);
  color: var(--rf-success);
  vertical-align: middle;
}

.orderConfirmation .payment-card-delivery-info {
  display: inline-block;
  margin: 0;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  color: var(--main-color, var(--rf-success));
  background-color: var(--rf-paper); 
  background-color: color-mix(in srgb, var(--main-color, var(--rf-success)) 12%, white);
}

.orderConfirmation .payment-card-beneficiary-name {
  margin: 0;
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: var(--rf-ink);
}

.orderConfirmation .payment-card-beneficiary-email {
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  color: var(--rf-ink);
}

.orderConfirmation .payment-card-separator {
  width: 100%;
  height: 1px;
  background-color: var(--rf-line);
}

.orderConfirmation .payment-card-message-content {
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  color: var(--rf-ink);
  overflow-wrap: anywhere;
}

.orderConfirmation .btn.payment-card-download {
  width: 100%;
  background-color: transparent;
  border: 1.5px solid var(--rf-ink);
  color: var(--rf-ink);
  text-decoration: none;
}

.orderConfirmation .actionButtons {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 0;
  width: 100%;
}

.orderConfirmation .actionButtons .btn {
  width: 100%;
  text-decoration: none;
}

.orderConfirmation .actionButtons .buyOther {
  background-color: var(--rf-paper);
  color: var(--rf-ink);
  border: 1.5px solid var(--rf-ink);
}

.step-2 > .wrapper > div,
.step-payment > .wrapper > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: var(--rf-content-max);
  margin: 0 auto;
}

.step-2 .left-column-container {
  display: contents;
}

.step-2 .bottomSection2-step2 {
  order: 10;
  margin-top: 24px;
}

.step-2 > .wrapper > div .cardSection2,
.step-payment > .wrapper > div .cardSection2 {
  position: static;
  align-self: stretch;
  width: auto;
  max-width: none;
  max-height: none;
  overflow: visible;
  padding: 0;
  background-color: transparent;
  box-shadow: none;
}

.step-2 > .wrapper > div .orderSection,
.step-payment > .wrapper > div .orderSection {
  margin-left: 0;
  margin-top: 40px;
  align-self: stretch;
}

.step-2 .mainCol {
  min-height: 0;
  max-width: none;
  margin-left: 0;
}

.checkoutTabs {
  display: flex;
  gap: 16px;
}

.checkoutTab {
  background: none;
  border: none;
  padding: 0;
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: var(--rf-ink);
  cursor: pointer;
}

.checkoutTab.active {
  color: var(--rf-ink);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.checkoutTab:disabled {
  color: #b1bccd;
  cursor: default;
}

.checkoutTab:not(.active):not(:disabled):hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.checkoutSubtitle {
  margin: 40px 0;
  font-size: 16px;
  line-height: 20px;
  color: var(--rf-ink);
}

.step-2 .cartItemsHead {
  padding: 0 0 16px;
  border-bottom: 1px solid var(--rf-line);
}

.step-2 .cartItemsHead .row {
  display: flex;
  flex-wrap: nowrap;
  margin: 0;
}

.step-2 .cartItemsHead .myCart {
  display: block;
  float: none;
  width: auto;
  max-width: none;
  padding: 0;
}

.step-2 .cartItemsHead .cartQte,
.step-2 .cartItemsHead .cartTotal,
.step-2 .cartItemsHead .cartDiscountRow {
  display: none;
}

.step-2 .cartItemsHead .myCart {
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step-2 .cartItem2 {
  padding: 20px 56px 20px 0;
}

.step-2 .cartItem2 .itemPreview {
  width: 64px;
  border-radius: 6px;
  box-shadow: none;
}

.step-2 .cartItem2 .itemData {
  margin-left: 84px;
}

.step-2 .cartItem2 > .itemData > .iPrice {
  position: absolute;
  top: 20px;
  right: 36px;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--rf-ink);
  text-align: right;
}

.step-2 .cartItem2 .discount-abundance {
  font-size: 12px;
  font-weight: 400;
}

.step-2 .cartItem2 .discount-abundance .iPrice {
  font-size: 14px;
}

.step-2 .cartItem2 .itemData .iSender {
  font-size: 14px;
  color: var(--rf-ink);
}

.step-2 .cartItem2 .itemData .iDate {
  font-size: 13px;
  color: var(--rf-ink);
}

.step-2 .cartItem2 .itemData .iDate.sendBadge {
  display: inline-block;
  align-self: flex-start;
  margin-top: 6px;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  color: var(--main-color, var(--rf-success));
  background-color: var(--rf-surface);
  background-color: color-mix(in srgb, var(--main-color, var(--rf-success)) 12%, white);
}

.step-2 .cartItem2 .deleteItem {
  top: 20px;
  right: 0;
  margin-top: 0;
  font-size: 18px;
  color: var(--rf-muted);
}

.step-2 .cartItem2 .cardComment {
  margin-left: 84px;
  font-size: 14px;
  color: var(--rf-muted);
  overflow-wrap: anywhere;
}

.step-2 .cartItem2.cartItemRow {
  display: flex;
  gap: 16px;
  position: relative;
  padding: 16px 56px 16px 0;
}

.step-2 .cartItem2.cartItemRow .itemPreviewBox {
  position: relative;
  width: 72px;
  height: 114px;
  flex-shrink: 0;
}

.step-2 .cartItem2.cartItemRow .itemPreview {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 114px;
  height: auto;
  transform: translate(-50%, -50%) rotate(90deg);
  border-radius: 6px;
  box-shadow: none;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.18));
}

.step-2 .cartItem2.cartItemRow .itemData {
  margin-left: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
  padding-right: 96px; 
}

.step-2 .cartItem2.cartItemRow .itemData .iSender.iName {
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
}

.step-2 .cartItem2.cartItemRow .itemData .iSender {
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.step-2 .cartItem2.cartItemRow .itemData .cardComment {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.step-2 .cartItem2.cartItemRow > .itemData > .iPrice {
  top: auto;
  bottom: 12px;
  right: 36px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
}

.step-2 .cartItem2.cartItemRow .deleteItem {
  top: 16px;
}

.step-2 .checkoutTotals {
  border-top: 1px solid var(--rf-line);
}

.step-2 .checkoutTotals .totalRow,
.step-2 .checkoutTotals .discountRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0; 
  padding: 12px 0;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

.step-2 .checkoutTotals .totalRow > span:last-child,
.step-2 .checkoutTotals .discountRow > span:last-child {
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step-2 .checkoutTotals > div + div {
  border-top: 1px solid var(--rf-line);
}

.step-2 .checkoutTotals .subTotal {
  color: var(--rf-muted);
}

.step-2 .checkoutTotals .discountRow {
  color: var(--rf-success);
}

.step-2 .checkoutTotals .discountRow > span:last-child {
  color: var(--rf-success);
}

.step-2 .checkoutTotals .grandTotal {
  border-top: 1px solid var(--rf-input-bd);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step-2 .whiteBox {
  background-color: var(--rf-surface);
  border-radius: var(--rf-radius-input);
  min-height: 0;
  padding: 24px;
  color: var(--rf-ink);
}

.step-2 .whiteBox .fieldsGroupHead {
  padding: 0;
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: 600;
  color: var(--rf-ink);
  text-align: left !important;
}

.step-2 .whiteBox .fieldsGroup {
  margin: 0 0 16px;
}

.step-2 .customCheckbox label:before {
  border-radius: 3px;
  border-width: 1.5px;
  border-color: var(--rf-input-bd);
  top: 2px;
}

.step-2 .customCheckbox label[for="isGettingInvoiceActivated"] {
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
}

.step-2 .customCheckbox input[type="checkbox"]:checked + label:before {
  content: "\2713";
  background-color: var(--rf-ink);
  border-color: var(--rf-ink);
  box-shadow: none;
  color: #ffffff;
  font-size: 14px;
  line-height: 20px;
}

.step-2 .customCheckbox input[type="checkbox"]:focus-visible + label:before {
  outline: 2px solid var(--rf-ink);
  outline-offset: 2px;
}

.step-2 .fieldsGroup .formField.cgvBlock {
  margin: 16px 0 12px;
  padding-top: 16px;
  border-top: 1px solid var(--rf-input-bd);
}

.step-2 .optinTitle {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: 600;
  color: var(--rf-ink);
}

.step-2 .optinCaption {
  display: block;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  color: #4b5563;
}

.step-2 .optinCaption a.mainColor {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.step-2 .fieldsGroup .whitebox {
  display: none;
}

.step-2 .formBox2 .formControl {
  position: relative;
}

.step-2 .formBox2 .formControl .flLabel {
  position: absolute;
  top: 5px;
  left: 17px;
  font-size: 12px;
  line-height: 16px;
  color: var(--rf-muted);
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}

.step-2 .formBox2 .formControl input:not(:placeholder-shown) ~ .flLabel {
  opacity: 1;
}

.step-2 .formBox2 .formControl:has(input:not(:placeholder-shown)) input {
  padding-top: 18px;
  padding-bottom: 4px;
}

.step-2 .fieldRow {
  display: flex;
  gap: 12px;
}

.step-2 .fieldRow .formField {
  flex: 1;
  min-width: 0;
}

.step-2 .fieldRow .formField.fieldPostal {
  flex: 0 0 132px;
}

.step-2 .fieldsGroup .formField {
  margin: 0 0 12px;
}

.step-2 .whiteBox .actionsRow {
  position: static;
  left: auto;
  right: auto;
  margin-top: 20px;
}

.step-2 .actionsRow .btn.sendOrder {
  width: 100%;
}

.step-2 .actionsRow .btn.sendOrder::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  vertical-align: -6px;
  background-color: currentColor;
  -webkit-mask: url("../images/ic-lock-checkout.svg") no-repeat center / contain;
  mask: url("../images/ic-lock-checkout.svg") no-repeat center / contain;
}

.step-2 .actionsRow .btn.buyOther {
  display: none;
}

.headerBuyOther {
  background: none;
  border: none;
  padding: 8px 0;
  font-size: 14px;
  color: var(--rf-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  white-space: nowrap;
}

.step-payment .left-column-container {
  display: none;
}

.step-2 .paymentHead .totalRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--rf-ink);
}

.step-2 #paymentHtml {
  background-color: var(--rf-surface);
  border: none;
  border-radius: var(--rf-radius-input);
  padding: 24px;
}

.step-2 .promoCodeSection {
  margin-bottom: 16px;
}

.step-2 .promoCodeInputRow {
  display: flex;
  gap: 12px;
}

.step-2 .promoCodeInputRow .promoCodeInput {
  flex: 1;
  min-width: 0;
}

.step-2 .promoCodeInputRow .promoCodeBtn {
  flex-shrink: 0;
}

.step-2 .promoCodeApplied {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}

.step-2 .promoCodeError {
  margin-top: 8px;
  font-size: 13px;
  color: #d32f2f;
}

.step-2 .cancelPaymentLink {
  display: block;
  margin: 20px auto 0;
  background: none;
  border: none;
  padding: 4px 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--rf-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}