/*
Template Name: Top One Futures v10
Template URL: https://topone.com/
Description: TopOne Futures Checkout - v10 (Next.js style parity)
Author: TopOne
Author URI: https://topone.com/
Version: 10.0.0
*/
/*------------------- Mixin -------------------*/
/*------------------- Function -------------------*/
/*------------------- Fonts -------------------*/
/*------------------- Variable-------------------*/
:root {
  /* TOF Brand Colors - Matching Next.js */
  --dark: #06120d;
  --dark-gray: #131614;
  --green: #7dff7d;
  --neon-yellow: #f6ff78;
  --neon-green: #7bfc7f;
  /* Theme Color System */
  --theme-color: #7bfc7f;
  --theme-color2: #7dff7d;
  --theme-color3: #f6ff78;
  --title-color: #ffffff;
  --body-color: rgba(255, 255, 255, 0.7);
  --smoke-color: rgba(255, 255, 255, 0.08);
  --smoke-color2: rgba(255, 255, 255, 0.05);
  --smoke-color3: #131614;
  --body-bg: #06120d;
  --black-color: #06120d;
  --white-color: #ffffff;
  --light-color: rgba(255, 255, 255, 0.5);
  --gray-color: rgba(255, 255, 255, 0.3);
  --yellow-color: #f6ff78;
  --success-color: #7dff7d;
  --error-color: #f87171;
  --ot-border-color: rgba(255, 255, 255, 0.1);
  --title-font: "Poppins", sans-serif;
  --body-font: "Poppins", sans-serif;
  --icon-font: "Font Awesome 6 Pro";
  --main-container: 1152px;
  --container-gutters: 24px;
  --section-space: 100px;
  --section-space-mobile: 70px;
  --section-title-space: 50px;
  --ripple-ani-duration: 5s;
}

/*------------------- Typography -------------------*/
/* Typography - matching Next.js checkout */
body {
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 400;
  color: var(--body-color);
  line-height: 24px;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  background-color: var(--body-bg);
}

iframe {
  border: none;
  width: 100%;
}

.main-container {
  max-width: var(--main-container);
  margin-left: auto;
  margin-right: auto;
}

img {
  max-width: 100%;
  height: auto;
}

input,
button,
textarea {
  color: inherit;
}

input,
button {
  border: none;
}

button {
  cursor: pointer;
}

a {
  text-decoration: none;
  color: inherit;
  outline: 0 !important;
  transition: 0.3s ease-in-out;
}

a:hover {
  text-decoration: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

ul {
  list-style-type: disc;
}

ol {
  list-style-type: decimal;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--title-font);
  color: var(--title-color);
  text-transform: none;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 12px 0;
}

h1 {
  font-size: 56px;
  font-weight: 600;
  letter-spacing: -0.02em;
  /* Medium Large devices */
}
@media (max-width: 1299px) {
  h1 {
    font-size: 48px;
  }
}
h1 {
  /* Large devices */
}
@media (max-width: 1199px) {
  h1 {
    font-size: 40px;
  }
}
h1 {
  /* Medium devices */
}
@media (max-width: 991px) {
  h1 {
    font-size: 36px;
  }
}
h1 {
  /* Extra small devices */
}
@media (max-width: 575px) {
  h1 {
    font-size: 32px;
  }
}

h2 {
  font-size: 44px;
  font-weight: 600;
  letter-spacing: -0.02em;
  /* Medium Large devices */
}
@media (max-width: 1299px) {
  h2 {
    font-size: 36px;
  }
}
h2 {
  /* Large devices */
}
@media (max-width: 1199px) {
  h2 {
    font-size: 32px;
  }
}
h2 {
  /* Medium devices */
}
@media (max-width: 991px) {
  h2 {
    font-size: 28px;
  }
}
h2 {
  /* Extra small devices */
}
@media (max-width: 575px) {
  h2 {
    font-size: 24px;
  }
}

h3 {
  font-size: 32px;
  font-weight: 600;
  /* Large devices */
}
@media (max-width: 1199px) {
  h3 {
    font-size: 28px;
  }
}
h3 {
  /* Medium devices */
}
@media (max-width: 991px) {
  h3 {
    font-size: 24px;
  }
}
h3 {
  /* Extra small devices */
}
@media (max-width: 575px) {
  h3 {
    font-size: 20px;
  }
}

h4 {
  font-size: 24px;
  font-weight: 600;
  /* Medium devices */
}
@media (max-width: 991px) {
  h4 {
    font-size: 20px;
  }
}

h5 {
  font-size: 20px;
  font-weight: 600;
  /* Medium devices */
}
@media (max-width: 991px) {
  h5 {
    font-size: 18px;
  }
}

h6 {
  font-size: 16px;
  font-weight: 600;
}

p {
  font-family: var(--body-font);
  margin-bottom: 0.8em;
  color: var(--body-color);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}
p:last-child {
  margin-bottom: 0;
}

/* Section title classes */
.sec-title {
  font-size: 56px;
  font-weight: 600;
  letter-spacing: -0.02em;
  /* Medium devices */
}
@media (max-width: 991px) {
  .sec-title {
    font-size: 36px;
  }
}
.sec-title {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .sec-title {
    font-size: 28px;
  }
}

.box-title {
  font-size: 18px;
  font-weight: 600;
}

/* Space utilities */
.space,
.space-top {
  padding-top: var(--section-space);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space,
  .space-top {
    padding-top: var(--section-space-mobile);
  }
}

.space,
.space-bottom {
  padding-bottom: var(--section-space);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space,
  .space-bottom {
    padding-bottom: var(--section-space-mobile);
  }
}

.space-extra,
.space-extra-top {
  padding-top: calc(var(--section-space) - 30px);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space-extra,
  .space-extra-top {
    padding-top: calc(var(--section-space-mobile) - 30px);
  }
}

.space-extra,
.space-extra-bottom {
  padding-bottom: calc(var(--section-space) - 30px);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space-extra,
  .space-extra-bottom {
    padding-bottom: calc(var(--section-space-mobile) - 30px);
  }
}

.space-extra2,
.space-extra2-top {
  padding-top: calc(var(--section-space) - 40px);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space-extra2,
  .space-extra2-top {
    padding-top: calc(var(--section-space-mobile) - 30px);
  }
}

.space-extra2,
.space-extra2-bottom {
  padding-bottom: calc(var(--section-space) - 40px);
  /* Medium devices */
}
@media (max-width: 991px) {
  .space-extra2,
  .space-extra2-bottom {
    padding-bottom: calc(var(--section-space-mobile) - 30px);
  }
}

/* Spacing utilities - 5px increments */
.p-5 {
  padding: 5px;
}

.pt-5 {
  padding-top: 5px;
}

.pb-5 {
  padding-bottom: 5px;
}

.pl-5 {
  padding-left: 5px;
}

.pr-5 {
  padding-right: 5px;
}

.m-5 {
  margin: 5px;
}

.mt-5 {
  margin-top: 5px;
}

.mb-5 {
  margin-bottom: 5px;
}

.ml-5 {
  margin-left: 5px;
}

.mr-5 {
  margin-right: 5px;
}

.p-10 {
  padding: 10px;
}

