@layer global {

  html {
    scroll-behavior: smooth;
    overflow-x: hidden;
  }

  .hidden {
    display: none !important;
  }

  .visible-flex {
    display: flex !important;
  }

  .product-page {
    margin-block-end: 3.75rem;
  }

  .single-product__main-content {
    display: flex;
    flex-direction: column;
    gap: 3rem;
  }

  @media(width >= 48.875rem) {
    .product-page {
      --column-gap: 1.5rem;
      display: grid;
      grid-template-columns: 1fr 15.4rem;
      column-gap: var(--column-gap);
      grid-template-areas: 
        "title title" 
        "before-content sidebar" 
        "content sidebar";
      margin-block-end: 6.5rem;

      .single-product__before-main-content {
        grid-area: before-content;
      }

      .single-product__sidebar {
        --offset-top: 4.25rem;
        position: sticky;
        inset-block-start: var(--offset-top);
        grid-area: sidebar;
      }

      .single-product__main-content {
        grid-area: content;
      }

      .single-product__description {
        padding-top: 4rem;
      }
    }
  }

  @media(width >= 70rem) {
    .product-page {
      --column-gap: max(calc(0.05 * var(--content-max-width)), 1.5rem);
      grid-template-columns: 1fr min(23%, 18.4rem);
    }
  }

  .single-product__anchor-navbar {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: #FFF;
    display: flex;
    align-items: center;
    gap: 2.5rem;
    padding: 0 2.5rem;
    border-bottom: 1px solid var(--Color-Gray-Dark, #5F5F5F);
    box-shadow: 0 4px 20px 0 hsla(0, 0%, 0%, 0.05);
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    user-select: none;
    transform: none;
    transition: all .3s cubic-bezier(0.075, 0.82, 0.165, 1);

    @media screen and (width >= 80rem) {
      justify-content: center;
    }

    a {
      display: inline-block;
      background-color: var(--color-canvas);
      padding-block: .7em;
      padding-inline: 1em;
      font-size: var(--step--1);
      font-weight: 500;
      line-height: 1.6875;
      color: #000;
      text-decoration: none;
      border-block: .3rem solid transparent;
      transition: all .2s ease;
    }

    a.active {
      border-block-end-color: var(--color-primary-light);
      background-color: color-mix(in srgb, var(--color-primary-light) 10%, transparent 50%);
    }

    @starting-style {
      transform: translateY(-100%);
    }
  }

  body.admin-bar .single-product__anchor-navbar {
    top: 46px;
  }

  @media( width >= 782px ) {
    body.admin-bar .single-product__anchor-navbar {
      top: 32px;
    }
  }

  .single-product__anchor-navbar::-webkit-scrollbar {
    display: none;
  }  

  .single-product__anchor-navbar.grabbing {
    cursor: grabbing;
  }

  .single-product__anchor {
    scroll-margin-block-start: 1.1rem;
     @media( width >= 782px ) {
      scroll-margin-block-start: 3.5rem;
     }
  }

  .woocommerce-breadcrumb span.woocommerce-breadcrumb-region-item {
    padding: 0;
    margin-right: .5rem;
  }

  .single-product__wrapper {
    display: flex;
    flex-direction: column;
  }

  @media( width >= 782px ) {
    .single-product__wrapper {
      flex-direction: row;
      justify-content: space-between;
    }
  }

  @media( width >= 782px ) {
    .single-product__main-content {
      padding-inline-start: .5rem;
      line-height: 1.6;
    }
  }

  .single-product__sidebar {
    height: fit-content;
    margin-bottom: 2.4rem;
    @media( width >= 782px ) {
      position: sticky;
    }
  }

  .single-product__top-section .single-product__sidebar {
    margin-bottom: 0;
  }

  @media( width >= 782px ) {
    .single-product__top-section .single-product__sidebar {
      display: none;
    }
  }

  .single-product__before-inner-content {
    margin-bottom: 2rem;
  }

  .single-product__top-section {
    display:  grid;
    grid-template-columns: 1fr auto;
  }

  @media( width <= 781px ) {
    .single-product__top-section {
      display: flex;
      flex-direction: column;
      gap: 3rem;
    }
  }
  
  .single-product__description-content {
    &>*+* {
      margin-block-start: var(--space-s);
    }
    @media( width > 782px ) {
      padding-inline-start: 3rem;
    }
  }



  @media( width <= 781px ) {

    .single-product__description {
      position: relative;
    }

    .single-product__description-content {
      position: relative;
      max-height: 150px;
      overflow: hidden;
    }

    .single-product__description-content::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 70px;
      background: linear-gradient(to bottom, transparent, white); 
      pointer-events: none;
    }

    .single-product__description-content.expanded::after {
      display: none;
    }

    .single-product__description-load-more {
      display: inline-block; 
      width: fit-content;
      font-size: .9375rem;
      border-bottom: 4px solid var(--color-accent);
      height: 1.125rem;
      border-radius: .1rem;
      cursor: pointer;
      margin-top: 1rem;
    }
  }

  @media( width >= 782px ) {
    .single-product__description-load-more {
      display: none;
    }
  }

  .single-product__tour-duration {
    padding: 1.25rem 0;

    p {
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: .7rem;
      font-size: .875rem;
    }
  }

  .single-product__main-content p {
    color: var(--color-gray-dark);
  }

  .single-product__page-title {
    margin-bottom: 2rem;
    grid-area: title;

    #page-title {
      font-size: 2rem;
    }
  }

  @media( width >= 782px ) {
    .single-product__page-title {
      margin-bottom: 1.7rem;
      font-size: revert;

      #page-title {
        font-size: 4rem;
      }
    }
  }
  
  .single-product__featured-image {
    position: relative;
    aspect-ratio: 1.654 / 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    
    @media screen and (width >= 64rem) {
      width:100%;
    }
  }

  .single-product__gallery-button {
    position: absolute;
    left: 0.4rem;
    bottom: 0.4rem;
    cursor: pointer;
    background: #ffffff;
    color: black;
    font-weight: 500;
  }

  .single-product__utility-info {
    border-bottom: 2px solid var(--color-blue-light);
  }


  @media screen and (width < 782px) {
    .single-product__highlights-content,
    .single-product__itinerary-list,
    .single-product__pricing-and-cancellation ul, ol,
    .single-product__useful-info-description ul, ol {
      padding-inline-start: 1rem;
    }
  }

  .single-product__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: var(--step-2);
    font-weight: 300;
    line-height: 2.25;
    margin-bottom: .75rem;

    svg {
      width: 45px;
      height: 45px;
    }
  }

  @media( width >= 782px ) {
    .single-product__title {
      flex-direction: row;
      gap: 1rem;
      margin-inline-start: -0.5rem;
    }
  }

  .single-product__content li::marker {
    color: var(--color-blue-light);
    font-size: var(--step-0);
  }

  @media( width >= 782px ) {
    .single-product__content {
      padding-inline-start: 3.8rem; 
      &:is(ul, ol):not(.single-product__useful-info-list) {
        padding-inline-start: 4.5rem;
      }
    }
  }

  .single-product__route {
    img {
      aspect-ratio: 0.81 / 1;
      object-fit: cover;
    }
  }

  @media( width >= 782px ) {
    .single-product__route {
      img {
        aspect-ratio: 1.81 / 1;
        object-fit: unset;
      }
    }
  }

  .single-product__route #acf-map {
    width: 100%;
    aspect-ratio: 4/5;
    @media( width >= 782px ) {
      aspect-ratio: 5/3;
      margin-left: 3rem;
      width: calc(100% - 3rem);
    }
  }

  .gm-style-iw-c {
    padding: 0 !important;
  }

  .gm-style-iw-d {
    padding-left: 1.1rem;
  }

  .gm-style-iw-ch {
    display: none;
  }
  
  .gm-style-iw-chr {
    display: none;
  }

  .single-product__itinerary-list-item {
    margin-bottom: 1.5rem;
  }

  .single-product__itinerary-list-title {
    font-size: 1.125rem;
    font-weight: 400;
  }

  .single-product__itinerary-duration-in-hours {
    display: flex;
    align-items: center;
    font-size: .875rem;
    font-weight: 600;
    gap: .33rem;
    background-color: var(--color-gray-light);
    width: fit-content;  
    border-radius: 3.125rem;
    padding: .125rem .375rem;
    margin-top: .5rem;
  }

  .single-product__pricing-and-cancellation {

    .single-product__included-and-excluded {
      columns: 2;
      column-width: 20rem;
      column-gap: 1.5rem;
      margin-block-end: 2rem;

      & > *:not(:last-child) {
        break-inside: avoid;
        margin-block-end: 2rem;
      }
    }

    .single-product__included-in-price-title,
    .single-product__included-in-price::marker {
      color: var(--color-positive);
    }

    .single-product__excluded-in-price-title,
    .single-product__excluded-in-price::marker {
      color: var(--color-negative);
    }

    .single-product__included-in-price-list,
    .single-product__excluded-in-price-list { 
      padding-inline-start: 1.1rem;
    }

    @media( width >= 782px ) {
      .single-product__included-in-price-list,
      .single-product__excluded-in-price-list { 
        padding-inline-start: 2rem;
      }
    }

    .single-product__included-in-price-title,
    .single-product__excluded-in-price-title,
    .single-product__tour-policy-title {
      font-size: 1.125rem;
      font-weight: 600;
      line-height: 1.575;
    }

    .single-product__included-item::marker,
    .single-product__excluded-item::marker,
    .single-product__tour-policy::marker {
      color: #000;  
    }
  }

  .single-product__useful-info-list {
    padding-inline-start: 0;
  }

  @media( width >= 782px ) {
    .single-product__useful-info-list {
      padding-inline-start: 3rem;
    }
  }

  .single-product__useful-info-list-item {
    list-style-type: none;
  }

  .single-product__useful-info-list-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.6875;
    padding: .5rem 1rem .5rem 1rem;
    border-bottom: 1px solid var(--color-gray-dark);
    cursor: pointer;

    svg {
      min-width: 1rem;
      transition: transform 0.3s ease;
    }
  }

  .single-product__useful-info-list-title.active svg {
    transform: rotate(180deg);
  }

  .single-product__useful-info-description {
    display: none;
    padding: 1rem 1rem 0.5rem 1.25rem;
  }

  .single-product__gallery-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: .5rem;
  }

  @media( width >= 782px ) {
    .single-product__gallery-content {
      padding-left: 3.8rem;
    }
  }

  .single-product__gallery-content .single-product__gallery-thumb {
    aspect-ratio: 1.44 / 1;
    object-fit: cover;
    height: auto;
  }

  .single-product__gallery-content .single-product__gallery-item {
    cursor: pointer;
  }
}

