/**
 * Public-facing styles for the plugin.
 *
 * @package    Indacloud_PDP_Commerce
 */
/* The per-feature mount point (Registry::wrap()) the switcher swaps a region
   into. display: contents so it adds no box: the region lays out exactly as
   if the wrapper were not there. */
.indacloud-pdp-feature {
  display: contents;
}
/* .icon-extreme / .icon-high (and extreme.svg, high.svg) moved to the theme —
   see shortcodes/wc-product-gallery-slider.php. The theme renders the strength
   pill that uses them, so it owns the styling and the art. */
.icon-truck {
  background-image: url("../img/truck.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-us-flag {
  background-image: url("../img/us-flag.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-shield {
  background-image: url("../img/shield.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-microscope {
  background-image: url("../img/microscope.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-money {
  background-image: url("../img/money.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-candy {
  background-image: url("../img/candy.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-plant {
  background-image: url("../img/plant.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-scale {
  background-image: url("../img/scale.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.icon-trofee {
  background-image: url("../img/trofee.svg");
  width: 18px;
  height: 18px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

body.single-product .custom-product-headlines .headline-1 {
  max-height: fit-content !important;
  margin: 0;
}

body.single-product .custom-product-headlines .headline-1 img {
  display: none !important;
}

/* a.pt-reviews moved to the theme — see shortcodes/product-tags.php. */

body.single-product
  .e-atc-qty-button-holder
  .single_add_to_cart_button[disabled] {
  background-color: #f3cb41 !important;
  color: #000 !important;
  cursor: not-allowed !important;
}

body.single-product .acf-product-details-wrapper .product-details-list {
  padding-left: 0px;
}

body.single-product .acf-product-details-wrapper .product-details-list li {
  padding-left: 5px;
}

body.single-product
  .acf-product-details-wrapper
  .product-details-list
  li::before {
  content: "";
  background-image: url(../img/green-filled-check.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 6px;
  height: 6px;
  left: -15px;
  top: 45%;
}

body.single-product .e-atc-qty-button-holder .quantity {
  display: none !important;
}

body button.sticky_add_to_cart_button,
body.single-product .e-atc-qty-button-holder .single_add_to_cart_button {
  background-color: #f9ad32 !important;
}

body.single-product .sticky-atc-wrap {
  position: fixed;
  display: flex;
  width: 100%;
  z-index: 999;
  padding: 16px;
  background-color: #fff;
  bottom: env(safe-area-inset-bottom, 0px);
  box-sizing: border-box;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  visibility: hidden;
  opacity: 0;
  transition: 0.2s;
}

body.single-product .sticky-atc-wrap.visible {
  visibility: visible;
  opacity: 1;
}

body.single-product .sticky-atc-wrap .content {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.single-product .sticky-atc-wrap .content .thumb {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
}

body.single-product .sticky-atc-wrap .content .thumb img {
  width: 60px;
  height: 60px;
}

body.single-product .sticky-atc-wrap .content .title h6 {
  margin: 0;
  font-weight: bold;
  font-size: 18px;
}

body.single-product .sticky-atc-wrap .content .title .price {
  display: block !important;
  margin-left: 0px !important;
  font-weight: 600;
}

body.single-product .sticky-atc-wrap button.sticky_add_to_cart_button {
  transition: 0.2s;
  width: auto;
  /* Keeps the button a stable size across its different labels ("Add to
     Cart", "Subscribe & Save - $45.00", "Out of Stock") — without this,
     `width: auto` lets it visibly shrink to hug whichever is shortest. */
  min-width: 180px;
  border: none;
  border-radius: 100px;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--nd-theme-dark) !important;
  background-color: #f9ad32 !important;
  text-transform: uppercase;
  padding: 15px 25px;
  height: auto;
}

body.single-product
  .sticky-atc-wrap
  button.sticky_add_to_cart_button.button:hover {
  opacity: 0.8;
}

/* Out-of-stock state, set via `disabled` by changeAddToCartButtonLabel()
   (lps-pricing.js). Same opacity/cursor treatment the main ATC region's own
   "Out of Stock" button already uses. */
body.single-product
  .sticky-atc-wrap
  button.sticky_add_to_cart_button:disabled {
  opacity: 0.8;
  cursor: not-allowed;
}

.indacloud-linked-product-switcher {
  border: 1px solid #ddd;
  padding: 25px;
  border-radius: 25px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-family: "Montserrat";
  background-color: #fff;
}
.indacloud-linked-product-switcher .indacloud-attribute-wrapper {
  font-family: "Montserrat";
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-attribute-label {
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 8px;
  color: var(--nd-theme-dark);
  position: relative;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-attribute-label::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #ddd;
  left: 0;
  top: 12px;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-attribute-label
  span {
  position: relative;
  z-index: 1;
  background-color: #fff;
  display: inline-block;
  padding: 0 10px;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown {
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu {
  font-weight: 500;
  display: flex;
  gap: 10px;
  overflow-x: scroll;
  scroll-behavior: smooth !important;
  padding: 10px 0 20px;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item {
  cursor: pointer;
  position: relative;
  flex: 0 0 130px;
  /* Room for the active-item check badge, which overhangs the pill by ~5px.
     Without it the last pill's badge widens the scrollable track. */
  margin-right: 5px;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper.first-attribute
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.no-image {
  /* Equal share of the row, at every width -- no per-breakpoint values. */
  flex: 1 1 0;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.out-of-stock {
  opacity: 0.5;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.no-image {
  border: 1px solid #ddd;
  padding: 10px;
  border-radius: 10px;
  background-color: #fdf5e4;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.no-image
  .strength-unit {
  font-size: 11px;
  font-weight: normal;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item
  img {
  border: 1px solid #ddd;
  border-radius: 20px;
  padding: 10px;
  background-color: #fdf5e4;
  width: 100%;
  object-fit: contain;
  aspect-ratio: 1 / 1;
  pointer-events: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item
  svg {
  width: 25px;
  height: 25px;
  position: absolute;
  top: -5px;
  right: -5px;
  background-color: #fff;
  border-radius: 50px;
  display: none;
  pointer-events: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item
  span {
  font-size: 12px;
  line-height: 1.4;
  display: inline-block;
  font-weight: 500;
  pointer-events: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item
  .term-badge {
  font-size: 10px;
  font-weight: bold;
  background-color: #ffcb57;
  padding: 2px 8px;
  border-radius: 100px;
  position: absolute;
  top: -9px;
  left: 50%;
  text-transform: uppercase;
  transform: translate(-50%, 0%);
  overflow: hidden;
  text-overflow: ellipsis;
  width: max-content;
  pointer-events: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.no-image.active {
  border: 1px solid #000;
  background-color: #e9f3f8;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.active
  img {
  border: 1px solid #000;
  background-color: #e9f3f8;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.active
  svg {
  display: block;
  pointer-events: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item.active
  span {
  font-weight: bold;
}

.acf-product-details-wrapper .indacloud-product-details-wrapper {
  text-align: left;
}

.acf-product-details-wrapper
  .indacloud-product-details-wrapper
  .indacloud-product-details-content {
  display: flex;
  font-size: 14px;
  font-family: "Montserrat";
  font-weight: 500;
  line-height: 26px;
  flex-direction: column;
  align-items: start;
  justify-content: center;
}

.acf-product-details-wrapper
  .indacloud-product-details-wrapper
  .indacloud-product-details-toggle-btn {
  font-family: "Montserrat";
  font-weight: bolder;
  flex-direction: column;
  font-size: 14px;
  text-transform: capitalize;
  border: none;
  background: none;
  padding: 0px;
  color: var(--nd-theme-dark);
  display: inline-flex;
  border-bottom: 2px solid var(--nd-theme-dark);
  border-radius: 0;
}

/**
* Autoship option styles
*/

/* ===== CUSTOM SLIDER FUNCTIONALITY (5-20-2026) ===== */

/* Further CSS for Handeling scrollbar on iOS devices (6-12-2026) */

.ios-device .indacloud-custom-slider + .custom-scrollbar-track {
  background: #e5e5e5;
}

/* ends (6-12-2026) */

.indacloud-custom-slider {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
.indacloud-custom-slider::-webkit-scrollbar {
  height: 8px;
}
.indacloud-custom-slider::-webkit-scrollbar-thumb {
  background: var(--nd-scrollbar-thumb);
  border-radius: 100px;
}
.indacloud-custom-slider::-webkit-scrollbar-track {
  background: #e5e5e5;
  border-radius: 0px;
}
.indacloud-custom-slider::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}
.indacloud-custom-slider-nav {
  background: none !important;
  border: none;
  padding: 0;
  cursor: pointer;
  line-height: 0;
  transition: opacity 0.2s;
}
.indacloud-custom-slider-nav:hover {
  background: none !important;
}
.indacloud-custom-slider-nav img {
  display: block;
}
.indacloud-custom-slider-nav .nav-prev {
  transform: rotate(180deg);
}
.indacloud-slider-nav-bottom {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}
.indacloud-slider-nav-top-right {
  position: absolute;
  top: -40px;
  right: 0;
  display: flex;
  gap: 8px;
}
.indacloud-custom-slider.dragging {
  cursor: grabbing;
}
.indacloud-custom-slider.dragging .slide * {
  pointer-events: none !important;
}
.indacloud-custom-slider .slide img {
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-user-select: none;
  user-select: none;
}

/* .custom-badges-wrapper rules moved to the theme — the theme now renders this
   wrapper directly in shortcodes/wc-product-gallery-slider.php. */

.rank-math-breadcrumb a {
  color: #000 !important;
}

/* Backorder notice target.
 * The ic-woo-backorder plugin server-renders .ic-wb-shipping-notice on every
 * landing, EMPTY when the product is not backordered, so the switcher has an
 * element to fill when the shopper switches to a backordered product (see
 * ProductData backorder_notice_html). The plugin styles the box
 * unconditionally (padding, border, background), so an empty one showed as a
 * bare bar until the first switch hid it. Hide it while it has no content.
 * The switcher's inline display (flex when filled, none when cleared) still
 * wins on a switch, and a filled notice is not :empty. */
.ic-wb-shipping-notice:empty {
  display: none;
}

.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu#pa_strength_slider
  .indacloud-dropdown-item {
  flex: 1 1 0;
}

/* Jahanggir */
.indacloud-linked-product-switcher
  .indacloud-attribute-wrapper
  .indacloud-custom-dropdown
  .indacloud-dropdown-menu
  .indacloud-dropdown-item
  span {
  font-weight: 600;
}
/* a.general-benefit-item.high / .extreme colour variants moved to the theme —
   see shortcodes/wc-product-gallery-slider.php. */

/* End Jahanggir */

@media (max-width: 375px) {
  body.single-product .custom-product-headlines .headline-1 {
    font-size: 24px;
    line-height: 1.2;
  }
  body.single-product .e-atc-qty-button-holder .single_add_to_cart_button {
    font-size: 14px !important;
  }
  body button.sticky_add_to_cart_button {
    font-size: 14px !important;
  }
  .indacloud-linked-product-switcher
    .indacloud-attribute-wrapper
    .indacloud-custom-dropdown
    .indacloud-dropdown-menu
    .indacloud-dropdown-item {
    width: 120px;
  }
  .indacloud-linked-product-switcher
    .indacloud-attribute-wrapper
    .indacloud-custom-dropdown
    .indacloud-dropdown-menu {
    margin-right: 0;
    justify-content: center;
  }
  /* .indacloud-pdp-packs .indacloud-pdp-pack-list {
    margin-right: 0px;
    justify-content: center;
  } */
}

@media (max-width: 320px) {
  .indacloud-linked-product-switcher
    .indacloud-attribute-wrapper
    .indacloud-custom-dropdown
    .indacloud-dropdown-menu
    .indacloud-dropdown-item {
    width: 110px;
  }
}

/* Important sizes */
/* 384,390,414,393,430,360 */