.pt-10 {
  padding-top: 10px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pl-10 {
  padding-left: 10px;
}

.pr-10 {
  padding-right: 10px;
}

.m-10 {
  margin: 10px;
}

.mt-10 {
  margin-top: 10px;
}

.mb-10 {
  margin-bottom: 10px;
}

.ml-10 {
  margin-left: 10px;
}

.mr-10 {
  margin-right: 10px;
}

.p-15 {
  padding: 15px;
}

.pt-15 {
  padding-top: 15px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pl-15 {
  padding-left: 15px;
}

.pr-15 {
  padding-right: 15px;
}

.m-15 {
  margin: 15px;
}

.mt-15 {
  margin-top: 15px;
}

.mb-15 {
  margin-bottom: 15px;
}

.ml-15 {
  margin-left: 15px;
}

.mr-15 {
  margin-right: 15px;
}

.p-20 {
  padding: 20px;
}

.pt-20 {
  padding-top: 20px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pl-20 {
  padding-left: 20px;
}

.pr-20 {
  padding-right: 20px;
}

.m-20 {
  margin: 20px;
}

.mt-20 {
  margin-top: 20px;
}

.mb-20 {
  margin-bottom: 20px;
}

.ml-20 {
  margin-left: 20px;
}

.mr-20 {
  margin-right: 20px;
}

.p-25 {
  padding: 25px;
}

.pt-25 {
  padding-top: 25px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pl-25 {
  padding-left: 25px;
}

.pr-25 {
  padding-right: 25px;
}

.m-25 {
  margin: 25px;
}

.mt-25 {
  margin-top: 25px;
}

.mb-25 {
  margin-bottom: 25px;
}

.ml-25 {
  margin-left: 25px;
}

.mr-25 {
  margin-right: 25px;
}

.p-30 {
  padding: 30px;
}

.pt-30 {
  padding-top: 30px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pl-30 {
  padding-left: 30px;
}

.pr-30 {
  padding-right: 30px;
}

.m-30 {
  margin: 30px;
}

.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.ml-30 {
  margin-left: 30px;
}

.mr-30 {
  margin-right: 30px;
}

.p-35 {
  padding: 35px;
}

.pt-35 {
  padding-top: 35px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pl-35 {
  padding-left: 35px;
}

.pr-35 {
  padding-right: 35px;
}

.m-35 {
  margin: 35px;
}

.mt-35 {
  margin-top: 35px;
}

.mb-35 {
  margin-bottom: 35px;
}

.ml-35 {
  margin-left: 35px;
}

.mr-35 {
  margin-right: 35px;
}

.p-40 {
  padding: 40px;
}

.pt-40 {
  padding-top: 40px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pl-40 {
  padding-left: 40px;
}

.pr-40 {
  padding-right: 40px;
}

.m-40 {
  margin: 40px;
}

.mt-40 {
  margin-top: 40px;
}

.mb-40 {
  margin-bottom: 40px;
}

.ml-40 {
  margin-left: 40px;
}

.mr-40 {
  margin-right: 40px;
}

.p-45 {
  padding: 45px;
}

.pt-45 {
  padding-top: 45px;
}

.pb-45 {
  padding-bottom: 45px;
}

.pl-45 {
  padding-left: 45px;
}

.pr-45 {
  padding-right: 45px;
}

.m-45 {
  margin: 45px;
}

.mt-45 {
  margin-top: 45px;
}

.mb-45 {
  margin-bottom: 45px;
}

.ml-45 {
  margin-left: 45px;
}

.mr-45 {
  margin-right: 45px;
}

.p-50 {
  padding: 50px;
}

.pt-50 {
  padding-top: 50px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pl-50 {
  padding-left: 50px;
}

.pr-50 {
  padding-right: 50px;
}

.m-50 {
  margin: 50px;
}

.mt-50 {
  margin-top: 50px;
}

.mb-50 {
  margin-bottom: 50px;
}

.ml-50 {
  margin-left: 50px;
}

.mr-50 {
  margin-right: 50px;
}

/*=================================
    Reset
==================================*/
/*------------------- Container -------------------*/
@media only screen and (min-width: 1300px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    max-width: calc(var(--main-container) + var(--container-gutters));
    padding-left: calc(var(--container-gutters) / 2);
    padding-right: calc(var(--container-gutters) / 2);
  }
  .container-xxl.px-0,
  .container-xl.px-0,
  .container-lg.px-0,
  .container-md.px-0,
  .container-sm.px-0,
  .container.px-0 {
    max-width: var(--main-container);
  }
  .row:not([class*="gx-"]) {
    --bs-gutter-x: 30px;
  }
}
.row:not([class*="gx-"]) {
  --bs-gutter-x: 30px;
}

@media only screen and (max-width: 1600px) {
  .container-fluid.px-0 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .container-fluid.px-0 .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
.container-full {
  padding-left: 24px;
  padding-right: 24px;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .container-full {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.small-container {
  max-width: 778px;
  margin-left: auto;
  margin-right: auto;
}

/*------------------- Grid -------------------*/
.slick-track > [class*="col"] {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) / 2);
  padding-left: calc(var(--bs-gutter-x) / 2);
  margin-top: var(--bs-gutter-y);
}

.gy-30 {
  --bs-gutter-y: 30px;
}

.gy-40 {
  --bs-gutter-y: 40px;
}

.gy-50 {
  --bs-gutter-y: 50px;
}

.gx-6 {
  --bs-gutter-x: 6px;
}

.gx-12 {
  --bs-gutter-x: 12px;
}

.gx-20 {
  --bs-gutter-x: 20px;
}

@media (min-width: 1299px) {
  .gx-60 {
    --bs-gutter-x: 60px;
  }
}
@media (min-width: 1399px) {
  .gx-30 {
    --bs-gutter-x: 30px;
  }
  .gx-25 {
    --bs-gutter-x: 25px;
  }
  .gx-40 {
    --bs-gutter-x: 40px;
  }
}
/* Medium devices */
@media (max-width: 991px) {
  .gy-50 {
    --bs-gutter-y: 40px;
  }
}
/*------------------- Input -------------------*/
/* Inputs - matching Next.js dark theme inputs */
select,
.form-control,
.form-select,
textarea,
input:not([type="submit"]) {
  height: 48px;
  padding: 0 12px;
  border: 1px solid var(--ot-border-color);
  color: var(--title-color);
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  font-size: 16px;
  width: 100%;
  font-family: var(--body-font);
  transition: 0.3s ease-in-out;
  position: relative;
  z-index: 2;
}
select:focus,
.form-control:focus,
.form-select:focus,
textarea:focus,
input:not([type="submit"]):focus {
  color: var(--title-color);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(123, 252, 127, 0.15);
  border-color: var(--theme-color);
  background-color: rgba(255, 255, 255, 0.05);
}
select::-moz-placeholder,
.form-control::-moz-placeholder,
.form-select::-moz-placeholder,
textarea::-moz-placeholder,
input:not([type="submit"])::-moz-placeholder {
  color: var(--light-color);
}
select::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder,
.form-select::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
input:not([type="submit"])::-webkit-input-placeholder {
  color: var(--light-color);
}
select:-ms-input-placeholder,
.form-control:-ms-input-placeholder,
.form-select:-ms-input-placeholder,
textarea:-ms-input-placeholder,
input:not([type="submit"]):-ms-input-placeholder {
  color: var(--light-color);
}
select::placeholder,
.form-control::placeholder,
.form-select::placeholder,
textarea::placeholder,
input:not([type="submit"])::placeholder {
  color: var(--light-color);
}
select::selection,
.form-control::selection,
.form-select::selection,
textarea::selection,
input:not([type="submit"])::selection {
  background: var(--neon-green);
  color: var(--black-color);
}
select[aria-invalid="true"],
.form-control[aria-invalid="true"],
.form-select[aria-invalid="true"],
textarea[aria-invalid="true"],
input:not([type="submit"])[aria-invalid="true"] {
  border-color: var(--error-color);
}
select[aria-invalid="true"]:focus,
.form-control[aria-invalid="true"]:focus,
.form-select[aria-invalid="true"]:focus,
textarea[aria-invalid="true"]:focus,
input:not([type="submit"])[aria-invalid="true"]:focus {
  box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.2);
}

.form-select,
select {
  display: block;
  width: 100%;
  line-height: 1.5;
  vertical-align: middle;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px 12px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}

textarea.form-control,
textarea {
  min-height: 160px;
  padding-top: 16px;
  padding-bottom: 17px;
  border-radius: 8px;
}

.form-group {
  margin-bottom: var(--bs-gutter-x);
  position: relative;
}

.input-group {
  position: relative;
  z-index: 2;
}
.input-group input {
  border-radius: 8px !important;
}
.input-group button {
  position: absolute;
  top: 15px;
  right: 20px;
  background-color: transparent;
  border: none;
  padding: 0;
  color: var(--theme-color) !important;
  z-index: 11;
  opacity: 1 !important;
}
.input-group button:hover {
  color: var(--theme-color) !important;
}

option {
  background-color: var(--dark-gray);
  color: var(--title-color);
}
option:checked,
option:focus,
option:hover {
  background-color: var(--theme-color);
  color: var(--black-color);
}

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

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

input[type="checkbox"] {
  visibility: hidden;
  opacity: 0;
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 0;
  display: none;
}
input[type="checkbox"]:checked ~ label:before {
  content: url('data:image/svg+xml,<svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.2508 0.368943C13.5074 0.599855 13.5282 0.995036 13.2973 1.2516L6.84927 8.41605C6.03715 9.3184 4.66225 9.43087 3.71429 8.67249L0.775604 6.32154C0.506066 6.10591 0.462365 5.71261 0.677996 5.44307C0.893627 5.17353 1.28693 5.12983 1.55647 5.34546L4.49516 7.69641C4.92605 8.04112 5.55101 7.99 5.92015 7.57984L12.3681 0.415399C12.5991 0.15883 12.9942 0.138031 13.2508 0.368943Z" fill="black"/></svg>');
  color: var(--black-color);
  background-color: var(--theme-color);
  border-color: var(--theme-color);
}
input[type="checkbox"] ~ label {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  display: block;
}
input[type="checkbox"] ~ label:before {
  content: "";
  font-family: var(--icon-font);
  font-weight: 700;
  position: absolute;
  left: 0px;
  top: 3.5px;
  background-color: transparent;
  border: 1px solid var(--ot-border-color);
  height: 18px;
  width: 18px;
  line-height: 18px;
  text-align: center;
  font-size: 12px;
  border-radius: 4px;
}

input[type="radio"] {
  visibility: hidden;
  opacity: 0;
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 0;
  display: none;
}
input[type="radio"] ~ label {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  line-height: 1;
  display: inline-block;
  font-weight: 500;
  margin-bottom: 0;
}
input[type="radio"] ~ label::before {
  content: "";
  position: absolute;
  left: 0;
  top: -2px;
  width: 20px;
  height: 20px;
  padding-left: 0;
  font-size: 0.6em;
  line-height: 19px;
  text-align: center;
  border: 1px solid var(--ot-border-color);
  border-radius: 100%;
  font-weight: 700;
  background: transparent;
  color: transparent;
  transition: all 0.2s ease;
}
input[type="radio"]:checked ~ label::before {
  border-color: var(--theme-color);
  background-color: var(--theme-color);
  color: var(--black-color);
}

label {
  margin-bottom: 12px;
  display: block;
  color: var(--title-color);
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 400;
}

textarea.is-invalid,
select.is-invalid,
input.is-invalid,
.was-validated input:invalid {
  border: 1px solid var(--error-color) !important;
  background-position: right calc(0.375em + 0.8875rem) center;
  background-image: none;
}
textarea.is-invalid:focus,
select.is-invalid:focus,
input.is-invalid:focus,
.was-validated input:invalid:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.2);
}

.row.no-gutters > .form-group {
  margin-bottom: 0;
}

.form-messages {
  display: none;
}
.form-messages.mb-0 * {
  margin-bottom: 0;
}
.form-messages.success {
  color: var(--success-color);
  display: block;
}
.form-messages.error {
  color: var(--error-color);
  display: block;
}
.form-messages pre {
  padding: 0;
  background-color: transparent;
  color: inherit;
}

/*------------------- Slick Slider -------------------*/
.slick-track > [class*="col"] {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) / 2);
  padding-left: calc(var(--bs-gutter-x) / 2);
  margin-top: var(--bs-gutter-y);
}

.slick-list {
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
}

.slick-track {
  min-width: 100%;
}

.slick-slide img {
  display: inline-block;
}

.slick-dots {
  list-style-type: none;
  padding: 0 0;
  margin: 40px 0 0 0;
  line-height: 0;
  text-align: center;
  height: max-content;
}
.slick-dots li {
  display: inline-block;
  margin-right: 5px;
}
.slick-dots li:last-child {
  margin-right: 0;
}
.slick-dots button {
  font-size: 0;
  padding: 0;
  background-color: transparent;
  width: 10px;
  height: 10px;
  line-height: 0;
  border-radius: 9999px;
  border: none;
  background-color: var(--theme-color);
  transition: all ease 0.4s;
}
.slick-dots button:hover {
  border-color: var(--title-color);
}
.slick-dots .slick-active button {
  width: 60px;
  transform: scale(1);
  background-color: var(--theme-color);
}

.slick-arrow {
  display: inline-block;
  padding: 0;
  background-color: #f8f8fb;
  color: var(--title-color);
  position: absolute;
  top: 50%;
  border: none;
  box-shadow: none;
  left: var(--pos-x, -14px);
  width: var(--icon-size, 52px);
  height: var(--icon-size, 52px);
  line-height: var(--icon-size, 52px);
  font-size: var(--icon-font-size, 16px);
  margin-top: calc(var(--icon-size, 52px) / -2);
  border-radius: 99px;
  z-index: 2;
}
.slick-arrow .icon {
  content: url('data:image/svg+xml,<svg width="18" height="14" viewBox="0 0 18 14" preserveAspectRatio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 7L1 7M1 7L7 13M1 7L7 0.999999" stroke="%230E0E1F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  transition: 0.4s ease-in-out;
}
.slick-arrow:hover {
  background-color: var(--theme-color);
}
.slick-arrow:hover .icon {
  filter: brightness(0) invert(1);
}
.slick-arrow.slick-next {
  right: var(--pos-x, -14px);
  left: auto;
}
.slick-arrow.slick-next .icon {
  content: url('data:image/svg+xml,<svg width="18" height="14" viewBox="0 0 18 14" preserveAspectRatio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 7H17M17 7L11 1M17 7L11 13" stroke="%230E0E1F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}

.arrow-margin .slick-arrow {
  top: calc(50% - 30px);
}

.arrow-wrap .slick-arrow {
  opacity: 0;
  visibility: hidden;
  transform: scale(0.5);
}
.arrow-wrap:hover .slick-arrow {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.slick-arrow.default {
  position: relative;
  --pos-x: 0;
  margin-top: 0;
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}

/* Medium Large devices */
@media (max-width: 1299px) {
  .slick-arrow {
    --arrow-horizontal: -20px;
    --pos-x: -70px;
  }
}
/* Medium Large devices */
@media (max-width: 1399px) {
  .slick-arrow {
    --arrow-horizontal: 40px;
    --pos-x: -6px;
  }
}
/* Medium devices */
@media (max-width: 991px) {
  .slick-arrow {
    margin-right: 40px;
    font-size: 14px;
  }
  .slick-arrow.slick-next {
    margin-right: 0;
    margin-left: 40px;
  }
  .slick-dots {
    margin: 40px 0 0 0;
  }
  .icon-box .slick-arrow {
    margin-right: 0;
  }
}
/*------------------- Mobile Menu -------------------*/
.ot-menu-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999999;
  width: 0;
  width: 100%;
  height: 100%;
  transition: all ease 0.8s;
  opacity: 0;
  visibility: hidden;
}
.ot-menu-wrapper .mobile-logo {
  padding-bottom: 50px;
  padding-top: 40px;
  display: block;
  text-align: center;
  background-color: var(--body-bg);
  clip-path: polygon(0 0, 100% 0, 100% 75%, 50% 100%, 0 75%);
}
.ot-menu-wrapper .mobile-logo svg {
  max-width: 185px;
}
.ot-menu-wrapper .ot-menu-toggle {
  border: none;
  font-size: 22px;
  position: absolute;
  right: -16.5px;
  top: 25px;
  padding: 0;
  line-height: 1;
  width: 33px;
  height: 33px;
  line-height: 0;
  font-size: 18px;
  z-index: 1;
  color: var(--white-color);
  background-color: var(--theme-color);
  border-radius: 50%;
}
.ot-menu-wrapper .ot-menu-toggle svg {
  max-width: 12px;
}
.ot-menu-wrapper .ot-menu-toggle:hover {
  background-color: var(--black-color);
  color: var(--white-color);
}
.ot-menu-wrapper .ot-menu-area {
  width: 100%;
  max-width: 310px;
  background-color: var(--smoke-color);
  border-right: 3px solid var(--theme-color);
  height: 100%;
  position: relative;
  left: -110%;
  opacity: 0;
  visibility: hidden;
  transition: all ease 1s;
  z-index: 1;
}
.ot-menu-wrapper.ot-body-visible {
  opacity: 1;
  visibility: visible;
}
.ot-menu-wrapper.ot-body-visible .ot-menu-area {
  left: 0;
  opacity: 1;
  visibility: visible;
}

.ot-mobile-menu {
  overflow-y: scroll;
  max-height: calc(100vh - 200px);
  padding-bottom: 40px;
  margin-top: 33px;
  text-align: left;
}
.ot-mobile-menu ul {
  margin: 0;
  padding: 0 0;
}
.ot-mobile-menu ul li {
  border-bottom: 1px solid var(--ot-border-color);
  list-style-type: none;
}
.ot-mobile-menu ul li li:first-child {
  border-top: 1px solid var(--ot-border-color);
}
.ot-mobile-menu ul li a {
  display: block;
  position: relative;
  padding: 12px 0;
  line-height: 1.4;
  font-size: 14px;
  font-weight: 400;
  text-transform: capitalize;
  color: var(--title-color);
}
.ot-mobile-menu ul li.ot-active > a {
  color: var(--theme-color);
}
.ot-mobile-menu ul li.ot-active > a:before {
  transform: rotate(90deg);
}
.ot-mobile-menu ul li ul li {
  padding-left: 20px;
}
.ot-mobile-menu ul li ul li:last-child {
  border-bottom: none;
}
.ot-mobile-menu ul .ot-item-has-children > a {
  position: relative;
}
.ot-mobile-menu ul .ot-item-has-children > a .ot-mean-expand {
  position: absolute;
  right: 0;
  top: 50%;
  font-weight: 400;
  font-size: 12px;
  width: 25px;
  height: 25px;
  line-height: 25px;
  margin-top: -12.5px;
  display: inline-block;
  text-align: center;
  background-color: var(--smoke-color2);
  color: var(--title-color);
  box-shadow: 0 0 20px -8px rgba(173, 136, 88, 0.5);
  border-radius: 50%;
}
.ot-mobile-menu ul .ot-item-has-children > a .ot-mean-expand:before {
  content: "+";
  font-family: "Arial";
  font-size: 16px;
}
.ot-mobile-menu ul .ot-item-has-children > a:after {
  content: "+";
  font-family: "Arial";
  width: 22px;
  height: 22px;
  line-height: 22px;
  display: inline-block;
  text-align: center;
  font-size: 16px;
  border-radius: 50px;
  background-color: var(--smoke-color);
  float: right;
  margin-top: 1px;
  display: none;
}
.ot-mobile-menu ul .ot-item-has-children.ot-active > a .ot-mean-expand:before {
  content: "-";
}
.ot-mobile-menu ul .ot-item-has-children.ot-active > a:after {
  content: "-";
}
.ot-mobile-menu > ul {
  padding: 0 40px;
}
.ot-mobile-menu > ul > li:last-child {
  border-bottom: none;
}

.ot-menu-toggle {
  width: 50px;
  height: 50px;
  line-height: 0;
  padding: 0;
  font-size: 20px;
  border: none;
  background-color: var(--theme-color);
  color: var(--white-color);
  display: inline-block;
  border-radius: 12px;
}
.ot-menu-toggle:hover {
  background-color: var(--black-color);
}

@media (max-width: 400px) {
  .ot-menu-wrapper .ot-menu-area {
    width: 100%;
    max-width: 270px;
  }
  .ot-mobile-menu > ul {
    padding: 0 20px;
  }
}
/*=================================
    03. Utilities
==================================*/
/*------------------- Preloader -------------------*/
.preloader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
  background-color: var(--title-color);
}
.preloader .ot-btn {
  padding: 15px 20px;
  border-radius: 0;
  font-size: 14px;
}

.preloader-inner {
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  line-height: 1;
}
.preloader-inner img {
  display: block;
  margin: 0 auto 10px auto;
}

.loader {
  display: inline-block;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  position: relative;
  transform: rotate(45deg);
  background-color: var(--white-color);
}

.loader::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  inset: 0px;
  border-radius: 50%;
  border: 24px solid var(--theme-color);
  animation: prixClipFix 2s infinite linear;
}

@keyframes prixClipFix {
  0% {
    clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);
  }
  25% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);
  }
  50% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
  }
  75% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);
  }
  100% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
  }
}
/*------------------- Buttons -------------------*/
.ot-btn {
  position: relative;
  z-index: 2;
  overflow: hidden;
  vertical-align: middle;
  display: inline-block;
  border: none;
  text-align: center;
  background-image: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  color: var(--black-color);
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-transform: none;
  padding: 16px 24px;
  min-width: auto;
  border-radius: 27px;
  min-width: 124px;
  cursor: pointer;
  transition: 0.4s ease-in-out;
}
.ot-btn .icon1 {
  content: url('data:image/svg+xml,<svg width="14" height="10" viewBox="0 0 14 10" preserveAspectRatio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.6665 5H12.3332M12.3332 5L8.33317 1M12.3332 5L8.33317 9" stroke="%23ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  display: inline-block;
  margin-left: 5px;
}
.ot-btn:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: 0.4s ease-in-out;
}
.ot-btn:hover,
.ot-btn.active {
  color: var(--black-color);
}
.ot-btn:hover:before,
.ot-btn.active:before {
  visibility: visible;
  opacity: 1;
}
.ot-btn.style2 {
  background: transparent;
  border: 1px solid var(--ot-border-color);
  color: var(--title-color);
  padding: 15px 24px;
  font-weight: 400;
}
.ot-btn.style2:hover {
  border-color: transparent;
  color: var(--black-color);
}
.ot-btn.style3 {
  background: var(--smoke-color2);
  color: var(--title-color);
  font-weight: 500;
  box-shadow: none;
  outline: none;
}
.ot-btn.style3:hover {
  color: var(--white-color);
  background-color: var(--theme-color);
}
.ot-btn.style4 {
  background: var(--theme-color2);
  outline: none;
  box-shadow: none;
}
.ot-btn.btn-lg {
  font-size: 18px;
  padding: 21px 24px;
}
.ot-btn.btn-xl {
  font-size: 24px;
  padding: 25px 30px;
}
.ot-btn.btn-sm {
  padding: 16px 30px;
}
.ot-btn.w-100:hover::before,
.ot-btn.w-100.active::before {
  height: 760%;
}
.ot-btn.white-glow {
  box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.4);
}
.ot-btn.inset-glow {
  box-shadow: inset 0 0 7px 2px rgba(123, 252, 127, 0.4);
}

@keyframes shine {
  0% {
    left: -100px;
  }
  60% {
    left: 100%;
  }
  100% {
    left: 100%;
  }
}
@keyframes breathe {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes tof-arrow-float-x {
  0%,
  100% {
    transform: translateX(-3px);
  }
  50% {
    transform: translateX(3px);
  }
}
.tof-arrow-float-x {
  display: inline-block;
  animation: tof-arrow-float-x 2s ease-in-out infinite;
  will-change: transform;
}

.arrow-badge {
  background-color: var(--black-color);
  color: var(--title-color);
  padding: 2px 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
}

.link-btn {
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  line-height: 0.8;
  position: relative;
  padding-bottom: 4px;
  margin-bottom: -4px;
  text-transform: capitalize;
  color: var(--title-color);
  text-decoration: none !important;
}
.link-btn i {
  margin-left: 5px;
  font-size: 0.9rem;
}
.link-btn.title-color {
  color: var(--title-color);
  font-weight: 600;
}
.link-btn:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background-color: var(--theme-color);
  transition: all ease 0.4s;
}
.link-btn:hover {
  color: var(--theme-color);
}
.link-btn:hover::before {
  width: 100%;
}

/*------------------- Titles -------------------*/
.sec-title {
  margin-bottom: calc(var(--section-title-space) - 13px);
  margin-top: -0.25em;
}

.sub-title {
  font-size: 16px;
  font-weight: 500;
  color: var(--theme-color);
  text-transform: uppercase;
  margin-bottom: 26px;
  position: relative;
  display: block;
}

