@charset "UTF-8";
/*
@File: Blue Template Styles

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below>>>>>

*******************************************
*******************************************


** - Blue Checkout Area CSS
*/
/*================================================
Default CSS
=================================================*/
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap");
:root {
  --body-font-family: "Space Grotesk", sans-serif;
  --bodyColor: #a3c5d0;
  --primaryColor: #27A6EF;
  --whiteColor: #ffffff;
  --blackColor: #000;
  --smokeColor: #111D28;
  --borderColor: #29343E;
  --transition: .5s;
  --fontSize: 16px;
}

a {
  text-decoration: none;
  outline: 0 !important;
}

body {
  margin: 0;
  padding: 0;
  font-weight: 400;
  background-color: #04111C !important;
  font-size: var(--fontSize);
  font-family: var(--body-font-family) !important;
  background-image: url("../img/noise_bg.png") !important;
  background-repeat: repeat !important;
}

body.woocommerce-checkout {
  background-color: var(--Colors-Background-bg-primary, #081A28) !important;
  background-image: none !important;
}

body.woocommerce-order-received {
  background-color: var(--Colors-Background-bg-primary, #081A28) !important;
  background-image: none !important;
  color: var(--whiteColor);
}

body.woocommerce-order-received .woocommerce-order-details,
body.woocommerce-order-received .woocommerce-customer-details,
body.woocommerce-order-received table.woocommerce-table--order-details {
  display: none !important;
}

/*=========================================
Blue Checkout Area CSS
===========================================*/
.checkout-section.content-item.choose-payment.tab-content-payment {
  max-width: none !important;
}

.section-header h3 {
  font-size: 32px !important;
}

input.select2-search__field {
  font-size: 18px !important;
}

/* Header bar → gradient border (solid #081927 fill in padding-box so only the
   border shows the gradient; card-style #2DB1FB→rgba(45,177,251,0.12) gradient). */
.blue-header-info {
  padding: 16px 24px;
  border-radius: var(--radius-4xl, 24px);
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, #081927 0%, #081927 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box !important;
}

/* Logo size (Figma 2904:24932 — 40px tall) */
.blue-header-info .single-blue-logo img {
  height: 40px;
  width: auto;
  display: block;
}

/* Login button → gradient border (same as coupon Apply) */
.blue-header-info .single-blue-button ul li .login-nav-btn {
  padding: 12px 20px;
  font-size: 16px !important;
  font-weight: 600;
  border: 1px solid transparent !important;
  background:
    linear-gradient(#082035, #082035) padding-box,
    linear-gradient(180deg, #5cc0fb 0%, #1e6f9d 100%) border-box !important;
  color: var(--Colors-Text-text-secondary, #a3c4e0) !important;
}
.blue-header-info .single-blue-button ul li .login-nav-btn:hover {
  color: #fff !important;
  border-color: transparent !important;
}

.blue-header-info a {
  -webkit-transition: var(--transition);
  transition: var(--transition);
  color: var(--whiteColor) !important;
  text-decoration: none;
  outline: 0 !important;
}

.blue-header-info a:hover {
  color: var(--primaryColor) !important;
}

.blue-header-info .single-blue-button ul li {
  margin-right: 20px;
}

.blue-header-info .single-blue-button ul li .website {
  padding-left: 22px;
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 16px;
  font-weight: 500;
}

.blue-header-info .single-blue-button ul li .website i {
  top: 0;
  left: 0;
  line-height: 1;
  font-size: 20px;
  position: absolute;
}

.blue-header-info .single-blue-button ul li .button,
.edit-product-btn,
.coupon-form .default-btn {
  font-size: 14px !important;
  padding: 7px 25px;
  border-radius: 64px;
  display: inline-block;
  color: var(--whiteColor) !important;
  background: var(--smokeColor);
  border: 1px solid var(--borderColor);
  font-weight: 500;
  box-shadow: none;
  text-decoration: none !important;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

.blue-header-info .single-blue-button ul li .button:hover,
.edit-product-btn:hover,
.coupon-form .default-btn:hover {
  color: var(--whiteColor) !important;
  border-color: var(--primaryColor) !important;
}

.blue-header-info .single-blue-button ul li:last-child {
  margin-right: 0;
}

.checkout-section.content-item {
  border-radius: var(--radius-2xl, 16px);
  border: 1px solid var(--Colors-Border-border-secondary, #0E314E);
  background: var(--Colors-Background-bg-secondary, #082035);
  box-shadow: none;
  overflow: hidden;
}

.checkout-content-wrap {
  padding: 0;
}

.blue-checkout-area {
  color: var(--whiteColor);
  padding: 0px 0px 120px 0px;
  background: var(--Colors-Background-bg-primary, #081A28);
}

.blue-checkout-area a {
  -webkit-transition: var(--transition);
  transition: var(--transition);
  color: var(--whiteColor) !important;
  text-decoration: none;
  outline: 0 !important;
}

.blue-checkout-area a:hover {
  color: var(--primaryColor) !important;
}

.blue-checkout-area p {
  font-size: var(--fontSize);
  color: var(--bodyColor);
  margin-bottom: 15px;
  line-height: 28px;
}

.blue-checkout-area p:last-child {
  margin-bottom: 0;
}

.blue-checkout-area img {
  max-width: 100%;
  height: auto;
}

.blue-checkout-area .form-control:focus {
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: var(--primaryColor) !important;
}

.blue-checkout-area .main-max-width {
  max-width: 1180px;
}

.blue-checkout-area .blue-section-title {
  margin-top: 48px;
  margin-bottom: 48px;
}

/* "Back to Home" pill (hero, Figma 2395:38664) */
.blue-checkout-area .blue-section-title .checkout-back-home {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 auto 32px;
  padding: 12px 20px;
  border-radius: 9999px;
  background: var(--Colors-Background-bg-secondary, #082035);
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  color: var(--Colors-Text-text-secondary, #a3c4e0) !important;
  font-family: "Montserrat", var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  text-decoration: none !important;
  transition: var(--transition, all .2s);
}
.blue-checkout-area .blue-section-title .checkout-back-home:hover {
  color: #fff !important;
  border-color: #2db1fb;
}
.blue-checkout-area .blue-section-title .checkout-back-home svg { flex-shrink: 0; }

.blue-checkout-area .blue-section-title h1,
.blue-checkout-area .blue-section-title h2 {
  line-height: 1.1;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 24px;
  font-size: 52px;
  font-weight: 400;
}

.blue-checkout-area .blue-section-title h2 span {
  color: var(--primaryColor);
  text-shadow: 0px 0px 80px rgba(39, 166, 239, 0.15), 0px 0px 40px rgba(39, 166, 239, 0.15), 0px 0px 20px rgba(39, 166, 239, 0.15), 0px 0px 10px rgba(39, 166, 239, 0.15), 0px 0px 5px rgba(39, 166, 239, 0.15);
}

.blue-checkout-area .blue-section-title p {
  font-size: 20px;
  font-weight: 500;
  color: #CCCCCC;
}

@media (max-width: 767px) {
  .blue-checkout-area .blue-section-title p {
    font-size: 16px;
  }
}
.blue-tabs-info {
  max-width: 1000px;
  margin: auto;
}

.blue-checkout-area .blue-tabs-info {
  margin-bottom: 50px;
}

.blue-checkout-area .blue-tabs-info .nav {
  margin-bottom: 50px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 7px;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item {
  padding: 24px 43px 24px 32px;
  border: 1px solid var(--borderColor);
  min-width: 280px;
  border-radius: 12px;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:last-child:before, .blue-checkout-area .blue-tabs-info .nav .nav-item:first-child:before {
  content: "";
  position: absolute;
  top: calc(50% - 19px);
  right: -19px;
  border: 1px solid var(--borderColor);
  height: 38px;
  width: 38px;
  border-radius: 99px;
  background-color: #04111C;
  -webkit-clip-path: polygon(0 0, calc(50% + 1.5px) 0, calc(50% + 1.5px) 100%, 0% 100%);
  clip-path: polygon(0 0, calc(50% + 1.5px) 0, calc(50% + 1.5px) 100%, 0% 100%);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:last-child:before {
  right: unset;
  left: -19px;
  -webkit-clip-path: polygon(calc(50% - 1px) 0, 100% 0, 100% 100%, calc(50% - 1px) 100%);
  clip-path: polygon(calc(50% - 1px) 0, 100% 0, 100% 100%, calc(50% - 1px) 100%);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link {
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: unset;
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link strong {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  text-align: center;
  line-height: 38px;
  border-radius: 100%;
  display: inline-block;
  color: var(--whiteColor);
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background-color: var(--smokeColor);
  border: 1px solid var(--borderColor);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link:hover, .blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link.active {
  color: var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link:hover strong, .blue-checkout-area .blue-tabs-info .nav .nav-item .nav-link.active strong {
  color: var(--whiteColor);
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item::after {
  content: url('data:image/svg+xml,<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.57303 0.763428L9.80973 5.00012L5.57303 9.23681L4.76491 8.42869L7.62205 5.57155H0.430176V4.42869H7.62205L4.76491 1.57155L5.57303 0.763428Z" fill="%2304111C"/></svg>');
  position: absolute;
  top: calc(50% - 16px);
  right: -17px;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 99px;
  background-color: #868C92;
  text-align: center;
  z-index: 3;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:nth-child(2):after {
  right: -24px;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:has(.active) {
  background-color: var(--smokeColor);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:has(.active):after {
  background-color: var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:last-child {
  margin-right: 0;
}

.blue-checkout-area .blue-tabs-info .nav .nav-item:last-child::after {
  display: none;
}

@media (max-width: 991px) {
  .blue-checkout-area .blue-tabs-info .nav .nav-item {
    min-width: auto;
    padding: 22px 36px 22px 24px;
  }
}
@media (max-width: 575px) {
  .blue-checkout-area .blue-tabs-info .nav .nav-item {
    min-width: 280px;
  }
  .blue-checkout-area .blue-tabs-info .nav .nav-item:after {
    display: none;
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item {
  padding: 32px;
  border-radius: 12px;
  margin-bottom: 25px;
  background-color: transparent;
  border: 1px solid var(--borderColor);
}

@media (max-width: 1200px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item {
    padding: 20px;
  }
}
@media (max-width: 992px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item {
    padding: 30px;
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item h3 {
  margin-bottom: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--borderColor);
  font-size: 24px;
  font-weight: 700;
}

@media (max-width: 676px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item h3 {
    padding-bottom: 16px;
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item .title {
  margin-bottom: 15px;
  color: var(--whiteColor);
  font-size: 16px;
  font-weight: 500;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul {
  margin-bottom: 30px;
  border: 1px solid var(--borderColor);
  border-radius: 12px;
  padding: 8px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media (max-width: 767px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul {
    gap: 8px;
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li {
  position: relative;
  z-index: 2;
  border-right: 1px solid var(--borderColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button {
  z-index: 1;
  font-size: 16px;
  padding: 8px 20px;
  min-width: 85px;
  position: relative;
  border-radius: 6px;
  color: var(--whiteColor);
  border: none;
  background-color: transparent;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button svg {
  margin: -2px 5px 0 0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  z-index: -1;
  content: "";
  margin: -1px;
  visibility: hidden;
  position: absolute;
  border-radius: inherit;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background: var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button:hover::before, .blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button.active::before {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 1200px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button {
    padding: 8px 14px;
    min-width: 78px;
  }
}
@media (max-width: 767px) {
  .blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li button {
    font-size: 14px;
    padding: 8px 12px;
    border: 1px solid var(--borderColor);
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li:last-child {
  border-right: none;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul li img {
  position: absolute;
  top: -6px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 3;
  display: none;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item ul:last-child {
  margin-bottom: 0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 10px;
  padding: 24px 32px;
  background: var(--smokeColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support h5 {
  margin-bottom: 0;
  font-size: 16px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support h5 img {
  width: 28px;
  height: 20px;
  margin-right: 10px;
  border-radius: 2px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support h5 span {
  margin-left: 10px;
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support a {
  color: var(--primaryColor) !important;
  text-decoration: underline;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.support a:hover {
  color: var(--whiteColor) !important;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group {
  margin-bottom: 25px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control {
  height: 52px;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  padding-left: 15px;
  border-radius: 12px;
  background-color: transparent;
  color: #CCCCCC;
  border: 1px solid var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control::-webkit-input-placeholder {
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control::-moz-placeholder {
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control:-ms-input-placeholder {
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control::-ms-input-placeholder {
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form .form-group .form-control::placeholder {
  color: #CCCCCC;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form button {
  border: 0;
  z-index: 1;
  padding: 10px 35px;
  position: relative;
  border-radius: 6px;
  display: inline-block;
  color: var(--whiteColor);
  background-color: var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form button::before {
  top: 0;
  left: 0;
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 6px;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background: linear-gradient(85deg, #49BEFF 9.96%, #0D98E7 94.46%);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.form button:hover::before {
  opacity: 0;
  visibility: hidden;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker h3 {
  max-width: 200px;
  line-height: 1.6;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 500;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker h2 {
  margin-bottom: 0;
  font-size: 22px;
  font-weight: 700;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item {
  margin-top: 17px;
  padding-top: 15px;
  border-top: 1px solid #84a4b0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item .d-flex {
  margin-bottom: 13px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item .d-flex:last-child {
  margin-bottom: 0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item p {
  margin-bottom: 0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item p a {
  color: #ed4c49;
  margin-left: 10px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item p a i {
  top: 2px;
  font-size: 22px;
  margin-right: 1px;
  position: relative;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item p a:hover {
  color: var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker .price-item span {
  font-size: 16px;
  color: var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tradelocker.style-2 {
  margin-top: 55px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form {
  margin-bottom: 35px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group {
  margin-bottom: 15px;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-label {
  font-size: 18px;
  font-weight: 500;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control {
  border: 0;
  height: 45px;
  color: #a3c5d0;
  border-radius: 0;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  padding-left: 0;
  background-color: transparent;
  border-bottom: 1px solid #84a4b0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control::-webkit-input-placeholder {
  color: #a3c5d0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control::-moz-placeholder {
  color: #a3c5d0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control:-ms-input-placeholder {
  color: #a3c5d0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control::-ms-input-placeholder {
  color: #a3c5d0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-control::placeholder {
  color: #a3c5d0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-select {
  border: 0;
  height: 45px;
  color: #a3c5d0;
  border-radius: 0;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  padding-left: 0;
  background-color: transparent;
  border-bottom: 1px solid #84a4b0;
}

.blue-checkout-area .blue-tabs-info .tab-content-info .tab-content-form form .form-group .form-select option {
  color: var(--blackColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-info.form-info {
  max-width: 776px;
}

.blue-checkout-area .blue-tabs-info .tab-content-payment .payment-item {
  padding: 12px 18px;
  border-radius: 11px;
  border: 1px solid var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .tab-content-payment .payment-item h5 {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
}

.blue-checkout-area .blue-tabs-info .tab-content-payment .payment-item h5 img {
  margin-right: 10px;
}

.blue-checkout-area .blue-tabs-info .tab-down-info {
  margin-top: 24px;
}

.blue-checkout-area .blue-tabs-info .tab-down-info h2 {
  margin-bottom: 14px;
  font-size: 32px;
  font-weight: 700;
}

.blue-checkout-area .blue-tabs-info .tab-down-info p {
  color: var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 25px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check .form-check-input {
  top: -3px;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  border-radius: 100%;
  position: relative;
  background-color: transparent;
  border: 0.833px solid var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check .form-check-input:checked {
  border: 0;
  background-color: var(--primaryColor);
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check .form-check-label {
  color: var(--whiteColor);
  font-size: 15px;
  font-weight: 400;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check .form-check-label a {
  font-weight: 400;
  color: var(--primaryColor);
  text-decoration: none;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .form-check .form-check-label a:hover {
  color: var(--whiteColor);
}

.blue-checkout-area .blue-tabs-info .tab-down-info .continue {
  border: 0;
  z-index: 1;
  margin-top: 0;
  padding: 15px 25px;
  position: relative;
  border-radius: 99px;
  display: inline-block;
  color: var(--whiteColor);
  background-color: var(--primaryColor);
  width: 100%;
  text-align: center;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .continue i {
  top: 1px;
  margin-left: 4px;
  position: relative;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .continue::before {
  top: 0;
  left: 0;
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: inherit;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background: linear-gradient(85deg, #49BEFF 9.96%, #0D98E7 94.46%);
  opacity: 0;
  visibility: hidden;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .continue:hover {
  color: #fff !important;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .continue:hover::before {
  opacity: 1;
  visibility: visible;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .lock {
  margin-top: 25px;
  font-size: 14px;
  font-weight: 400;
}

.blue-checkout-area .blue-tabs-info .tab-down-info .lock img {
  top: -3px;
  margin-right: 8px;
  position: relative;
}

.blue-checkout-area .blue-footer-section .list {
  margin-top: 80px;
  margin-bottom: 20px;
}

.blue-checkout-area .blue-footer-section .list li {
  margin-right: 15px;
}

.blue-checkout-area .blue-footer-section .list li a {
  font-size: 14px;
  color: var(--primaryColor);
}

.blue-checkout-area .blue-footer-section .list li a:hover {
  color: var(--whiteColor);
}

.blue-checkout-area .blue-footer-section .list li:last-child {
  margin-right: 0;
}

.blue-checkout-area .blue-footer-section .copyright {
  font-size: 14px;
}

.blue-checkout-area .background-image {
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  margin: auto;
  width: 100%;
  text-align: center;
  position: absolute;
}

div#wc_checkout_add_ons {
  display: none;
}

.available-info h3 {
  font-size: 18px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 24px;
  margin-top: -0.2em;
}

.available-info .addons-item {
  margin-bottom: 20px;
  color: #fff;
  position: relative;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  cursor: pointer;
  line-height: 1.1;
}

.available-info .addons-item:before {
  content: "";
  display: inline-block;
  height: 18px;
  width: 18px;
  border: 1px solid var(--borderColor);
  background-color: var(--smokeColor);
  border-radius: 4px;
  margin-right: 5px;
  -webkit-transform: translateY(3px);
  transform: translateY(3px);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-size: auto;
  background-repeat: no-repeat;
  background-position: center center;
}

.available-info .addons-item b {
  font-weight: 400;
  color: #CCCCCC;
}

.available-info .addons-item i {
  position: absolute;
  top: 0;
  right: 0;
  color: var(--primaryColor);
}

.available-info .addons-item p {
  color: var(--paragraphColor);
  font-size: 15px;
  font-weight: 400;
}

.available-info .addons-item.active:before {
  border-color: var(--primaryColor);
  background-color: var(--primaryColor);
  background-image: url('data:image/svg+xml,<svg width="11" height="8" viewBox="0 0 11 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.806488 4.81459L3.17091 6.70613C3.72562 7.14989 4.53014 7.08408 5.00536 6.55607L10.1933 0.791656" stroke="white" stroke-width="1.00573" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}

.available-info .addons-item:last-child {
  margin-bottom: 0;
}

.coupon-form {
  position: relative;
  z-index: 2;
}

.coupon-form .form-group {
  margin-bottom: 0 !important;
}

.coupon-form .default-btn {
  position: absolute !important;
  top: 2.5px;
  right: 2px;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.wt_sc_single_coupon.wt-single-coupon.stitched_padding.active-coupon.checkout_page {
  display: none;
}

ul.woocommerce-error {
  max-width: 978px;
  margin: auto;
  padding: 25px;
  border-radius: 7px;
  margin-bottom: 25px;
  background-color: #112d46;
  color: #fff;
}

.woocommerce-error::before {
  display: none;
}

.content-item.tradelocker div#payment {
  display: none;
}

#add_payment_method #payment ul.payment_methods li img, .woocommerce-cart #payment ul.payment_methods li img, .woocommerce-checkout #payment ul.payment_methods li img {
  max-width: 28px !important;
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
  background-color: #fff;
}

#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
  content: "";
  display: block;
  border: 1em solid #fff;
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  position: absolute;
  top: -0.75em;
  left: 0;
  margin: -1em 0 0 2em;
}

/* Payment method radios — hide native input, single custom indicator on label */
#payment ul.payment_methods li.wc_payment_method,
.woocommerce-checkout #payment ul.payment_methods li {
  position: relative;
  list-style: none;
}

#payment ul.payment_methods li.wc_payment_method input.input-radio[type=radio],
#add_payment_method #payment ul.payment_methods li input[type=radio],
.woocommerce-cart #payment ul.payment_methods li input[type=radio],
.woocommerce-checkout #payment ul.payment_methods li input[type=radio],
#payment ul.payment_methods li input.input-radio,
.woocommerce-checkout-payment ul.payment_methods li input[type=radio] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

#payment ul.payment_methods li.wc_payment_method label,
.woocommerce-checkout #payment ul.payment_methods li label {
  position: relative !important;
  padding-left: 34px !important;
  cursor: pointer !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center !important;
  gap: 10px !important;
  line-height: 22px !important;
  width: 100%;
  margin: 0 !important;
}

#payment ul.payment_methods li.wc_payment_method label::before,
.woocommerce-checkout #payment ul.payment_methods li label::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  -webkit-transform: translateY(-50%) !important;
  transform: translateY(-50%) !important;
  width: 22px !important;
  height: 22px !important;
  border: 2px solid rgba(255, 255, 255, 0.35) !important;
  border-radius: 6px !important;
  background-color: transparent !important;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#payment ul.payment_methods li.wc_payment_method input.input-radio:checked + label::before,
#payment ul.payment_methods li.wc_payment_method input.input-radio[checked=checked] + label::before,
#add_payment_method #payment ul.payment_methods li input[type=radio]:checked + label::before,
.woocommerce-cart #payment ul.payment_methods li input[type=radio]:checked + label::before,
.woocommerce-checkout #payment ul.payment_methods li input[type=radio]:checked + label::before,
#payment ul.payment_methods li input.input-radio:checked + label::before,
.woocommerce-checkout-payment ul.payment_methods li input[type=radio]:checked + label::before {
  background-color: #27A6EF !important;
  border-color: #27A6EF !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 14px 14px !important;
}

.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
  border: 0;
  height: 45px;
  color: #a3c5d0;
  border-radius: 0;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  padding-left: 0;
  background-color: transparent;
  border-bottom: 1px solid #84a4b0;
}

.woocommerce form .form-row input.input-text:focus, .woocommerce form .form-row textarea:focus {
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: var(--primaryColor) !important;
}

.woocommerce form .form-row input.input-text::-webkit-input-placeholder, .woocommerce form .form-row textarea::-webkit-input-placeholder {
  color: #a3c5d0;
}

.woocommerce form .form-row input.input-text::-moz-placeholder, .woocommerce form .form-row textarea::-moz-placeholder {
  color: #a3c5d0;
}

.woocommerce form .form-row input.input-text:-ms-input-placeholder, .woocommerce form .form-row textarea:-ms-input-placeholder {
  color: #a3c5d0;
}

.woocommerce form .form-row input.input-text::-ms-input-placeholder, .woocommerce form .form-row textarea::-ms-input-placeholder {
  color: #a3c5d0;
}

.woocommerce form .form-row input.input-text::placeholder, .woocommerce form .form-row textarea::placeholder {
  color: #a3c5d0;
}

.woocommerce-billing-fields__field-wrapper {
  margin-bottom: 30px;
}

.account-information {
  padding: 25px;
  border-radius: 7px;
  margin-bottom: 25px;
  background-color: #112d46;
}

.woocommerce form .form-row h3 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 0;
}

td.product-name {
  font-weight: 500;
}

.woocommerce table.shop_table {
  border: none;
  margin: 0;
  border-radius: 0;
}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
  background: transparent;
  border-radius: inherit;
  padding: 0;
  margin: 0;
}

.woocommerce-terms-and-conditions-wrapper {
  text-align: center;
  max-width: 630px;
  margin: auto;
}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  float: unset;
  text-align: center;
  display: block;
  max-width: 100%;
  width: 100%;
  margin: auto;
  border: 0;
  z-index: 1;
  margin-top: 25px;
  padding: 15px 25px !important;
  line-height: 1.5;
  position: relative;
  text-transform: none;
  font-weight: 500;
  border-radius: 99px;
  color: var(--whiteColor);
  background-color: var(--primaryColor);
}

.woocommerce #payment #place_order::before,
.woocommerce-page #payment #place_order::before {
  top: 0;
  left: 0;
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: inherit;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background: linear-gradient(85deg, #49BEFF 9.96%, #0D98E7 94.46%);
  visibility: hidden;
  opacity: 0;
}

.make-payment-tab-final .woocommerce-Price-currencySymbol {
  display: inline !important;
  color: inherit !important;
}

.woocommerce form .form-row.woocommerce-invalid label {
  color: #ff2020;
}

.woocommerce form .form-row select {
  --bs-form-select-bg-img: url(data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"%3e%3cpath fill="none" stroke="%23343a40" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m2 5 6 6 6-6"/%3e%3c/svg%3e);
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  border: 0;
  height: 45px;
  color: #a3c5d0;
  border-radius: 0;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  padding-left: 0;
  background-color: transparent;
  border-bottom: 1px solid #84a4b0;
}

.f_checkout_loading .woocommerce-checkout::before {
  position: absolute;
  content: "";
  background: white;
  height: 100%;
  width: 100%;
  z-index: 9999;
  opacity: 0.5;
  border-radius: 9px;
  max-width: 978px;
  left: 0;
  right: 0;
  margin: auto;
}

.make-payment-tab-final span {
  display: block;
  margin-top: 13px;
  color: #ff4d4d;
}

.btn-disable {
  pointer-events: none;
  cursor: default;
  opacity: 0.2;
  position: relative;
}

.woocommerce-cart .container {
  display: none;
}

/* ================================================================== */
.header-top .top-logos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.header-top .top-logo {
  padding: 8px 24px;
}

.header-top .top-logo:hover {
  background-color: rgba(255, 255, 255, 0.03);
}

.header-top .top-logo.active {
  background-color: rgba(255, 255, 255, 0.05);
}

.header-ticker {
  background-color: var(--primaryColor);
  padding: 7px 0;
  overflow: hidden;
}

.header-ticker .marquee-text {
  color: var(--whiteColor);
  font-size: 16px;
}

.header-ticker .js-marquee {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 25px;
}

.header-ticker .js-marquee span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
}

.ot-header {
  padding-top: 12px;
}

.content-item .woocommerce-checkout-review-order {
  margin: -14px 0;
}

.content-item .woocommerce-terms-and-conditions-wrapper {
  text-align: left;
  max-width: 100%;
  margin: auto;
}

.woocommerce table.shop_table.woocommerce-checkout-review-order-table td,
.woocommerce table.shop_table.woocommerce-checkout-review-order-table th {
  padding: 14px 0;
  border-top: 1px solid var(--borderColor);
}

.tab-down-info > p {
  border-bottom: 1px solid var(--borderColor);
  padding-bottom: 32px;
  margin-bottom: 32px;
}

@media (max-width: 767px) {
  .tab-down-info > p {
    padding-bottom: 16px;
    margin-bottom: 16px;
  }
}
.blue-checkout-area .blue-tabs-info .tab-content-info .content-item.tab-down-info {
  background: var(--smokeColor);
}

.woocommerce form .form-row {
  padding: 0;
  margin: 0;
}

.woocommerce form .form-row textarea,
.woocommerce form .form-row input.input-text {
  height: 54px;
  color: #CCCCCC;
  border-radius: 12px;
  padding: 0 16px;
  background-color: var(--smokeColor);
  border: 1px solid var(--borderColor);
}

.woocommerce form .form-row label {
  font-size: 16px;
  color: #fff !important;
  font-family: var(--body-font-family);
  margin-bottom: 8px;
}

.woocommerce form .form-row label .optional {
  color: #a3c4e0 !important;
  font-weight: 400;
}

.woocommerce form .form-row label.screen-reader-text {
  display: none !important;
}

.woocommerce form .form-row select {
  height: 54px;
  padding: 0 16px;
  color: #CCCCCC;
  border-radius: 12px;
  background-color: var(--smokeColor);
  border-bottom: 1px solid var(--borderColor);
}

.woocommerce form .form-row select:focus {
  border-color: var(--primaryColor);
}

.woocommerce form .form-row select:valid {
  border: 1px solid var(--borderColor);
}

.woocommerce form .form-row select:invalid {
  border: 1px solid var(--wc-red);
}

.woocommerce form .form-row > h3 {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.woocommerce form .form-row-wide {
  clear: none;
}

.woocommerce form #billing_company_field,
.woocommerce form #billing_phone_field {
  margin-bottom: 0;
}

.woocommerce form .form-row#billing_email_field {
  margin-top: 0;
  padding-bottom: 48px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--borderColor);
}

@media (max-width: 767px) {
  .woocommerce form .form-row#billing_email_field {
    padding-bottom: 24px;
    margin-bottom: 2px;
  }
}
.woocommerce form .form-row.place-order {
  padding: 20px 24px !important;
  margin: 16px 0 0 !important;
  border-radius: var(--radius-2xl, 16px);
  border: 1px solid var(--Colors-Border-border-secondary, #0E314E);
  background: var(--Colors-Background-bg-secondary, #082035);
}

.form-row.place-order .woocommerce-terms-and-conditions-wrapper {
  max-width: 100%;
  text-align: left;
  margin: 0;
}

.form-row.place-order .security-note {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
  text-align: center;
}

.form-row.place-order .security-note span {
  color: rgba(255, 255, 255, 0.75);
  font-size: 12px;
  line-height: 1.4;
}

.form-row.place-order .security-note svg {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.order-summary-sidebar #order_review.woocommerce-checkout-review-order {
  border-radius: var(--radius-2xl, 16px);
  background: #0E314E;
  padding: 16px 20px;
  margin: 0 0 20px !important;
}

.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table {
  border: none;
  margin: 0;
}

.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table td,
.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table th {
  padding: 10px 0;
  border-top: none !important;
  border-bottom: none !important;
  color: rgba(255, 255, 255, 0.75);
  background: transparent;
}

.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table tr.order-total th,
.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table tr.order-total td,
.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table tr.order-total td strong {
  color: #fff;
}

.order-summary-sidebar #order_review .woocommerce-checkout-review-order-table .woocommerce-Price-amount {
  color: inherit;
}

@media (max-width: 767px) {
  .woocommerce form .form-row {
    width: 100% !important;
    float: none !important;
  }
  .woocommerce form .form-row#billing_company_field {
    margin-bottom: 24px !important;
  }
}
.woocommerce-billing-fields__field-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 0 !important;
}

.woocommerce-billing-fields__field-wrapper .form-row {
  width: 100%;
  -webkit-box-flex: calc(50% - 12px);
  -ms-flex: calc(50% - 12px);
  flex: calc(50% - 12px);
}

.woocommerce-billing-fields__field-wrapper .form-row#billing_email_field, .woocommerce-billing-fields__field-wrapper .form-row#email_label_field, .woocommerce-billing-fields__field-wrapper .form-row#billing_details_field {
  -webkit-box-flex: 100%;
  -ms-flex: 100%;
  flex: 100%;
}

@media (max-width: 767px) {
  .woocommerce-billing-fields__field-wrapper {
    gap: 12px;
  }
  .woocommerce-billing-fields__field-wrapper .form-row label {
    display: none !important;
  }
}
.content-item.checkout-information .woocommerce-additional-fields,
.content-item.checkout-information .woocommerce-shipping-fields {
  display: none;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  padding: 0 16px;
  line-height: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #CCCCCC;
  line-height: 54px;
}

.select2-container .select2-dropdown, .select2-container .select2-selection {
  background-color: var(--smokeColor);
  border: 1px solid var(--borderColor);
  border-radius: 12px;
  height: 54px;
}

.select2-results {
  background-color: var(--smokeColor);
  color: var(--whiteColor);
}

.select2-results li {
  color: var(--whiteColor);
}

.tab-content-payment {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

.tab-content-payment h3 {
  padding-bottom: 0 !important;
  border-bottom: none !important;
}

.tab-content-payment .title {
  margin-bottom: 0 !important;
}

#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
  text-align: left;
  padding: 0;
  border: none;
  border-bottom: none;
  margin: 0;
  display: block;
}

#add_payment_method #payment ul.payment_methods li,
.woocommerce-cart #payment ul.payment_methods li,
.woocommerce-checkout #payment ul.payment_methods li {
  border: none !important;
}

#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
  background-color: var(--smokeColor);
  color: var(--whiteColor);
  border: 1px solid var(--borderColor);
  border-radius: 12px;
}

#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
  content: "";
  display: block;
  border: 1em solid var(--smokeColor);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  position: absolute;
  top: -0.75em;
  left: 0;
  margin: -1em 0 0 2em;
}

.footer-links-wrapper .text-weight-bold {
  font-size: 16px;
  font-weight: 700;
  color: var(--whiteColor);
  margin-bottom: 24px;
}

.footer-links-bottom a {
  font-size: 16px;
  color: #CCCCCC !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-bottom: 10px;
}

.footer-links-bottom a:last-child {
  margin-bottom: 0;
}

.footer-links-bottom a:hover {
  color: var(--primaryColor) !important;
}

.footer-top-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 40px;
  max-width: 570px;
}

@media (max-width: 991px) {
  .footer-top-left {
    margin-bottom: 40px;
  }
}
@media (max-width: 575px) {
  .footer-top-left {
    gap: 40px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  .footer-top-left .footer-links-wrapper {
    -webkit-box-flex: calc(50% - 40px);
    -ms-flex: calc(50% - 40px);
    flex: calc(50% - 40px);
  }
}
.footer-top .row {
  margin-bottom: 46px;
}

.footer-big-logo {
  margin: 48px 0;
}

.footer-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.footer-logo-link {
  display: inline-block;
}

.footer-logo-img {
  max-width: 160px;
  height: auto;
}

.footer-cta-btn {
  display: inline-block;
  padding: 10px 28px;
  background: var(--primaryColor);
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none !important;
  transition: opacity 0.2s ease;
}

.footer-cta-btn:hover {
  opacity: 0.85;
}

.footer-right-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-right-col .join-discord-img {
  margin-bottom: 0;
}

.guardian-tv-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 24px;
  color: #fff !important;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none !important;
  transition: border-color 0.2s ease;
  width: fit-content;
}

.guardian-tv-btn:hover {
  border-color: var(--primaryColor);
}

.guardian-tv-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  flex-shrink: 0;
}

@media (max-width: 991px) {
  .footer-brand {
    margin-bottom: 40px;
  }
  .footer-right-col {
    margin-top: 40px;
  }
}
@media (max-width: 575px) {
  .footer-brand {
    margin-bottom: 32px;
  }
}
.footer-bottom p {
  font-size: 14px;
  color: #CCCCCC;
  margin-bottom: 24px;
}

.footer-bottom p:last-of-type {
  margin-bottom: 0;
}

.footer-logos-wrrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 20px;
  padding: 48px 0;
}

@media (max-width: 575px) {
  .footer-logos-wrrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 20px 40px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
.woocommerce-checkout .wt_sc_pagination {
  width: 100%;
  clear: both;
  margin-bottom: 15px;
  text-align: right;
  display: none;
}

/* ===== My Account Dashboard (logged in) ===== */
.woocommerce-account.logged-in #primary {
  max-width: 960px;
  margin: 60px auto;
  padding: 0 20px;
}

.woocommerce-account.logged-in #primary .woocommerce {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 40px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

@media (max-width: 767px) {
  .woocommerce-account.logged-in #primary .woocommerce {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 24px;
  }
}
.woocommerce-account.logged-in #primary #my-account-menu {
  width: 260px;
  min-width: 260px;
  background: rgba(23, 86, 115, 0.2);
  border-radius: 12px;
  padding: 24px;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

@media (max-width: 767px) {
  .woocommerce-account.logged-in #primary #my-account-menu {
    width: 100%;
    min-width: unset;
  }
}
.woocommerce-account.logged-in #primary #my-account-menu .user-profile {
  text-align: center;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.woocommerce-account.logged-in #primary #my-account-menu .user-profile .user-avatar img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 2px solid var(--primaryColor);
  margin-bottom: 12px;
}

.woocommerce-account.logged-in #primary #my-account-menu .user-profile .user-info .username {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--whiteColor);
  margin-bottom: 4px;
}

.woocommerce-account.logged-in #primary #my-account-menu .user-profile .user-info .user-email {
  display: block;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 12px;
  word-break: break-all;
}

.woocommerce-account.logged-in #primary #my-account-menu .user-profile .user-info .logout a {
  display: inline-block;
  font-size: 13px;
  font-weight: 500;
  color: var(--primaryColor);
  background: rgba(39, 166, 239, 0.1);
  border: 1px solid rgba(39, 166, 239, 0.25);
  border-radius: 6px;
  padding: 6px 16px;
  text-decoration: none;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.woocommerce-account.logged-in #primary #my-account-menu .user-profile .user-info .logout a:hover {
  background: rgba(39, 166, 239, 0.2);
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li {
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  border-bottom: none !important;
  list-style: none !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li a {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border-radius: 8px !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  -webkit-transition: all 0.2s ease !important;
  transition: all 0.2s ease !important;
  background: none !important;
  border: none !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li a .item-icon {
  width: 20px;
  text-align: center;
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.4) !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li a .item-label {
  color: inherit !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li a:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--whiteColor) !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li a:hover .item-icon {
  color: var(--primaryColor) !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li.active a,
.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li.is-active a {
  background: rgba(39, 166, 239, 0.1) !important;
  color: var(--primaryColor) !important;
}

.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li.active a .item-icon,
.woocommerce-account.logged-in #primary #my-account-menu ul.myaccount-menu li.is-active a .item-icon {
  color: var(--primaryColor) !important;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  background: rgba(23, 86, 115, 0.2);
  border-radius: 12px;
  padding: 32px;
  min-height: 300px;
}

@media (max-width: 767px) {
  .woocommerce-account.logged-in #primary .woocommerce-MyAccount-content {
    padding: 24px 20px;
  }
}
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content p {
  color: rgba(255, 255, 255, 0.7);
  font-size: 15px;
  line-height: 1.7;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content p strong {
  color: var(--whiteColor);
  font-weight: 600;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content p a {
  color: var(--primaryColor);
  text-decoration: none;
  font-weight: 500;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content p a:hover {
  text-decoration: underline;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content h2,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content h3 {
  color: var(--whiteColor);
  font-weight: 600;
  margin-bottom: 16px;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content table {
  width: 100%;
  border-collapse: collapse;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content table th {
  color: rgba(255, 255, 255, 0.6);
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  text-align: left;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content table td {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content table td a {
  color: var(--primaryColor);
  text-decoration: none;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content table td a:hover {
  text-decoration: underline;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content button[type=submit],
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content .button {
  background: var(--primaryColor);
  border: none;
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 12px 28px;
  cursor: pointer;
  font-family: var(--body-font-family);
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content .woocommerce-Button:hover,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content button[type=submit]:hover,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content .button:hover {
  opacity: 0.85;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input.input-text,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=text],
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=email],
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=password],
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content textarea,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content select {
  width: 100%;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: 1px 1px 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 100px 0 rgba(255, 255, 255, 0.1) inset;
  box-shadow: 1px 1px 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 100px 0 rgba(255, 255, 255, 0.1) inset;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
  height: 54px;
  padding: 0 20px;
  font-size: 16px;
  font-family: var(--body-font-family);
  outline: none;
  -webkit-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input.input-text::-webkit-input-placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=text]::-webkit-input-placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=email]::-webkit-input-placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=password]::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input.input-text::placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=text]::placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=email]::placeholder,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=password]::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input.input-text:focus,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=text]:focus,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=email]:focus,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content input[type=password]:focus,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content textarea:focus,
.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content select:focus {
  border-color: var(--primaryColor);
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 8px;
}

.woocommerce-account.logged-in #primary .woocommerce-MyAccount-content label .required {
  color: var(--primaryColor);
}

/* ===== My Account Login Page ===== */
.woocommerce-account:not(.logged-in) #primary {
  max-width: 520px;
  margin: 80px auto;
  padding: 0 20px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce h2 {
  font-size: 35px;
  font-weight: 600;
  color: var(--whiteColor);
  text-align: center;
  margin-bottom: 32px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login {
  background: rgba(23, 86, 115, 0.2);
  border-radius: 12px;
  padding: 32px;
  border: none;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row {
  margin-bottom: 20px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 8px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row label .required {
  color: var(--primaryColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.input-text,
.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.woocommerce-Input {
  width: 100%;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 1px 1px 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 100px 0 rgba(255, 255, 255, 0.1) inset;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
  height: 54px;
  padding: 0 20px;
  font-size: 16px;
  font-family: var(--body-font-family);
  outline: none;
  -webkit-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.input-text::-webkit-input-placeholder,
.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.woocommerce-Input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.input-text::placeholder,
.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.woocommerce-Input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.input-text:focus,
.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row input.woocommerce-Input:focus {
  border-color: var(--primaryColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row .password-input {
  position: relative;
  display: block;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row .password-input input {
  width: 100%;
  padding-right: 50px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row .password-input .show-password-input {
  position: absolute;
  right: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  padding: 0;
  font-size: 14px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .form-row .password-input .show-password-input:hover {
  color: var(--whiteColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  cursor: pointer;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: var(--primaryColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .woocommerce-form-login__submit {
  width: 100%;
  background: var(--primaryColor);
  border: none;
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  padding: 14px 36px;
  cursor: pointer;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  margin-top: 8px;
  font-family: var(--body-font-family);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .woocommerce-form-login__submit:hover {
  opacity: 0.85;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .lost_password {
  text-align: center;
  margin-top: 16px;
  margin-bottom: 0;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .lost_password a {
  color: var(--primaryColor);
  font-size: 14px;
  text-decoration: none;
  font-weight: 500;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login .lost_password a:hover {
  text-decoration: underline;
}

@media (max-width: 767px) {
  .woocommerce-account:not(.logged-in) #primary {
    margin: 40px auto;
  }
  .woocommerce-account:not(.logged-in) #primary .woocommerce h2 {
    font-size: 28px;
    margin-bottom: 24px;
  }
  .woocommerce-account:not(.logged-in) #primary .woocommerce .woocommerce-form-login {
    padding: 24px 20px;
  }
  .woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password {
    padding: 24px 20px;
  }
}
/* Lost Password Page */
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password {
  background: rgba(23, 86, 115, 0.2);
  border-radius: 12px;
  padding: 32px;
  border: none;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password > p {
  color: rgba(255, 255, 255, 0.7);
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 24px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row {
  margin-bottom: 20px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 8px;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row label .required {
  color: var(--primaryColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.input-text,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.woocommerce-Input {
  width: 100%;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: 1px 1px 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 100px 0 rgba(255, 255, 255, 0.1) inset;
  box-shadow: 1px 1px 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 100px 0 rgba(255, 255, 255, 0.1) inset;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
  height: 54px;
  padding: 0 20px;
  font-size: 16px;
  font-family: var(--body-font-family);
  outline: none;
  -webkit-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.input-text::-webkit-input-placeholder,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.woocommerce-Input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.input-text::placeholder,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.woocommerce-Input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.input-text:focus,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .form-row input.woocommerce-Input:focus {
  border-color: var(--primaryColor);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .woocommerce-Button,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password button[type=submit] {
  width: 100%;
  background: var(--primaryColor);
  border: none;
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  padding: 14px 36px;
  cursor: pointer;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  font-family: var(--body-font-family);
}

.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password .woocommerce-Button:hover,
.woocommerce-account:not(.logged-in) #primary .woocommerce .lost_reset_password button[type=submit]:hover {
  opacity: 0.85;
}

/* Checkout form input styling */
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-container--default .select2-selection--single,
.woocommerce-checkout .select2-container--default .select2-selection--multiple,
.blue-custom-checkout .futures-form-row .input-text,
.order-summary-coupon input#coupon_code {
  border-radius: var(--radius-full, 9999px) !important;
  border: 1px solid #194E7B !important;
  background: #082035 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #ffffff !important;
  height: 54px !important;
  padding: 0 20px !important;
  font-size: 16px !important;
  font-family: var(--body-font-family) !important;
}

.woocommerce-checkout input.input-text,
.order-summary-coupon input#coupon_code,
.woocommerce-checkout .select2-container--default .select2-selection--single,
.woocommerce-checkout .select2-container--default .select2-selection--multiple {
  height: 36px !important;
  font-size: 14px !important;
}

.woocommerce-checkout textarea {
  min-height: 54px;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.woocommerce-checkout .woocommerce form .form-row input.input-text,
.woocommerce-checkout .woocommerce form .form-row textarea,
.woocommerce-checkout .woocommerce form .form-row select {
  border-radius: var(--radius-full, 9999px) !important;
  border: 1px solid #194E7B !important;
  background: #082035 !important;
  border-bottom: 1px solid #194E7B !important;
}

.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--multiple,
.blue-custom-checkout .futures-form-row .input-text:focus,
.order-summary-coupon input#coupon_code:focus {
  outline: none !important;
  border-color: var(--primaryColor, #27A6EF) !important;
  background: #082035 !important;
  box-shadow: none !important;
}

.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
  color: #ffffff !important;
  line-height: 36px !important;
  padding-left: 0 !important;
}

.woocommerce-checkout .select2-container .select2-dropdown,
.woocommerce-checkout .select2-container .select2-selection {
  border-radius: var(--radius-full, 9999px) !important;
  border: 1px solid #194E7B !important;
  background: #082035 !important;
}

/* Unified checkout input placeholders */
.woocommerce-checkout input.input-text::-webkit-input-placeholder,
.woocommerce-checkout textarea::-webkit-input-placeholder,
.order-summary-coupon input#coupon_code::-webkit-input-placeholder,
.coupon-form input#coupon_code::-webkit-input-placeholder {
  color: #a3c5d0 !important;
  opacity: 1;
}

.woocommerce-checkout input.input-text::-moz-placeholder,
.woocommerce-checkout textarea::-moz-placeholder,
.order-summary-coupon input#coupon_code::-moz-placeholder,
.coupon-form input#coupon_code::-moz-placeholder {
  color: #a3c5d0 !important;
  opacity: 1;
}

.woocommerce-checkout input.input-text::placeholder,
.woocommerce-checkout textarea::placeholder,
.order-summary-coupon input#coupon_code::placeholder,
.coupon-form input#coupon_code::placeholder {
  color: #a3c5d0 !important;
  opacity: 1;
}

/* ==================== PROMO BANNER (matches Figma node 2853:45018) ==================== */
.header-promo-banner {
  background: linear-gradient(180deg, #2db1fb 0%, #17597e 100%);
  padding: 8px 48px;
  text-align: center;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  z-index: 999;
  position: relative;
}
.header-promo-banner .banner-content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.header-promo-banner .promo-badge {
  background: none;
  padding: 0;
  border-radius: 0;
  letter-spacing: 0;
  color: #f5f5fc;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}
.header-promo-banner .promo-text {
  color: #f5f5fc;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 20px;
}
.header-promo-banner .promo-dot {
  color: rgba(245, 245, 252, 0.5);
  font-size: 14px;
  line-height: 20px;
}
.header-promo-banner .promo-code-box {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #0b0c16;
  border: none;
  padding: 2px 4px 2px 12px;
  border-radius: 8px;
}
.header-promo-banner .promo-code-box .code-text {
  color: #f5f8fa;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  font-family: 'Montserrat', 'Inter', sans-serif;
}
.header-promo-banner .promo-code-box .copy-code-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  opacity: 0.8;
  transition: opacity 0.2s;
}
.header-promo-banner .promo-code-box .copy-code-btn:hover {
  opacity: 1;
}
.copy-code-btn.copied .copy-icon-default { display: none !important; }
.copy-code-btn.copied .copy-icon-success { display: inline-flex !important; }

/* ==================== TWO COLUMN LAYOUT GRID ==================== */
.checkout-layout-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1.5fr 32px 1fr;
  grid-template-columns: 1.5fr 1fr;
  gap: 32px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
  margin-top: 40px;
}

@media (max-width: 991px) {
  .checkout-layout-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.checkout-left-col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
}

.checkout-right-col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  position: -webkit-sticky;
  position: sticky;
  top: 24px;
}

@media (max-width: 991px) {
  .checkout-right-col {
    position: static;
  }
}
/* ==================== ADD-ONS STYLING ==================== */
.checkout-addons .available-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
}

.checkout-addons .addons-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  margin-bottom: 0 !important;
  width: 100% !important;
}
.checkout-addons .addons-item:before,
.checkout-addons .addons-item.active:before {
  content: none;
  display: none;
}

.checkout-addons .addons-item:hover {
  background: rgba(39, 166, 239, 0.03) !important;
  border-color: rgba(39, 166, 239, 0.2) !important;
}

.checkout-addons .addons-item.active {
  background: rgba(39, 166, 239, 0.08) !important;
  border-color: var(--primaryColor) !important;
}

.checkout-addons .addons-item.active .addon-checkbox {
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
}

.checkout-addons .addons-item.active .addon-checkbox::after {
  content: "";
  display: block;
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-left: 5px;
  margin-top: 1px;
}

.checkout-addons .addons-item .addon-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}

.checkout-addons .addons-item .addon-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: rgba(39, 166, 239, 0.1);
  border-radius: 10px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.checkout-addons .addons-item .addon-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
}

.checkout-addons .addons-item .addon-title-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.checkout-addons .addons-item .addon-title {
  color: #fff;
  font-size: 16px;
  font-weight: 400;
}

.checkout-addons .addons-item .addon-badge {
  background: rgba(39, 166, 239, 0.15);
  color: var(--primaryColor);
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
}

.checkout-addons .addons-item .addon-desc {
  color: #a3c4e0;
  font-weight: 300;
  font-size: 14px;
}

.checkout-addons .addons-item .addon-checkbox {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

/* ==================== QUANTITY STEPPER ==================== */
.quantity-selector-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 20px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.quantity-selector-section .qty-label-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
}

.quantity-selector-section .qty-title {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

.quantity-selector-section .qty-sub {
  color: #6da5d5;
  font-size: 13px;
}

.quantity-selector-section .qty-stepper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 6px 12px;
  border-radius: 99px;
}

.quantity-selector-section .qty-stepper .qty-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 100%;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
}

.quantity-selector-section .qty-stepper .qty-btn:hover {
  background: rgba(255, 255, 255, 0.05);
}

.quantity-selector-section .qty-stepper .qty-val {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  min-width: 20px;
  text-align: center;
}

/* ==================== BUNDLE DISCOUNT ==================== */
.bundle-discount-section {
  padding: 20px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.bundle-discount-section .bundle-title {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
}

.bundle-discount-section .bundle-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
}

.bundle-discount-section .bundle-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 12px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.01);
  border: 1px solid rgba(255, 255, 255, 0.03);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0.5;
  cursor: pointer;
}

.bundle-discount-section .bundle-row:hover {
  opacity: 0.85;
  background: rgba(39, 166, 239, 0.03);
  border-color: rgba(39, 166, 239, 0.2);
}

.bundle-discount-section .bundle-row.active {
  opacity: 1;
  background: rgba(39, 166, 239, 0.05);
  border-color: rgba(39, 166, 239, 0.3);
}

.bundle-discount-section .bundle-row.active .bundle-check {
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
}

.bundle-discount-section .bundle-row.active .bundle-check svg {
  display: block;
}

.bundle-discount-section .bundle-row .bundle-row-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
}

.bundle-discount-section .bundle-row .bundle-check {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.bundle-discount-section .bundle-row .bundle-check svg {
  display: none;
}

.bundle-discount-section .bundle-row .bundle-name {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
}

.bundle-discount-section .bundle-row .bundle-desc {
  font-size: 14px;
  font-weight: 500;
  color: #a3c4e0;
}

.bundle-discount-section .bundle-row .discount-green {
  color: #47cd89 !important;
}

/* ==================== PAYMENT METHOD SELECTION ==================== */
.order-summary-payment {
  padding: 20px 0;
}

.order-summary-payment .payment-title {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
}

.order-summary-payment .woocommerce-checkout-payment {
  background: transparent !important;
  padding: 0 !important;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin: 0 !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li:has(input:checked) {
  border-color: rgba(39, 166, 239, 0.45) !important;
  background: rgba(39, 166, 239, 0.06) !important;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li label {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding-left: 34px !important;
  margin: 0 !important;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li label img {
  max-height: 24px;
  width: auto;
  margin-left: auto;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li input[type=radio] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
}

/* Description renders as an inline subtitle under the title (no bordered box) — Figma 2395:38786 */
.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li .payment_box {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: #6da5d5 !important;
  font-size: 14px !important;
  line-height: 20px !important;
  margin: -2px 0 0 34px !important;
  width: fit-content !important;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li .payment_box::before {
  display: none !important;
}

.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li .payment_box p {
  margin: 0;
}

/* Provider name inside the subtitle (e.g. "Pay securely using <strong>Paytiko</strong>") */
.order-summary-payment .woocommerce-checkout-payment ul.payment_methods li .payment_box strong {
  color: #f5f8fa !important;
  font-weight: 600 !important;
}

/* Simplified checkout footer */
.footer-wrapper--checkout {
  padding-top: 40px;
}

.footer-wrapper--checkout .footer-bottom {
  margin-bottom: 24px;
}

.footer-wrapper--checkout .footer-logos-wrrapper {
  justify-content: center;
}

/* ==================== SECURITY FOOTER (legacy — moved into .place-order) ==================== */
.order-summary-footer {
  display: none;
}

/* ==================== CHECKOUT REDESIGN — NEW LAYOUT COMPONENTS ==================== */
/* Let the two-column grid use the full content width */
.checkout-content-wrap .blue-tabs-info {
  max-width: 100%;
  margin: 0;
}

.checkout-content-wrap .blue-tabs-info {
  margin-bottom: 0;
}

/* Card shell for every section inside the grid */
.checkout-layout-grid .checkout-section.content-item,
.checkout-layout-grid .customer-info-card,
.checkout-layout-grid .billing-details-card {
  border-radius: var(--radius-2xl, 16px);
  border: 1px solid var(--Colors-Border-border-secondary, #0E314E);
  background: var(--Colors-Background-bg-secondary, #082035);
  overflow: hidden;
}

/* Section header (title + optional Edit button) */
.checkout-layout-grid .section-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 18px 24px 6px;
}

.checkout-layout-grid .section-header h3 {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.75) !important;
}

.checkout-layout-grid .section-header h3 span {
  color: inherit !important;
}

/* Generic inner padding for section bodies */
.checkout-layout-grid .section-body {
  padding: 24px;
}

/* Edit button (Product summary) — shares nav pill styles with Login / Apply */

/* Product summary rows */
.product-summary-display {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 14px;
  padding: 20px 24px;
}

.summary-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.summary-label {
  color: #8fb3cf;
  font-size: 15px;
}

.summary-value {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  text-align: right;
}

/* Product edit panel (expandable selection UI) */
.product-edit-panel {
  padding: 8px 24px 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.product-edit-panel .edit-panel-header h3 {
  font-size: 18px !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.75) !important;
  margin: 8px 0 4px !important;
  padding: 0 !important;
  border: none !important;
}

.product-edit-panel .edit-panel-header h3 span {
  color: inherit !important;
}

.product-edit-panel .title {
  display: block;
  margin: 18px 0 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

/* Market panels toggle */
.market-panel {
  display: none;
}

.market-panel.active {
  display: block;
}

/* Re-apply the selection pill styling (lost when sections moved out of .tab-content-info) */
.product-edit-panel ul {
  list-style: none;
  margin: 0 0 8px;
  padding: 8px;
  border: 1px solid var(--borderColor);
  border-radius: 12px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 6px;
}

.product-edit-panel ul li {
  position: relative;
  z-index: 2;
  display: inline-block;
}

.product-edit-panel ul li.item-with-icon {
  position: relative;
}

.product-edit-panel ul li.item-with-icon .popular-tag {
  position: absolute;
  top: -10px;
  right: -6px;
  left: auto;
  -webkit-transform: none;
  transform: none;
  font-size: 14px;
  line-height: 1;
  z-index: 3;
  pointer-events: none;
}

.product-edit-panel ul li button {
  z-index: 1;
  position: relative;
  font-size: 15px;
  padding: 8px 18px;
  min-width: 70px;
  border-radius: var(--radius-full, 9999px);
  color: var(--whiteColor);
  border: 1px solid var(--Gradient-Brand-Primary, #2DB1FB);
  background: var(--Component-colors-Components-Buttons-Secondary-color-button-secondary-color-bg, #082035);
  box-shadow: 0 0 0 1px var(--Colors-Effects-Shadows-shadow-skeumorphic-inner-border, rgba(12, 14, 18, 0.18)) inset, 0 -2px 0 0 var(--Colors-Effects-Shadows-shadow-skeumorphic-inner, rgba(12, 14, 18, 0.05)) inset, 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(255, 255, 255, 0));
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

.product-edit-panel ul li button:not(.active):hover {
  opacity: 0.9;
}

/* Platform buttons — icon sits to the right of the name */
.product-edit-panel ul.blg-platform li button,
.product-edit-panel ul.blg-futures-platform li button,
.product-edit-panel ul.blg-crypto-platform li button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
}

.product-edit-panel .platform-icon {
  max-height: 20px;
  width: auto;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.product-edit-panel ul li button.active {
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
  color: #fff;
  box-shadow: none;
}

.product-edit-panel ul li button.dsbl-btn2 {
  opacity: 0.4;
  pointer-events: none;
}

.product-edit-panel ul li.challenge-hidden,
.product-edit-panel ul li.capital-hidden {
  display: none !important;
}

/* Customer info / billing cards (section-body supplies padding — not the field wrapper) */
.checkout-information-wrapper .woocommerce-billing-fields__field-wrapper {
  padding: 0 !important;
}

.checkout-layout-grid .customer-info-card,
.checkout-layout-grid .billing-details-card {
  padding: 0;
}

.checkout-layout-grid .customer-info-card .form-row,
.checkout-layout-grid .billing-details-card .form-row {
  padding: 0;
}

.customer-info-card .form-row#billing_email_field,
.billing-details-card .form-row#billing_email_field {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  border-bottom: none !important;
}

/* Futures account auth */
.futures-auth-tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
}

.futures-auth-tab {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.02);
  color: #a3c4e0;
  font-weight: 600;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

.futures-auth-tab.active {
  border-color: var(--primaryColor);
  background: rgba(39, 166, 239, 0.08);
  color: #fff;
}

.futures-auth-panel {
  display: none;
}

.futures-auth-panel.active {
  display: block;
}

.futures-form-row {
  margin-bottom: 16px;
}

.futures-form-row label {
  display: block;
  margin-bottom: 8px;
  color: #fff;
  font-size: 14px;
}

.futures-auth-submit {
  background: var(--primaryColor);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 12px 28px;
  font-weight: 600;
  cursor: pointer;
}

.futures-auth-message {
  margin-top: 12px;
  font-size: 14px;
}

.futures-auth-message.error {
  color: #ff6b6b;
}

.futures-auth-message.success {
  color: #47cd89;
}

/* Order summary sidebar spacing */
.order-summary-sidebar .section-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.order-summary-sidebar .order-summary-coupon {
  margin-bottom: 20px;
}

/* Language selector in nav */
.lang-selector-li {
  margin-right: 14px !important;
  vertical-align: middle;
}

.lang-selector-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--borderColor);
  background: var(--smokeColor);
  overflow: hidden;
}

.lang-selector-btn .lang-flag {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
}

/* Copy button checkmark feedback */
.copy-code-btn.copied .copy-icon-default {
  display: none !important;
}

.copy-code-btn.copied .copy-icon-success {
  display: inline-flex !important;
}

/* Hide apartment, suite, unit label */
#billing_address_2_field label {
  display: none !important;
}

/* ==================== THANK YOU PAGE ==================== */
.blue-checkout-area.thankyou-page {
  padding: 48px 0 120px;
}

.thankyou-page .thankyou-content-wrap {
  max-width: 700px;
  margin: 0 auto;
}

.thankyou-page .thankyou-success-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #27A6EF 0%, #0D98E7 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  box-shadow: 0 0 40px rgba(39, 166, 239, 0.3), 0 0 80px rgba(39, 166, 239, 0.15);
}

.thankyou-page .thankyou-success-icon svg {
  width: 40px;
  height: 40px;
}

.thankyou-page .blue-section-title.thankyou-title {
  margin-top: 0;
  margin-bottom: 48px;
}

.thankyou-page .blue-section-title.thankyou-title p strong {
  color: var(--whiteColor);
}

.thankyou-page .checkout-section.content-item.thankyou-section {
  margin-bottom: 24px;
}

.thankyou-page .thankyou-section .section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid var(--Colors-Border-border-secondary, #0E314E);
}

.thankyou-page .thankyou-section .section-header h3 {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.75) !important;
}

.thankyou-page .thankyou-section .section-body {
  padding: 24px;
}

.thankyou-page .thankyou-section .section-header h3 span {
  color: inherit !important;
}

.thankyou-page .product-summary-display.thankyou-summary {
  padding: 0;
  gap: 14px;
}

.thankyou-page .thankyou-order-totals {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--Colors-Border-border-secondary, #0E314E);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.thankyou-page .thankyou-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 16px;
  margin-top: 8px;
  border-top: 1px solid var(--Colors-Border-border-secondary, #0E314E);
}

.thankyou-page .thankyou-total-label {
  font-size: 18px;
  font-weight: 600;
  color: var(--whiteColor);
}

.thankyou-page .thankyou-total-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--whiteColor);
}

.thankyou-page .thankyou-status-badge {
  display: inline-block;
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  text-transform: capitalize;
}

.thankyou-page .thankyou-status-badge.status-completed,
.thankyou-page .thankyou-status-badge.status-processing {
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
}

.thankyou-page .thankyou-status-badge.status-on-hold {
  background: rgba(234, 179, 8, 0.15);
  color: #eab308;
}

.thankyou-page .thankyou-status-badge.status-pending {
  background: rgba(39, 166, 239, 0.15);
  color: #27A6EF;
}

.thankyou-page .thankyou-status-badge.status-failed,
.thankyou-page .thankyou-status-badge.status-cancelled {
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
}

.thankyou-page .thankyou-next-steps {
  list-style: none;
  padding: 0;
  margin: 0;
}

.thankyou-page .thankyou-next-steps li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--Colors-Border-border-secondary, #0E314E);
  font-size: 16px;
  color: var(--bodyColor);
  line-height: 1.5;
}

.thankyou-page .thankyou-next-steps li:last-child {
  border-bottom: none;
}

.thankyou-page .thankyou-next-steps li strong {
  color: var(--whiteColor);
}

.thankyou-page .thankyou-next-steps a.thankyou-link {
  color: var(--primaryColor) !important;
  text-decoration: underline !important;
}

.thankyou-page .thankyou-step-number {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.thankyou-page .thankyou-cta {
  text-align: center;
  margin-top: 40px;
}

.thankyou-page .thankyou-cta .btn-primary-cta {
  display: inline-block;
  padding: 14px 40px;
  background: var(--primaryColor);
  color: var(--whiteColor) !important;
  font-size: 16px;
  font-weight: 500;
  border-radius: 64px;
  border: none;
  text-decoration: none !important;
  transition: var(--transition);
}

.thankyou-page .thankyou-cta .btn-primary-cta:hover {
  opacity: 0.9;
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(39, 166, 239, 0.3);
}

.thankyou-page .thankyou-cta .btn-secondary-cta {
  display: inline-block;
  padding: 14px 40px;
  background: var(--smokeColor);
  color: var(--whiteColor) !important;
  font-size: 16px;
  font-weight: 500;
  border-radius: 64px;
  border: 1px solid var(--borderColor);
  text-decoration: none !important;
  margin-left: 12px;
  transition: var(--transition);
}

.thankyou-page .thankyou-cta .btn-secondary-cta:hover {
  border-color: var(--primaryColor);
}

.thankyou-page .thankyou-failed {
  text-align: center;
  padding: 60px 20px;
}

.thankyou-page .thankyou-failed-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(239, 68, 68, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
}

.thankyou-page .thankyou-failed h2 {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 12px;
}

.thankyou-page .thankyou-failed p {
  color: var(--bodyColor);
  font-size: 16px;
  max-width: 500px;
  margin: 0 auto 24px;
  line-height: 1.6;
}

.thankyou-page .thankyou-failed .btn-primary-cta {
  display: inline-block;
  padding: 14px 40px;
  background: var(--primaryColor);
  color: var(--whiteColor) !important;
  font-size: 16px;
  font-weight: 500;
  border-radius: 64px;
  text-decoration: none !important;
  transition: var(--transition);
}

/*# sourceMappingURL=style.css.map */

/* ==================== BNPL SELECTOR (single page) ==================== */
.bnpl-selector {
  margin-top: 18px;
  padding: 18px 24px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.bnpl-selector .title {
  margin: 0 0 10px;
}
.bnpl-selector ul {
  margin-bottom: 18px;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bnpl-selector ul li button {
  z-index: 1;
  position: relative;
  font-size: 15px;
  padding: 8px 18px;
  min-width: 70px;
  border-radius: var(--radius-full, 9999px);
  color: var(--whiteColor, #fff);
  border: 1px solid var(--Gradient-Brand-Primary, #2DB1FB);
  background: #082035;
  cursor: pointer;
  transition: var(--transition, all 0.2s);
}
.bnpl-selector ul li button:not(.active):hover { opacity: 0.9; }
.bnpl-selector ul li button.active {
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
  color: #fff;
}

/* =========================================================================
   ACCOUNT INFORMATION REDESIGN (Figma node 2223:13040)
   Left column: heading + divider, collapsed Account card with Edit pill,
   merged Customer-info/Billing card with placeholder-only pill fields.
   ========================================================================= */

/* ---- "Account information" heading + trailing divider line ---- */
.checkout-col-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 16px;
}
.checkout-col-heading__title {
  margin: 0;
  font-family: "Inter", var(--body-font-family);
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
  color: var(--Colors-Text-text-secondary, #a3c4e0);
  white-space: nowrap;
}
.checkout-col-heading__divider {
  flex: 1 1 0;
  height: 1px;
  background: var(--Colors-Border-border-secondary, #0e314e);
}

/* ---- Section header titles → Figma "Account" (Montserrat 18 semibold, white) ---- */
.checkout-layout-grid .section-header h3 {
  font-family: "Montserrat", var(--body-font-family);
  font-weight: 600 !important;
  color: var(--Colors-Text-text-primary, #f5f8fa) !important;
}

/* ---- Edit pill (secondary button per Figma button-secondary tokens) ---- */
.checkout-layout-grid .edit-product-btn {
  font-size: 12px !important;
  font-weight: 600;
  line-height: 18px;
  padding: 7px 12px;
  border-radius: 9999px;
  color: var(--button-secondary-fg, #a3c4e0) !important;
  background: var(--button-secondary-bg, #082035);
  border: 1px solid var(--button-secondary-border, #194e7b);
}
.checkout-layout-grid .edit-product-btn:hover {
  color: #fff !important;
  border-color: #2db1fb !important;
}

/* ---- Account summary rows: Figma colors/sizes ---- */
.summary-label { color: var(--Colors-Text-text-secondary, #a3c4e0); font-size: 16px; }
.summary-value { color: var(--Colors-Text-text-primary, #f5f8fa); font-size: 16px; }

/* ---- Merged Customer-info + Billing card ---- */
.checkout-layout-grid .customer-billing-card .section-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.billing-subsection { display: flex; flex-direction: column; gap: 8px; }
.billing-subsection__label {
  font-family: "Montserrat", var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--Colors-Text-text-primary, #f5f8fa);
}
.billing-subsection__divider {
  display: block;
  height: 1px;
  width: 100%;
  background: var(--Colors-Border-border-secondary, #0e314e);
}

/* Neutralise the old email field divider/spacing inside the merged card */
.customer-billing-card #billing_email_field {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  border-bottom: none !important;
}

/* ---- Placeholder-only: visually hide field labels (kept for screen readers) ---- */
.customer-billing-card .form-row > label {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---- Single-column layout (First/Last name share a row) ---- */
.customer-billing-card .woocommerce-billing-fields__field-wrapper {
  gap: 12px;
}
.customer-billing-card .woocommerce-billing-fields__field-wrapper .form-row {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
  width: 100%;
}
.customer-billing-card .woocommerce-billing-fields__field-wrapper .form-row#billing_first_name_field,
.customer-billing-card .woocommerce-billing-fields__field-wrapper .form-row#billing_last_name_field {
  -ms-flex: 1 1 calc(50% - 6px);
  flex: 1 1 calc(50% - 6px);
  min-width: 200px;
}

/* Visual order (Figma): name → country → street → city → state → postcode →
   apartment(optional) → phone. THWCFE controls DOM order, so order via flexbox. */
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_first_name_field { order: 1; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_last_name_field  { order: 2; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_company_field    { order: 3; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_country_field    { order: 4; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_address_1_field  { order: 5; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_city_field       { order: 6; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_state_field      { order: 7; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_postcode_field   { order: 8; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_address_2_field  { order: 9; }
.customer-billing-card .woocommerce-billing-fields__field-wrapper #billing_phone_field      { order: 10; }

/* ---- Pill inputs / select per Figma (radius-full, bg-secondary, border-primary) ---- */
.customer-billing-card .form-row input.input-text,
.customer-billing-card .form-row textarea,
.customer-billing-card .form-row select {
  height: 52px;
  border-radius: 9999px;
  background-color: var(--Colors-Background-bg-secondary, #082035);
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  color: var(--Colors-Text-text-primary, #f5f8fa);
  padding: 0 18px;
}
.customer-billing-card .form-row textarea {
  height: auto;
  min-height: 96px;
  border-radius: 16px;
  padding: 14px 18px;
}
.customer-billing-card .form-row input.input-text::placeholder,
.customer-billing-card .form-row textarea::placeholder {
  color: var(--Colors-Text-text-placeholder, #3386cc);
  opacity: 1;
}
.customer-billing-card .form-row input.input-text:focus,
.customer-billing-card .form-row textarea:focus,
.customer-billing-card .form-row select:focus {
  border-color: #2db1fb;
}

/* Select2 country dropdown → pill to match */
.customer-billing-card .select2-container--default .select2-selection--single {
  height: 52px;
  border-radius: 9999px !important;
  background-color: var(--Colors-Background-bg-secondary, #082035);
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
}
.customer-billing-card .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 52px;
  color: var(--Colors-Text-text-primary, #f5f8fa);
  padding-left: 42px;
}
.customer-billing-card .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 50px;
}
.customer-billing-card .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--Colors-Text-text-placeholder, #3386cc);
}

/* ---- Leading icons: mail on email, globe on country ----
   The global `.woocommerce-checkout … input.input-text { background:#082035 !important }`
   shorthand wipes background-image, so the icon declarations need !important too. */
.customer-billing-card #billing_email_field input.input-text {
  padding-left: 42px !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236da5d5'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='2'%20y='4'%20width='20'%20height='16'%20rx='2'/%3E%3Cpath%20d='m22%207-10%205L2%207'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 16px center !important;
}
.customer-billing-card #billing_country_field .select2-container {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236da5d5'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M2%2012h20'/%3E%3Cpath%20d='M12%202a15.3%2015.3%200%200%201%204%2010%2015.3%2015.3%200%200%201-4%2010%2015.3%2015.3%200%200%201-4-10%2015.3%2015.3%200%200%201%204-10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 16px center !important;
}

.futures-avatar img.avatar {
  border-radius: 50% !important;
}
.futures-logged-in .futures-user-info .futures-user-details {
  display: flex;
  gap: 4px;
}

/* =========================================================================
   ADD-ONS REDESIGN (Figma node 2223:12563) + gradient borders / button
   ========================================================================= */

/* "Additional information" / order notes removed — hide the empty wrapper. */
.woocommerce-additional-fields { display: none !important; }

/* Section is now a heading + standalone cards (no outer card shell) */
.checkout-addons { margin-top: 4px; }
.checkout-addons .available-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
}

/* Add-on cards: plain border when idle, gradient border on hover / when selected */
.checkout-addons .addons-item {
  border: 1px solid #0E314E !important;
  background: #082035 !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
}
.checkout-addons .addons-item:hover {
  border: 1px solid transparent !important;
  background:
    linear-gradient(180deg, #082035 0%, #082035 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box !important;
}
/* Selected state: same gradient border as hover (per spec) */
.checkout-addons .addons-item.active {
  border: 1px solid transparent !important;
  background:
    linear-gradient(180deg, #082035 0%, #082035 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box !important;
}

/* Icon: line icon, no filled box (Figma) */
.checkout-addons .addons-item .addon-icon {
  background: none;
  width: 32px;
  height: 32px;
  border-radius: 0;
}
.checkout-addons .addons-item .addon-icon svg {
  width: 32px;
  height: 32px;
}

/* Badge: outlined pill (Figma) */
.checkout-addons .addons-item .addon-badge {
  background: transparent;
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  color: var(--primaryColor, #2DB1FB);
  border-radius: 9999px;
  font-weight: 600;
  padding: 1px 8px;
}

/* Supporting text tone */
.checkout-addons .addons-item .addon-desc {
  color: #6da5d5;
}

/* ---- Payment-method cards: #0E314E border idle, gradient border when selected ----
   NOTE: `.woocommerce-checkout #payment ul.payment_methods li { border:none!important }`
   (id-bearing) wins over class-only selectors, so these MUST include #payment. */
.order-summary-payment #payment ul.payment_methods li {
  border: 1px solid #0E314E !important;
  background: #082035 !important;
}
.order-summary-payment #payment ul.payment_methods li:hover {
  border: 1px solid transparent !important;
  background:
    linear-gradient(180deg, #082035 0%, #082035 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box !important;
}
.order-summary-payment #payment ul.payment_methods li:has(input:checked) {
  border: 1px solid transparent !important;
  background:
    linear-gradient(180deg, #082035 0%, #082035 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box !important;
}

/* ---- Gradient "place order" / payment button (per provided spec) ---- */
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  border: 1px solid transparent !important;
  background:
    linear-gradient(63deg, oklch(0.4422 0.0879 238.67) 16.72%, #2db1fb 83.39%) padding-box,
    linear-gradient(63deg,
      color-mix(in oklch, oklch(0.4422 0.0879 238.67) 65%, transparent) 16.72%,
      color-mix(in oklch, #2db1fb 65%, transparent) 83.39%) border-box !important;
  background-clip: padding-box, border-box !important;
}
.woocommerce #payment #place_order::before,
.woocommerce-page #payment #place_order::before {
  display: none !important;
}
.woocommerce #payment #place_order:hover,
.woocommerce-page #payment #place_order:hover {
  filter: brightness(1.08);
}

/* =========================================================================
   PLAN SELECTOR REDESIGN (Figma node 2395:39389 / layout 2395:38687)
   Separate card below the Account card; new tab-button states + badges.
   ========================================================================= */

/* The selector is its own card (page-bg fill + border, sits below Account) */
.checkout-selector-card {
  background: var(--Colors-Background-bg-primary, #081a28) !important;
  border: 1px solid var(--Colors-Border-border-primary, #194e7b) !important;
  border-radius: var(--radius-xl, 12px) !important;
  padding: 24px !important;
  margin: 0 !important;
}
.checkout-selector-card .edit-panel-header { display: none !important; }

/* Section labels + dividers between sections */
.checkout-selector-card .title {
  display: block;
  font-family: "Montserrat", var(--body-font-family);
  font-size: 14px;
  font-weight: 400;
  color: var(--Colors-Text-text-primary, #f5f8fa);
  border-top: 1px solid var(--Colors-Border-border-secondary, #0e314e);
  margin: 24px 0 12px;
  padding-top: 24px;
}
/* First section in each card has no divider above it */
.product-edit-panel.checkout-selector-card > .title,
.bnpl-selector.checkout-selector-card > .title:first-of-type {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

/* Button group: plain flex, no pill-group box */
.checkout-selector-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: none !important;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.checkout-selector-card ul li {
  position: relative;
  display: inline-block;
}

/* Tab button — base (unselected) */
.checkout-selector-card ul li button {
  height: 40px;
  min-width: 120px;
  padding: 8px 12px;
  border-radius: var(--radius-sm, 6px);
  font-family: "Montserrat", var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  color: var(--Colors-Text-text-secondary, #a3c4e0);
  background: var(--Colors-Background-bg-secondary, #082035);
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  box-shadow: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: var(--transition, all .2s);
}
.checkout-selector-card .blg-products li button,
.checkout-selector-card .blg-futures-size li button,
.checkout-selector-card .blg-crypto-products li button,
.checkout-selector-card .blg-bnpl-size li button {
  min-width: 96px;
}
.checkout-selector-card ul li button:not(.active):hover {
  border-color: #2db1fb;
  opacity: 1;
}

/* Selected — Market / Plan / Account type / Platform → solid gradient fill */
.checkout-selector-card ul li button.active {
  border: 1px solid #50befc;
  background-color: transparent;
  background-image: linear-gradient(9.46deg, #17597e 8.33%, #1e76a7 91.67%);
  color: var(--Colors-Text-text-primary, #f5f8fa);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.18);
}

/* Selected — Account size → gradient border (the spec used for add-ons) */
.checkout-selector-card .blg-products li button.active,
.checkout-selector-card .blg-futures-size li button.active,
.checkout-selector-card .blg-crypto-products li button.active,
.checkout-selector-card .blg-bnpl-size li button.active {
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, #0E314E 0%, #0E314E 100%) padding-box,
    linear-gradient(180deg, #2DB1FB 8.33%, rgba(45, 177, 251, 0.12) 91.67%) border-box;
  color: var(--Colors-Text-text-primary, #f5f8fa);
  box-shadow: none;
}

/* Most Popular / Popular badge (overlaps the bottom edge of its button) */
.checkout-selector-card .has-pop-badge { position: relative; }
.checkout-selector-card .bg-pop-badge {
  position: absolute;
  left: 50%;
  bottom: -11px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  background: var(--Colors-Background-bg-quaternary, #194e7b);
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  color: var(--Colors-Text-text-primary, #f5f8fa);
  font-family: "Montserrat", var(--body-font-family);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  padding: 2px 6px;
  border-radius: var(--radius-sm, 6px);
  z-index: 3;
  pointer-events: none;
}
.checkout-selector-card .bg-pop-badge svg { width: 12px; height: 12px; flex-shrink: 0; }

/* =========================================================================
   COUPON FORM (Figma node 2910:1540)
   Left coupon-percent icon on the input + secondary-style Apply button.
   ========================================================================= */
.order-summary-coupon input#coupon_code {
  padding-left: 42px !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%3E%3Cpath%20d='M1.64305%206.22915C1.47736%206.22915%201.32615%206.09484%201.33377%205.91928C1.37838%204.89123%201.50337%204.22196%201.85355%203.69254C2.05501%203.38796%202.30526%203.12304%202.59298%202.90977C3.37066%202.33331%204.46775%202.33331%206.66194%202.33331H9.3384C11.5326%202.33331%2012.6297%202.33331%2013.4074%202.90977C13.6951%203.12304%2013.9453%203.38796%2014.1468%203.69254C14.4969%204.2219%2014.6219%204.89108%2014.6666%205.91893C14.6742%206.0947%2014.5228%206.22915%2014.3569%206.22915C13.433%206.22915%2012.6841%207.02198%2012.6841%207.99998C12.6841%208.97798%2013.433%209.77081%2014.3569%209.77081C14.5228%209.77081%2014.6742%209.90526%2014.6666%2010.081C14.6219%2011.1089%2014.4969%2011.7781%2014.1468%2012.3074C13.9453%2012.612%2013.6951%2012.8769%2013.4074%2013.0902C12.6297%2013.6666%2011.5326%2013.6666%209.3384%2013.6666H6.66194C4.46775%2013.6666%203.37066%2013.6666%202.59298%2013.0902C2.30526%2012.8769%202.05501%2012.612%201.85355%2012.3074C1.50337%2011.778%201.37838%2011.1087%201.33377%2010.0807C1.32615%209.90512%201.47736%209.77081%201.64305%209.77081C2.56691%209.77081%203.31584%208.97798%203.31584%207.99998C3.31584%207.02198%202.56691%206.22915%201.64305%206.22915Z'%20stroke='%236DA5D5'%20stroke-linejoin='round'/%3E%3Cpath%20d='M6.3335%209.66665L9.66683%206.33331'%20stroke='%236DA5D5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3Cpath%20d='M6.3335%206.33331H6.34098M9.65935%209.66665H9.66683'%20stroke='%236DA5D5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 16px center !important;
}
/* Coupon: input + Apply are two separate pills in a flex row (not overlapped) */
.order-summary-coupon.coupon-form {
  display: flex !important;
  align-items: stretch !important;
  gap: 12px !important;
  position: static !important;
}
.order-summary-coupon.coupon-form .form-group {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
}
/* Apply button → gradient border (Figma 2910:1538), inline pill beside the input */
.order-summary-coupon .default-btn,
.coupon-form .default-btn {
  position: static !important;
  top: auto !important;
  right: auto !important;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0 20px !important;
  border: 1px solid transparent !important;
  background:
    linear-gradient(#082035, #082035) padding-box,
    linear-gradient(180deg, #5cc0fb 0%, #1e6f9d 100%) border-box !important;
  color: var(--Colors-Text-text-secondary, #a3c4e0) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}
.order-summary-coupon .default-btn:hover,
.coupon-form .default-btn:hover {
  color: #fff !important;
}

/* Coupon code label above the field */
.order-summary-coupon-label {
  display: block;
  font-family: "Montserrat", var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  color: var(--Colors-Text-text-primary, #f5f8fa);
  margin-bottom: 12px;
}

/* =========================================================================
   RIGHT COLUMN: quantity / bundles / payment radios / actions
   (Figma 2395:38754, bundles 3836:52610, payment 2395:38786, actions 2395:38876)
   ========================================================================= */

/* Quantity: dashed divider + pill stepper */
.quantity-selector-section {
  border-bottom: 1px dashed #1d3a52 !important;
  padding: 0 0 20px !important;
}
.quantity-selector-section .qty-stepper {
  background: transparent !important;
  border: 1px solid var(--Colors-Border-border-primary, #194e7b) !important;
}
.quantity-selector-section .qty-stepper .qty-btn:hover {
  background: rgba(45, 177, 251, 0.1) !important;
}

/* Bundle discount: plain rows, green/grey checks, two-tone amounts */
.bundle-discount-section {
  border-bottom: none !important;
  padding: 20px 0 0 !important;
}
.bundle-discount-section .bundle-list { gap: 14px !important; }
.bundle-discount-section .bundle-row,
.bundle-discount-section .bundle-row:hover,
.bundle-discount-section .bundle-row.active {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
}
.bundle-discount-section .bundle-row .bundle-check,
.bundle-discount-section .bundle-row.active .bundle-check {
  width: 16px;
  height: 16px;
  border: none !important;
  background: none !important;
  border-radius: 0 !important;
  color: #3f5f7e;
}
.bundle-discount-section .bundle-row .bundle-check svg {
  display: block !important;
  width: 14px;
  height: 14px;
}
.bundle-discount-section .bundle-row .bundle-check svg path { stroke: currentColor !important; }
.bundle-discount-section .bundle-row.reached .bundle-check { color: #47cd89; }
.bundle-discount-section .bundle-row .bundle-name { color: var(--Colors-Text-text-secondary, #a3c4e0); font-size: 15px; }
.bundle-discount-section .bundle-row.reached .bundle-name { color: var(--Colors-Text-text-primary, #f5f8fa); }
.bundle-discount-section .bundle-row .bundle-row-right { display: inline-flex; gap: 8px; align-items: baseline; }
.bundle-discount-section .bundle-row .bundle-pct { color: #6da5d5; font-size: 15px; font-weight: 500; }
.bundle-discount-section .bundle-row .bundle-save { color: #6da5d5; font-size: 15px; font-weight: 400; }
.bundle-discount-section .bundle-row.active .bundle-pct { color: var(--Colors-Text-text-primary, #f5f8fa); }
.bundle-discount-section .bundle-row.active .bundle-save { color: #47cd89; }

/* Payment method: circular radio with centre dot (instead of square check) */
.order-summary-payment #payment ul.payment_methods li label::before {
  border-radius: 50% !important;
  width: 20px !important;
  height: 20px !important;
  border: 1px solid var(--Colors-Border-border-primary, #194e7b) !important;
  background-color: transparent !important;
  background-image: none !important;
}
.order-summary-payment #payment ul.payment_methods li.wc_payment_method input.input-radio:checked + label::before,
.order-summary-payment #payment ul.payment_methods li input[type=radio]:checked + label::before {
  background-color: #2693d1 !important;
  border-color: #2693d1 !important;
  background-image: radial-gradient(circle, #fff 0, #fff 3px, transparent 3.5px) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* "Recommend" pill — outline badge sitting inline right after the method title (Figma 2395:38786) */
.order-summary-payment #payment ul.payment_methods li .payment-recommended-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border: 1px solid var(--Colors-Border-border-primary, #194e7b);
  border-radius: 999px;
  background: transparent;
  color: var(--Colors-Text-text-secondary, #a3c4e0);
  font-family: "Montserrat", var(--body-font-family);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  white-space: nowrap;
}

/* Brand logo (e.g. Paytiko/Confirmo) pinned to the right edge of the title row */
.order-summary-payment #payment ul.payment_methods li .payment-brand-icon-wrap {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
}
.order-summary-payment #payment ul.payment_methods li .payment-brand-img {
  max-height: 24px;
  width: auto;
}

/* Actions: arrow after the place-order button label */
.woocommerce #payment #place_order::after,
.woocommerce-page #payment #place_order::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 8px;
  vertical-align: middle;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='20'%20height='20'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2012h16'/%3E%3Cpath%20d='M14%206l6%206-6%206'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}