/* Let links inside the sticky inner receive pointer events */
.vi-sticky-product__inner a {
  pointer-events: auto;
  /* If needed, make sure this is higher specificity or loaded later */
}

/* But disable pointer events on the wrapper itself so it doesn’t block */
.vi-sticky-product__inner {
  pointer-events: none;
}

/* Now its children (links) override that and become clickable */
.vi-sticky-product__inner * {
  pointer-events: auto;
}


.single-product .site-content {
  background: white;
}

/* Example — for tablets and mobile */
@media (max-width: 1024px) {
  .woocommerce-product-gallery {
    max-width: 90%;
    /* or whatever width works best */
    margin-left: auto;
    margin-right: auto;
  }

  .woocommerce-product-gallery__wrapper,
  .woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    max-height: 400px;
    /* adjust this as needed */
    object-fit: contain;
  }
}

/* For smaller mobile screens */
@media (max-width: 768px) {
  .woocommerce-product-gallery {
    max-width: 100%;
  }

  .woocommerce-product-gallery__wrapper,
  .woocommerce-product-gallery__image img {
    max-height: 200px;
    /* or a smaller value you prefer */
  }

  .woocommerce-js.single-product .sale:not(.ast-product-gallery-layout-vertical-slider)>span.onsale {
    top: -1em;
  }

  .woocommerce-js.single-product .sale>span.onsale {
    font-size: 1em;
    left: 6.5em;
  }
}

/* On-Sale Badge */

/* H1 Product Title */
.single-product h1.product_title.entry-title {
  font-weight: 600 !important;
  color: #021B32 !important;
  font-size: 36px;
  line-height: 1.3;
  margin-bottom: 0;
}

/* Meta Star and Sales Count (30 + total) */
.vi-title-meta {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: .6rem 1rem;
  flex-wrap: wrap;
  margin-top: .5rem;
}

/* Rating text */
.single-product .entry-summary span.jdgm-prev-badge__text {
  color: #656A76;
  line-height: 1.5;
  font-size: 16px;
  font-weight: 500;
}

/* Style tweak */
.vi-title-meta__sales {
  font-weight: 600;
  color: #167237;
  background-color: #EFFDF4;
  font-size: 14px;
  padding: 6px 10px;
  border-radius: 9999px;
  line-height: 1.5;
}

.vi-title-meta__total_sales {
  color: #05559F;
  font-weight: 500;
  line-height: 1.5;
  margin: 10px 0 20px 0;
}

/* Price + Per Person */
.vi-price-above-variations .vi-per-person {
  opacity: .85;
  font-size: 16px;
  margin-left: .35em;
  font-family: 'Matimo';
  vertical-align: middle;
  color: #656A76;
  white-space: nowrap;
  font-weight: 400;
}

/* ShortDescription / Show More */
/* Default style for paragraphs in single product */
.single-product p {
  color: #656A76 !important;
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 12px !important;
}

/* Reset inside excluded containers */
.single-product .xoo-wsc-container p,
.single-product .xoo-wsc-drawer p,
.single-product .vi-sticky-product p {
  color: inherit !important;
  font-weight: inherit;
  font-size: inherit;
  margin-bottom: inherit !important;
}

/* Show more toggle */
.vi-sd:not(.is-open) .vi-sd__preview {
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: 10.5em;
}

.single-product .vi-sd__toggle {
  margin-top: .5rem;
  text-decoration: underline;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
  color: #021B32 !important;
  font-weight: 500 !important;
}

/* Expanded state: un-clamp */
.vi-sd.is-open .vi-sd__preview {
  display: block;
  -webkit-line-clamp: initial;
  max-height: none;
  overflow: visible;
}

/* Price Functionality */
.single-product div.product span.price:before {
  background: none !important;
}

.single-product div.product span.price,
.single-product div.product span.price .amount bdi {
  color: #021B32 !important;
  font-size: 32px;
}


.woocommerce-variation.single_variation .woocommerce-variation-description {
  display: none;
}

/* Variation Info */
/* fonts */
.summary.entry-summary .variations,
#vi-sticky-product .variations {
  font-family: 'Matimo';
}

/* spacing */
.summary.entry-summary .variations tbody,
#vi-sticky-product .variations tbody {
  gap: 10px;
  /* keep if your theme makes tbody a grid */
}

/* label cell */
.summary.entry-summary .variations tbody tr th.label,
#vi-sticky-product .variations tbody tr th.label {
  margin-bottom: 2px;
}

/* label text */
.summary.entry-summary .variations tbody tr th label,
#vi-sticky-product .variations tbody tr th label {
  color: #021B32;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
  margin-bottom: 0;
}

/* Astra variation chips */
.summary.entry-summary .variations tbody td.value .ast-single-variation,
#vi-sticky-product .variations tbody td.value .ast-single-variation {
  font-size: 16px;
  background-color: #DDE7F3;
  border: 1px solid transparent;
  /* reserve the 1px so hover doesn't grow */
  border-radius: 999px;
  margin-bottom: 0;
  transition: background-color .3s ease, color .3s ease, border-color .3s ease;
  transform: none;
  /* just in case other CSS sets a scale */
  box-shadow: none;
  /* optional: avoid glow jumps */
  font-weight: 600;
  /* pick a steady weight to avoid reflow */
}


.summary.entry-summary .variations tbody td.value .ast-single-variation.active,
#vi-sticky-product .variations tbody td.value .ast-single-variation.active,
#vi-sticky-product .variations tbody td.value .ast-single-variation:hover,
.summary.entry-summary .variations tbody td.value .ast-single-variation:hover {
  background-color: #083156;
  color: #fff;
  border: none;
  margin-bottom: 0;
}