.text-gradient {
  color: transparent;
  background-image: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradient2 {
  color: transparent;
  background-image: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradient3 {
  color: transparent;
  background-image: linear-gradient(
    to right,
    var(--theme-color),
    var(--theme-color2)
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.title-area {
  margin-bottom: calc(var(--section-title-space) - 13px);
  position: relative;
  z-index: 2;
}
.title-area .sec-title {
  margin-bottom: 25px;
}
.title-area .sec-text {
  padding-bottom: 10px;
}
.title-area.mb-0 .sec-title {
  margin-bottom: -0.23em;
}

.mb-34 {
  margin-bottom: 34px;
}

.box-title {
  font-size: 24px;
  line-height: 1.455;
  margin-top: -0.32em;
  font-weight: 700;
  margin-bottom: 16px;
}
.box-title a {
  color: inherit;
}
.box-title a:hover {
  color: var(--theme-color);
}

.title-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
}
.title-wrap .box-title {
  margin: 0;
}

.sec-text {
  max-width: 670px;
  font-weight: 500;
}

.title-area.text-center .sec-text {
  margin-left: auto;
  margin-right: auto;
}

.sec-btn {
  margin-bottom: var(--section-title-space);
}

/* Large devices */
@media (max-width: 1199px) {
  .sub-title {
    margin-bottom: 20px;
  }
  .title-area,
  .sec-title {
    --section-title-space: 45px;
  }
  .title-area.mb-30,
  .sec-title.mb-30 {
    margin-bottom: 25px;
  }
  .title-area.mb-40,
  .sec-title.mb-40 {
    margin-bottom: 30px;
  }
  .title-area.mb-45,
  .sec-title.mb-45 {
    margin-bottom: 32px;
  }
  .title-area.mb-50,
  .sec-title.mb-50 {
    margin-bottom: 35px;
  }
  .title-area.mb-25,
  .sec-title.mb-25 {
    margin-bottom: 15px;
  }
  .title-area.mb-35,
  .sec-title.mb-35 {
    margin-bottom: 25px;
  }
  .sec-btn {
    --section-title-space: 50px;
  }
}
/* Medium devices */
@media (max-width: 991px) {
  .title-area,
  .sec-title {
    --section-title-space: 50px;
  }
  .title-area.mb-40,
  .sec-title.mb-40 {
    margin-bottom: 25px;
  }
  .title-area.mb-45,
  .sec-title.mb-45 {
    margin-bottom: 27px;
  }
  .title-area.mb-50,
  .sec-title.mb-50 {
    margin-bottom: 28px;
  }
  .sec-btn {
    --section-title-space: 50px;
  }
}
/* Extra small devices */
@media (max-width: 575px) {
  .sub-title .text {
    padding: 2px 12px;
    min-width: 120px;
  }
}
/*------------------- Common -------------------*/
/* Common utilities - matching Next.js styling */
.z-index-step1 {
  z-index: 4 !important;
}

.z-index-step2 {
  z-index: 3 !important;
}

/* Badge styles */
.badge1 {
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  border-radius: 999px;
  padding: 6px 12px;
  color: var(--title-color);
}

.badge1.bg-success {
  background: rgba(123, 252, 127, 0.1);
  color: var(--neon-green);
}

.badge1.bg-warning {
  background: rgba(246, 255, 120, 0.1);
  color: var(--neon-yellow);
}

/* Rounded corners */
.rounded-5 {
  border-radius: 5px;
}

.rounded-10 {
  border-radius: 10px;
}

.rounded-12 {
  border-radius: 12px;
}

.rounded-16 {
  border-radius: 16px;
}

.rounded-20 {
  border-radius: 20px;
}

/* Social Media + Button Groups */
.social-icon a {
  color: var(--body-color);
  transition: 0.3s ease-in-out;
}
.social-icon a:hover {
  color: var(--theme-color);
}

.btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.video-link {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  color: var(--title-color);
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
}

/* Login & Registration page */
.login-page-sec {
  min-height: 100vh;
  position: relative;
  z-index: 2;
}

.authentication-form {
  max-width: 560px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 30px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .authentication-form {
    padding: 20px;
  }
}
.authentication-form .form-title {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 6px;
}
.authentication-form .form-text {
  color: var(--body-color);
  margin-bottom: 24px;
  font-size: 16px;
}
.authentication-form .form-group {
  margin-bottom: 16px;
}
.authentication-form label {
  font-size: 14px;
  margin-bottom: 8px;
  font-weight: 500;
}
.authentication-form .submit-btn {
  width: 100%;
  margin-top: 8px;
}
.authentication-form .forgot-password {
  text-align: right;
  margin-bottom: 16px;
}
.authentication-form .forgot-password a {
  color: var(--theme-color);
  font-size: 14px;
}
.authentication-form .forgot-password a:hover {
  color: var(--title-color);
}
.authentication-form .form-footer {
  text-align: center;
  margin-top: 24px;
  color: var(--body-color);
}
.authentication-form .form-footer a {
  color: var(--theme-color);
  font-weight: 500;
}
.authentication-form .form-footer a:hover {
  color: var(--title-color);
}
.authentication-form .or-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 24px 0;
}
.authentication-form .or-divider span {
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.1);
}
.authentication-form .or-divider p {
  margin: 0;
  color: var(--light-color);
  font-size: 14px;
}

/* Checkout page full wrapper */
.checkout-full-page {
  display: flex;
  flex-direction: row;
  gap: 64px;
  /* Medium Large devices */
}
@media (max-width: 1299px) {
  .checkout-full-page {
    gap: 32px;
  }
}
.checkout-full-page {
  /* Medium devices */
}
@media (max-width: 991px) {
  .checkout-full-page {
    flex-direction: column;
    gap: 16px;
  }
}

.checkout-left-column {
  display: flex;
  flex-direction: column;
  gap: 40px;
  width: 50%;
  /* Medium devices */
}
@media (max-width: 991px) {
  .checkout-left-column {
    width: 100%;
  }
}

.checkout-right-column {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 50%;
  /* Medium devices */
}
@media (max-width: 991px) {
  .checkout-right-column {
    width: 100%;
    min-width: unset;
  }
}
.checkout-right-column {
  /* Large devices */
}
@media (max-width: 1199px) {
  .checkout-right-column {
    min-width: 448px;
  }
}

/* Order Summary Card - matching Next.js */
.order-summary-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 24px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .order-summary-card {
    padding: 16px;
  }
}
.order-summary-card .card-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--title-color);
  margin: 0;
}

/* Selection pills - matching Next.js account type/size badges */
.selection-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 60px;
}

.selection-pill {
  display: flex;
  height: fit-content;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.08);
  padding: 4px 12px;
  font-size: 12px;
}
.selection-pill .pill-label {
  color: rgba(255, 255, 255, 0.5);
}
.selection-pill .pill-value {
  color: var(--title-color);
}
.selection-pill.is-accent {
  border-color: rgba(246, 255, 120, 0.2);
}
.selection-pill.is-accent .pill-value {
  color: var(--neon-yellow);
}

/* White glow utility */
.white-glow {
  box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.4);
}

/* Inset glow utility */
.inset-glow {
  box-shadow: inset 0 0 7px 2px rgba(123, 252, 127, 0.4);
}

/*------------------- Font -------------------*/
.font-icon {
  font-family: var(--icon-font);
}

.font-title {
  font-family: var(--title-font);
}

.font-body {
  font-family: var(--body-font);
}

.fw-extralight {
  font-weight: 100;
}

.fw-light {
  font-weight: 300;
}

.fw-normal {
  font-weight: 400;
}

.fw-medium {
  font-weight: 500;
}

.fw-semibold {
  font-weight: 600;
}

.fw-bold {
  font-weight: 700;
}

.fw-extrabold {
  font-weight: 800;
}

.fs-md {
  font-size: 18px;
}

.fs-lg {
  font-size: 20px;
}

.fs-22 {
  font-size: 22px;
}

.fs-xs {
  font-size: 14px;
}

.fs-60 {
  font-size: 60px;
  line-height: 74px;
}

.fs-96 {
  font-size: 96px;
  line-height: 1.1;
}

/* Large devices */
@media (max-width: 1199px) {
  .fs-60 {
    font-size: 50px;
    line-height: 62px;
  }
  .fs-96 {
    font-size: 70px;
  }
}
/* Medium devices */
@media (max-width: 991px) {
  .fs-60 {
    font-size: 38px;
    line-height: 1.33;
  }
  .fs-96 {
    font-size: 54px;
  }
}
/* Small devices */
@media (max-width: 767px) {
  .fs-60 {
    font-size: 32px;
  }
  .fs-96 {
    font-size: 42px;
  }
}
/*------------------- Background -------------------*/
.bg-theme {
  background-color: var(--theme-color) !important;
}

.bg-theme2 {
  background-color: var(--theme-color2) !important;
}

.bg-smoke {
  background-color: var(--smoke-color) !important;
}

.bg-smoke2 {
  background-color: var(--smoke-color2) !important;
}

.bg-smoke3 {
  background-color: var(--smoke-color3) !important;
}

.bg-white {
  background-color: var(--white-color) !important;
}

.bg-black {
  background-color: var(--black-color) !important;
}

.bg-title {
  background-color: var(--title-color) !important;
}

.bg-body {
  background-color: var(--body-color) !important;
}

.bg-dark {
  background-color: var(--dark) !important;
}

.bg-dark-gray {
  background-color: var(--dark-gray) !important;
}

.gr-bg1 {
  background-image: linear-gradient(
    to right,
    var(--theme-color),
    var(--theme-color2)
  );
}

.background-image,
[data-bg-src] {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.bg-fluid {
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
}

.bg-auto {
  background-size: auto auto;
}

.bg-bottom-right {
  background-size: auto;
  background-position: bottom right;
}

.bg-top-right {
  background-size: auto;
  background-position: top right;
}

.bg-top-center {
  background-size: auto;
  background-position: top center;
}

.bg-top-left {
  background-size: auto;
  background-position: top left;
}

.bg-left {
  background-position: left center;
}

.bg-top {
  background-position: top center;
}

.bg-repeat {
  background-size: auto;
  background-repeat: repeat;
}

.bg-contain-repeat {
  background-size: contain;
  background-repeat: repeat;
  background-position: center left;
}

/* Large devices */
@media (max-width: 1199px) {
  .bg-contain-repeat {
    background-position: bottom left;
  }
}
/*------------------- Text Color -------------------*/
.text-theme {
  color: var(--theme-color) !important;
}

.text-theme2 {
  color: var(--theme-color2) !important;
}

.text-title {
  color: var(--title-color) !important;
}

.text-body {
  color: var(--body-color) !important;
}

.text-white {
  color: var(--white-color) !important;
}

.text-light {
  color: var(--light-color) !important;
}

.text-gray {
  color: var(--gray-color) !important;
}

.text-yellow {
  color: var(--yellow-color) !important;
}

.text-success {
  color: var(--success-color) !important;
}

.text-error {
  color: var(--error-color) !important;
}

.text-neon-green {
  color: var(--neon-green) !important;
}

.text-neon-yellow {
  color: var(--neon-yellow) !important;
}

.text-inherit {
  color: inherit;
}
.text-inherit:hover {
  color: var(--theme-color);
}

a.text-theme:hover,
.text-reset:hover {
  text-decoration: underline;
}

/*------------------- Overlay -------------------*/
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.position-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

[data-overlay] {
  position: relative;
  z-index: 2;
}
[data-overlay] [class^="col-"],
[data-overlay] [class*="col-"] {
  z-index: 1;
}

[data-overlay]:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

[data-overlay="theme"]:before {
  background-color: var(--theme-color);
}

[data-overlay="theme2"]:before {
  background-color: var(--theme-color2);
}

[data-overlay="title"]:before {
  background-color: var(--title-color);
}

[data-overlay="white"]:before {
  background-color: var(--white-color);
}

[data-overlay="black"]:before {
  background-color: var(--black-color);
}

[data-overlay="overlay1"]:before {
  background-color: #0e121d;
}

[data-opacity="1"]:before {
  opacity: 0.1;
}

[data-opacity="2"]:before {
  opacity: 0.2;
}

[data-opacity="3"]:before {
  opacity: 0.3;
}

[data-opacity="4"]:before {
  opacity: 0.4;
}

[data-opacity="5"]:before {
  opacity: 0.5;
}

[data-opacity="6"]:before {
  opacity: 0.6;
}

[data-opacity="7"]:before {
  opacity: 0.7;
}

[data-opacity="8"]:before {
  opacity: 0.8;
}

[data-opacity="9"]:before {
  opacity: 0.9;
}

[data-opacity="10"]:before {
  opacity: 1;
}

/*------------------- Animation -------------------*/
.ripple-animation {
  animation-duration: var(--ripple-ani-duration);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-name: ripple;
}

@keyframes ripple {
  0% {
    transform: scale(1);
    opacity: 0;
  }
  30% {
    opacity: 0.4;
  }
  100% {
    transform: scale(1.7);
    opacity: 0;
  }
}
@keyframes ripplemap {
  0% {
    transform: scale(1);
    opacity: 0;
  }
  30% {
    opacity: 0.6;
  }
  100% {
    transform: scale(2.5);
    opacity: 0;
  }
}
.movingX {
  animation: movingX 8s linear infinite;
}

@keyframes movingX {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(50px);
  }
  100% {
    transform: translateX(0);
  }
}
.moving {
  animation: moving 8s linear infinite;
}

@keyframes moving {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-50px);
  }
  100% {
    transform: translateX(0);
  }
}
.jump {
  animation: jumpAni 7s linear infinite;
}

@keyframes jumpAni {
  0% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  100% {
    transform: translateY(0);
  }
}
.jump-reverse {
  animation: jumpReverseAni 7s linear infinite;
}

@keyframes jumpReverseAni {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(30px);
  }
  100% {
    transform: translateY(0);
  }
}
.spin {
  animation: spin 15s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(40deg);
  }
  100% {
    transform: rotate(0);
  }
}
@keyframes animate-positive {
  0% {
    width: 0;
  }
}
.scalein.ot-animated {
  --animation-name: scalein;
}

.slidetopleft.ot-animated {
  --animation-name: slidetopleft;
}

.slidebottomright.ot-animated {
  --animation-name: slidebottomright;
}

.slideinleft.ot-animated {
  --animation-name: slideinleft;
}

.slideinright.ot-animated {
  --animation-name: slideinright;
}

.slideinup.ot-animated {
  --animation-name: slideinup;
}

.slideindown.ot-animated {
  --animation-name: slideindown;
}

.rollinleft.ot-animated {
  --animation-name: rollinleft;
}

.rollinright.ot-animated {
  --animation-name: rollinright;
}

.scalein,
.slidetopleft,
.slidebottomright,
.slideinleft,
.slideinright,
.slideindown,
.slideinup,
.rollinleft,
.rollinright {
  opacity: 0;
  animation-fill-mode: both;
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-delay: 0.3s;
  animation-name: var(--animation-name);
}

.ot-animated {
  opacity: 1;
}

