.booking-details-heading h2,
.right-panel .booking-status-heading h2 {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-family);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 2.375rem;
  margin: 8px 0 24px;
  @media(width >= 1366px) {
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 40px;
  }
  @media(width >= 1024px) {
    line-height: 2.5rem;
  }
}
.booking-status-heading {
  @media(width >= 1366px) {
    margin-bottom: 84px;
  }
}

.cmp-payment-success {
  margin-top: 40px;
}
.cmp-payment-success .details-top h4 {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5rem;
  margin: 0 0 14px;
  @media(width >= 1366px) {
    margin: 0 0 24px;
  }
  @media(width >= 1024px) {
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 100%;
  }
}

.cancellation-msg-block {
  display: none;
}
.booking-status .top-section {
  background: var(--Primary-Variations-Secondary, #F5F5F5);;
  padding: 14px 20px;
}


.cmp-payment-success .success-vehicle-details .accordian-content {
  background: var(--Gradients-Accent-Section-Bg-1, linear-gradient(228deg, rgba(23, 29, 155, 0.10) 31.52%, rgba(255, 98, 0, 0.10) 111.9%));
  padding: 16px;
  margin-bottom: 24px;
  @media(width >= 1366px) {
    padding: 40px 47px 33px 40px;
  }
}

.cmp-payment-success .success-vehicle-details .accordian-content .model-name {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-family);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.875rem;
  @media(width >= 1366px) {
    font-weight: 700;
    margin: 0;
  }
  @media (width >=1024px) {
    font-size: 1.75rem;
  }
}