#vi-sticky-product .variations tbody td.value .ast-single-variation:not(.active):hover,
.summary.entry-summary .variations tbody td.value .ast-single-variation:not(.active):hover {
  border: 1px solid #083156;
  font-weight: 700;
  color: #083156;
  background: #DDE7F3;
  transform: none !important;
  /* 🔹 prevent scaling/zoom */
  box-shadow: none !important;
  /* 🔹 remove any shadow glow */
}



/* hide in-form variation price (you show the moved/top price) */
.summary.entry-summary .single_variation .price,
#vi-sticky-product .single_variation .price {
  display: none !important;
}

/* spacing for the moved price holder above the table */
.summary.entry-summary .vi-price-above-variations {
  margin: 8px 0 12px;
}

#vi-sticky-product .vi-price-above-variations {
  margin: 0;
}

/* add-to-cart button style in sticky card */
#vi-sticky-product form.cart .single_add_to_cart_button {
  color: #083156;
  border-radius: 99999px;
  max-width: 400px;
  width: 100%;
}

/* Add to cart button and +/- */

.ast-variation-button-group .is-off {
  display: none !important;
}

.single-product.woocommerce div.product form.cart .button.single_add_to_cart_button {
  color: #083156;
  border-radius: 99999px;
  max-width: fit-content;
  width: 100%;
}

@media (max-width: 767.98px) {
    .single-product.woocommerce div.product form.cart .button.single_add_to_cart_button {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* ===== Pill wrapper ===== */
.bcc-quantity {
  display: inline-flex;
  align-items: center;
  padding: 0 6px;
  height: 40px;
  border: 1px solid #d1d5db;
  /* light gray border */
  border-radius: 9999px;
  /* full pill */
  background: #fff;
  gap: 2px;
  box-shadow: 0 1px 0 rgba(17, 24, 39, .03);
  margin-bottom: 10px;
}

/* ===== Buttons (+ / −) ===== */
.bcc-quantity>a.minus,
.bcc-quantity>a.plus {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 500 18px/1 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #6b7280 !important;
  /* gray-500 */
  text-decoration: none;
  background: transparent;
  border: 0 !important;
  /* nuke old borders */
  border-radius: 9999px;
  /* for subtle hover bg */
  cursor: pointer;
  user-select: none;
}

.bcc-quantity>a.minus:hover,
.bcc-quantity>a.plus:hover {
  background: #f3f4f6 !important;
  /* light hover */
}

.bcc-quantity>a.minus:active,
.bcc-quantity>a.plus:active {
  background: #e5e7eb;
}

/* ===== Input (center number) ===== */
.bcc-quantity input.qty {
  width: 30px !important;
  /* tweak as you like */
  text-align: center;
  border: 0 !important;
  background: transparent;
  font: 700 16px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #111827;
  /* gray-900 */
  padding: 0;
  height: calc(var(40px) - 2px);
  -moz-appearance: textfield;
}

.bcc-quantity a.plus:focus,
.bcc-quantity a.minus:focus {
  outline: none !important;
}

/* remove number arrows */
.bcc-quantity input.qty::-webkit-outer-spin-button,
.bcc-quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}



/* Mobile size tweak (optional) */
@media (max-width: 480px) {
  .bcc-quantity {
    --pill-h: 40px;
    --pill-w-btn: 36px;
  }

  .bcc-quantity input.qty {
    width: 42px;
    font-weight: 700;
  }
}

/* Payment Method Icons */
/* Payment methods row */
.payment-method-icons {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  /* space between label/badges */
  justify-content: center;
}

/* Inject the "We Accept:" label without changing your PHP */
.payment-method-icons::before {
  content: "We Accept:";
  font-weight: 600;
  color: #083156;
  /* your theme navy */
  margin-right: 6px;
}

/* Each icon as a small rounded badge */
.payment-method-icons>div {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  min-width: 44px;
  /* gray badge bg */
  color: #fff;
  /* white icon/text */
  border-radius: 6px;
  line-height: 1;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04);
}

/* Ensure Font Awesome icons are centered/consistent */
.payment-method-icons>div i {
  font-size: 24px !important;
  line-height: 1;
  color: #fff;
  /* force white glyphs */
}


/* Small screens: keep it tidy and centered if it wraps */
@media (max-width: 480px) {
  .payment-method-icons {
    justify-content: center;
  }

  .payment-method-icons::before {
    flex-basis: 100%;
    text-align: center;
    margin: 0 0 2px;
  }
}


/* Price List */
/* ===============================
   Compare block (NON full-bleed)
   =============================== */
.vi-compare-block {
  margin: 36px 0 12px 0;
  position: relative;
  display: flex;
  left: 50%;
  right: 50%;
  width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
}

.vi-compare__inner {
  max-width: var(--site-max, 1200px);
  /* or 1140/1280 etc. */
  margin: 0 auto;
  padding: 0 16px;
  /* safe gutter on small screens */
}

.vi-compare__title {
  margin: 0 0 16px;
  text-align: center;
  font-weight: 700;
  font-size: clamp(20px, 2.2vw, 28px);
  color: #072A52;
}

/* Optional: slightly tighten the shortcode table inside our section */
.vi-compare-block .comparison-table-shortcode .comparison-table {
  /* keep whatever the shortcode styles do, but tweak padding if desired */
  padding: 0.5rem 0.25rem;
}