@keyframes slideinup {
  0% {
    opacity: 0;
    transform: translateY(70px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes slideinright {
  0% {
    opacity: 0;
    transform: translateX(70px);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slideindown {
  0% {
    opacity: 0;
    transform: translateY(-70px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes slideinleft {
  0% {
    opacity: 0;
    transform: translateX(-70px);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slidebottomright {
  0% {
    opacity: 0;
    transform: translateX(100px) translateY(100px);
  }
  100% {
    transform: translateX(0) translateY(0);
  }
}
@keyframes slidetopleft {
  0% {
    opacity: 0;
    transform: translateX(-100px) translateY(-100px);
  }
  100% {
    transform: translateX(0) translateY(0);
  }
}
@keyframes scalein {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes rollinleft {
  0% {
    opacity: 0;
    transform: translateX(-100%) rotate(-120deg);
  }
  to {
    transform: translateX(0) rotate(0deg);
  }
}
@keyframes rollinright {
  0% {
    opacity: 0;
    transform: translateX(100%) rotate(120deg);
  }
  to {
    transform: translateX(0) rotate(0deg);
  }
}
/*------------------- Header  -------------------*/
.ot-header {
  position: relative;
  z-index: 41;
}

/* Background elements matching Next.js layout */
.tof-dots-bg {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 0;
  pointer-events: none;
}
.tof-dots-bg img {
  width: 100%;
  background: transparent;
}

.tof-green-glow {
  position: absolute;
  width: 50%;
  aspect-ratio: 1/1;
  top: 0;
  left: 50%;
  transform: translateX(-33%) translateY(-50%);
  background: rgba(123, 252, 127, 0.05);
  border-radius: 50%;
  filter: blur(48px);
  z-index: 0;
  pointer-events: none;
}

.site-main {
  position: relative;
  z-index: 1;
  padding: 24px;
}

.sticky-wrapper {
  transition: 0.4s ease-in-out;
}
.sticky-wrapper.sticky {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  background-color: transparent;
  padding-top: 0;
  padding-bottom: 0;
  box-shadow: none;
  animation: stickyAni 0.4s ease-in-out;
}
.sticky-wrapper.sticky .menu-area {
  background-color: var(--smoke-color) !important;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}

@keyframes stickyAni {
  0% {
    transform: translate3d(0, -40px, 0) scaleY(0.8);
    opacity: 0.7;
  }
  100% {
    transform: translate3d(0, 0, 0) scaleY(1);
    opacity: 1;
  }
}
.main-menu a {
  display: block;
  position: relative;
  font-weight: 500;
  font-size: 16px;
  color: var(--title-color);
  text-transform: capitalize;
}
.main-menu a:hover {
  color: var(--theme-color);
}
.main-menu > ul > li {
  margin: 0 20px;
}
.main-menu > ul > li > a {
  padding: 12px 0;
}
.main-menu ul {
  margin: 0;
  padding: 0;
}
.main-menu ul li {
  list-style-type: none;
  display: inline-block;
  position: relative;
}
.main-menu ul li:last-child {
  margin-right: 0 !important;
}
.main-menu ul li:first-child {
  margin-left: 0 !important;
}
.main-menu ul li:hover > ul.sub-menu,
.main-menu ul li:hover ul.mega-menu {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
  z-index: 9;
}
.main-menu ul.sub-menu {
  position: absolute;
  text-align: left;
  top: 100%;
  left: 0;
  background-color: var(--body-bg);
  border: 1px solid var(--ot-border-color);
  visibility: hidden;
  min-width: 190px;
  width: max-content;
  padding: 18px 20px;
  left: -27px;
  opacity: 0;
  z-index: -1;
  border-radius: 10px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
  transform: scaleY(0);
  transform-origin: top center;
  transition: all 0.4s ease 0s;
}
.main-menu ul.sub-menu li {
  display: block;
  margin: 0 0;
  padding: 0px 9px;
}
.main-menu ul.sub-menu li a {
  font-size: 14px;
  line-height: 30px;
}

.dropdown-menu:before {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(50% - 10px);
  border-style: solid;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #fff transparent;
}

.header-button {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
}
.header-button .dropdown-menu {
  text-align: center;
  top: 7px !important;
}
.header-button {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .header-button {
    gap: 6px;
  }
}

.header-logo-img {
  width: 160px;
  height: auto;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .header-logo-img {
    width: 144px;
  }
}

.logo-wrap {
  align-items: center;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .logo-wrap {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Header Layout 1 - matching Next.js */
.header-layout1 {
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;
  position: relative;
  z-index: 41;
  /* Medium devices */
}
@media (max-width: 991px) {
  .header-layout1 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.header-layout1 .header-logo {
  position: relative;
  z-index: 2;
}
.header-layout1 .ot-menu-toggle {
  margin-left: auto;
}

/* Logout button style */
.ot-btn.style-logout {
  background: transparent;
  border: 1px solid var(--ot-border-color);
  color: var(--title-color);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 27px;
  min-width: auto;
}
.ot-btn.style-logout:hover {
  border-color: transparent;
  color: var(--black-color);
}

/* Small devices */
@media (max-width: 767px) {
  .header-layout1 .row {
    --bs-gutter-x: 6px;
  }
  .header-layout1 .header-logo img {
    max-width: 144px;
  }
}
/*------------------- Footer  -------------------*/
/* Footer - matching Next.js design */
.tof-footer {
  width: 100%;
  padding: 64px 32px;
  position: relative;
  z-index: 2;
  /* Medium devices */
}
@media (max-width: 991px) {
  .tof-footer {
    padding: 40px 16px;
  }
}

.footer-top {
  margin-bottom: 64px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .footer-top {
    margin-bottom: 40px;
  }
}

.footer-brand {
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  /* Small devices */
}
@media (max-width: 767px) {
  .footer-brand {
    max-width: 100%;
    align-items: center;
    text-align: center;
  }
}

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

.footer-tagline {
  color: var(--title-color);
  font-size: 18px;
  line-height: 1.4;
  margin: 0;
  /* Small devices */
}
@media (max-width: 767px) {
  .footer-tagline {
    text-align: center;
  }
}
.footer-tagline {
  /* Large devices */
}
@media (max-width: 1199px) {
  .footer-tagline {
    font-size: 16px;
  }
}

.newsletter-input-wrap {
  display: flex;
  align-items: center;
  background-color: var(--smoke-color3);
  padding-right: 12px;
  border-radius: 12px;
  overflow: hidden;
  gap: 8px;
}

.newsletter-email {
  flex: 1;
  border: none !important;
  background: transparent !important;
  height: 56px;
  color: var(--title-color);
  padding-left: 16px;
  font-size: 16px;
}
.newsletter-email::placeholder {
  color: var(--light-color);
}
.newsletter-email:focus {
  outline: none;
  box-shadow: none;
  border: none !important;
}

.newsletter-submit {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: none;
  background-image: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  color: var(--black-color);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  translate: 31%;
  transition:
    transform 0.2s ease,
    opacity 0.2s ease;
}
.newsletter-submit:hover {
  opacity: 0.9;
  transform: scale(1.05);
}
.newsletter-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.newsletter-message {
  font-size: 14px;
  color: var(--body-color);
  margin: 0;
}

.footer-heading {
  color: var(--title-color);
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 16px;
}

.footer-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.footer-links-list li {
  list-style: none;
}
.footer-links-list a {
  color: var(--body-color);
  font-size: 16px;
  transition: 0.3s ease-in-out;
}
.footer-links-list a:hover {
  color: var(--title-color);
}

.footer-divider {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  margin: 0 0 32px 0;
}

.footer-bottom {
  margin-bottom: 32px;
}

.footer-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-copyright {
  color: rgba(255, 255, 255, 0.9);
  max-width: 384px;
  margin: 0;
  font-size: 14px;
}

.footer-address {
  color: rgba(255, 255, 255, 0.9);
  max-width: 224px;
  margin: 0;
  font-size: 14px;
}

.footer-legal {
  display: flex;
  gap: 32px;
}
.footer-legal a {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  transition: 0.3s ease-in-out;
}
.footer-legal a:hover {
  color: var(--title-color);
}

.footer-disclaimer {
  color: var(--body-color);
  font-size: 14px;
}
.footer-disclaimer p {
  color: var(--body-color);
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 8px;
}
.footer-disclaimer p:last-child {
  margin-bottom: 0;
}

/* Legacy footer support */
.footer-wrapper {
  position: relative;
  z-index: 2;
}

.copy-right-area {
  padding: 20px 0;
  border-top: 1px solid var(--ot-border-color);
}

.copyright-text {
  margin: 0;
  color: var(--title-color);
}
.copyright-text a {
  color: var(--theme-color);
}
.copyright-text a:hover {
  color: var(--title-color);
}

.social-links .social-title {
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  margin: 0 20px 0 0;
  color: var(--body-color);
}
.social-links a {
  font-size: 16px;
  display: inline-block;
  color: var(--body-color);
  text-align: center;
  transition: 0.4s ease-in-out;
  margin-right: 30px;
}
.social-links a:last-child {
  margin-right: 0;
}
.social-links a:hover {
  color: var(--theme-color);
}

.footer-widget {
  margin-bottom: 0;
  height: 100%;
}
.footer-widget,
.footer-widget .widget {
  padding: 0;
  background-color: transparent;
  box-shadow: none;
  /* Medium devices */
}
@media (max-width: 991px) {
  .footer-widget,
  .footer-widget .widget {
    margin-bottom: 45px;
  }
}
.footer-widget .widget_title {
  font-size: 20px;
  font-weight: 600;
  color: var(--title-color);
  margin-bottom: 16px;
}
.footer-widget.widget_categories a,
.footer-widget.widget_nav_menu a {
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 8px;
  color: var(--body-color);
  display: block;
  transition: 0.3s ease-in-out;
}
.footer-widget.widget_categories a:hover,
.footer-widget.widget_nav_menu a:hover {
  color: var(--title-color);
}
.footer-widget.widget_categories li,
.footer-widget.widget_nav_menu li {
  list-style: none;
}

.newsletter-form {
  width: 100%;
  position: relative;
  z-index: 2;
}
.newsletter-form .wpcf7-spinner {
  display: none;
}
.newsletter-form input {
  height: 56px;
  background-color: var(--smoke-color);
}
.newsletter-form input:focus {
  border-color: var(--theme-color);
}
.newsletter-form .ot-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  padding: 11.5px 16px;
  height: 48px;
  min-width: auto;
  border-radius: 50%;
  background: var(--theme-color2);
  width: auto;
  outline: none;
  transition: 0.4s ease-in-out;
}
.newsletter-form .ot-btn:hover {
  background: var(--title-color);
}

/*------------------- Breadcumb  -------------------*/
.breadcumb-menu {
  max-width: 100%;
  padding: 0;
  margin: 40px 0 -0.5em 0;
  list-style-type: none;
  position: relative;
}
.breadcumb-menu li {
  display: inline-block;
  margin-right: 3px;
  padding-right: 5px;
  list-style: none;
  position: relative;
}
.breadcumb-menu li:after {
  content: "/";
  position: relative;
  margin-left: 10px;
  font-weight: 500;
  font-size: inherit;
  color: inherit;
  font-family: "Arial";
}
.breadcumb-menu li:last-child {
  padding-right: 0;
  margin-right: 0;
  color: var(--light-color);
}
.breadcumb-menu li:last-child:after {
  display: none;
}
.breadcumb-menu li,
.breadcumb-menu a,
.breadcumb-menu span {
  white-space: normal;
  color: inherit;
  word-break: break-word;
  font-weight: 400;
  font-size: 16px;
  color: var(--white-color);
}
.breadcumb-menu li svg,
.breadcumb-menu a svg,
.breadcumb-menu span svg {
  margin-right: 5px;
  margin-top: -7px;
}

.body-shape1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
.body-shape1 img {
  width: 100%;
  /* Small devices */
}
@media (max-width: 767px) {
  .body-shape1 img {
    min-height: 750px;
    object-fit: cover;
  }
}

.breadcumb-text {
  color: var(--title-color);
  max-width: 500px;
  font-size: 16px;
  margin: 45px auto -0.4em auto;
}
.breadcumb-text.bigger-content {
  max-width: 700px;
}

.breadcumb-subtitle {
  font-size: 18px;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--title-color);
  margin-top: -0.4em;
  margin-bottom: 35px;
  display: block;
}

.breadcumb-title {
  color: var(--title-color);
  margin: -0.23em 0 -0.23em 0;
  display: block;
  position: relative;
  font-weight: 800;
}
.breadcumb-title.platform-title {
  max-width: 804px;
  margin-left: auto;
  margin-right: auto;
}

.breadcumb-wrapper {
  padding: 210px 0 100px 0;
  position: relative;
  z-index: 3;
  text-align: center;
}

/* Large devices */
@media (max-width: 1199px) {
  .breadcumb-menu {
    margin: 30px 0 -0.5em 0;
  }
}
/* Medium devices */
@media (max-width: 991px) {
  .breadcumb-wrapper {
    padding: 160px 0 80px;
  }
  .breadcumb-text {
    margin-top: 35px;
  }
  .breadcumb-menu {
    margin: 25px 0 -0.5em 0;
  }
  .breadcumb-menu li,
  .breadcumb-menu a,
  .breadcumb-menu span {
    font-size: 16px;
  }
  .breadcumb-subtitle {
    text-transform: capitalize;
  }
  .breadcumb-title {
    font-size: 40px;
  }
  .breadcumb-title.fs-96 {
    font-size: 54px;
  }
}
/* Small devices */
@media (max-width: 767px) {
  .breadcumb-title {
    font-size: 34px;
  }
  .breadcumb-title.fs-96 {
    font-size: 42px;
  }
}
/*------------------- Simple Sections  -------------------*/
.wpcf7 form p {
  margin: 0;
}
.wpcf7 form br {
  display: none;
}
.wpcf7 form .wpcf7-response-output {
  border: none;
  padding: 0;
  margin-bottom: 0;
}
.wpcf7 form.sent .wpcf7-response-output {
  border: none;
  color: green;
}
.wpcf7 form .wpcf7-not-valid-tip {
  margin-top: 5px;
}

.contact-form {
  max-width: 860px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.8);
  border: 1.5px solid #ffffff;
  backdrop-filter: blur(45px);
  border-radius: 18px;
  padding: 30px 30px 0 30px;
}
.contact-form label {
  color: var(--theme-color);
  font-weight: 700;
  padding-left: 20px;
}
.contact-form label span {
  color: var(--light-color);
  font-weight: 400;
}
.contact-form .row {
  --bs-gutter-x: 16px;
}
.contact-form .form-group {
  margin-bottom: 26px;
}
.contact-form {
  /* Medium devices */
}
@media (max-width: 991px) {
  .contact-form {
    padding: 25px 0 0 0;
  }
}
.contact-form {
  /* Small devices */
}
@media (max-width: 767px) {
  .contact-form {
    border-radius: 12px;
  }
}

.newsletter-form2 {
  display: flex;
  gap: 12px;
  max-width: 330px;
}
.newsletter-form2 input {
  background-color: transparent;
  border: 1px solid var(--ot-border-color);
}
.newsletter-form2 {
  /* Extra small devices */
}
@media (max-width: 375px) {
  .newsletter-form2 {
    flex-direction: column;
  }
}

.checklist ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.checklist li {
  font-size: 16px;
  color: var(--body-color);
  display: block;
  max-width: fit-content;
  margin-bottom: 16px;
  padding-left: 34px;
  position: relative;
}
.checklist li:before {
  content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="24" height="24" rx="12" fill="url(%23paint0_radial_8_21825)"/><path d="M17 8L10.125 15L7 11.8182" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><defs><radialGradient id="paint0_radial_8_21825" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(12) rotate(90) scale(24)"><stop stop-color="%235EC0FF"/><stop offset="1" stop-color="%231894E3"/></radialGradient></defs></svg>');
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.checklist li:last-child {
  margin-bottom: 0;
}
.checklist.style2 li {
  padding-left: 22px;
  margin-bottom: 12px;
}
.checklist.style2 li:before {
  content: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.99992 8.00004L6.99992 10L10.9999 6.00004M14.6666 8.00004C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00004C1.33325 4.31814 4.31802 1.33337 7.99992 1.33337C11.6818 1.33337 14.6666 4.31814 14.6666 8.00004Z" stroke="%231894E3" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  top: 3px;
}
.checklist.style2 li:last-child {
  margin-bottom: 0;
}

.post-container {
  max-width: 1012px;
  margin-left: auto;
  margin-right: auto;
}

.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
  margin-bottom: 20px;
  font-weight: 600;
}
.post-content > p:last-child {
  margin-bottom: -0.3em;
}
.post-content p:has(+ h3, + h4, + h5, + h6) {
  margin-bottom: 40px;
}
.post-content ul {
  padding-left: 20px;
}
.post-content ul:has(+ h3, + h4, + h5, + h6) {
  margin-bottom: 40px;
}

.process-box-area {
  background-size: auto;
  background-position: top 26px center;
  /* Medium devices */
}
@media (max-width: 991px) {
  .process-box-area {
    background-position: top 14px center;
  }
}
.process-box-area {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .process-box-area {
    background-image: none !important;
  }
}
.process-box {
  text-align: center;
}
.process-box .box-number {
  display: inline-block;
  font-size: 20px;
  color: var(--white-color);
  width: 52px;
  height: 52px;
  line-height: 52px;
  background: radial-gradient(100% 100% at 50% 0%, #5ec0ff 0%, #1894e3 100%);
  box-shadow: 0px 12px 29px rgba(83, 188, 255, 0.5);
  border-radius: 99px;
  margin-bottom: 28px;
}
.process-box .box-title {
  max-width: 280px;
  margin: 0 auto;
}
.process-box.box-2 {
  padding-top: 46px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .process-box.box-2 {
    padding-top: 0;
  }
}

/* Medium devices */
@media (max-width: 991px) {
  .process-row {
    justify-content: center;
    --bs-gutter-y: 35px;
  }
  .process-box .box-number {
    margin-bottom: 20px;
  }
}
.footer-box1 {
  padding: 80px 40px;
  border-radius: 24px;
  text-align: center;
  height: 100%;
}
.footer-box1 .box-subtitle {
  color: var(--theme-color);
  display: block;
  margin-bottom: 16px;
}
.footer-box1 .title {
  max-width: 580px;
  margin: 0 auto 30px auto;
  letter-spacing: -0.03em;
}
.footer-box1 .box-text {
  max-width: 530px;
  margin: 0 auto 36px auto;
}
.footer-box1 {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .footer-box1 {
    padding: 50px 20px;
  }
}

.footer-box2 {
  padding: 80px 40px;
  border-radius: 24px;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.footer-box2 .box-shape {
  position: absolute;
  bottom: 30px;
  left: 0;
  pointer-events: none;
}
.footer-box2 .box-img {
  margin-bottom: 35px;
}
.footer-box2 .title {
  font-size: 32px;
  margin: 0 auto 30px auto;
  max-width: 350px;
  letter-spacing: -0.03em;
}
.footer-box2 {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .footer-box2 {
    padding: 50px 20px;
  }
  .footer-box2 .box-shape {
    bottom: 0;
    max-width: 70px;
  }
}

.feature-sec {
  background-position: top center;
  margin-bottom: -150px;
  padding-bottom: 150px;
}

.brand-area {
  text-align: center;
}
.brand-area .box-title {
  color: var(--body-color);
  margin-bottom: 30px;
  font-weight: 500;
}

.brand-row {
  display: flex;
  justify-content: center;
  gap: 24px 80px;
  flex-wrap: wrap;
  /* Medium devices */
}
@media (max-width: 991px) {
  .brand-row {
    gap: 20px 40px;
  }
}

.feature-box {
  background: rgba(255, 255, 255, 0.7);
  border: 1.5px solid #ffffff;
  box-shadow: 0px 32px 60px rgba(9, 67, 104, 0.1);
  backdrop-filter: blur(45px);
  border-radius: 24px;
  text-align: center;
  padding: 70px 30px;
  height: 100%;
}
.feature-box .box-title {
  font-weight: 800;
}
.feature-box .box-icon {
  margin-bottom: 24px;
  transition: 0.4s ease-in-out;
}
.rounded-sec {
  margin: 16px;
  border-radius: 24px;
}

.feature-card {
  background: rgba(255, 255, 255, 0.7);
  border: 1.5px solid #ffffff;
  box-shadow: 0px 32px 60px -20px rgba(9, 67, 104, 0.1);
  backdrop-filter: blur(45px);
  border-radius: 24px;
  padding: 30px;
  text-align: center;
  height: 100%;
}
.feature-card .box-icon {
  margin-bottom: 30px;
  transition: 0.4s ease-in-out;
  position: relative;
  z-index: 2;
}
.feature-card .box-text {
  max-width: 430px;
  margin-left: auto;
  margin-right: auto;
}
.timeline-wrap {
  padding: 60px 0;
}

.timeline-box {
  display: flex;
  justify-content: center;
  gap: 80px;
  margin-bottom: 50px;
}
.timeline-box:last-child {
  margin-bottom: 0;
}
.timeline-box:nth-child(even) {
  flex-direction: row-reverse;
}
.timeline-box:nth-child(even) .box-content {
  text-align: right;
}
.timeline-box:nth-child(odd) .box-img {
  text-align: right;
}
.timeline-box {
  /* Medium devices */
}
@media (max-width: 991px) {
  .timeline-box {
    gap: 60px;
  }
}
.timeline-box .box-img,
.timeline-box .box-content {
  flex: 1;
  max-width: 395px;
}
.timeline-box .box-subtitle {
  text-transform: uppercase;
  color: var(--title-color);
  display: inline-block;
  background: rgba(255, 255, 255, 0.4);
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0px 20px 20px -15px rgba(9, 67, 104, 0.12);
  backdrop-filter: blur(10px);
  border-radius: 12px;
  padding: 9px 20px;
  margin-bottom: 28px;
}
.timeline-box .box-title {
  font-size: 32px;
  color: var(--theme-color);
}
.timeline-box {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .timeline-box {
    flex-direction: column !important;
    gap: 40px;
    text-align: center;
  }
  .timeline-box .box-img,
  .timeline-box .box-content {
    max-width: 100%;
    text-align: center !important;
  }
}

.t-line {
  position: absolute;
  top: 0;
  left: calc(50% - 1px);
  width: 3px;
  height: 100%;
  background-color: #cfedff;
}
.t-line .line-inner {
  position: absolute;
  top: 0;
  left: 0;
  height: 210px;
  width: 100%;
  background-image: linear-gradient(to bottom, var(--theme-color), transparent);
}
.t-line {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .t-line {
    display: none;
  }
}

.tab-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 50px;
}
.tab-wrap .text {
  color: var(--title-color);
}
.tab-wrap {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .tab-wrap {
    gap: 10px;
    flex-direction: column;
  }
}

.timeline-tab {
  background-color: var(--white-color);
  display: inline-flex;
  flex-wrap: nowrap;
  border-radius: 99px;
  position: relative;
  z-index: 2;
}
.timeline-tab button {
  width: 48px;
  height: 48px;
  padding: 0;
  border: none;
  background-color: transparent;
  z-index: 3;
  position: relative;
  cursor: pointer;
}
.timeline-tab .indicator {
  position: absolute;
  top: var(--pos-y);
  left: var(--pos-x);
  width: var(--width-set);
  height: var(--height-set);
  background: radial-gradient(100% 100% at 50% 0%, #5ec0ff 0%, #1894e3 100%);
  border: 3px solid #ffffff;
  box-shadow: 0px 12px 29px -10px #53bcff;
  border-radius: 99px;
  transition: 0.3s ease-in-out;
}

.platform-content .line-wrap {
  display: flex;
  gap: 30px;
  margin-bottom: 30px;
  margin-top: 20px;
}
.platform-content .line-wrap span {
  display: inline-block;
  flex: 100%;
  height: 2px;
  background-color: var(--body-bg);
  transition: 0.4s ease-out;
}
.platform-content .line-wrap span.active {
  background-color: var(--theme-color) !important;
}

.pl-img img {
  width: 100%;
  border-radius: 24px;
}

.platform-tab {
  gap: 16px;
  margin-bottom: 30px;
}
.platform-tab button {
  background: rgba(255, 255, 255, 0.25);
  border: 1.5px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  border-radius: 8px;
  padding: 11px 12px;
  transition: 0.3s ease-in-out;
}
.platform-tab button:before {
  transform: translateX(5px);
  transition: 0.3s ease-in-out;
}
.platform-tab button.active {
  background: rgba(255, 255, 255, 0.9);
  border: 1.5px solid #ffffff;
  box-shadow: 0px 22px 40px -50px rgba(9, 67, 104, 0.12);
}
.platform-tab button.active:before {
  content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="24" height="24" rx="5" fill="%231894E3"/><path d="M8.3999 12L10.7999 14.4L15.5999 9.59998" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  vertical-align: middle;
  line-height: 1px;
  margin-right: 4px;
  transform: translateX(0);
}

/* Medium devices */
@media (max-width: 991px) {
  .platform-sec {
    text-align: center;
  }
  .platform-sec ul {
    display: inline-block;
  }
  .platform-sec ul li {
    text-align: left;
  }
  .platform-sec .platform-tab {
    justify-content: center;
  }
  .platform-sec .line-wrap {
    margin-top: 35px;
  }
  .platform-sec .line-wrap span {
    background-color: var(--ot-border-color);
  }
}
.estimate-buttons {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}
.estimate-buttons button {
  position: relative;
  z-index: 2;
  background-image: linear-gradient(to top, var(--theme-color2), #c3e8ff);
  border: none;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 500;
  border-radius: 8px;
  color: var(--title-color);
  min-width: 94px;
}
.estimate-buttons button:before {
  content: "";
  position: absolute;
  inset: 1px;
  background-color: var(--body-bg);
  border-radius: inherit;
  z-index: -1;
  transition: 0.4s ease-in-out;
}
.estimate-buttons button:hover {
  color: var(--theme-color);
}
.estimate-buttons button.active {
  color: var(--white-color);
  box-shadow: 0px 12px 29px -10px #53bcff;
  background-image: radial-gradient(
    100% 100% at 50% 0%,
    var(--theme-color2) 0%,
    var(--theme-color) 100%
  );
}
.estimate-buttons button.active:before {
  opacity: 0;
  visibility: hidden;
}

.estimate-area {
  max-width: 738px;
  margin: 0 auto;
  padding: 40px;
  text-align: center;
  border-radius: 24px;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .estimate-area {
    padding: 40px 20px;
  }
}
.estimate-area .account-title {
  font-size: 32px;
}
.estimate-area .box-title {
  color: var(--theme-color);
}
.estimate-area .input-range {
  border: none !important;
  background-color: #acd5fc !important;
  height: 2px;
  margin-bottom: 30px;
  -webkit-appearance: none;
  appearance: none;
  padding: 0;
}
.estimate-area .input-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background-image: radial-gradient(
    100% 100% at 50% 0%,
    var(--theme-color2) 0%,
    var(--theme-color) 100%
  );
  cursor: pointer;
  transform: translateY(-1px);
  z-index: 4;
  position: relative;
}
.estimate-area .input-range::-moz-range-thumb {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background-image: radial-gradient(
    100% 100% at 50% 0%,
    var(--theme-color2) 0%,
    var(--theme-color) 100%
  );
  cursor: pointer;
  z-index: 4;
  position: relative;
}
.estimate-area .input-range::-moz-range-progress {
  background-color: var(--theme-color);
}
.estimate-area .rang-wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-top: 20px; /* Add space for the value above */
}
.estimate-area .range-value {
  position: absolute;
  top: -5px;
  left: 50%;
  font-size: 16px;
  font-weight: 500;
  color: var(--theme-color);
  pointer-events: none;
}
.estimate-area .range-proggress {
  position: absolute;
  top: calc(50% + 1px);
  left: 0;
  height: 2px;
  background-color: var(--theme-color);
  z-index: 3;
  width: 50%;
  pointer-events: none;
  transition: 0.1s ease-in-out;
}
.estimate-area .profit-calc-result {
  font-size: 24px;
  font-weight: 700;
  color: var(--theme-color);
}

.bird-shape1 {
  position: absolute;
  top: 0;
  left: 4%;
  z-index: -1;
}

.bear-shape1 {
  position: absolute;
  bottom: 0;
  right: 4%;
  z-index: -1;
}

/*------------------- Table  -------------------*/
.pricing-buttons-wrap {
  display: flex;
  gap: 30px 60px;
  justify-content: center;
  margin-bottom: 36px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .pricing-buttons-wrap {
    flex-wrap: wrap;
  }
}

.btn-disable {
  opacity: 0.4;
  pointer-events: none;
}

.home-variations {
  --title-color: #090d0a;
  --body-color: #090d0a;
  --ot-border-color: #c8c6c6;
  max-width: 646px;
  margin: 0 auto 32px auto;
  background-color: var(--white-color);
  border-radius: 24px;
  padding: 30px;
  text-align: left;
}
.home-variations .main-title {
  font-size: 18px;
  font-weight: 600;
}
.home-variations h6 {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 14px;
}
.home-variations {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .home-variations {
    padding: 20px;
  }
}

.info-box {
  text-align: center;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(8px);
  border-radius: 24px;
  padding: 32px;
  max-width: 646px;
  margin: 0 auto;
}

.variations-buttons {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 14px;
}
.variations-buttons button {
  position: relative;
  z-index: 2;
  border: none;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 500;
  border-radius: 8px;
  color: var(--title-color);
  min-width: 94px;
}
.variations-buttons button:hover {
  color: var(--theme-color);
}
.variations-buttons button.active {
  color: var(--white-color);
  background-image: var(--theme-color);
}
.variations-buttons button.active:before {
  opacity: 0;
  visibility: hidden;
}

.variation-sec {
  position: relative;
  z-index: 3;
}
.variation-sec {
  /*
  .sec-shape {
      position: absolute;
      bottom: -774px;
      left: 0;
      text-align: center;
      width: 100%;
      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(30, 137, 27, 0.4) 102.48%);
      background-size: 100% 202px;
      background-repeat: no-repeat;
      background-position: bottom 774px center;

      img {
          position: relative;
          z-index: 2;
          mix-blend-mode: color-dodge;
      }
  }
  .sec-glow {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 202px;
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(30, 137, 27, 0.4) 102.48%);
  }
  */
}

.price-area {
  padding: 60px 90px 0 90px;
  background: var(--body-bg);
  box-shadow: 0px -66px 94px -70px rgba(83, 188, 255, 0.6);
  border-radius: 24px;
  /* Medium Large devices */
}
@media (max-width: 1299px) {
  .price-area {
    padding: 60px 0 0 0;
  }
}

.start-trading-btn {
  padding: 20px 30px;
  min-width: 150px;
}

.challege-price {
  font-size: 36px;
  color: var(--body-color);
  font-weight: 600;
  margin-bottom: 40px;
}
.challege-price .original-price {
  font-weight: 500;
  color: var(--title-color);
}
.challege-price .duration {
  font-size: 16px;
}
.challege-price {
  font-weight: 400;
}

.selected-variations {
  margin-bottom: 10px;
}

.woocommerce-additional-fields {
  display: none;
}

.screen-reader-text {
  display: none;
}

/*------------------- Affiliate  -------------------*/
/*------------------- Checkout  -------------------*/
/* Checkout section - matching Next.js layout and styling */
/* ================== FRONT PAGE / HOME VARIATIONS ================== */
.variation-sec {
  position: relative;
  z-index: 2;
}

.title-area {
  margin-bottom: 24px;
}
.title-area .sec-title {
  font-size: 56px;
  font-weight: 600;
  color: var(--title-color);
  margin-bottom: 8px;
  letter-spacing: -0.02em;
  /* Medium devices */
}
@media (max-width: 991px) {
  .title-area .sec-title {
    font-size: 36px;
  }
}
.title-area .sec-text {
  font-size: 18px;
  color: var(--body-color);
  max-width: 448px;
  margin: 0 auto;
  line-height: 1.4;
  /* Medium devices */
}
@media (max-width: 991px) {
  .title-area .sec-text {
    font-size: 14px;
  }
}
.title-area .sec-text a {
  color: var(--neon-yellow);
  font-weight: 600;
}
.title-area .sec-text a:hover {
  color: var(--neon-green);
}

/* Home page layout matching Next.js 2-column checkout */
.home-variations {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.home-variations .main-title {
  display: none;
}

.account-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.account-item h6 {
  color: var(--title-color);
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Variation buttons matching Next.js RadioGroup pattern */
.variations-buttons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  /* Large devices */
}
@media (max-width: 1199px) {
  .variations-buttons {
    grid-template-columns: repeat(2, 1fr);
  }
}
.variations-buttons {
  /* Medium devices */
}
@media (max-width: 991px) {
  .variations-buttons {
    grid-template-columns: repeat(2, 1fr);
  }
}
.variations-buttons button {
  position: relative;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--title-color);
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 400;
  padding: 12px 16px;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.3s ease-in-out;
  text-align: center;
}
.variations-buttons button:hover {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.03);
}
.variations-buttons button.active {
  border-color: var(--neon-green);
  background: rgba(123, 252, 127, 0.08);
  box-shadow: inset 0 0 7px 2px rgba(123, 252, 127, 0.4);
}

/* Quantity selector - matching Next.js pattern */
.quantity-selector {
  display: flex;
  align-items: center;
  gap: 8px;
}
.quantity-selector button {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: transparent;
  color: var(--title-color);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s ease-in-out;
}
.quantity-selector button:hover {
  border-color: rgba(255, 255, 255, 0.2);
}
.quantity-selector button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.quantity-selector input {
  width: 40px;
  text-align: center;
  font-weight: 700;
  border: none;
  background: transparent;
  color: var(--title-color);
  font-size: 16px;
}
.quantity-selector input:focus {
  outline: none;
  box-shadow: none;
  border: none;
}

/* Price/Info box matching Next.js Order Summary card */
.info-box {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .info-box {
    padding: 16px;
  }
}
.info-box .selected-variations {
  font-size: 14px;
  color: var(--body-color);
  margin: 0;
}
.info-box .challege-price {
  font-size: 32px;
  font-weight: 600;
  color: var(--neon-yellow);
  margin: 0;
  line-height: 1;
}
.info-box .challege-price .original-price {
  color: var(--neon-yellow);
}
.info-box .challege-price .duration {
  color: var(--light-color);
  font-size: 14px;
  font-weight: 400;
}
.info-box .start-trading-btn {
  width: 100%;
  text-align: center;
  font-weight: 700;
  height: 48px;
  line-height: 48px;
  padding: 0 24px;
  box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.4);
}

/* ================== WOOCOMMERCE CHECKOUT ================== */
.woocommerce-checkout.space,
.woocommerce-checkout-2.space {
  padding-bottom: 100px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce-checkout.space,
  .woocommerce-checkout-2.space {
    padding-bottom: 70px;
  }
}
.woocommerce-checkout .authentication-form,
.woocommerce-checkout-2 .authentication-form {
  max-width: 100%;
}
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout-2 .woocommerce-message,
.woocommerce-checkout-2 .woocommerce-error {
  max-width: calc(50% - 15px);
  margin-right: auto;
  margin-left: 0;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce-checkout .woocommerce-message,
  .woocommerce-checkout .woocommerce-error,
  .woocommerce-checkout-2 .woocommerce-message,
  .woocommerce-checkout-2 .woocommerce-error {
    max-width: 100%;
  }
}
.woocommerce-checkout .row,
.woocommerce-checkout-2 .row {
  --bs-gutter-x: 30px;
}
.woocommerce-checkout,
.woocommerce-checkout-2 {
  /* Shop table (order review) - matching Next.js order summary card */
}
.woocommerce-checkout table.shop_table,
.woocommerce-checkout-2 table.shop_table {
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.08) !important;
  padding: 24px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  border-collapse: separate;
  border-spacing: 0;
}
.woocommerce-checkout table.shop_table td,
.woocommerce-checkout-2 table.shop_table td {
  border-top: none;
  padding: 0;
  vertical-align: middle;
}
.woocommerce-checkout table.shop_table dl,
.woocommerce-checkout-2 table.shop_table dl {
  margin-bottom: 4px;
}
.woocommerce-checkout table.shop_table .recurring-total,
.woocommerce-checkout table.shop_table .recurring-totals,
.woocommerce-checkout-2 table.shop_table .recurring-total,
.woocommerce-checkout-2 table.shop_table .recurring-totals {
  display: none;
}
.woocommerce-checkout table.shop_table .product-name,
.woocommerce-checkout-2 table.shop_table .product-name {
  font-size: 16px;
  font-weight: 600;
  color: var(--title-color);
}
.woocommerce-checkout table.shop_table .product-name .product-quantity,
.woocommerce-checkout-2 table.shop_table .product-name .product-quantity {
  display: none;
}
.woocommerce-checkout table.shop_table .product-name a,
.woocommerce-checkout-2 table.shop_table .product-name a {
  color: inherit;
}
.woocommerce-checkout table.shop_table .product-name dd,
.woocommerce-checkout-2 table.shop_table .product-name dd {
  font-weight: 500;
  color: var(--title-color);
}
.woocommerce-checkout table.shop_table .product-name dd p,
.woocommerce-checkout-2 table.shop_table .product-name dd p {
  color: inherit;
}
.woocommerce-checkout table.shop_table .variation,
.woocommerce-checkout-2 table.shop_table .variation {
  gap: 6px;
  font-size: 14px;
}
.woocommerce-checkout table.shop_table ul,
.woocommerce-checkout-2 table.shop_table ul {
  list-style-type: none;
  margin: 0;
  margin-top: 5px;
  padding: 0;
}
.woocommerce-checkout table.shop_table ul li,
.woocommerce-checkout-2 table.shop_table ul li {
  display: inline-block;
  margin-bottom: 0;
  color: var(--title-color);
}
.woocommerce-checkout table.shop_table ul li p,
.woocommerce-checkout-2 table.shop_table ul li p {
  margin-bottom: 0;
  display: inline-block;
}
.woocommerce-checkout table.shop_table ul li:after,
.woocommerce-checkout-2 table.shop_table ul li:after {
  content: "-";
  margin: 0 6px;
  color: inherit;
}
.woocommerce-checkout table.shop_table ul li:last-child:after,
.woocommerce-checkout-2 table.shop_table ul li:last-child:after {
  display: none;
}
.woocommerce-checkout table.shop_table ul .wc-item-meta-label,
.woocommerce-checkout-2 table.shop_table ul .wc-item-meta-label {
  display: none;
}
.woocommerce-checkout table.shop_table dl.variation dd::after,
.woocommerce-checkout-2 table.shop_table dl.variation dd::after {
  margin-left: 2px;
}
.woocommerce-checkout table.shop_table .product-total,
.woocommerce-checkout-2 table.shop_table .product-total {
  padding-right: 0;
}
.woocommerce-checkout table.shop_table .product-total .woocommerce-Price-amount,
.woocommerce-checkout-2
  table.shop_table
  .product-total
  .woocommerce-Price-amount {
  font-size: 22px;
  font-weight: 600;
}
.woocommerce-checkout table.shop_table thead,
.woocommerce-checkout-2 table.shop_table thead {
  display: none;
}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td,
.woocommerce-checkout-2 table.shop_table th,
.woocommerce-checkout-2 table.shop_table td {
  padding: 4px 0;
  font-weight: 400;
  color: var(--body-color);
  border: none;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.woocommerce-checkout table.shop_table th strong,
.woocommerce-checkout table.shop_table td strong,
.woocommerce-checkout-2 table.shop_table th strong,
.woocommerce-checkout-2 table.shop_table td strong {
  font-weight: 400;
}
.woocommerce-checkout table.shop_table th:last-child,
.woocommerce-checkout table.shop_table td:last-child,
.woocommerce-checkout-2 table.shop_table th:last-child,
.woocommerce-checkout-2 table.shop_table td:last-child {
  text-align: right;
}
.woocommerce-checkout table.shop_table thead tr,
.woocommerce-checkout table.shop_table tfoot tr,
.woocommerce-checkout-2 table.shop_table thead tr,
.woocommerce-checkout-2 table.shop_table tfoot tr {
  position: relative;
  z-index: 2;
}
.woocommerce-checkout table.shop_table thead th,
.woocommerce-checkout table.shop_table thead td,
.woocommerce-checkout table.shop_table tfoot th,
.woocommerce-checkout table.shop_table tfoot td,
.woocommerce-checkout-2 table.shop_table thead th,
.woocommerce-checkout-2 table.shop_table thead td,
.woocommerce-checkout-2 table.shop_table tfoot th,
.woocommerce-checkout-2 table.shop_table tfoot td {
  padding: 11px 0 !important;
}
.woocommerce-checkout table.shop_table tfoot th:first-child,
.woocommerce-checkout table.shop_table tfoot td:first-child,
.woocommerce-checkout-2 table.shop_table tfoot th:first-child,
.woocommerce-checkout-2 table.shop_table tfoot td:first-child {
  color: var(--light-color);
}
.woocommerce-checkout table.shop_table tfoot bdi,
.woocommerce-checkout-2 table.shop_table tfoot bdi {
  font-weight: 400;
}

/* Instruction Item - matching Next.js InstructionItem component */
.instruction-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.instruction-item .item-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 12px;
  font-weight: 600;
  color: var(--title-color);
  flex-shrink: 0;
}
.instruction-item .item-caption {
  font-size: 18px;
  font-weight: 600;
  color: var(--title-color);
  margin: 0;
}

/* Form Section - matching Next.js FormSection component */
.form-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-section .section-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--title-color);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

/* Promo Code Card - matching Next.js PromoCodeCard component */
.promo-code-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: rgba(123, 252, 127, 0.08);
  border: 1px solid rgba(123, 252, 127, 0.2);
  border-radius: 12px;
}
.promo-code-card .promo-info {
  display: flex;
  flex-direction: column;
}
.promo-code-card .promo-info .promo-code {
  font-weight: 600;
  color: var(--neon-green);
  font-size: 14px;
}
.promo-code-card .promo-info .promo-description {
  font-size: 12px;
  color: var(--body-color);
}
.promo-code-card .promo-info .promo-discount {
  font-size: 14px;
  font-weight: 600;
  color: var(--neon-yellow);
}
.promo-code-card .promo-remove {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  font-size: 16px;
  padding: 4px;
}
.promo-code-card .promo-remove:hover {
  color: var(--error-color);
}

/* Payment method section - matching Next.js PaymentRadioItem */
.payment-method-item {
  display: flex;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  cursor: pointer;
  transition: 0.3s ease-in-out;
}
.payment-method-item:hover {
  border-color: rgba(255, 255, 255, 0.2);
}
.payment-method-item.active {
  border-color: var(--neon-green);
  background: rgba(123, 252, 127, 0.03);
}

/* Separator - matching Next.js Separator */
.tof-separator {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  margin: 8px 0;
}

/* Secured text - matching Next.js lock icon text */
.secured-text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
  margin: 0;
}
.secured-text svg {
  width: 16px;
  height: 16px;
}

/* ================== IP Detector Block ================== */
.ip-detector-block {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 16px;
  font-size: 14px;
  color: var(--body-color);
}

/* ================== LOGGED IN STATES ================== */
body.logged-in .woocommerce-checkout .woocommerce-message,
body.logged-in .woocommerce-checkout .woocommerce-error {
  max-width: 100% !important;
}

h3#ship-to-different-address {
  display: none;
}

/* Variation display */
.variation {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.variation dt,
.variation dd {
  display: inline;
  margin: 0;
}

.variation dt::after {
  content: ":";
  margin-right: 5px;
}

.variation dd p {
  display: inline;
  margin: 0;
}

.variation dt {
  display: none !important;
}

.woocommerce td.product-name dl.variation dd::after {
  content: " -";
  margin-left: 5px;
}

.woocommerce td.product-name dl.variation dd:last-child::after {
  display: none;
}

.woocommerce-checkout bdi {
  color: var(--title-color);
  font-weight: 700;
}

.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table {
  font-weight: 400;
}

.woocommerce-cart #payment,
.woocommerce-checkout #payment,
#add_payment_method #payment {
  border-radius: 0;
  border: none;
  background: transparent;
  padding: 0 !important;
}

.content-area {
  position: relative;
  z-index: 2;
}
.content-area .shape1 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.content-area .shape2 {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
.content-area {
  /* Medium Large devices */
}
@media (max-width: 1299px) {
  .content-area .shape1,
  .content-area .shape2 {
    max-width: 130px;
    z-index: -1;
  }
}

.checkout-area {
  position: relative;
  z-index: 3;
}
.checkout-area .checkout-right-sidebar .select-list {
  margin-bottom: 35px;
}

/* Payment Methods */
.woocommerce-checkout #payment ul.payment_methods li {
  margin-bottom: 16px;
}
.woocommerce-checkout #payment ul.payment_methods li:last-child {
  margin-bottom: 0;
}

#add_payment_method #payment ul.payment_methods li input[type="checkbox"],
.woocommerce-cart #payment ul.payment_methods li input[type="checkbox"],
.woocommerce-checkout #payment ul.payment_methods li input[type="checkbox"] {
  width: 20px;
  height: 20px;
  transform: translateY(5px);
}

#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  width: 100%;
  padding: 1em;
  margin: 1em 0;
  font-size: 0.92em;
  border-radius: 8px;
  line-height: 1.5;
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: var(--body-color);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
#add_payment_method #payment div.payment_box input,
.woocommerce-cart #payment div.payment_box input,
.woocommerce-checkout #payment div.payment_box input {
  background-color: var(--dark-gray);
}
#add_payment_method #payment div.payment_box p:last-child,
.woocommerce-cart #payment div.payment_box p:last-child,
.woocommerce-checkout #payment div.payment_box p:last-child {
  margin-bottom: 0;
}
#add_payment_method #payment div.payment_box:after,
#add_payment_method #payment div.payment_box:before,
.woocommerce-cart #payment div.payment_box:after,
.woocommerce-cart #payment div.payment_box:before,
.woocommerce-checkout #payment div.payment_box:after,
.woocommerce-checkout #payment div.payment_box:before {
  content: "";
  display: block;
  border: 12px solid rgba(255, 255, 255, 0.1);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  position: absolute;
  top: -12px;
  left: 0;
  margin: -12px 0 0 2em;
}
#add_payment_method #payment div.payment_box:after,
.woocommerce-cart #payment div.payment_box:after,
.woocommerce-checkout #payment div.payment_box:after {
  border: 12px solid rgba(255, 255, 255, 0.08);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  top: -13px;
}
#add_payment_method #payment div.payment_box ul,
.woocommerce-cart #payment div.payment_box ul,
.woocommerce-checkout #payment div.payment_box ul {
  padding-left: 0;
}