.cart {
  border-block-start: 10px solid var(--color-primary-light);
  padding-block: 1.25rem;
  padding-inline: 1rem;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.2rem;
  background-color: color-mix(in srgb, var(--color-primary-light) 10%, white 100%);
  transition: all .3s ease;

  .quantity-button {
    width: 2.5rem;
  }

  label {
    font-weight: 500;
    display: block;
    font-size: .875rem;
    margin-block-end: .75rem;

    &:first-letter {
      text-transform: uppercase;
    }
  }

  body:has(.single-product__anchor-navbar.visible-flex) & {
    border-color: var(--color-white);
  }

  @media(width >= 782px) {
    max-height: calc(100vh - var(--offset-top));
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--color-primary) transparent;
  }
}

.cart__num_container {
  margin-inline: auto;
  width: min(20rem, 100%);
}

.cart__num-input-container {
  display: flex;
  justify-content: space-between;
  gap: 1.5625rem;

  
  input[type="number"] {
    text-align: center;
    width: 3rem;
    border: 1px solid var(--color-neutral);
    display: flex;
    align-items: center;
    color: var(--color-neutral-dark);
    margin-block: 0.1rem;
  }
}

.disabled {
  cursor: default;
  opacity: .3;
}

.single_add_to_cart_button.disabled {
  opacity: 1;
  color: color-mix(in srgb, var(--color-ink) 100%, transparent 100%);
  background-color: color-mix(in srgb, var(--color-accent) 20%, white 70%) !important;
}

.single_add_to_cart_button {
  font-size: 1rem;
  width: 100%;
  font-weight: 500;
  padding-block: .5rem;
  line-height: 1.5;
  position: relative;
}

.single_add_to_cart_button.loading {
  cursor: default;
  color: transparent;

  &::after {
    content: "";
    position: absolute;
    top: calc(50% - 12px);
    left: calc(50% - 12px);
    height: 24px;
    width: 24px;
    border: 2px solid var(--color-ink);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
  }
}


.cart__pickup-date input {
  padding: .875rem .9375rem;
  border: 1px solid var(--color-neutral);
  width: 100%;
  font-size: .9375rem;
  color: var(--color-neutral-dark);
  height: 2.75rem;
  cursor: pointer;
}

.cart__error {
  background: var(--color-white);
  border-top: .1rem solid var(--color-negative);
  padding: .5em;
  font-size: .85rem;
}

.date_picker_wrapper {
  position: relative;
  
  svg {
    pointer-events: none;
    position: absolute;
    right: .875rem;
    top: 50%;
    transform: translateY( -50%);
  }
}

#single-product__scroll-to-sidebar {
  display: none;
}

.single-product__highlights-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.single-product__highlights-item {
    font-size: 1.125rem;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