/* Price List */
/* Variation Table */
/* Optional outer wrapper margin */
.jvl-table-wrapper {
  margin-bottom: 30px;
}

/* Table: using separate border model so outer border remains intact */
.jvl-variation-table {
  position: relative;
  max-width: 850px;
  margin: 10px 0 60px 0 !important;
  border-collapse: separate;
  border-spacing: 0;
  /* No spacing between cells */
  border: 1px solid #E6EAEF;
  /* Blue outer border */
  border-radius: 16px;
  /* Rounded corners */
  table-layout: fixed;
  padding: 0;
  font-family: 'Matimo', sans-serif;
}


/* Caption: remains inside the table but is absolutely positioned so it “pops out” */
.jvl-variation-table caption {
  font-size: 1.5em;
  margin-top: 40px;
  margin-bottom: 20px;
  text-align: center;
  font-size: clamp(20px, 2.2vw, 28px);
  font-weight: 600;
  color: #072A52 !important;
}

/* Table header styling */
.jvl-variation-table thead th {
  border: none;
  /* No full border on headers */
  font-size: 0.85em;
  letter-spacing: 0.1em;
  background-color: #F5F5F5;
  color: #021B32;
  padding: 0.625em;
  text-align: center;
  cursor: pointer;
  position: relative;

}

/* Always display a chevron on every header with default ascending arrow */
.jvl-variation-table thead th::after {
  content: " ▲";
  /* default arrow set to ascending */
  margin-left: 0.6em;
  font-size: 0.8em;
  color: #021B32;
}

.jvl-variation-table thead th.sort-desc::after {
  content: " ▼";
  font-size: 0.8em;
}



/* Ensure the header row’s extreme left/right corners match the table’s rounding */
.jvl-variation-table thead th:first-child {
  border-top-left-radius: 16px;

}

.jvl-variation-table thead th:last-child {
  border-top-right-radius: 16px;
}

/* Table body cells: apply full gray borders (inner grid lines) */
.jvl-variation-table tbody td {
  padding: 0.625em;
  text-align: center;
  border: none;
}

.jvl-variation-table tbody td:first-child,
.jvl-variation-table tbody th:first-child {
  text-align: left;
}

/* Remove the cell borders on the outer edges so the blue table border shows */
/* For the first row, remove the top border on its cells */
.jvl-variation-table tbody tr:first-child td {
  border-top: none;
}

/* For the first cell in each row, remove the left border */
.jvl-variation-table tbody td:first-child {
  border-left: none;
}

/* For the last cell in each row, remove the right border */
.jvl-variation-table tbody td:last-child {
  border-right: none;
}

/* Instead of removing all bottom borders on the last row,
   remove them only from the extreme cells and add border radius */
.jvl-variation-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 16px;
  border-bottom: none;
}

.jvl-variation-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 16px;
  border-bottom: none;
}

.jvl-variation-table tbody tr {
  background-color: #fff;
}

.comparison-table-shortcode .comparison-table td.feature {
  overflow: visible;
}

.comparison-table-shortcode .comparison-table .tooltips-custom {
  margin-left: .4rem;
  vertical-align: middle;
}

.comparison-table-shortcode .comparison-table .tooltips-custom {
  margin-left: .4rem;
  vertical-align: middle;
}

/* (Optional) Responsive styling adjustments */
@media screen and (max-width: 600px) {
  .jvl-variation-table {
    border: 0;
  }

  .jvl-variation-table caption {
    font-size: 1.3em;
  }

  .jvl-variation-table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  .jvl-variation-table tbody tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: 0.625em;
  }

  .jvl-variation-table tbody td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: 0.9em;
    text-align: right !important;
  }

  .jvl-variation-table tbody td::before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
  }

  .jvl-variation-table tbody td:last-child {
    border-bottom: 0;
  }
}

/* Why choose our services */
/* full-bleed band */
.vi-usps-fullbleed {
  position: relative;
  display: flex;
  left: 50%;
  right: 50%;
  width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
  background: #F5F5F5;
  border-top: 1px solid #E9EBED;
  border-bottom: 1px solid #E9EBED;
}

.vi-usps__inner {
  max-width: var(--site-max, 1200px);
  margin: 0 auto;
  padding: 80px 0 100px 0;
}

/* Section title: h3, 24px, lh 1.3, #021B32, 600 */
.single-product .vi-usps-fullbleed h3.vi-usps__title {
  margin: 0 0 30px;
  text-align: center;
  font-size: 24px;
  line-height: 1.3;
  font-weight: 600 !important;
  color: #021B32 !important;
}

.single-product .vi-usps-fullbleed h4.vi-usps__item-title {
  margin: 0 0 10px;
  margin-top: 5px;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 600 !important;
  color: #021B32 !important;
}