#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 {
  background: #fff;
  border-radius: 4px;
}

#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
  padding-bottom: 35px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  margin-bottom: 30px !important;
}

.woocommerce-privacy-policy-text {
  display: none;
}
.woocommerce-privacy-policy-text a {
  color: var(--neon-green);
}
.woocommerce-privacy-policy-text a:hover {
  color: var(--title-color);
}

.woocommerce form.woocommerce-checkout #payment ul.wc_payment_methods li label {
  color: var(--title-color);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}

abbr[data-bs-original-title],
abbr[title] {
  text-decoration: none;
}

/* Place order button - matching Next.js primary CTA */
.checkout-place-order {
  float: unset !important;
  border: 0;
  z-index: 1;
  font-weight: 700 !important;
  box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.4);
  position: relative;
  padding: 19px 35px !important;
  margin-bottom: 35px;
  display: inline-block;
  text-decoration: none;
  color: var(--black-color) !important;
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  ) !important;
  font-size: 16px;
  text-transform: none !important;
  margin-top: 6px !important;
  border-radius: 27px !important;
}
.checkout-place-order:before {
  border-radius: inherit;
}
.checkout-place-order:hover {
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  ) !important;
}
.checkout-place-order:hover:before {
  visibility: visible;
  opacity: 1;
}

