

/* CSS from section stylesheet tags */
.nav-inline {

  padding: 1rem 0;

  font-size: 16px; /* smaller font size */

}
.nav-inline__container {

  display: flex;

  align-items: center;

  flex-wrap: wrap;
  gap: 0.5rem;
  color: var(--color-text, #333);
  margin-left: 4rem; /* more left spacing */
}

.nav-inline__link {
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
}

.nav-inline__link:hover {
  color: #917646;
}

.nav-inline__current {
  color: var(--color-text-muted, #999);
}

.nav-inline__icon {
  display: flex;
  align-items: center;
  margin: 0 0.25rem;
}

.nav-inline__icon svg {
  width: 10px;
  height: 10px;
}
@media screen and (max-width: 767px){
  .nav-inline__container {

  display: flex;

  align-items: center;

  flex-wrap: wrap;
  gap: 0.5rem;
  color: var(--color-text, #333);
  margin-left: 4rem; /* more left spacing */
  margin-top:40px;
  
}
}
@media screen and (min-width: 1540px) {
  .nav-inline {
    margin-left: 13rem !important;
  }
}
.nav-trail {
  display: block;
  padding: 1rem 0;
  font-size: 16px; /* smaller font size */
  font-family: inherit;
  margin-left: 2rem; /* added left margin */
}

.nav-trail__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.nav-trail__item {
  display: flex;
  align-items: center;
}

.nav-trail__link {
  text-decoration: none;
  color: var(--color-text, #333);
  transition: color 0.2s ease;
}

.nav-trail__link:hover {
  color: #917646;
}

.nav-trail__current {
  color: var(--color-text-muted, #999);
}

.nav-trail__item svg {
  margin: 0 0.5rem;
  width: 10px;
  height: 10px;
  fill: currentColor;
}
@media screen and (min-width: 1540px) {
  .nav-trail {
    margin-left: 17rem !important;
  }
}
.product-information {
    gap: var(--gap) 0;
  }

  /* Base grid layout */
  .product-information__grid {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
  }

  /* Default column positions */
  .product-details {
    order: 1;
  }

  .product-information__media {
    order: 0;
    width: 0;
    min-width: 100%;
  }

  /* Mobile styles */
  @media screen and (width < 750px) {
    .product-information__media {
      grid-column: 1 / -1;
    }
    .product-details {
      grid-column: 2 / 3;
    }
  }

  /* Desktop styles */
  @media screen and (width >= 750px) {
    .product-information__grid {
      grid-column: 2;
    }

    /* Position when there is no media */
    .product-information__grid.product-information--media-none,
    .product-information__grid:has(.product-information__media:empty) {
      .product-details {
        width: var(--narrow-content-width);
        margin: 0 auto;
      }
    }

    /* Position when there is media */
    .product-information__grid:not(:has(.product-information__media:empty)) {
      /* Media on the left side */
      &.product-information--media-left {
        grid-template-columns: 1fr min(50vw, var(--sidebar-width));

        .product-information__media {
          padding-right: calc(var(--gap, 0) / 2);
        }
        .product-details {
          padding-left: calc(var(--gap, 0) / 2);
        }

        &:has(.media-gallery--extend) {
          grid-column: 1 / 3;
        }
      }

      /* Media on the right side */
      &.product-information--media-right {
        grid-template-columns: min(50vw, var(--sidebar-width)) 1fr;

        .product-information__media {
          padding-left: calc(var(--gap, 0) / 2);
          order: 1;
        }
        .product-details {
          padding-right: calc(var(--gap, 0) / 2);
          order: 0;
        }

        &:has(.media-gallery--extend) {
          grid-column: 2 / -1;
        }
      }

      /* Equal width columns */
      &.product-information__grid--half,
      &.product-information__grid--half:has(.media-gallery--extend) {
        grid-column: 1 / -1;
        grid-template-columns:
          var(--full-page-grid-margin) calc(var(--full-page-grid-central-column-width) / 2) calc(
            var(--full-page-grid-central-column-width) / 2
          )
          var(--full-page-grid-margin);

        &.product-information--media-left {
          .product-information__media {
            grid-column: 2 / 3;
            &:has(.media-gallery--extend) {
              grid-column: 1 / 3;
            }
          }
          .product-details {
            grid-column: 3 / 4;
          }
        }

        &.product-information--media-right {
          .product-information__media {
            grid-column: 3 / 4;
            &:has(.media-gallery--extend) {
              grid-column: 3 / -1;
            }
          }
          .product-details {
            grid-column: 2 / 3;
          }
        }
      }
    }

    /* Handle full width section */
    .section--full-width {
      .product-information__grid:not(:has(.product-information__media:empty)),
      .product-information__grid:not(:has(.product-information__media:empty)) {
        &.product-information--media-left,
        &.product-information--media-right {
          grid-column: 1 / -1;
        }

        &.product-information--media-left .product-details {
          padding-inline-end: var(--padding-lg);
        }
        &.product-information--media-right .product-details {
          padding-inline-start: var(--padding-lg);
        }

        &.product-information__grid--half.product-information--media-left {
          .product-information__media {
            grid-column: 1 / 3;
          }
          .product-details {
            grid-column: 3 / -1;
          }
        }
        &.product-information__grid--half.product-information--media-right {
          .product-information__media {
            grid-column: 3 / -1;
          }
          .product-details {
            grid-column: 1 / 3;
          }
        }
      }
    }
  }

  .product-information__grid--limit-details .product-details > .group-block {
    max-width: var(--sidebar-width);
  }

  /* If the header is sticky, make product details content stick underneath the header */
  body:has(#header-group #header-component[data-sticky-state='active']) .product-details.sticky-content--desktop {
    --sticky-header-offset: var(--header-height);
  }