/* grid */
.vi-usps__grid {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

@media (max-width:900px) {
  .vi-usps__grid {
    grid-template-columns: 1fr;
  }
}

/* card */
.vi-usps__item {
  background: #fff;
  border: 1px solid #E9EBED;
  border-radius: 16px;
  box-shadow: 0 1px 0 rgba(233, 235, 237, .9), 0 6px 18px rgba(7, 42, 82, .06);
  padding: 18px 18px 20px;
}

/* row: icon left, text right */
.vi-usps__row {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

/* icon: bg #021B32, glyph rgb(249,201,10) */
.vi-usps__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #021B32;
  color: rgb(249, 201, 10);
}

.vi-usps__icon svg {
  display: block;
}

/* card title: h4, 20px, lh 1.3, #021B32, 600 */
.vi-usps__item-title {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 600;
  color: #021B32;
}

/* card text: p, 16px, lh 1.5, #083156, 400 */
.single-product p.vi-usps__item-text {
  margin: 0;
  font-size: 16px !important;
  line-height: 1.5;
  font-weight: 400 !important;
  color: #083156 !important;
}


/* All styles are scoped to the .comparison-table-shortcode container */
.comparison-table-shortcode {
  background-color: #fff;
  /* Instead of styling the global body */
}

.comparison-table-shortcode a {
  text-decoration: none;
  color: inherit;
}

.comparison-table-shortcode a:hover,
.comparison-table-shortcode a:focus {
  text-decoration: none !important;
  color: inherit !important;
}

.comparison-table-shortcode .comparison-table {
  width: 100%;
  margin: auto;
  max-width: 1100px;
  border-collapse: separate;
  border-spacing: 2rem 0;
  table-layout: fixed;
  background-color: #fff;
  padding: 1rem;
  border: none;
}

.comparison-table-shortcode .comparison-table th,
.comparison-table-shortcode .comparison-table td {
  margin: 0;
  padding: 0;
  border: none !important;
  vertical-align: middle;
}

.comparison-table-shortcode .comparison-table th div,
.comparison-table-shortcode .comparison-table td div {
  padding: 1rem;
}

.comparison-table-shortcode .comparison-table td>div {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #083156;
  font-weight: 600;
}

.comparison-table-shortcode .comparison-table th {
  text-align: center;
}

.comparison-table-shortcode .comparison-table th .comparison-title p {
  margin: 0 !important;
}

.comparison-table-shortcode .comparison-table td {
  text-align: center;
}

.comparison-table-shortcode .comparison-table .feature {
  text-align: left;
}

.comparison-table-shortcode .comparison-table .feature .feature-toggle .title-text {
  color: #083156;
  text-align: left;
}

.comparison-table-shortcode .comparison-table .feature-desc td p {
  text-align: left;
  margin-top: 10px;
  margin-left: 20px;
  margin-bottom: 10px;
}

.comparison-table-shortcode .info {
  font-weight: bold;
  text-align: center;
}

.comparison-table-shortcode .hightlight {
  background-color: rgb(246, 247, 249);
  margin: 0 1rem;
}

.comparison-table-shortcode .rounded-top {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.comparison-table-shortcode .rounded-bottom {
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.comparison-table-shortcode .feature {
  width: 50%;
  font-weight: bold;
  font-size: 1rem;
}

.comparison-table-shortcode .comparison-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: nowrap;
}

.comparison-table-shortcode .comparison-title p {
  color: #021B32 !important;
  font-weight: 600;
  line-height: 1.5;
}

.comparison-table-shortcode .comparison-title img {
  object-fit: contain;
}

@media (max-width: 600px) {
  .comparison-table-shortcode .comparison-title p {
    display: none;
  }

  .comparison-table-shortcode .feature,
  .comparison-table-shortcode .info {
    font-size: 0.8rem;
    font-weight: 500;
  }

  .comparison-table-shortcode .comparison-table {
    border-spacing: 0.2em 0;
  }

  .comparison-table-shortcode center {
    font-size: 13px;
  }
}

/* 	Arrow Toggle */
/* full-width flex container with space-between */
.comparison-table-shortcode .feature-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  /* take the full column width */
  background: none;
  border: none;
  padding: 0.5em 1rem;
  /* optional: give some breathing room */
  font: inherit;
  text-align: left;
  /* ensure multi‐line text wraps left */
  cursor: pointer;
}

/* remove the old margin-right on your arrow */
.comparison-table-shortcode .feature-toggle .sub-arrow::after {
  content: '\e900';
  font-family: 'Astra';
  font-size: 0.8rem;
  font-weight: 700;
  display: inline-block;
  transform: rotate(0deg);
  transition: transform 0.2s ease;
  /* no margin-right needed */
  color: #083156;
}

/* rotate when open */
.comparison-table-shortcode .feature-toggle[aria-expanded="true"] .sub-arrow::after {
  transform: rotate(180deg);
}

/* ————————————————————————————
   Tooltip inside the feature-toggle
   ———————————————————————————— */
.comparison-table-shortcode .feature-toggle .tooltip-wrap {
  position: relative;
  /* allow absolute children */
  margin-left: 0.5em;
  /* give some breathing room from the label */
}

.comparison-table-shortcode .feature-toggle .tooltip-text {
  position: absolute;
  /* pop out of the flex flow */
  top: 100%;
  /* just below the icon */
  left: 50%;
  transform: translateX(-50%);
  color: #4B4F59;
}

/* Mobile <480px adjustments */
@media (max-width: 480px) {
  .comparison-table-shortcode .comparison-table {
    padding: 1rem 4px;
    table-layout: unset;
  }

  .comparison-table-shortcode .comparison-table th {
    width: 25% !important;
  }

  .comparison-table-shortcode .comparison-table th div,
  .comparison-table-shortcode .comparison-table td div {
    padding: 6px 3px;
    font-size: 10px;
    line-height: 16px !important;
  }

  .comparison-table-shortcode .feature-toggle {
    padding: 3px 5px;
    gap: 3px;
  }

  .comparison-table-shortcode td.hightlight {
    background: #F5F5F5;
  }

  .comparison-table-shortcode td.hightlight div svg {
    width: 24px;
    height: 24px;
  }

  .comparison-table-shortcode .comparison-table .feature-desc td p {
    margin-left: 0;
    font-size: 10px;
    margin-bottom: 10px;
    line-height: 16px;
    text-align: justify;
    margin-right: 4px;
  }

  .comparison-table-shortcode .comparison-table .feature .feature-toggle .title-text {
    line-height: 16px;
  }

  .comparison-table-shortcode .comparison-table tr th .comparison-title {
    margin-bottom: 15px;
  }
}


/* Two-column grid next to the accordion */
.vi-tabs-layout {
  display: flex;
  gap: 80px;
  flex-direction: row;
  position: relative;
  left: 50%;
  right: 50%;
  width: 80vw;
  /* still fullbleed trick */
  margin-left: -40vw;
  margin-right: -40vw;
  justify-content: center;
  overflow: visible;
  /* center the two columns */
}

/* Left column (accordion) */
.vi-tabs-col.vi-tabs-col--accordion {
  flex: 1 1 0;
  max-width: 800px;
  /* cap at 800px */
  min-width: 0;
  /* prevent flex overflow */
}

/* Accordion */
.single-product .woocommerce-accordion .sp-accordion-item {
  border: 1px solid #E9EBED;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(233, 235, 237, .7),
    0 1px 0 rgba(233, 235, 237, .95);
  margin-bottom: 20px;
  overflow: hidden;
}

.single-product .woocommerce-accordion .accordion-header {
  background-color: unset;
  color: #021B32;
  padding: 20px;
  line-height: 1.3;
  font-weight: 600;
  margin-bottom: 0;
  border-radius: 16px;
  font-size: 20px;
  pointer-events: none;
}

.single-product .woocommerce-accordion .accordion-content {
  display: block;
  padding-top: 0;
  margin-bottom: 0px;
  padding: 5%;
}

/* Tablepress */
.single-product .accordion-content .dt-container {
  background: #fff;
  border: 1px solid #E6EAEF;
  border-radius: 16px;
  box-shadow: 0 1px 0 rgba(233, 235, 237, .9), 0 6px 18px rgba(7, 42, 82, .06);
  /* inner gutter */
  overflow: hidden;
  /* clip rounded corners */
  margin-top: 10px;
}

.single-product .accordion-content .dt-container .dt-layout-cell {
  padding-top: 0px;
}

/* Base table */
.single-product .accordion-content table.tablepress {
  width: 100% !important;
  border-collapse: separate;
  border-spacing: 0;
  background: transparent;
  border: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #083156;
}

/* Header row (light grey bar, rounded top corners) */
.single-product .accordion-content table.tablepress thead th {
  background: #F6F7F9 !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  color: #021B32 !important;
  text-align: left;
  padding: 12px 16px;
}

.single-product .accordion-content table.tablepress thead th:first-child {
  border-top-left-radius: 12px;
}

.single-product .accordion-content table.tablepress thead th:last-child {
  border-top-right-radius: 12px;
}

/* Body rows (clean separators, no zebra/hover) */
.single-product .accordion-content table.tablepress tbody tr {
  background: #fff !important;
}

.single-product .accordion-content table.tablepress tbody td {
  padding: 12px 16px;
  vertical-align: top;
}

.single-product .accordion-content table.tablepress tbody tr:last-child td {
  border-bottom: 0;
}

.single-product .accordion-content table.tablepress tbody tr:last-child td:first-child {
  border-bottom-left-radius: 12px;
}

.single-product .accordion-content table.tablepress tbody tr:last-child td:last-child {
  border-bottom-right-radius: 12px;
}

.single-product .accordion-content table.tablepress thead th .dt-column-title {
  font-weight: 500 !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  color: #021B32 !important;
}

/* Column typography / widths */
.single-product .accordion-content table.tablepress tbody td.column-1 {
  width: 42%;
  /* label column */
  color: #656A76;
}

.single-product .accordion-content table.tablepress tbody td.column-2 {
  color: #656A76;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
}


/* Caption (admin Edit link) subtle */
.single-product .accordion-content .tablepress caption {
  margin-top: 8px;
  padding: 0;
  background: none;
  border: 0;
  font-size: 12px;
  color: #6b7280;
}

/* ── Strip zebra & hover in TablePress (single product accordion only) ── */

/* 1) Reset the plugin's CSS variables to white */
.single-product .accordion-content .tablepress {
  --even-bg-color: #fff !important;
  --odd-bg-color: #fff !important;
  --hover-bg-color: #fff !important;
  --text-color: #083156;
  /* keep your text color */
  --border-color: #E6EAEF;
  /* keep your border color */
}

/* 2) Override the row-striping used by TP v2 with :where() selectors */
.single-product .accordion-content .tablepress> :where(tbody.row-striping)> :where(:not(.child, .dtrg-group)):nth-child(odd)>*,
.single-product .accordion-content .tablepress> :where(tbody.row-striping)> :where(:not(.child, .dtrg-group)):nth-child(even)>* {
  background: #fff !important;
}

/* 3) Also cover older/easier selectors some setups use */
.single-product .accordion-content .tablepress tbody.row-striping tr.odd>*,
.single-product .accordion-content .tablepress tbody.row-striping tr.even>* {
  background: #fff !important;
}

/* 4) Kill hover shading */
.single-product .accordion-content .tablepress .row-hover tr:hover>* {
  background: #fff !important;
}

/* 5) Safety net: ensure all cells in tbody render white */
.single-product .accordion-content .tablepress tbody tr>* {
  background: #fff !important;
}

/* 6) Keep your borders intact (matches your existing look) */
.single-product .accordion-content .tablepress> :where(thead)+tbody> :where(:not(.child))>*,
.single-product .accordion-content .tablepress>tbody>*~ :where(:not(.child))>*,
.single-product .accordion-content .tablepress>tfoot> :where(:first-child)>* {
  border-top: 1px solid var(--border-color) !important;
}

/* Loosen vertical divider between the two columns */
.single-product .accordion-content table.tablepress tbody td+td,
.single-product .accordion-content table.tablepress thead th+th {
  padding-left: 32px;
  /* ⬅️ increase this until it feels right */
}

/* Right column (sticky card) */
.vi-tabs-col.vi-sticky-col {
  flex: 1 1 0;
  max-width: 400px;
  /* cap at 400px */
  min-width: 0;
}

/* Sticky card itself */
.vi-sticky-product {
  position: sticky;
  top: 160px;
  background: #fff;
  border: 1px solid #E9EBED;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(233, 235, 237, .7),
    0 1px 0 rgba(233, 235, 237, .95);
  padding: 28px;
  margin-bottom: 20px;
}

p.vi-sticky-product__title.product_title {
  color: #021B32 !important;
  line-height: 1.3;
  font-size: 24px;
  font-weight: 600;
}

/* Hidden state (JS toggles this) */
#vi-sticky-product[hidden] {
  display: none !important;
}