/* Coupon form - matching Next.js promo code section */
.coupon-form {
  margin-bottom: 20px;
}
.coupon-form .info-text {
  color: var(--title-color);
  margin-bottom: 5px;
  margin-top: 20px;
  margin-top: -0.35em;
}
.coupon-form .form-group {
  margin-bottom: 0;
  display: flex;
  gap: 8px;
}
.coupon-form .apply-btn {
  min-width: 80px;
  position: relative;
  z-index: 4;
  height: 48px;
  outline: none;
  padding: 8px 16px;
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  color: var(--black-color);
  border-radius: 8px;
  font-weight: 600;
  border: none;
  cursor: pointer;
}
.coupon-form .apply-btn:hover {
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
}
.coupon-form input#coupon_code {
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.coupon-form input#coupon_code:focus {
  border-color: var(--theme-color);
}

.woocommerce-page.woocommerce-checkout form #order_review td:last-child,
.woocommerce-page.woocommerce-checkout form #order_review th:last-child,
.woocommerce.woocommerce-checkout form #order_review td:last-child,
.woocommerce.woocommerce-checkout form #order_review th:last-child {
  text-align: right;
}

tr:nth-of-type(4) bdi {
  color: #fff !important;
}

/* Payment methods image styles */
#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 {
  vertical-align: middle;
  margin: -2px 0 0 0.5em;
  padding: 0;
  position: relative;
  box-shadow: none;
  width: 30px;
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
  background: transparent;
  border-radius: 0;
  padding-top: 20px;
}

#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-bottom: none;
  margin: 0;
  list-style: none outside;
}

#add_payment_method #payment div.form-row,
.woocommerce-cart #payment div.form-row,
.woocommerce-checkout #payment div.form-row {
  padding: 0 !important;
}

#add_payment_method #payment ul.payment_methods li input,
.woocommerce-cart #payment ul.payment_methods li input,
.woocommerce-checkout #payment ul.payment_methods li input {
  margin: 0 0.4em 0 0;
}

/* Checkout payment section */
.woocommerce-checkout-payment .heading-label {
  margin-bottom: 26px !important;
}
.woocommerce-checkout-payment .form-check {
  margin-bottom: 20px !important;
}
.woocommerce-checkout-payment .form-check .form-check-input {
  display: inline-block;
  width: 20px;
  height: 20px;
  padding: 0;
  box-shadow: unset;
  border-radius: 100%;
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.3);
  margin-right: 10px;
  margin-bottom: 0;
  margin-left: 2px;
  cursor: pointer;
  transform: translateY(6px);
  visibility: visible;
  opacity: 1;
}
.woocommerce-checkout-payment .form-check .form-check-input:focus {
  border-color: rgba(255, 255, 255, 0.3);
}
.woocommerce-checkout-payment .form-check .form-check-input:checked {
  background-color: var(--theme-color);
  border-color: var(--theme-color);
  background-size: 13px;
}
.woocommerce-checkout-payment
  .form-check
  .form-check-input:checked[type="checkbox"] {
  background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" preserveAspectRatio="none"  fill-rule="evenodd" clip-rule="evenodd" xmlns="http://www.w3.org/2000/svg"><path d="M11.2097 0.140053C11.4235 0.33248 11.4408 0.661797 11.2484 0.875605L5.87504 6.84597C5.19828 7.59793 4.05253 7.69165 3.26256 7.05968L0.813655 5.10055C0.589039 4.92086 0.552622 4.59311 0.732314 4.36849C0.912007 4.14387 1.23976 4.10746 1.46438 4.28715L3.91328 6.24627C4.27236 6.53354 4.79316 6.49093 5.10077 6.14914L10.4741 0.178766C10.6665 -0.035041 10.9959 -0.0523735 11.2097 0.140053Z" fill="%23060D0A"/></svg>');
}
.woocommerce-checkout-payment .form-check .form-check-label {
  display: inline-block !important;
  color: var(--title-color);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  padding-left: 0;
}
.woocommerce-checkout-payment .form-check .form-check-label a {
  color: var(--neon-green);
  text-decoration: none;
  font-weight: 600;
}
.woocommerce-checkout-payment .form-check .form-check-label a:hover {
  color: var(--neon-yellow);
}
.woocommerce-checkout-payment .form-check .form-check-label strong {
  font-weight: 500;
  color: var(--title-color);
}
.woocommerce-checkout-payment .input-checkbox {
  margin-top: 0 !important;
  transform: translateY(6px);
}
.woocommerce-checkout-payment .Label {
  color: var(--title-color) !important;
}

/* Thank you / Order received page */
.woocommerce-thankyou-order-details.order_details {
  padding: 0;
  margin: 0;
  margin-bottom: 24px !important;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 24px;
  list-style: none;
}
.woocommerce-thankyou-order-details.order_details:after,
.woocommerce-thankyou-order-details.order_details:before {
  display: none !important;
}
.woocommerce-thankyou-order-details.order_details {
  /* Large devices */
}
@media (max-width: 1199px) {
  .woocommerce-thankyou-order-details.order_details {
    grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
    gap: 10px;
  }
}
.woocommerce-thankyou-order-details.order_details {
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce-thankyou-order-details.order_details {
    gap: 12px;
  }
}
.woocommerce-thankyou-order-details.order_details li {
  font-size: 14px !important;
  background-color: rgba(255, 255, 255, 0.08);
  border: none !important;
  border-radius: 16px;
  padding: 24px !important;
  flex: 1;
  color: var(--body-color);
  margin: 0 !important;
}
.woocommerce-thankyou-order-details.order_details li strong {
  color: var(--title-color);
  display: block;
  font-weight: 400;
  margin-top: 8px;
  font-size: 16px !important;
}
.woocommerce-thankyou-order-details.order_details + p {
  display: none;
}

