/* Skrupt Carousel 2.2 — compatibility with the existing Vapovor theme. */
.skrupt-carousel:not(#skrupt-carousel-1) .skrupt-carousel__item > .product {
  width: 100%;
  max-width: none;
  min-width: 0;
  padding: 0;
}

.skrupt-carousel:not(#skrupt-carousel-1) .product-miniature .thumbnail-container {
  margin-bottom: 0;
}

body.page-index .page-home > .home-list:has(.skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"]) {
  order: 20;
}

body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] {
  margin: 0;
}

body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] .skrupt-carousel__header {
  align-items: flex-end;
  gap: 24px;
  margin: 0 0 24px;
}

body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] .skrupt-carousel__track {
  gap: 16px 24px;
}

body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] .skrupt-carousel__view-all {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--vhome-ink);
  font-size: 14px;
  font-weight: 600;
  height: auto;
  margin: 0 0 4px auto;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 767.98px) {
  body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] {
    margin-top: 0;
  }
  body.page-index .page-home .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-hook-name="arHomePageHook1"] .skrupt-carousel__track {
    gap: 12px;
  }
}

/* Preserve source-group order for the migrated home sections. */
body.page-index .page-home .home-list:has(.skrupt-carousel[data-skrupt-hook-name="arHomePageHook1"]) > .col-sm-12 {
  display: grid;
  gap: 64px;
  padding-top: 64px;
}

body.page-index .page-home #skrupt-carousel-3 { order: 1; }
body.page-index .page-home #skrupt-carousel-5 { order: 2; }
body.page-index .page-home #skrupt-carousel-2 { order: 3; }
body.page-index .page-home #skrupt-carousel-4 { order: 4; }
body.page-index .page-home #skrupt-carousel-6 { order: 5; }

@media (max-width: 767.98px) {
  body.page-index .page-home .home-list:has(.skrupt-carousel[data-skrupt-hook-name="arHomePageHook1"]) > .col-sm-12 {
    gap: 32px;
    padding-top: 32px;
  }
}

/* In the two leading home sections, products after the first four stay compact. */
body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .thumbnail-container {
  flex-direction: row;
  align-items: stretch;
  min-height: 0;
  padding: 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .thumbnail-top {
  flex: 0 0 76px;
  width: 76px;
  max-width: 76px;
  height: 76px;
  padding: 4px;
  aspect-ratio: 1;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-data {
  flex: 1 1 0;
  width: auto;
  padding: 12px 12px 12px 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-title a {
  font-size: 14px;
  line-height: 20px;
}

@media (max-width: 767.98px) {
  body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .thumbnail-container { flex-direction: column; }
  body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .thumbnail-top {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 12px;
  }
  body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-data { flex: 0 0 auto; width: 100%; padding: 12px; }
  body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-title a { font-size: 16px; line-height: 24px; }
}

/* Compact home structures retain priority over the interface stylesheet. */

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-data {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  align-items: start;
  min-width: 0;
  gap: 6px;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-data > * {
  grid-column: 1 / -1;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 6px 0 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-footer > .product-price-and-shipping {
  flex: 1 0 100%;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-tools {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  gap: 6px;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-tools .product-card-link {
  flex: 0 0 44px;
  width: 44px;
  min-width: 44px;
  max-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-purchase {
  flex: 0 1 auto;
  width: auto;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

body.page-index #wrapper #main .page-home :is(#skrupt-carousel-3, #skrupt-carousel-5) .skrupt-carousel__track > .skrupt-carousel__item:nth-child(n+5) .product-card-add {
  width: auto;
  min-width: 44px;
  max-width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  gap: 8px;
}

/* Dedicated accessories list: native prices, compact rows, no product-card extras. */
body#product #wrapper #main .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-grid][data-skrupt-hook-name="arProductPageHook1"] {
  --skrupt-compact-surface: var(--vvp-product-surface, #fff);
  --skrupt-compact-radius: var(--vvp-ds-radius-panel, 12px);
  --skrupt-compact-ink: var(--vvp-product-ink, #263b63);
  --skrupt-compact-price: var(--vvp-product-ink, #252527);
  --skrupt-compact-muted: var(--vvp-product-muted, #667085);
  --skrupt-compact-action: #263b63;
  --skrupt-compact-action-hover: #172845;
}

body#product #wrapper #main .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-grid][data-skrupt-hook-name="arProductPageHook1"] .skrupt-carousel__title {
  color: var(--vvp-product-ink);
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -.3px;
  text-transform: none;
}

body#product #wrapper #main .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-grid][data-skrupt-hook-name="arProductPageHook1"] .skrupt-compact-product__unit :is(p, div) {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}

body#product #wrapper #main .skrupt-carousel:not(#skrupt-carousel-1)[data-skrupt-grid][data-skrupt-hook-name="arProductPageHook1"] .skrupt-carousel__more-toggle {
  color: #263b63;
  background: var(--vvp-product-surface);
  border-color: var(--vvp-product-line);
  border-radius: 12px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