#vi-sticky-product {
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease;
}

#vi-sticky-product.is-ready {
  opacity: 1;
  visibility: visible;
}

#vi-sticky-product .vi-price-above-variations .vi-main-price .price bdi {
  font-size: 28px !important;
  line-height: 1.3;
}

#vi-sticky-product .vi-title-meta__total_sales {
  margin-top: 8px;
  margin-bottom: 8px;
}

#vi-sticky-product .vi-price-above-variations .vi-main-price .price bdi {
  font-size: 28px !important;
  line-height: 1.3;
}

#vi-sticky-product .vi-title-meta__total_sales {
  margin-top: 8px;
  margin-bottom: 8px;
}

#vi-sticky-product tbody {
  border-top: 1px solid #E9EBED;
  margin-top: 10px;
  padding-top: 10px;

}

#vi-sticky-product table {
  margin-bottom: 0 !important;
}

#vi-sticky-product tbody th.label label {
  font-size: 16px !important;
}

#vi-sticky-product tbody .ast-variation-button-group .ast-single-variation {
  font-size: 16px !important;
}

#vi-sticky-product .single_variation_wrap .single_variation {
  margin-bottom: 0;
}

/* Responsive fallback: stack on narrow screens */
@media (max-width: 900px) {
  .vi-tabs-layout {
    flex-direction: column;
    width: 100%;
    /* reset fullbleed on mobile */
    margin: 0;
    left: auto;
    right: auto;
  }

  .vi-tabs-col.vi-tabs-col--accordion,
  .vi-tabs-col.vi-sticky-col {
    max-width: 100%;
    width: 100%;
  }
}