.woocommerce-order {
  padding-bottom: 70px;
}
.woocommerce-order .woocommerce-customer-details {
  padding: 30px;
  background-color: rgba(255, 255, 255, 0.08);
  border: none !important;
  border-radius: 16px;
  height: 100%;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .woocommerce-order .woocommerce-customer-details {
    padding: 20px;
  }
}
.woocommerce-order .woocommerce-customer-details .woocommerce-column__title {
  font-size: 24px;
  font-weight: 500;
  color: var(--theme-color);
  margin-top: -0.2em;
  margin-bottom: 15px;
}
.woocommerce-order .woocommerce-customer-details address {
  font-size: 18px;
  color: var(--body-color);
  line-height: 1.6;
  margin-bottom: 0;
  border: none !important;
  padding: 0 !important;
}
.woocommerce-order .woocommerce-customer-details address::first-line {
  color: var(--title-color);
  line-height: 60px;
}
.woocommerce-order .woocommerce-customer-details p {
  padding: 0 0;
  background-color: transparent;
  margin-bottom: 12px;
}
.woocommerce-order .woocommerce-customer-details p:first-of-type {
  margin-top: 35px;
}
.woocommerce-order .woocommerce-customer-details p:last-child {
  margin-bottom: 0;
}
.woocommerce-order .woocommerce-order-details {
  padding: 30px;
  background-color: rgba(255, 255, 255, 0.08);
  border: none;
  border-radius: 16px;
  height: 100%;
}
.woocommerce-order .woocommerce-order-details table.shop_table {
  border-radius: 0;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  margin-bottom: 24px !important;
  margin: 0 !important;
  width: 100%;
}
.woocommerce-order .woocommerce-order-details table.shop_table:before {
  display: none;
}
.woocommerce-order .woocommerce-order-details table.shop_table thead {
  display: table-row-group;
}
.woocommerce-order .woocommerce-order-details table.shop_table .order_item th,
.woocommerce-order .woocommerce-order-details table.shop_table .order_item td {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.woocommerce-order .woocommerce-order-details table.shop_table .product-total {
  padding-right: 0 !important;
}
.woocommerce-order
  .woocommerce-order-details
  table.shop_table
  .product-name
  .wc-item-meta
  .wc-item-meta-label {
  display: none;
}
.woocommerce-order .woocommerce-order-details {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .woocommerce-order .woocommerce-order-details {
    padding: 20px;
  }
}
.woocommerce-order
  .woocommerce-order-details
  .woocommerce-order-details__title {
  font-size: 24px;
  font-weight: 500;
  margin-top: -0.2em;
  margin-bottom: 15px;
  color: var(--theme-color);
}
.woocommerce-order .woocommerce-order-details .order-again {
  margin: 20px 0 0 0;
}
.woocommerce-order .woocommerce-order-details .order-again a {
  display: inline-block;
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  color: var(--black-color);
  padding: 14px 24px;
  border-radius: 27px;
  font-weight: 600;
}
.woocommerce-order .woocommerce-order-details .order-again a:hover {
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
}
.woocommerce-order
  .woocommerce-order-details
  .woocommerce-orders-table--subscriptions {
  display: none;
}
.woocommerce-order .woocommerce-order-details header {
  display: none;
  padding-top: 24px;
}
.woocommerce-order .woocommerce-order-details header h2 {
  font-size: 32px;
  font-weight: 600;
  padding-bottom: 16px;
}

.woocommerce-notice.woocommerce-thankyou-order-received {
  display: none;
}

body.woocommerce-order-received .copy-right-area,
body.woocommerce-order-received .footer-wrapper,
body.woocommerce-order-received .ot-header {
  display: none;
}
body.woocommerce-order-received .breadcumb-wrapper {
  padding-top: 130px;
  padding-bottom: 10px;
}

@media (min-width: 1400px) and (max-width: 1600px) {
  .configuration-area {
    margin-left: 50px;
    margin-right: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .hide-on-mobile {
    display: none;
  }
}
@media only screen and (min-width: 767px) {
  .hide-on-big {
    display: none;
  }
}
#add_payment_method .woocommerce-checkout-review-order-table {
  display: none;
}

/*------------------- My Account  -------------------*/
.woocommerce-account .shape-wrapper {
  display: none;
}

.woocommerce-MyAccount-navigation {
  background-color: var(--smoke-color);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 25px 30px;
  border-radius: 24px;
}
.woocommerce-MyAccount-navigation ul {
  padding-left: 0;
  margin: 0;
  list-style-type: none;
}
.woocommerce-MyAccount-navigation li {
  font-size: 14px;
  padding: 12px 15px;
  line-height: 1;
  color: var(--title-color);
  position: relative;
  z-index: 2;
}
.woocommerce-MyAccount-navigation li::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  border-radius: 8px;
  opacity: 0;
  z-index: -1;
  transition: 0.4s ease-in-out;
}
.woocommerce-MyAccount-navigation li.is-active {
  color: var(--black-color);
}
.woocommerce-MyAccount-navigation li.is-active a:hover {
  color: var(--black-color);
}
.woocommerce-MyAccount-navigation li.is-active::before {
  opacity: 1;
}
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--dashboard,
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--downloads,
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--store-credit {
  display: none !important;
}
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 85px;
}
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout
  a:before {
  content: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.1559 9.625H7.12175C6.77675 9.625 6.49675 9.345 6.49675 9C6.49675 8.655 6.77675 8.375 7.12175 8.375H17.1559C17.5009 8.375 17.7809 8.655 17.7809 9C17.7809 9.345 17.5009 9.625 17.1559 9.625Z" fill="%23FF522C"/><path fill-rule="evenodd" clip-rule="evenodd" d="M14.7162 12.055C14.5562 12.055 14.3953 11.9942 14.2737 11.8708C14.0303 11.6258 14.0312 11.2308 14.2753 10.9875L16.2703 8.99999L14.2753 7.01334C14.0312 6.77 14.0295 6.375 14.2737 6.13C14.517 5.885 14.912 5.885 15.157 6.12834L17.597 8.55749C17.7153 8.67415 17.7809 8.83415 17.7809 8.99999C17.7809 9.16582 17.7153 9.32582 17.597 9.44249L15.157 11.8725C15.0353 11.9942 14.8753 12.055 14.7162 12.055Z" fill="%23FF522C"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8.43267 17.3333H4.36104C2.32437 17.3333 0.66687 15.6758 0.66687 13.6375V4.36332C0.66687 2.32499 2.32437 0.666656 4.36104 0.666656H8.4235C10.4618 0.666656 12.1202 2.32499 12.1202 4.36332V5.13999C12.1202 5.48499 11.8402 5.76499 11.4952 5.76499C11.1502 5.76499 10.8702 5.48499 10.8702 5.13999V4.36332C10.8702 3.01332 9.77267 1.91666 8.4235 1.91666H4.36104C3.01354 1.91666 1.91687 3.01332 1.91687 4.36332V13.6375C1.91687 14.9867 3.01354 16.0833 4.36104 16.0833H8.43267C9.776 16.0833 10.8702 14.99 10.8702 13.6467V12.8608C10.8702 12.5158 11.1502 12.2358 11.4952 12.2358C11.8402 12.2358 12.1202 12.5158 12.1202 12.8608V13.6467C12.1202 15.68 10.4652 17.3333 8.43267 17.3333Z" fill="%23FF522C"/></svg>');
  margin-right: 8px;
  vertical-align: middle;
}
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout {
  /* Large devices */
}
@media (max-width: 1199px) {
  .woocommerce-MyAccount-navigation
    li.woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 50px;
  }
}
.woocommerce-MyAccount-navigation li a {
  display: block;
  color: inherit;
}
.woocommerce-MyAccount-navigation li a:hover {
  color: var(--theme-color);
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  float: left;
  width: 24%;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce-account .woocommerce-MyAccount-navigation {
    float: none;
    width: 100%;
    margin-bottom: 30px;
  }
}

.woocommerce-account .woocommerce-MyAccount-content {
  float: right;
  width: 74%;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce-account .woocommerce-MyAccount-content {
    float: none;
    width: 100%;
  }
}
.woocommerce-account .woocommerce-MyAccount-content .button {
  display: inline-block;
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
  color: var(--black-color);
  font-size: 14px;
  border-radius: 12px;
  font-weight: 500;
  padding: 9px 15px;
}
.woocommerce-account .woocommerce-MyAccount-content .button:hover {
  color: var(--black-color);
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
}
.woocommerce-account .woocommerce-MyAccount-content h2 {
  font-size: 32px;
  margin: 0;
  font-weight: 500;
}
.woocommerce-account
  .woocommerce-MyAccount-content
  .woocommerce-address-fields {
  margin-top: 25px;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
  line-height: 32px;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:after {
  display: none;
}
.woocommerce-account
  .woocommerce-MyAccount-content
  .woocommerce-Addresses
  .col-2 {
  display: none;
}
.woocommerce-account .woocommerce-MyAccount-content address {
  padding: 0;
  color: var(--title-color);
}
.woocommerce-account .woocommerce-MyAccount-content address br {
  display: block;
  border-bottom: 1px solid var(--ot-border-color);
}
.woocommerce-account
  .woocommerce-MyAccount-content
  .woocommerce-customer-details--phone {
  border-top: 1px solid var(--ot-border-color);
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address {
  max-width: 555px;
  width: 100%;
}
.woocommerce-account .woocommerce-MyAccount-content header {
  margin-bottom: 30px;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title {
  display: flex;
  align-items: center;
  gap: 10px 15px;
  margin-bottom: 30px;
}
.woocommerce-account
  .woocommerce-MyAccount-content
  .woocommerce-Address-title:before,
.woocommerce-account
  .woocommerce-MyAccount-content
  .woocommerce-Address-title:after {
  display: none;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-column__title {
  margin-bottom: 30px;
}
.woocommerce-account .woocommerce-MyAccount-content .edit:before {
  content: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.9887 3.85928L14.1408 7.01137M1.5 16.5L4.56065 15.9174C5.2096 15.7938 5.80641 15.478 6.27353 15.0109L15.8198 5.46461C16.7267 4.55765 16.7267 3.08718 15.8198 2.18022C14.9128 1.27326 13.4423 1.27326 12.5354 2.18022L2.98913 11.7265C2.52201 12.1936 2.20617 12.7904 2.08263 13.4394L1.5 16.5Z" stroke="%238DCD8B" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  display: inline-block;
  margin-right: 5px;
  transform: translateY(4px);
}
.woocommerce-account
  .woocommerce-MyAccount-content
  > .woocommerce-notices-wrapper
  + p {
  display: none;
}
.woocommerce-account .woocommerce-MyAccount-content #account_display_name {
  margin-bottom: 0 !important;
}
.woocommerce-account
  .woocommerce-MyAccount-content
  #account_display_name
  + span {
  display: none;
}
.woocommerce-account
  .woocommerce-MyAccount-content
  #add_payment_method
  #place_order {
  float: none;
  padding: 18px 24px;
  border-radius: 12px;
  background: var(--theme-color);
}
.woocommerce-account
  .woocommerce-MyAccount-content
  #add_payment_method
  #place_order:hover {
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
}

.woocommerce .woocommerce-address-fields .button {
  padding: 16px 24px !important;
  border-radius: 12px;
}
.woocommerce .woocommerce-address-fields .form-row-first,
.woocommerce .woocommerce-address-fields .form-row-last {
  width: 49%;
  overflow: visible;
}
.woocommerce .woocommerce-address-fields .form-row {
  margin-bottom: 16px;
}
.woocommerce .woocommerce-address-fields .form-row label {
  display: none !important;
}
.woocommerce .woocommerce-address-fields input[type="checkbox"] {
  visibility: visible;
  opacity: 1;
  display: inline-block;
  vertical-align: middle;
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.select2-dropdown {
  background-color: var(--body-bg);
}

.woocommerce-view-order .woocommerce-customer-details,
.woocommerce-view-subscription .woocommerce-customer-details {
  display: none;
}

.woocommerce table.account-payment-methods-table,
.woocommerce table.my_account_orders {
  border: none;
}
.woocommerce table.account-payment-methods-table .th,
.woocommerce table.account-payment-methods-table td,
.woocommerce table.my_account_orders .th,
.woocommerce table.my_account_orders td {
  font-size: 16px !important;
  border: none;
  padding: 18px 24px;
  font-weight: 400;
  color: var(--title-color) !important;
}
.woocommerce table.account-payment-methods-table tbody th,
.woocommerce table.account-payment-methods-table tbody td,
.woocommerce table.account-payment-methods-table tfoot th,
.woocommerce table.account-payment-methods-table tfoot td,
.woocommerce table.my_account_orders tbody th,
.woocommerce table.my_account_orders tbody td,
.woocommerce table.my_account_orders tfoot th,
.woocommerce table.my_account_orders tfoot td {
  border: none;
  border-bottom: 1px solid var(--ot-border-color);
}
.woocommerce table.account-payment-methods-table tbody tr:last-child th,
.woocommerce table.account-payment-methods-table tbody tr:last-child td,
.woocommerce table.account-payment-methods-table tfoot tr:last-child th,
.woocommerce table.account-payment-methods-table tfoot tr:last-child td,
.woocommerce table.my_account_orders tbody tr:last-child th,
.woocommerce table.my_account_orders tbody tr:last-child td,
.woocommerce table.my_account_orders tfoot tr:last-child th,
.woocommerce table.my_account_orders tfoot tr:last-child td {
  border-bottom: none;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce table.account-payment-methods-table tbody tr:last-child th,
  .woocommerce table.account-payment-methods-table tbody tr:last-child td,
  .woocommerce table.account-payment-methods-table tfoot tr:last-child th,
  .woocommerce table.account-payment-methods-table tfoot tr:last-child td,
  .woocommerce table.my_account_orders tbody tr:last-child th,
  .woocommerce table.my_account_orders tbody tr:last-child td,
  .woocommerce table.my_account_orders tfoot tr:last-child th,
  .woocommerce table.my_account_orders tfoot tr:last-child td {
    border-bottom: 1px solid var(--ot-border-color);
  }
}
.woocommerce table.account-payment-methods-table thead,
.woocommerce table.my_account_orders thead {
  position: relative;
  z-index: 2;
}
.woocommerce table.account-payment-methods-table thead:before,
.woocommerce table.my_account_orders thead:before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--smoke-color);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 12px;
  z-index: -1;
}
.woocommerce table.account-payment-methods-table thead tr:first-child th,
.woocommerce table.my_account_orders thead tr:first-child th {
  font-weight: 500;
}
.woocommerce table.account-payment-methods-table thead tr:first-child th,
.woocommerce table.account-payment-methods-table thead tr:first-child td,
.woocommerce table.my_account_orders thead tr:first-child th,
.woocommerce table.my_account_orders thead tr:first-child td {
  padding: 18px 20px !important;
  border: none !important;
}
.woocommerce table.account-payment-methods-table tbody th:first-child,
.woocommerce table.account-payment-methods-table tbody td:first-child,
.woocommerce table.my_account_orders tbody th:first-child,
.woocommerce table.my_account_orders tbody td:first-child {
  padding: 4px 20px;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce table.account-payment-methods-table tbody th:first-child,
  .woocommerce table.account-payment-methods-table tbody td:first-child,
  .woocommerce table.my_account_orders tbody th:first-child,
  .woocommerce table.my_account_orders tbody td:first-child {
    padding: 15px 20px;
  }
}
.woocommerce table.account-payment-methods-table,
.woocommerce table.my_account_orders {
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-actions,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    justify-content: space-between;
    width: 100%;
    padding: 12px 15px;
    gap: 6px;
  }
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-actions
    a,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-actions
    a {
    display: inline-block;
  }
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-actions:before,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-actions:before {
    content: "Action: ";
    display: block !important;
    font-weight: 600;
    color: var(--title-color);
    vertical-align: text-bottom;
    float: left;
    line-height: 36px;
    width: 100%;
    text-align: left;
  }
}
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-total,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-total {
  font-size: 0 !important;
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-total,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-total {
    height: 55px;
    line-height: 1.5;
  }
}
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-total:before,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-total:before {
  font-size: 16px !important;
}
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-total
  .woocommerce-Price-amount,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-total
  .woocommerce-Price-amount {
  font-size: 16px;
}
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__header-order-actions,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__header-order-actions {
  display: none;
}
.woocommerce table.account-payment-methods-table .status-active,
.woocommerce table.account-payment-methods-table .status-completed,
.woocommerce table.my_account_orders .status-active,
.woocommerce table.my_account_orders .status-completed {
  color: var(--success-color) !important;
}
.woocommerce table.account-payment-methods-table .status-pending-cancellation,
.woocommerce table.account-payment-methods-table .status-pending-payment,
.woocommerce table.account-payment-methods-table .status-processing,
.woocommerce table.my_account_orders .status-pending-cancellation,
.woocommerce table.my_account_orders .status-pending-payment,
.woocommerce table.my_account_orders .status-processing {
  color: var(--yellow-color) !important;
}
.woocommerce table.account-payment-methods-table .status-cancelled,
.woocommerce table.account-payment-methods-table .status-failed,
.woocommerce table.my_account_orders .status-cancelled,
.woocommerce table.my_account_orders .status-failed {
  color: var(--error-color) !important;
}
.woocommerce table.account-payment-methods-table .status-refunded,
.woocommerce table.account-payment-methods-table .status-on-hold,
.woocommerce table.my_account_orders .status-refunded,
.woocommerce table.my_account_orders .status-on-hold {
  color: var(--yellow-color) !important;
}
@media (min-width: 992px) {
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-status,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-status {
    width: 160px;
    padding-right: 5px;
    padding-left: 5px;
  }
}
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-status:before,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-status:before {
  color: var(--title-color);
}
.woocommerce table.account-payment-methods-table,
.woocommerce table.my_account_orders {
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce table.account-payment-methods-table th,
  .woocommerce table.account-payment-methods-table td,
  .woocommerce table.my_account_orders th,
  .woocommerce table.my_account_orders td {
    padding: 15px;
  }
  .woocommerce table.account-payment-methods-table th:before,
  .woocommerce table.account-payment-methods-table td:before,
  .woocommerce table.my_account_orders th:before,
  .woocommerce table.my_account_orders td:before {
    font-weight: 600 !important;
  }
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-number,
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-product-name,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-number,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-product-name {
    background-color: var(--theme-color) !important;
    border-radius: 12px;
    color: var(--black-color) !important;
  }
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-order-number
    a,
  .woocommerce
    table.account-payment-methods-table
    .woocommerce-orders-table__cell-product-name
    a,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-order-number
    a,
  .woocommerce
    table.my_account_orders
    .woocommerce-orders-table__cell-product-name
    a {
    color: var(--black-color);
  }
}
.woocommerce table.account-payment-methods-table + .button,
.woocommerce table.my_account_orders + .button {
  padding: 18px 24px !important;
  border-radius: 12px;
}
.woocommerce
  table.account-payment-methods-table.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.account-payment-methods-table.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__header-order-actions,
.woocommerce
  table.my_account_orders.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.my_account_orders.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__header-order-actions {
  display: table-cell;
}
.woocommerce
  table.account-payment-methods-table.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__cell-product-name,
.woocommerce
  table.my_account_orders.woocommerce-orders-table--subscriptions
  .woocommerce-orders-table__cell-product-name {
  /* Medium devices */
}
@media (max-width: 991px) {
  .woocommerce
    table.account-payment-methods-table.woocommerce-orders-table--subscriptions
    .woocommerce-orders-table__cell-product-name,
  .woocommerce
    table.my_account_orders.woocommerce-orders-table--subscriptions
    .woocommerce-orders-table__cell-product-name {
    background-color: transparent !important;
    border-radius: 0 !important;
  }
}