.cmp-payment-success .success-vehicle-info .model-name .variant-name {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.125rem;
  @media(width >= 1366px) {
    font-family: var(--body-font-family);
    font-size: 1.5rem;
    line-height: 1.75rem;
    display: block;
    width: 70%;
    margin-top: 8px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--tertiary-black);
    margin-bottom: 16px;
  }
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}
.cmp-payment-success .success-vehicle-info .transmission-fuel {
  display: flex;
  width: 100%;
  gap: 32px;
}
.cmp-payment-success .success-vehicle-info .transmission-fuel .fueltype {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  position: relative;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-payment-success .success-vehicle-info .transmission-fuel .fueltype:first-of-type:after {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  background: linear-gradient( rgba(0, 0, 0, 0.00) 0%, #000 46%, rgba(0, 0, 0, 0.00) 100%);
  right: -16px;
  top: 0;
}

.showroom-price.info-item.price-align p {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-family);
  font-size: 2rem;
  font-style: normal;
  font-weight: 600;
  line-height: 2.375rem;
  margin: 16px 0 0;
  @media (width >=1024px) {
    line-height: 2.5rem;
  }
}

.showroom-price.info-item.price-align span {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 300;
  line-height: 1rem; /* 14px */
  text-transform: capitalize;
  display: block;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.dealer-details .accordian-content,
.billing-details-content{
  background: var(--Primary-Variations-Secondary, #F5F5F5);
  padding: 16px;
  margin-bottom: 24px;
  position: relative;
  @media(width >= 1366px) {
    padding: 24px;
  }
}

.dealer-info-content .dealer-name p {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  margin: 0;
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.125rem;
  position: relative;
  padding-bottom: 14px;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.dealer-info-content .dealer-name p:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.00) 0%, #000 50%, rgba(0, 0, 0, 0.00) 100%);
  left: 0;
  bottom: 0;
}

.top-navigate-link.success-desktop-only {
  display: none;
}

.dealer-address p {
  color: var(--Neutrals-Headings, #1D1D1D);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.dealer-contact .phone-success a, 
.dealer-contact .email-success a {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.dealer-contact .phone-success {
  width: 100%;
}
.dealer-contact .email-success,
.dealer-contact .phone-success {
  display: inline-flex;
  position: relative;
  align-items: center;
  gap: 4px;
}
.email-copy-toast {
  background: rgba(23, 28, 143, 0.2);
  padding: 0.5rem 0.75rem;
  color: var(--primary-blue-700);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-weight: var(--fw-300);
  line-height: 1rem;
  white-space: nowrap;
  text-align: center;
  position: absolute;
  right: 0px;
  top: -25px;
  z-index: 999;
  display: none;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-payment-success .success-dealer-info .dealer-contact .phone-success .phone-icon-success,
.cmp-payment-success .success-dealer-info .dealer-contact .email-success .email-icon-success {
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  background-size: cover;
  height: 14px;
  width: 14px;
}

.cmp-payment-success .success-dealer-info .dealer-contact .phone-success .phone-icon-success {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M11.1051 6.84286C11.0715 5.72402 10.6641 4.77406 9.88291 3.99298C9.10173 3.2118 8.15177 2.80439 7.03304 2.77075V1.89575C7.71359 1.91072 8.35074 2.05019 8.94447 2.31415C9.53831 2.5782 10.057 2.93195 10.5005 3.37538C10.9439 3.81891 11.2976 4.33754 11.5616 4.93127C11.8257 5.52511 11.9652 6.1623 11.9801 6.84286H11.1051ZM8.77181 6.84286C8.73817 6.37541 8.5568 5.97622 8.2277 5.64527C7.89861 5.31443 7.50038 5.13403 7.03304 5.10409V4.22909C7.74276 4.25903 8.34738 4.52469 8.84691 5.02606C9.34654 5.52754 9.61317 6.13313 9.64681 6.84286H8.77181ZM11.3395 11.9583C10.2402 11.9583 9.13581 11.7027 8.02631 11.1915C6.9169 10.6803 5.89665 9.95917 4.96556 9.02817C4.03825 8.09707 3.319 7.0777 2.80781 5.97004C2.29661 4.86249 2.04102 3.75906 2.04102 2.65977C2.04102 2.48477 2.09935 2.33797 2.21602 2.21936C2.33268 2.10084 2.47852 2.04159 2.65352 2.04159H4.55606C4.70335 2.04159 4.83329 2.08966 4.94587 2.18581C5.05845 2.28187 5.13006 2.40058 5.16068 2.54194L5.49508 4.25825C5.51822 4.4175 5.51336 4.55434 5.4805 4.66877C5.44754 4.7832 5.38843 4.87931 5.30316 4.95709L3.95595 6.26856C4.17276 6.66562 4.42048 7.04124 4.69912 7.39542C4.97766 7.7495 5.27924 8.08769 5.60387 8.40998C5.92393 8.73013 6.2642 9.02744 6.6247 9.3019C6.9852 9.57636 7.37448 9.83176 7.79254 10.0681L9.10154 8.74773C9.19283 8.65275 9.30337 8.58615 9.43316 8.54794C9.56286 8.50983 9.69766 8.5005 9.83756 8.51994L11.4573 8.84981C11.6046 8.8887 11.7248 8.96386 11.818 9.07527C11.9111 9.18669 11.9577 9.31308 11.9577 9.45444V11.3458C11.9577 11.5208 11.8984 11.6666 11.7799 11.7833C11.6613 11.8999 11.5145 11.9583 11.3395 11.9583ZM3.54193 5.44067L4.58304 4.44448C4.6017 4.42951 4.61386 4.40895 4.61949 4.38279C4.62513 4.35664 4.62421 4.33233 4.61672 4.30988L4.36312 3.00627C4.35563 2.97643 4.34256 2.95402 4.32389 2.93904C4.30522 2.92407 4.28092 2.91659 4.25097 2.91659H3.00352C2.98106 2.91659 2.96234 2.92407 2.94737 2.93904C2.93249 2.95402 2.92506 2.97273 2.92506 2.99519C2.9549 3.3938 3.02014 3.79873 3.12077 4.20998C3.22129 4.62133 3.36168 5.03156 3.54193 5.44067ZM8.61693 10.482C9.00359 10.6622 9.40686 10.8 9.82677 10.8954C10.2468 10.9907 10.6392 11.0473 11.0041 11.0653C11.0265 11.0653 11.0453 11.0578 11.0602 11.0429C11.0752 11.0279 11.0827 11.0092 11.0827 10.9867V9.75952C11.0827 9.72958 11.0752 9.70527 11.0602 9.68661C11.0453 9.66794 11.0228 9.65486 10.993 9.64738L9.76799 9.39829C9.74554 9.39081 9.7259 9.38988 9.70908 9.39552C9.69226 9.40116 9.67447 9.41331 9.6557 9.43198L8.61693 10.482Z" fill="%23939393"/></svg>');
}

.cmp-payment-success .success-dealer-info .dealer-contact .email-success .email-icon-success {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.51351 11.375C2.21882 11.375 1.9694 11.2729 1.76523 11.0688C1.56107 10.8646 1.45898 10.6152 1.45898 10.3205V3.67952C1.45898 3.38484 1.56107 3.13542 1.76523 2.93125C1.9694 2.72708 2.21882 2.625 2.51351 2.625H11.4878C11.7825 2.625 12.0319 2.72708 12.2361 2.93125C12.4402 3.13542 12.5423 3.38484 12.5423 3.67952V10.3205C12.5423 10.6152 12.4402 10.8646 12.2361 11.0688C12.0319 11.2729 11.7825 11.375 11.4878 11.375H2.51351ZM7.00065 7.32535L2.33398 4.34131V10.3205C2.33398 10.3729 2.3508 10.4159 2.38444 10.4495C2.41808 10.4832 2.4611 10.5 2.51351 10.5H11.4878C11.5402 10.5 11.5832 10.4832 11.6169 10.4495C11.6505 10.4159 11.6673 10.3729 11.6673 10.3205V4.34131L7.00065 7.32535ZM7.00065 6.41667L11.5776 3.5H2.42367L7.00065 6.41667ZM2.33398 4.34131V3.5V10.3205C2.33398 10.3729 2.3508 10.4159 2.38444 10.4495C2.41808 10.4832 2.4611 10.5 2.51351 10.5H2.33398V4.34131Z" fill="%23939393"/></svg>');
}

.bottom-navigate-link.success-mobile-only {
  position: absolute;
  top: 50%;
  right: 16px;
}

.bottom-navigate-link.success-mobile-only a {
  color: var(--primary-blue-700);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.billing-details-content.accordian-content .detail-value, 
.billing-details-content.accordian-content .detail-label {
  color: var(--Neutrals-Headings, #1D1D1D);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.125rem;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}
.billing-details-content.accordian-content .detail-label  {
  font-weight: 400;
  min-width: 100px;
}

.billing-details-content.accordian-content .details-item {
  display: flex;
  margin-bottom: 24px;
}

.cmp-payment-success .accordian-head .accordian {
  @media(width >= 1366px) {
    display: none;
  }
}

.details-top.accordian-head {
  @media(width < 1366px) {
    display: flex;
    justify-content: space-between;
  }
}

.accordian-content {
  @media(width < 1366px) {
    display: none;
    &.open {
       display: block;
    }
  }

}

.success-vehicle-details,
.payment-details,
.dealer-details {
  @media(width < 1366px) {
    margin-top: 24px;
    margin-bottom: 24px;
    position: relative;
      &:after {
        background: linear-gradient(85deg, rgba(178, 178, 178, 0) 0%, #B2B2B2 50.5%, rgba(178, 178, 178, 0) 100%);
        content: "";
        width: 100%;
        height: 1px;
        position: absolute;
        top: 38px;
      }
  }
}

.billing-details {
  @media(width < 1366px) {
    margin: 20px 0 40px;
  }
}
.status-order-detail-block .booking-container {
  background: var(--Primary-Variations-Secondary, #F5F5F5);
  padding: 24px;
  margin-bottom: 24px;
}

.status-order-detail-block .booking-container .success-message {
  display: inline-flex;
  align-items: center;
  color: var(--Semantics-Success, #37B200);
  font-family: var(--body-font-arena);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.875rem;
  margin: 0;
  @media (width >=1024px) {
    font-size: 20px;
  }
}

.status-order-detail-block .booking-container .success-message img {
  width: 44px;
  height: 44px;
  display: inline-block;
  margin-right: 16px;
}

.status-order-detail-block .booking-container .sub-message {
  color: var(--neutrals-unfilled-inactive, #939393);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.status-order-detail-block .booking-container .sub-message strong {
  color: var(--Primary-Variations-Hover, #01044B);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.125rem;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.cmp-payment-success .timeline .status-icon {
  width: 32px;
  height: 32px;
  background-color: #CCCCCC;
  display: flex;
  justify-content: center;
  padding: 4px;
}

.cmp-payment-success .timeline .status {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  width: 100%;
  gap: 12px;
  align-items: flex-start;
  @media(width >= 768px) {
    justify-content: flex-start;
  }
  @media(width >= 1366px) {
    align-items: flex-start;
  }
}

.cmp-payment-success .timeline .status .status-left {
  flex-basis: 2%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}

.cmp-payment-success .timeline .status-icon img {
  display: none;
}

.cmp-payment-success .timeline .status .status-right {
  @media(width >= 1366px) {
    flex-basis: 98%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
  }
}

.cmp-payment-success .timeline .status-name {
  flex-basis: 27%;
}

.cmp-payment-success .timeline .status-text {
  margin: 0;
}

.cmp-payment-success .timeline .status-name p {
  color: var(--neutrals-bars-unselected, #939393);
  font-family: var(--body-font-arena);
  font-style: normal;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1rem;
  margin: 0 0 6px;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  @media(width >= 1366px) {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    margin: 0;
  }
}

.cmp-payment-success .timeline .status-text {
  color: var(--neutrals-unfilled-inactive, #939393);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.75;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  @media(width >= 1366px) {
    border-left: 1px solid #515151;
    margin-left: 12px;
    padding-left: 12px;
    flex-basis: 73%;
  }


}


.cmp-payment-success .timeline .timeline-item:not(:last-of-type) .status-icon::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  left: 16px;
  width: 1px;
  height: 48px;
  border: 1px dashed #CACBE5;
  vertical-align: middle;
  margin-top: 40px;
  @media (width >= 768px) {
    top: -8px;
    left: 12px;
    height: 30px;
  }
  @media (width >= 1366px) {
    top: 2px;
    left: 15px;
    height: 48px;
  }
}

.cmp-payment-success .timeline .item-top {
  margin-top: 34px;
  @media(width >= 1366px) {
    margin-top: 68px;
  }
}

.cmp-payment-success .timeline .status-text strong {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-weight: 700;
}

.timeline .timeline-item:last-of-type .status-icon {
  background: var(--primary-blue-700);
}

.cmp-payment-success .timeline .timeline-item:nth-last-child(2) .status-icon::after{
  border: 1px solid var(--primary-blue-700);
   top: 0px;
}

.cmp-payment-success .receipt-button {
  background: var(--primary-blue-700);
  padding: 12px 24px;
  color: var(--Primary-Variations-Secondary, #F5F5F5);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem;
  margin-top: 24px;
  border: none;
  cursor: pointer;
  &:hover {
    background: var(--primary-blue-900);
  }
}

.cmp-payment-success .actions {
  text-align: right;
}

.order-details .details,
.payment-details .details {
  background: var(--Primary-Variations-Secondary, #F5F5F5);
  padding: 13px 24px;
  margin-bottom: 24px;
}

.order-details .details {
  display: flex;
  justify-content: space-between;
  @media (width >= 1024px) {
    justify-content: flex-start;
    column-gap: 98px;
  }
}

.order-details .details .details-item .detail-value,
.payment-details .details .payment-details-item .detail-value-amount,
.payment-details .details .payment-details-item .detail-value {
  font-weight: 700;
}

.order-details .details .details-item .detail-label,
.payment-details .details .payment-details-item .detail-label{
  font-weight: 400;
}

.order-details .details .details-item .detail-value,
.order-details .details .details-item .detail-label,
.payment-details .details .payment-details-item .detail-label,
.payment-details .details .payment-details-item .detail-value-amount,
.payment-details .details .payment-details-item .detail-value {
  color: var(--Neutrals-Headings, #1D1D1D);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  line-height: 1.125rem;
  min-width: 150px;
  display: inline-block;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.payment-success-section .section-heading:has(.accordian-content.open) .accordian-head .accordian-icon img {
  width: 20px;
}

.order-details .details .details-item .detail-value,
.order-details .details .details-item .detail-label {
  display: block;
  min-width: unset;
}

.order-details .details .details-item {
  display: inline-flex;
  flex-direction: column;
  gap: 10px;
}

.cancel-refund a{
  color: var(--Neutrals-Headings, #1D1D1D);
  font-family: var(--body-font-arena);
  font-style: normal;
  font-weight: 300;
  font-size: 10px;
  line-height: 100%;
}

.success-vehicle-color-top .color-name {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid var(--dark-color);
  vertical-align: middle;
  &:after {
    content: "";
    width: 18px;
    height: 18px;
    margin: auto;
    position: relative;
    top: 0px;
    display: flex;
    background-image: url(/icons/check.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
  &[data-title*="White"] {
      &:after {
          background: url(/icons/check-black.svg);
          top: -2px;
      }
  }
}

.unlock-accessories {
  display: block;
  @media(width >= 1366px) {
    width: 100%;
    display: inline-flex;
    gap: 16px;
  }
}

.unlock-accessories .offers-section {
  background: #E0ECFF;
  padding: 24px;
  width: 100%;
  margin-bottom: 16px;
  @media(width >= 1366px) {
    width: 50%;
  }
}

.unlock-accessories .offers-section .offers-left h3 {
  margin: 0 0 8px;
  color: var(--Neutrals-Headings, #1D1D1D);
  font-family: var(--body-font-arena);
  font-style: normal;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.25rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
  }
}

.unlock-accessories .offers-section .offers-left h6 {
  color: var(--Neutrals-Headings, #1D1D1D);
  font-family: var(--body-font-arena);
  font-style: normal;
  font-weight: 400;
  margin: 0;
  font-size: 0.75rem;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.unlock-accessories .offers-section { 
  .offers-block {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  .offers-right {
    a {
      &:hover {
        img {
          transform: scale(1.1);
          transform-origin: bottom left;
        }
      }
    }
    img {
      width: 35px;
      height: 35px;
      transition: 0.5s ease all;
    }
  }
}

.cmp-ebook-journey__cta-buttons {
  display: inline-flex;
  justify-content: flex-end;
  width: 100%;
  gap: 16px;
  @media(width <=1365px) {
    > div {
      flex: 1;
      button, a {
        width: 100%;
        text-align: center;
      }
    }
  }
}

.cmp-ebook-journey__cta-buttons .cta__new {
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem;
  padding: 7px 12px;
  border: none;
  @media (width >=1024px) {
    padding: 12px 24px;
  }
}

.cmp-ebook-journey__cta-buttons .cmp-ebook-journey__continue {
  background: var(--primary-blue-700);
  color: var(--Primary-Variations-Secondary, #F5F5F5);
  cursor: pointer;
  &:hover {
    background: var(--primary-blue-900);
  }
}

.cmp-ebook-journey__cta-buttons .cancel-button {
  border: 1px solid var(--primary-blue-700);
  color: var(--primary-blue-700);
  background-color: transparent;
  cursor: pointer;
  &:hover {
    background-color: var(--primary-blue-700);
    color: var(--tertiary-white);
  }
}

.booking-status .success-message {
  display: inline-flex;
  color: var(--Semantics-Success, #37B200);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  align-items: center;
  margin: 0;
}

.booking-status .success-message span {
  @media(width < 1366px) {
    width: 24px;
    height: 24px;
    margin-right: 6px;
  }
}

.booking-status  .sub-message {
  color: var(--Primary-Variations-Hover, #01044B);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  margin: 16px 0 30px;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-cancel-ebooking h3 {
  color: var(--Neutrals-Headings, #1D1D1D);
  font-family: var(--body-font-arena);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.375rem;
  margin: 0;
  @media (width >=1024px) {
    line-height: 2.5rem;
    font-size: 2rem;
  }
}

.cancel-booking-message {
  display: flex;
  span.icon img {
    width: 40px;
    object-fit: contain;
    object-position: center;
}
}
.explore-description .card-title img {
  width: 60px;
  display: block;
  margin: 0 auto;
  height: 17px;
  object-fit: contain;
  @media(width >= 1366px) {
    width: 90px;
    height: 25px;
  }
}

.cmp-cancel-ebooking h3 span {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-family);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 300;
  line-height: 1.125rem;
  display: block;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.cmp-cancel-ebooking .description {
  margin: 24px 0 84px;
  @media(width >=1024px) {
      margin: 40px 0 56px;
  }
}
.cmp-cancel-ebooking .description p {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 300;
  line-height: 1rem;
  &:last-of-type {
    margin-bottom: 0;
  }
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-cancel-ebooking p.we-are-sorry {
  margin: 0;
  padding: 0;
  font-family: var(--body-font-family);
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0%;
  color: #18171A;

}

.cmp-cancel-ebooking .we-are-sorry-description {
  margin-top: 16px;
  margin-bottom: 0;
}

.cmp-cancel-ebooking p.write-the-reason,
.cmp-cancel-ebooking--step-finance .sub-title-text,
.cmp-cancel-ebooking--step-explore-more .sub-title-text {
  margin: 0;
  padding: 0;
  font-family: var(--body-font-family);
  font-weight: 300;
  font-size: 12px;
  line-height: 16px;
  color: #18171A;
  margin-top: 24px;
  @media(width >= 1024px){
    font-size: 14px;
    line-height: 20px;
    margin-top: 4px;
  }
}


.cmp-cancel-ebooking .button-container {
  display: flex;
  flex-direction: column;
  justify-content: flex-start; 
  width: 100%;
  margin: 0;
  gap: 16px;
  @media(width >=1024px) {
    flex-direction: row;
    justify-content: flex-start;
    margin-top: 24px;    
  }
} 

.cmp-cancel-ebooking .button-container * {
  font-weight: 400;
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
  @media(width >=1024px) {
      font-size: 16px;
      line-height: 24px;
  }
}
.cmp-cancel-ebooking .button-container button.confirm-cancel,
.cmp-cancel-ebooking .button-container button.skip,
.cmp-cancel-ebooking .button-container a.manage-booking {
  padding: 11px 12px;
  color: var(--primary-main);
  text-align: center;
  font-family: var(--body-font-arena);
  font-style: normal;
  font-weight: 400;    
  background-color: transparent;
  border: 1px solid var(--primary-blue-700);
  cursor: pointer;
  @media(width >=1024px) {
    padding: 11px 16px;
  }
  &:hover {
    background-color: var(--primary-blue-900);
    border: 1px solid var(--primary-blue-900);
    color: var(--tertiary-white);
  }
  width: 100%;
  @media(width >= 1024px) {
    width: auto;
  }
}

.cmp-cancel-ebooking .button-container button.confirm-cancel {
  @media(width >= 1024px) and  (width < 1366px){
    height: auto;
  }
}

.cmp-cancel-ebooking .button-container button.keep,
.cmp-cancel-ebooking .button-container button.submit,
.cmp-cancel-ebooking .button-container a.home-page {
  padding: 11px 12px;
  background: var(--primary-blue-700);
  border: 1px solid var(--primary-blue-700);

  color: var(--secondary-gray-20);
  font-family: var(--body-font-arena);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem; /* 128.571% */
  text-align: center;
  @media(width >=1024px) {
    padding: 11px 16px;
  }
  &:hover {
    background-color: var(--primary-blue-900);
    border: 1px solid var(--primary-blue-900);
    color: var(--tertiary-white);
  }
}

.cmp-cancel-ebooking .contact-container span {
  color: var(--neutrals-unfilled-inactive, #939393);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  display: block;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-cancel-ebooking .contact-container .phone-container a {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem;

  @media(width >=1024px) {
      font-size: 0.75rem;
  }
}

.cmp-cancel-ebooking .contact-container .phone-container a:nth-child(2) {
  margin-left: 24px;
}

.cmp-cancel-ebooking .contact-container .phone-container a:first-of-type:before {
  content: "";
  background-image: url('./../../../icons/phone.svg');
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  background-size: cover;
  height: 20px;
  width: 20px;
  vertical-align: middle;
  margin-right: 8px;
}

.cmp-cancel-ebooking .description label {
  color: var(--secondary-main);
  font-size: 0.875rem;
  font-family: var(--body-font-arena);
  font-style: normal;
  font-weight: 300;
  line-height: 1.125rem;
  display: inline-flex;
  align-items: start;
  gap: 8px;
  margin-bottom: 16px;
  width: 100%;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}
.cmp-cancel-ebooking >div > p {
  color: var(--primary-main);
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.cmp-cancel-ebooking textarea {
  border: 1px solid var(--tertiary-deep-Grey);
  width: 100%;
  height: 140px;
  resize: none;
  font-family: var(--body-font-family);
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  color: var(--primary-main);
  background: var(--light-gray);
  border: none;
  border-radius: 6px;
  padding: 16px 16px 16px 10px;

}

.cmp-cancel-ebooking--step-one:not(.active),
.cmp-cancel-ebooking--step-two:not(.active),
.cmp-cancel-ebooking--step-three:not(.active),
.cmp-cancel-ebooking--step-four:not(.active),
.cmp-cancel-ebooking--step-finance:not(.active),
.cmp-cancel-ebooking--step-explore-more:not(.active) {
  display: none;
} 

.cmp-cancel-ebooking .cmp-cancel-ebooking-overlay {
  content: "";
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  background: var(--black-shade-1);
}

.cmp-cancel-ebooking {
  position: absolute;
  z-index: 999;
  display: none;
  align-items: stretch;
  left: 0;
  top: 0;
  width: 100%;
  flex-direction: column;
  height: 100%;
  width: 100%;
  overflow: auto;
  @media(width >= 1366px) {
    z-index: 999;
    flex-direction: column;
    margin: 0;
    position: fixed;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

.cmp-cancel-ebooking.active {
  display: flex;  
}

.cmp-cancel-ebooking  .cancel-ebooking-modal {
  display: inline-flex;
  flex-direction: column;
  overflow: auto;
  align-items: stretch;
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  @media(width >= 1366px) {  
    flex-direction: row;
  }

  @media(width < 1024px) {    
    width: calc(100% + 20px);
  }

  @media(width < 768px) {    
    width: 100%;
    max-height: 90vh;
  }
}
.cmp-cancel-ebooking [class^='g-lg-10'] {
  position: relative;
}

@media(width < 1366px) {
  .cmp-cancel-ebooking .hide-mobile {
    display: none;
  }  
}

.cmp-cancel-ebooking .g-container, .cmp-cancel-ebooking .g-row {
    height: 100vh;
}
.cmp-cancel-ebooking .left {
  width: 100%;
  display: inline-flex;
  align-items: stretch;  
  @media(width >= 1366px) {    
    width: 45%;
    position: relative;   
  }
}

.cmp-cancel-ebooking .right {
  width: 100%;
  display: inline-flex;
  @media(width >= 1366px) {
    position: relative;
    width: 55%;
  }
}

.cmp-cancel-ebooking > div {
  width: 100%; 
}

.cmp-cancel-ebooking .left .left-section {
  width: 100%;
  height: 100%;
  position: relative;
}

.cmp-cancel-ebooking .left {
  background: linear-gradient(60.18deg, #C9D3D7 3.71%, #EBEBEB 104.51%);
}

.cmp-cancel-ebooking .left .cancel-car-model {
  display: none;
}

.cmp-cancel-ebooking .left .cancel-car-model p {
  margin: 0;
}

.cmp-cancel-ebooking .left .cancel-car-model p.model-italic {
  font-family: var(--body-font-arena);
  font-weight: 400;
  font-style: italic;
  font-size: 20px;
  line-height: 24px;
  color: #18171A;
  margin-bottom: 4px;
}

.cmp-cancel-ebooking .left .cancel-car-model p.model-name {
  font-family: var(--body-font-arena);
  font-weight: 700;
  font-size: 32px;
  line-height: 36px;
  color: #18171A;
  margin-bottom: 4px;  
}

.cmp-cancel-ebooking .left .cancel-car-image {
  width: 100%;
  height: auto;
  margin: auto;
  padding: 54px 16px 21px 62px; 
  @media (width >= 1366px){
    padding: 62px 24px 88px 24px;
  }
}

.cmp-cancel-ebooking .active {
  background-color: var(--tertiary-white);
  padding:16px 16px 40px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  margin-top: -20px;
  @media(width >= 1024px) {
    padding:40px;   
  }
  @media(width >= 1366px) {    
    overflow: auto;
    margin-top: 0;
  }
}

.cmp-cancel-ebooking img {
  display: block;
  width: 100%;
  object-fit: cover;
  object-position: center;
  height: 100%;
  margin-top: 0px;
  max-height: 90vh;
}

.cmp-cancel-ebooking a.close {
  height: 14px;
  width: 14px;
  background-image: url(../../../../../icons/close-icon-failure.svg);
  display: block;
  position: absolute; 
  top: 16px;
  right: 16px;
  z-index: 1;
  margin: 5px;
  @media (width >= 1366px) {
    top: 50px;
    right: 45px;
  }
}

.cmp-cancel-ebooking--step-two .button-container,
.cmp-cancel-ebooking--step-three .button-container,
.cmp-cancel-ebooking--step-four .button-container{
  margin: 0;
  padding: 0;
  border: none;
}

.cmp-cancel-ebooking >div.cmp-cancel-ebooking--step-four > p {
  font-weight: 500;
}

.overflow-hidden {
  overflow: hidden !important;
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-three .reason-description {
  margin-top: 24px;
  @media(width >= 1024px){
    margin-top: 25px;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-three .step-three-button-container {
  margin-top: 89px;
  @media(width >= 1024px){
    margin-top: 90px;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-four .step-final-button-container {
  margin-top: 40px;
}


.cmp-cancel-ebooking .cmp-cancel-ebooking--step-three .remaining-characters {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-family: var(--body-font-family);
  color: #515151;
  font-weight: 300;
  font-size: 12px;
  line-height: 17px;
  letter-spacing: 0%;

}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-three .remaining-characters #other-reason-error {
  color: var(--primary-red);
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-one .button-container {
  margin: 24px 0 40px;
  @media(width >= 1024px) {
    margin: 40px 0;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-one .description {
  margin-bottom: 0;
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-four h3.cancel-booking-message {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  font-family: var(--body-font-arena);
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  color: #18171A;
  margin: 0;
  padding: 0;
  margin-bottom: 24px;
  width: 95%;
  @media(width >= 1024px){
    font-size: 32px;    
    line-height: 36px;
    margin-bottom: 40px;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-four h3.cancel-booking-message span.icon {
  margin-right: 8px;
  @media(width >= 1024px){
    margin-right: 16px;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-four h3.cancel-booking-message span.icon img {
  width: 24px;
  height: 24px;
  @media(width >= 1024px){
    width: 40px;
    height: 40px;
  }
}

/* Basic container for the radio buttons */
.cmp-cancel-ebooking .custom-radio-group {
  display: flex;
  flex-direction: column;
  gap: 16px;
  @media(width >= 1024px){
    gap: 24px;
  }
}

/* Style for each custom radio button */
.cmp-cancel-ebooking .custom-radio-group .custom-radio {
  display: flex;
  align-items: flex-start;
  cursor: pointer;
  padding: 0;
  background: none;
  border: none;
  text-align: left;
}

.cmp-cancel-ebooking .description-heading {
  font-family: var(--body-font-arena);
  font-weight: 300;
  font-size: 12px;
  line-height: 17px;
  letter-spacing: 0%;
  margin-top: 8px;
  @media(width >= 1366px) {
    margin-top: 6px;
    font-size: 14px;
    line-height: 20px;
  }
}

/* The outer circle part of the radio button */
.cmp-cancel-ebooking .custom-radio-group .radio-circle {
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  border: 1px solid var(--secondary-main);
  margin-right: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  @media(width >= 1024px){
    margin-right: 8px;
  }
}

/* The inner circle (this will be white initially) */
.cmp-cancel-ebooking .custom-radio-group .inner-circle {
  width: 10px;
  height: 10px;
  background-color: white; /* Initially white */
}

/* When the radio is selected (clicked), change the inner circle */
.cmp-cancel-ebooking .custom-radio-group .custom-radio[aria-checked="true"] .inner-circle {
  background-color: var(--primary-blue-700); /* Custom selected color */
}

/* Optional: Hover effect */
.cmp-cancel-ebooking .custom-radio-group .custom-radio:hover .radio-circle {
  border-color: var(--primary-blue-700); 
}

/* Additional styling for the label text */
.cmp-cancel-ebooking .custom-radio-group .custom-radio span.option-text {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 1.125rem;
}

/* Apply outline for all focused links */
a:focus-visible {
  outline: 2px solid #18171A;
  outline-offset: 2px;
}


@media(width >=1024px) and (width < 1366px) {
  .cmp-cancel-ebooking [class*='g-lg-'] {
      width: 100%;
  }
}

.status-text-cancelled {
  color: var(--neutrals-unfilled-inactive, #939393);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: var(--body-font-arena);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem;
  @media (width >=1024px) {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  @media(width >= 1366px) {
    border-left: 1px solid #515151;
    margin-left: 12px;
    padding-left: 12px;
    flex-basis: 73%;
  }
}

.success-color-info {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  align-items: center;
}

.success-color-info .color-name {
  width: 20px;
  height: 20px;
  position: relative;
  margin: 0;
}

.success-color-info .color-name:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  left: -4px;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 0%, #000 51.5%, rgba(0, 0, 0, 0.00) 100%);
}

.success-color-info .color-label {
  color: var(--neutrals-sub-texts-paragraphs, #000);
  font-family: var(--body-font-arena);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.125rem; /* 142.857% */
  margin: 0;
  @media (width >=1024px) {
    font-size: 0.75rem;
  }
}

.cmp-payment-success .success-vehicle-color .success-color-info {
  display: none;
}

.cmp-payment-success #car-info-section {
  position: relative;
}
.cmp-payment-success .success-vehicle-color .link-label {
  position: absolute;
  font-family: var(--body-font-arena);
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  letter-spacing: 0%;
  text-decoration: underline;
  color: var(--primary-blue-700);
  top: 93px;
  right: 16px;
  @media(width >= 1366px) {
    top: 52px;
    right: 55px;
  }
}
.cmp-payment-success .modal-wrapper {
  clip-path: none;
}

.cmp-payment-success .arrow-icon-success {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M0.7025 9.98228L0.0176775 9.29746L7.63967 1.67546L7.66101 1.65413H7.63083H3.0125V0.679126H9.32083V6.98746H8.34583V2.36913V2.33895L8.32449 2.36029L0.7025 9.98228Z" fill="%2318171A" stroke="%23171C8F" stroke-width="0.025"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 6px;
  transition: all 0.2slinear;
  position: relative;
  top: 6px;
}

.cancellation-code-section {
  padding: 24px;
  background-color: var(--primary-blue-75);
  font-family: var(--body-font-arena);
  font-weight: 700;
  letter-spacing: 0%;
  line-height: 20px;
  font-size: 16px;
  margin-bottom: 24px;
  @media(width >= 1024px) {
    font-size: 20px;
    line-height: 24px;
  }
  .cancellation-value {
    font-family: var(--body-font-arena);
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 0%;
    display: block;
    margin-top: 8px;
    @media(width >= 1024px) {
      font-size: 14px;
    }
  }

}

.cmp-cancel-ebooking {
  .finance-container {
    display: flex;
    flex-wrap: wrap;
    max-height: 400px;
    overflow: auto;
    .item {
      width: 33.333%;
      padding: 12px;

      @media(width >=1024px) {
        padding: 32px;
      }
      img {
        height: 50px;
        @media(width >=1024px) {
          height: 100px;
        }
      }
    }
  }
  .submit {
    background: var(--primary-blue-700);
    padding: 12px 24px;
    color: var(--Primary-Variations-Secondary, #F5F5F5);
    font-family: var(--body-font-arena);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    margin-top: 0;
    border: none;
    text-align: center;
  }
}

.cmp-cancel-ebooking .cmp-cancel-ebooking--step-explore-more { 
  .explore-description {
    padding: 24px 0 40px;
    margin-left: -16px;
    width: calc(100% + 32px);
    @media (width >= 1366px) {
        padding: 40px 0 16px;
        width: calc(100% + 38px);
    }
  }
  .submit {
    background: var(--primary-blue-700);
    padding: 12px 24px;
    color: var(--Primary-Variations-Secondary, #F5F5F5);
    font-family: var(--body-font-arena);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    margin-top: 0;
    border: none;
  }
  .explore-container {
    position: relative;
    width: 100%;
    margin: auto;
    overflow: hidden;
  }

.explore-card-list {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: auto;
    gap: 16px;
    transition: all 0.5s ease-in-out;
    scroll-behavior: smooth;
    overflow-x: auto;
    scrollbar-width: none;
    @media (width >= 1024px) {
      margin-top: 16px;
      gap: 40px;
  }
  a.explore-card {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: 124px;
      min-width: 124px;
      padding: 8px;
      @media (width >= 1024px) {
        padding: 12px 16px;
        background: transparent;
      }
      @media (width >= 1366px) {
        width: 186px;
        padding-left: 0;
      }

      .card-content {
        text-align: center;
        width: 100%;
        .card-price {
          color: var(--neutrals-unfilled-inactive, #939393);
          text-align: center;
          font-feature-settings: 'liga' off, 'clig' off;
          font-family: Roboto;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 20px;
          margin: 0;
        }
      }
    }
  }
}

.explore-button-section {
  display: none;
}

.payment-success-container {
    .arena-detail-link.arena-desktop-only {
      border: none;
    }
    .arena-mobile-only {
        &.arena-detail-link {
            border: none;
        }
    }
    .cmp-summary-modal {
        .left {
            clip-path: none;
            background: linear-gradient(228.24deg, rgba(23, 29, 155, 0.1) 31.52%, rgba(255, 98, 0, 0.1) 111.9%);
            .left-section.arena {
                position: relative;
                @media(width >=1024px) {
                    padding-top: 52px ;
                }
                h4 {
                    display: none;
                }
                 > a.download-pdf {
                    position: absolute;
                    position: absolute;
                    right: 32px;
                    top: 52px;
                    color: var(--primary-blue-700);
                    &:after {
                        background: url('/icons/download-blue.svg');
                    }
                    @media(width >=1024px) {
                      display: flex;
                    }
                 }
                .info-container {
                    flex-direction: column;
                    align-items: flex-start;

                    .info-item {
                        width: 100%;
                        row-gap: 0;
                        .ex-price {
                            font-family: var(--body-font-arena);
                            font-weight: 600;
                            font-size: 24px;
                            line-height: 28px;
                            letter-spacing: 0%;
                            vertical-align: middle;
                        }
                        .ex-label {
                            font-family: var(--body-font-arena);
                            font-weight: 300;
                            font-size: 10px;
                            line-height: 140%;
                            letter-spacing: 0%;
                            vertical-align: middle;
                            text-transform: capitalize;

                        }
                        .car-info-item {
                            display: inline-flex;
                            flex-direction: column;
                            width: 100%;
                            position: relative;
                            padding-bottom: 16px;
                            .car-type {
                                @media(width >=1024px) {
                                    display: flex;
                                    flex-wrap: wrap;
                                }
                                span {
                                    display: inline-block;
                                    font-family: var(--body-font-arena);
                                    font-weight: 400;
                                    font-size: 14px;
                                    line-height: 20px;
                                    letter-spacing: 0%;
                                    vertical-align: middle;
                                    color: var(--primary-black);

                                    @media(width>= 1024px) {
                                        font-family: var(--body-font-arena);
                                        font-weight: 400;
                                        font-size: 12px;
                                        line-height: 140%;
                                        letter-spacing: 0%;
                                        vertical-align: middle;
                                        text-transform: capitalize;
                                    }
                                    &:first-of-type {
                                        margin-right: 16px;
                                        font-family: var(--body-font-arena);
                                        font-weight: 600;
                                        @media(width >= 1024px) {
                                            width: 100%;
                                            padding-bottom: 12px;
                                            margin-bottom: 12px;
                                            border-bottom: 1px solid var(--primary-black);
                                            font-weight: 600;
                                            font-size: 24px;
                                            line-height: 28px;
                                            letter-spacing: 0%;
                                            vertical-align: middle;

                                        }
                                    }
                                    &:nth-of-type(2) {
                                        margin-right: 12px;
                                        @media(width >= 1024px) {
                                            margin-right: 16px;
                                        }
                                    }
                                    &:nth-of-type(3) {
                                        padding-left: 12px;
                                        @media(width >= 1024px) {
                                            padding-left: 16px;
                                        }
                                        position: relative;
                                        &:before {
                                            content: "";
                                            position: absolute;
                                            width: 1px;
                                            height: 100%;
                                            left: 0;
                                            top: 0;
                                            background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, #000000 46%, rgba(0, 0, 0, 0) 100%);
                                        }
                                    }
                                }
                            }
                            &:after {
                                content: "";
                                position: absolute;
                                width: 100%;
                                height: 1px;
                                bottom: 0;
                                left: 0;
                                background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, #000000 50%, rgba(0, 0, 0, 0) 100%);
                                @media(width >=1024px) {
                                    display: none;
                                }
                            }

                        }
                        &:first-child {
                            @media(width >=1024px) {
                                border-right: none;
                            }
                        }
                        &:last-child {
                            margin-left: 0;
                        }
                        .car-model {
                            margin-bottom: 6px;
                            font-family: var(--body-font-arena);
                            font-weight: 700;
                            letter-spacing: 0%;
                            vertical-align: middle;
                            display: inline-flex;
                            flex-direction: column;
                            @media(width >=1024px) {
                                line-height: 38px;
                                font-size: 32px;
                            }
                        }
                    }
                }
                .arena-mobile-info-item {
                    width: 100%;
                    display: inline-flex;
                    justify-content: space-between;
                    margin-top: 22px;
                    @media(width >=1024px) {
                        display: none;
                    }
                    .ex-price {
                        margin: 0;
                        font-family: var(--body-font-arena);
                        font-weight: 700;
                        font-size: 16px;
                        line-height: 18px;
                        letter-spacing: 0%;
                        vertical-align: middle;
                    }
                    .ex-label {
                        margin: 0;
                        p {
                            font-family: var(--body-font-arena);
                            font-weight: 300;
                            font-size: 10px;
                            line-height: 140%;
                            letter-spacing: 0%;
                            vertical-align: middle;
                            text-transform: capitalize;
                            margin: 0;
                        }
                    }
                    a.download-pdf {
                        display: inline;
                        margin: 0;
                        font-family: var(--body-font-arena);
                        font-weight: 400;
                        font-size: 14px;
                        line-height: 18px;
                        letter-spacing: 0%;
                        text-decoration: underline;
                        text-decoration-style: solid;
                        text-decoration-thickness: 0%;

                    }
                }
                .car-image {
                        margin-top: 6px;
                }
            }
        }
        .right {
            .mobile-only.info-container {
                display: none;
            }
            .right-section {
                margin: 16px;
                @media(width >=1024px) {
                    margin: 60px 12px 0 32px;
                    padding: 0;
                }
                h3 {
                    font-size: 16px;
                    line-height: 20px;
                    font-family: var(--body-font-arena);
                    font-weight: 600;
                    margin: 0;
                    letter-spacing: 0%;
                    @media(width >=1024px) {
                        line-height: 28px;
                        font-size: 24px;
                    }
                }

                p, li {
                    font-size: 12px;
                    line-height: 16px;
                    letter-spacing: 0%;
                    font-family: var(--body-font-arena);
                    font-weight: 300;
                    @media(width >=1024px) {
                        font-size: 14px;
                        line-height: 20px;
                    }
                }
                li {
                    font-size: 14px;
                }
                .cmp-select-vehicle__row-cards {
                    margin-top: 0;
                    @media(width>=1366px) {
                    }
                    .cmp-select-vehicle__two-column-cards {
                        gap: 7px;
                        flex-direction: row;
                        img {
                            display: inline;
                            min-height: 62px;
                            @media(width >=1024px) {
                                min-height: 120px;
                            }
                        }
                        .cmp-select-vehicle__card {
                            width: 50%;
                            
                        }
                    }
                }
                .cmp-select-vehicle__tag {
                    span {
                        background: var(--primary-blue-75);
                        font-style: normal;
                        font-family: var(--body-font-arena);
                        font-weight: 500;
                        line-height: 100%;
                        letter-spacing: 0%;
                        font-size: 18px;
                        padding: 4px 8px;
                        height: auto;
                    }
                }
            }
        }
        .summary-modal-container {
            clip-path: none;
        }
        a.close {
            top: 24px;
            right: 24px;
        }
    }

    .cmp-select-vehicle__two-column-container,
    .cmp-select-vehicle__row-cards {
        border: none;
        padding: 0;
        @media(width >=1024px) {
            margin-top: 0;
            padding: 0 36px 24px 0;
        }
    }
}

.cmp-cancel-ebooking .cancel-ebooking-modal {
  max-height: 90%;
}