/* Full-bleed container like the screenshot */
/* Full-bleed band (desktop spec) */
.product-stats-fullbleed {
  position: relative;
  left: 50%;
  right: 50%;
  width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
  background: #00234F;
  /* ← your color */
  color: #fff;
  padding: 80px;
  /* ← desktop padding */
  border-top: 1px solid rgba(255, 255, 255, .15);
  border-bottom: 1px solid rgba(255, 255, 255, .15);
}

/* Inner grid */
.product-stats-inner {
  max-width: var(--site-max, 1200px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  /* column spacing */
  text-align: center;
  align-items: center;
}

/* Stat block */
.stat {
  display: grid;
  justify-items: center;
  gap: 10px;
  /* ← your stat gap */
}

/* Icons use currentColor so just set color here */
.stat__icon {
  width: 60px;
  /* ← your size */
  height: 60px;
  /* ← your size */
  color: #DDE7F3;
  /* ← glyph color */
  display: block;
}

/* Numbers + labels (desktop spec) */
.stat__value {
  font-size: 48px;
  /* ← your size */
  font-weight: 700;
  line-height: 1.3;
  /* ← your line height */
  letter-spacing: 0.2px;
}

.stat__label {
  font-size: 16px;
  /* ← your size */
  line-height: 1.5;
  /* ← your line height */
}

/* Responsive tweaks (optional) */
@media (max-width: 1200px) {
  .product-stats-inner {
    padding: 0 16px;
  }
}

@media (max-width: 1024px) {
  .product-stats-inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .product-stats-fullbleed {
    padding: 56px 32px;
  }
}

@media (max-width: 560px) {
  .product-stats-inner {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .product-stats-fullbleed {
    padding: 40px 20px;
  }

  .stat__value {
    font-size: 36px;
    line-height: 1.3;
  }
}

/* =======================
   ADDITIONS FOR WHY CARD
   ======================= */

/* Full-bleed wrapper for the "Why Book With Us" section */
.vi-why-card {
  position: relative;
  display: flex;
  left: 50%;
  right: 50%;
  width: 100vw;
  /* full viewport width */
  margin-left: -50vw;
  margin-right: -50vw;
  background: transparent;
  /* outer shell has no edges */
}

/* Inner centered container to align with your site width */
.vi-why-card__inner {
  max-width: var(--site-max, 1200px);
  /* adjust to your theme container width */
  margin: 0 auto;
  padding: 80px 16px 100px 16px;
  text-align: center;
}

.vi-why-card__header {
  max-width: 700px;
  margin: auto;
}

/* Title styling */
.single-product .vi-why-card h2.vi-why-card__title {
  font-size: 32px !important;
  line-height: 1.3;
  margin-bottom: 10px !important;
  background: #fff;
  color: #021B32 !important;
}

.vi-why-card__title .fa-solid {
  color: #f4b400;
}

/* Body container (holds your table/styles/JS) */
.single-product .vi-why-card p.vi-why-card__body {
  overflow: hidden;
  background: #fff;
  color: #083156 !important;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
}

/* Spacer that pushes the sticky product below the WHY card (height set by JS) */
#vi-why-spacer {
  height: 0 !important;
}

/* responsive */

.ast-variation-button-group {
  gap: 10px;
}

/* Responsive */
@media (max-width: 1024px) {
  .product-stats-inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .vi-usps__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile: single column; hide sticky card */
@media (max-width: 991.98px) {
  .vi-tabs-layout {
    display: block;
  }

  #vi-sticky-product {
    display: none !important;
  }
}

/* Example: tablets and smaller — adjust breakpoint as needed */
@media (max-width: 768px) {
  .vi-tabs-col.vi-tabs-col--accordion {
    width: 100% !important;
    /* optionally make other adjustments, e.g.: */

  }

  .woocommerce-js div.product form.cart .single_variation_wrap {
    width: 100%;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
  }
}


/* Small tweaks for mobile spacing */
@media (max-width: 600px) {
  .vi-compare-block {
    margin: 28px 0 8px;
  }

  .vi-compare__inner {
    padding: 0 12px;
  }
}

@media (max-width: 560px) {
  .product-stats-inner {
    grid-template-columns: 1fr;
  }

  .vi-usps__grid {
    grid-template-columns: 1fr;
  }

  .vi-usps__inner {
    padding: 36px 14px;
  }
}

/* Responsive: stack on small screens for readability */
@media (max-width:480px) {
  .vi-title-meta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* In the sticky card, let only the CART FORM receive pointer events */
#vi-sticky-product .vi-sticky-product__inner> :not(form) {
  pointer-events: none;
}

#vi-sticky-product form {
  pointer-events: auto;
  position: relative;
  z-index: 5;
}