.woocommerce form.woocommerce-EditAccountForm {
  max-width: 560px;
}
.woocommerce form.woocommerce-EditAccountForm fieldset {
  margin: 30px 0;
}
.woocommerce form.woocommerce-EditAccountForm fieldset legend {
  font-size: 18px;
  font-weight: 400;
  color: var(--title-color);
  margin-bottom: 15px;
}
.woocommerce form.woocommerce-EditAccountForm .button {
  padding: 18px 24px;
  border-radius: 12px;
  background: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
}
.woocommerce form.woocommerce-EditAccountForm #account_display_name {
  margin-bottom: 10px;
}
.woocommerce form.woocommerce-EditAccountForm .form-row {
  margin-bottom: 14px;
}
.woocommerce form.woocommerce-EditAccountForm .form-row label {
  display: none;
}
.woocommerce form.woocommerce-EditAccountForm .form-row-first,
.woocommerce form.woocommerce-EditAccountForm .form-row-last {
  width: 49% !important;
}
.woocommerce form.woocommerce-EditAccountForm .input-text {
  height: 54px;
  background-color: var(--smoke-color);
  border: 1px solid var(--ot-border-color);
  padding: 0 20px;
  border-radius: 12px;
  color: var(--light-color);
}
.woocommerce form.woocommerce-EditAccountForm .input-text::-moz-placeholder {
  color: var(--light-color);
}
.woocommerce
  form.woocommerce-EditAccountForm
  .input-text::-webkit-input-placeholder {
  color: var(--light-color);
}
.woocommerce
  form.woocommerce-EditAccountForm
  .input-text:-ms-input-placeholder {
  color: var(--light-color);
}
.woocommerce form.woocommerce-EditAccountForm .input-text::placeholder {
  color: var(--light-color);
}

.woocommerce .woocommerce-address-fields .form-row .input-text {
  height: 54px;
  background-color: var(--smoke-color);
  border: 1px solid var(--ot-border-color);
  padding: 0 20px;
  border-radius: 12px;
  color: var(--light-color);
}
.woocommerce
  .woocommerce-address-fields
  .form-row
  .input-text::-moz-placeholder {
  color: var(--light-color);
}
.woocommerce
  .woocommerce-address-fields
  .form-row
  .input-text::-webkit-input-placeholder {
  color: var(--light-color);
}
.woocommerce
  .woocommerce-address-fields
  .form-row
  .input-text:-ms-input-placeholder {
  color: var(--light-color);
}
.woocommerce .woocommerce-address-fields .form-row .input-text::placeholder {
  color: var(--light-color);
}

.woocommerce .shop_table.order_details,
.woocommerce .shop_table.subscription_details {
  position: relative;
  z-index: 2;
  padding: 24px;
  border: none;
  margin-bottom: 55px;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .woocommerce .shop_table.order_details,
  .woocommerce .shop_table.subscription_details {
    padding: 10px;
  }
}
.woocommerce .shop_table.order_details th,
.woocommerce .shop_table.order_details td,
.woocommerce .shop_table.subscription_details th,
.woocommerce .shop_table.subscription_details td {
  color: var(--title-color);
  border: none;
  border-right: 1px solid var(--ot-border-color);
  border-bottom: 1px solid var(--ot-border-color);
  padding: 16px 20px;
  font-weight: 400;
}
.woocommerce .shop_table.order_details th:last-child,
.woocommerce .shop_table.order_details td:last-child,
.woocommerce .shop_table.subscription_details th:last-child,
.woocommerce .shop_table.subscription_details td:last-child {
  border-right: none;
}
.woocommerce .shop_table.order_details th,
.woocommerce .shop_table.order_details td,
.woocommerce .shop_table.subscription_details th,
.woocommerce .shop_table.subscription_details td {
  /* Extra small devices */
}
@media (max-width: 575px) {
  .woocommerce .shop_table.order_details th,
  .woocommerce .shop_table.order_details td,
  .woocommerce .shop_table.subscription_details th,
  .woocommerce .shop_table.subscription_details td {
    padding: 16px 10px;
  }
}
.woocommerce .shop_table.order_details tr:last-child th,
.woocommerce .shop_table.order_details tr:last-child td,
.woocommerce .shop_table.subscription_details tr:last-child th,
.woocommerce .shop_table.subscription_details tr:last-child td {
  border-bottom: none;
}
.woocommerce .shop_table.order_details:before,
.woocommerce .shop_table.subscription_details:before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--smoke-color);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 24px;
  z-index: -1;
}
.woocommerce .shop_table.order_details .btn-wrapper,
.woocommerce .shop_table.subscription_details .btn-wrapper {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  /* Extra small devices */
}
@media (max-width: 575px) {
  .woocommerce .shop_table.order_details .btn-wrapper,
  .woocommerce .shop_table.subscription_details .btn-wrapper {
    flex-direction: column-reverse;
    align-items: flex-start;
  }
}
.woocommerce .shop_table.order_details .btn-wrapper .cancel,
.woocommerce .shop_table.subscription_details .btn-wrapper .cancel {
  background: transparent !important;
  color: var(--error-color);
  padding-left: 0;
}
.woocommerce .shop_table.order_details .btn-wrapper .change_payment_method,
.woocommerce
  .shop_table.subscription_details
  .btn-wrapper
  .change_payment_method {
  background: transparent !important;
  color: var(--theme-color);
}
.woocommerce .shop_table.order_details .btn-wrapper .subscription_renewal_early,
.woocommerce
  .shop_table.subscription_details
  .btn-wrapper
  .subscription_renewal_early {
  position: relative;
  z-index: 2;
  overflow: hidden;
  background-image: linear-gradient(
    180deg,
    var(--theme-color2) 0%,
    var(--theme-color3) 100%
  );
}
.woocommerce
  .shop_table.order_details
  .btn-wrapper
  .subscription_renewal_early:before,
.woocommerce
  .shop_table.subscription_details
  .btn-wrapper
  .subscription_renewal_early:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    var(--theme-color3) 0%,
    var(--theme-color2) 100%
  );
  opacity: 0;
  border-radius: inherit;
  z-index: -1;
  transition: 0.4s ease-in-out;
}
.woocommerce
  .shop_table.order_details
  .btn-wrapper
  .subscription_renewal_early:hover:before,
.woocommerce
  .shop_table.subscription_details
  .btn-wrapper
  .subscription_renewal_early:hover:before {
  opacity: 1;
}
.woocommerce .shop_table.order_details {
  margin-top: 25px !important;
}
.woocommerce .shop_table.order_details th,
.woocommerce .shop_table.order_details td {
  border-right: none !important;
}
.woocommerce .shop_table.order_details th:first-child,
.woocommerce .shop_table.order_details td:first-child {
  width: 0 !important;
  padding: 0 !important;
}
.woocommerce .shop_table.order_details th[colspan="2"],
.woocommerce .shop_table.order_details td[colspan="2"] {
  padding: 16px 20px !important;
}
.woocommerce .shop_table.order_details th:last-child,
.woocommerce .shop_table.order_details td:last-child {
  width: 50%;
}
.woocommerce .shop_table.order_details .product-remove,
.woocommerce .shop_table.order_details .remove_item {
  font-size: 0;
  border-right: none;
}
.woocommerce .shop_table.order_details .order_item td {
  border-bottom: 1px solid var(--ot-border-color) !important;
}
.woocommerce .shop_table .product-name a {
  color: var(--theme-color2);
}
.woocommerce .shop_table .product-name a:hover {
  color: var(--body-color);
}
.woocommerce .shop_table .product-name .product-quantity {
  display: none;
}
.woocommerce .shop_table thead th {
  border-bottom: 1px solid var(--ot-border-color) !important;
}

/*=================================
    05. Spacing
==================================*/
/*-- Padding Left And Right --*/
.px-5 {
  padding-right: 5px;
  padding-left: 5px;
}

.px-10 {
  padding-right: 10px;
  padding-left: 10px;
}

.px-15 {
  padding-right: 15px;
  padding-left: 15px;
}

.px-20 {
  padding-right: 20px;
  padding-left: 20px;
}

.px-25 {
  padding-right: 25px;
  padding-left: 25px;
}

.px-30 {
  padding-right: 30px;
  padding-left: 30px;
}

.px-35 {
  padding-right: 35px;
  padding-left: 35px;
}

.px-40 {
  padding-right: 40px;
  padding-left: 40px;
}

.px-45 {
  padding-right: 45px;
  padding-left: 45px;
}

.px-50 {
  padding-right: 50px;
  padding-left: 50px;
}

/*-- Padding Top And Bottom --*/
.py-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}

.py-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.py-15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.py-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.py-25 {
  padding-top: 25px;
  padding-bottom: 25px;
}

.py-30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.py-35 {
  padding-top: 35px;
  padding-bottom: 35px;
}

.py-40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.py-45 {
  padding-top: 45px;
  padding-bottom: 45px;
}

.py-50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

/*-- Padding Top --*/
.pt-5 {
  padding-top: 5px;
}

.pt-10 {
  padding-top: 10px;
}

.pt-15 {
  padding-top: 15px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-25 {
  padding-top: 25px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-35 {
  padding-top: 35px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-45 {
  padding-top: 45px;
}

.pt-50 {
  padding-top: 50px;
}

/*-- Padding Bottom --*/
.pb-5 {
  padding-bottom: 5px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-45 {
  padding-bottom: 45px;
}

.pb-50 {
  padding-bottom: 50px;
}

/*-- Padding Left --*/
.pl-5 {
  padding-left: 5px;
}

.pl-10 {
  padding-left: 10px;
}

.pl-15 {
  padding-left: 15px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-25 {
  padding-left: 25px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-35 {
  padding-left: 35px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-45 {
  padding-left: 45px;
}

.pl-50 {
  padding-left: 50px;
}

/*-- Padding Right --*/
.pr-5 {
  padding-right: 5px;
}

.pr-10 {
  padding-right: 10px;
}

.pr-15 {
  padding-right: 15px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-25 {
  padding-right: 25px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-35 {
  padding-right: 35px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-45 {
  padding-right: 45px;
}

.pr-50 {
  padding-right: 50px;
}

/*-- margin Left And Right --*/
.mx-5 {
  margin-right: 5px;
  margin-left: 5px;
}

.mx-10 {
  margin-right: 10px;
  margin-left: 10px;
}

.mx-15 {
  margin-right: 15px;
  margin-left: 15px;
}

.mx-20 {
  margin-right: 20px;
  margin-left: 20px;
}

.mx-25 {
  margin-right: 25px;
  margin-left: 25px;
}

.mx-30 {
  margin-right: 30px;
  margin-left: 30px;
}

.mx-35 {
  margin-right: 35px;
  margin-left: 35px;
}

.mx-40 {
  margin-right: 40px;
  margin-left: 40px;
}

.mx-45 {
  margin-right: 45px;
  margin-left: 45px;
}

.mx-50 {
  margin-right: 50px;
  margin-left: 50px;
}

/*-- margin Top And Bottom --*/
.my-5 {
  margin-top: 5px;
  margin-bottom: 5px;
}

.my-10 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.my-15 {
  margin-top: 15px;
  margin-bottom: 15px;
}

.my-20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.my-25 {
  margin-top: 25px;
  margin-bottom: 25px;
}

.my-30 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.my-35 {
  margin-top: 35px;
  margin-bottom: 35px;
}

.my-40 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.my-45 {
  margin-top: 45px;
  margin-bottom: 45px;
}

.my-50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

/*-- margin Top --*/
.mt-5 {
  margin-top: 5px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-35 {
  margin-top: 35px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-45 {
  margin-top: 45px;
}

.mt-50 {
  margin-top: 50px;
}

/*-- margin Bottom --*/
.mb-5 {
  margin-bottom: 5px;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-25 {
  margin-bottom: 25px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-50 {
  margin-bottom: 50px;
}

/*-- margin Left --*/
.ml-5 {
  margin-left: 5px;
}

.ml-10 {
  margin-left: 10px;
}

.ml-15 {
  margin-left: 15px;
}

.ml-20 {
  margin-left: 20px;
}

.ml-25 {
  margin-left: 25px;
}

.ml-30 {
  margin-left: 30px;
}

.ml-35 {
  margin-left: 35px;
}

.ml-40 {
  margin-left: 40px;
}

.ml-45 {
  margin-left: 45px;
}

.ml-50 {
  margin-left: 50px;
}

/*-- margin Right --*/
.mr-5 {
  margin-right: 5px;
}

.mr-10 {
  margin-right: 10px;
}

.mr-15 {
  margin-right: 15px;
}

.mr-20 {
  margin-right: 20px;
}

.mr-25 {
  margin-right: 25px;
}

.mr-30 {
  margin-right: 30px;
}

.mr-35 {
  margin-right: 35px;
}

.mr-40 {
  margin-right: 40px;
}

.mr-45 {
  margin-right: 45px;
}

.mr-50 {
  margin-right: 50px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mt-n1 {
  margin-top: -0.25rem;
}

.mt-n2 {
  margin-top: -0.6rem;
}

.mt-n3 {
  margin-top: -1rem;
}

.mt-n4 {
  margin-top: -1.5rem;
}

.mt-n5 {
  margin-top: -3rem;
}

.mb-n1 {
  margin-bottom: -0.25rem;
}

.mb-n2 {
  margin-bottom: -0.6rem;
}

.mb-n3 {
  margin-bottom: -1rem;
}

.mb-n4 {
  margin-bottom: -1.5rem;
}

.mb-n5 {
  margin-bottom: -3rem;
}

.space,
.space-top {
  padding-top: var(--section-space);
}

.space,
.space-bottom {
  padding-bottom: var(--section-space);
}

.space-extra,
.space-extra-top {
  padding-top: calc(var(--section-space) - 30px);
}

.space-extra,
.space-extra-bottom {
  padding-bottom: calc(var(--section-space) - 30px);
}

.space-extra2,
.space-extra2-top {
  padding-top: calc(var(--section-space) - 40px);
}

.space-extra2,
.space-extra2-bottom {
  padding-bottom: calc(var(--section-space) - 40px);
}

/* Medium devices */
@media (max-width: 991px) {
  .space,
  .space-top {
    padding-top: var(--section-space-mobile);
  }
  .space,
  .space-bottom {
    padding-bottom: var(--section-space-mobile);
  }
  .space-extra,
  .space-extra-top {
    padding-top: calc(var(--section-space-mobile) - 30px);
  }
  .space-extra,
  .space-extra-bottom {
    padding-bottom: calc(var(--section-space-mobile) - 30px);
  }
  .space-top-md-none {
    padding-top: 0;
  }
  .space-extra2,
  .space-extra2-top {
    padding-top: 70px;
  }
  .space-extra2,
  .space-extra2-bottom {
    padding-bottom: 70px;
  }
}

/* ==================== Bridger Pay v9 Modal Styles ==================== */
#payment-modal {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.85) !important;
  z-index: 9999 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px;
}

#payment-modal.show {
  display: flex !important;
}

#payment-modal > div {
  position: relative !important;
  max-width: 960px !important;
  width: 96vw !important;
  background: #363636 !important;
  border-radius: 16px !important;
  padding: 4px !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
}

#close-modal-btn {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: none !important;
  color: white !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10 !important;
  transition: background 0.2s ease;
}

#close-modal-btn:hover {
  background: rgba(255, 255, 255, 0.2) !important;
}

#payment-iframe {
  width: 100% !important;
  height: 600px !important;
  border: none !important;
  border-radius: 12px !important;
  background: white !important;
}

/* Confirm Cancel Modal */
#confirm-cancel-modal {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.9) !important;
  z-index: 10000 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px;
}

#confirm-cancel-modal.show {
  display: flex !important;
}

#confirm-cancel-modal > div {
  background: #2a2a2a !important;
  border-radius: 12px !important;
  padding: 24px !important;
  max-width: 400px !important;
  width: 90% !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
}

#confirm-cancel-modal h3 {
  color: white !important;
  margin: 0 0 12px 0 !important;
  font-size: 20px !important;
  font-weight: 600 !important;
}

#confirm-cancel-modal p {
  color: rgba(255, 255, 255, 0.7) !important;
  margin: 0 0 24px 0 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

#confirm-cancel-modal > div > div {
  display: flex !important;
  gap: 12px !important;
}

#continue-checkout-btn,
#confirm-cancel-btn {
  flex: 1 !important;
  border: none !important;
  padding: 12px !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  font-size: 14px !important;
  transition: all 0.2s ease;
}

#continue-checkout-btn {
  background: white !important;
  color: black !important;
}

#continue-checkout-btn:hover {
  background: #f0f0f0 !important;
}

#confirm-cancel-btn {
  background: #dc2626 !important;
  color: white !important;
}

#confirm-cancel-btn:hover {
  background: #b91c1c !important;
}

/* Loading spinner animation */
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* Button loading state */
#proceed-payment-btn:disabled {
  opacity: 0.7 !important;
  cursor: not-allowed !important;
}

/* Mobile responsive */
@media (max-width: 768px) {
  #payment-iframe {
    height: 500px !important;
  }

  #payment-modal > div {
    width: 95vw !important;
  }

  #confirm-cancel-modal > div {
    width: 95% !important;
    padding: 20px !important;
  }
}

.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.account-payment-methods-table
  .woocommerce-orders-table__header-order-actions,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__cell-order-actions,
.woocommerce
  table.my_account_orders
  .woocommerce-orders-table__header-order-actions {
  display: flex !important;
  gap: 8px;
}

table.my_account_subscriptions.my_account_orders.woocommerce-orders-table.woocommerce-MyAccount-subscriptions.shop_table.shop_table_responsive.woocommerce-orders-table--subscriptions {
  display: none !important;
}

#acfw-store-credits-my-account a.button {
  color: black !important;
}