/* --- STICKY VARIATIONS: layout --- */
#vi-sticky-product .variations {
  font-family: 'Matimo', system-ui, sans-serif;
}

#vi-sticky-product .variations td.value {
  display: block;
}

#vi-sticky-product .ast-variation-button-group {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

/* --- Chip base --- */
#vi-sticky-product .ast-variation-button-group .ast-single-variation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  min-height: 38px;
  border-radius: 999px;
  border: 0;
  background: #DDE7F3;
  color: #021B32;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 500;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, transform .02s ease-in-out;
  user-select: none;
  text-decoration: none;
}

/* hover/active to match main column */
#vi-sticky-product .ast-variation-button-group .ast-single-variation:hover,
#vi-sticky-product .ast-variation-button-group .ast-single-variation.active {
  background: #083156;
  color: #fff;
}

/* unavailable options (we toggle .is-off in JS) */
#vi-sticky-product .ast-variation-button-group .ast-single-variation.is-off {
  opacity: .45;
  cursor: not-allowed;
  filter: grayscale(.25);
}

/* keep native selects present for Woo, but out of sight */
#vi-sticky-product .variations select {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

/* ensure nothing else in the sticky sits above the form (prevents click theft) */
#vi-sticky-product .vi-sticky-product__inner>* {
  position: relative;
  z-index: 1;
}

#vi-sticky-product form.variations_form {
  position: relative;
  z-index: 5;
}


/* Responsive Section */
/* ===========================
   ≤ 768px mobile refinements
   =========================== */
/* ===========================
   ≤ 768px mobile refinements
   =========================== */
@media (max-width: 768px) {

  /* Site top spacing */
  .single-product .site-content {
    padding-top: 45px;
  }

  .single-product .entry-summary span.jdgm-prev-badge__text {
    font-size: 14px;
  }
 .payment-method-icons {
  display:none;
}
.payment-method-icons.vi-mobile-icons {
  display: flex;
}
  /* Title: responsive clamp */
  .single-product h1.product_title.entry-title {
    font-size: clamp(22px, 6vw, 32px);
    line-height: 1.25;
    margin-bottom: 6px;
  }

  /* Prices a bit smaller on mobile */
  .single-product div.product span.price,
  .single-product div.product span.price .amount bdi {
    font-size: 26px;
  }
/* Default style for paragraphs in single product */
.single-product p {
  font-size: 15px;
}

/* Reset inside excluded containers */
.single-product .xoo-wsc-container p,
.single-product .xoo-wsc-drawer p,
.single-product .vi-sticky-product p {
  font-size: inherit;
}
  /* ===== Variations – labels, chips, spacing ===== */
  .single-product .summary.entry-summary table.variations {
    width: 100%;
  }

  .single-product .summary.entry-summary .variations tbody {
    gap: 6px;
  }

  .single-product .summary.entry-summary .variations tr {
    vertical-align: top;
  }

  /* Label cell + text */
  .single-product .summary.entry-summary .variations tbody tr th.label {
    margin-bottom: 0;
    padding-right: 8px;
  }

  .single-product .summary.entry-summary .variations tbody tr th.label label {
    font-size: 15px;
    line-height: 1.35;
    font-weight: 500;
  }

  /* 🔽 CRITICAL: match/exceed specificity so the chip font-size wins */
  .single-product .summary.entry-summary .variations tbody td.value .ast-variation-button-group .ast-single-variation {
    font-size: 14px !important;
    /* ensure we beat the 18px base */
    padding: 8px 12px;
    min-height: 34px;
    line-height: 1.25;
    border-radius: 999px;
    gap: 6px;
  }

  /* Keep active/hover same size (no jump) */
  .single-product .summary.entry-summary .variations tbody td.value .ast-variation-button-group .ast-single-variation.active,
  .single-product .summary.entry-summary .variations tbody td.value .ast-variation-button-group .ast-single-variation:hover {
    font-size: 14px !important;
  }

  /* If you want the very long option slightly smaller, target it too */
  .single-product .summary.entry-summary .variations tbody td.value .variation-i-dont-have-an-onward-ticket {
    font-size: 13.5px !important;
  }

  /* Group layout */
  .single-product .summary.entry-summary .variations .ast-variation-button-group {
    gap: 8px;
    flex-wrap: wrap;
  }

  /* Reset link smaller & closer */
  .single-product .summary.entry-summary .variations .reset_variations {
    font-size: 12px;
    margin-left: 8px;
  }

  /* Native select (fallback) */
  .single-product .summary.entry-summary .variations select {
    font-size: 14px;
    padding: 6px 8px;
  }

  .single-product.woocommerce div.product form.cart .button.single_add_to_cart_button {
    margin-bottom: 0;
  }

  /* Tooltips next to label */
  .single-product .summary.entry-summary .variations .vi-attr-tooltip .vi-attr-tooltip__icon {
    font-size: 12px;
    line-height: 1;
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .single-product .summary.entry-summary .variations .vi-attr-tooltip__bubble {
    font-size: 13px;
    line-height: 1.45;
    max-width: min(86vw, 420px);
  }

  .single-product .summary.entry-summary .variations .vi-attr-tooltip__bubble p {
    margin: 0 0 8px;
  }

  .single-product .summary.entry-summary .variations .vi-attr-tooltip__close {
    font-size: 16px;
  }

  /* Compare block: full width, tighter margins */
  .vi-compare-block {
    margin: 28px 0 8px;
    width: 100%;
    left: 0;
    right: 0;
  }

  .vi-compare__inner {
    padding: 0 12px;
  }

  /* USPS (Why choose our services) – inner padding & type */
  .vi-usps__inner {
    padding: 36px 14px;
  }

  .single-product .vi-usps-fullbleed h3.vi-usps__title {
    font-size: clamp(18px, 4.5vw, 22px);
    margin-bottom: 18px;
  }

  .single-product .vi-usps-fullbleed h4.vi-usps__item-title {
    font-size: clamp(16px, 4vw, 18px);
  }

  .single-product p.vi-usps__item-text {
    font-size: 14px !important;
    line-height: 1.5;
  }

  .vi-usps__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .vi-usps__item {
    padding: 14px;
  }

  .vi-usps__icon {
    width: 32px;
    height: 32px;
  }

  /* WHY card title/body smaller on mobile */
  .single-product .vi-why-card h2.vi-why-card__title {
    font-size: clamp(20px, 6vw, 26px) !important;
  }

  .single-product .vi-why-card p.vi-why-card__body {
    font-size: 15px;
    line-height: 1.6;
  }

  /* Per-person note above variations */
  .vi-price-above-variations .vi-per-person {
    font-size: 14px;
    margin-left: .25em;
  }

  /* Title meta (stars + sales) stack neatly */
  .vi-title-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .vi-title-meta__sales {
    font-size: 13px;
    padding: 5px 8px;
  }

  .vi-title-meta__total_sales {
    margin: 6px 0 14px;
  }

  .single-product .woocommerce-accordion .accordion-content {
    padding: 50px 5% !important;
  }

  .single-product .accordion-content table.tablepress {
    font-size: clamp(14px, 2.2vw, 16px);
    /* body scales down a bit */
    line-height: 1.5;
    /* keep readable per WCAG */
  }

  .single-product .accordion-content table.tablepress thead th,
  .single-product .accordion-content table.tablepress thead th .dt-column-title {
    font-size: clamp(15px, 2.4vw, 16px) !important;
  }

  .single-product .accordion-content table.tablepress tbody td {
    padding: 10px 12px;
    /* slightly tighter */
  }

  .single-product .accordion-content table.tablepress thead th {
    padding: 10px 12px;
  }

  .single-product .accordion-content table.tablepress tbody td.column-2 {
    font-size: clamp(14px, 2.2vw, 16px);
  }

  .single-product .accordion-content table.tablepress tbody td+td,
  .single-product .accordion-content table.tablepress thead th+th {
    padding-left: 20px;
    /* reduce column gap */
  }

  .payment-method-icons {
    margin-top: 10px;
  }

  .payment-method-icons::before {
    content: unset;

  }

}

/* ===========================
   ≤ 480px extra-small polish
   =========================== */
@media (max-width: 480px) {
  .single-product h1.product_title.entry-title {
    font-size: clamp(20px, 7vw, 24px);
  }

  .single-product div.product span.price,
  .single-product div.product span.price .amount bdi {
    font-size: 24px;
  }

  /* Chips even tighter on very small phones */
  .single-product .summary.entry-summary .variations tbody td.value .ast-variation-button-group .ast-single-variation {
    font-size: 13px !important;
    padding: 7px 10px;
    min-height: 32px;
  }

  .single-product .summary.entry-summary .variations tbody tr th.label label {
    font-size: 14px;
  }

  .single-product .summary.entry-summary .variations .vi-attr-tooltip__bubble {
    font-size: 12.5px;
    transform: translateX(-26%);
  }
}