/* ==========================================================================
   Store box (vendor carousel widgets in olverin-core/elementor/widgets/
   *-vendor-carousel.php and *-vendor-carousel2.php)
   Authored by Olverin Ventures for the OlverinEcom theme. Not present on the
   demo pages (no multivendor plugin), so sizes are inferred from the markup
   and kept consistent with the product cards (15px gap, 2px radius, tokens).
   ========================================================================== */
.klb-storebox {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  border: 1px solid var(--olv-border);
  border-radius: var(--olv-radius);
  background-color: var(--olv-white);
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.klb-storebox:hover {
  border-color: transparent;
  box-shadow: var(--olv-shadow-md);
}
.klb-storebox > a {
  color: inherit;
}

/* Vendor identity */
.klb-storebox .store-detail {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.klb-storebox .store-avatar {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  overflow: hidden;
  border-radius: 50%;
  background-color: var(--olv-bg-gray);
}
.klb-storebox .store-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.klb-storebox .store-info {
  min-width: 0;
  flex: 1 1 auto;
}
.klb-storebox .store-name {
  overflow: hidden;
  font-family: var(--olv-font-heading);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: var(--olv-heading-tracking);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.klb-storebox .store-caption {
  display: inline-block;
  margin-top: 4px;
  padding: 2px 6px;
  border-radius: 3px;
  background-color: var(--olv-primary-soft);
  color: var(--olv-primary);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.4;
  text-transform: uppercase;
}
.klb-storebox .store-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.4;
}
.klb-storebox .store-rating i {
  color: var(--olv-star);
  font-size: 14px;
}
.klb-storebox .store-rating p {
  margin: 0;
  opacity: 0.7;
}
.klb-storebox .store-rating strong {
  color: var(--olv-text);
  opacity: 1;
}

/* Product thumbnails: one large column plus two stacked small ones */
.klb-storebox .store-products {
  display: flex;
  gap: 10px;
  margin-top: auto;
}
.klb-storebox .store-products .column {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 0;
  min-width: 0;
}
.klb-storebox .store-products .column:first-child { flex: 1.4 1 0; }
.klb-storebox .store-products .child-column { flex: 1 1 0; }
.klb-storebox .product-item {
  position: relative;
  overflow: hidden;
  border-radius: var(--olv-radius);
  background-color: var(--olv-bg-gray);
}
.klb-storebox .product-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.klb-storebox .product-price {
  position: absolute;
  left: 8px;
  bottom: 8px;
  padding: 3px 7px;
  border-radius: 3px;
  background-color: var(--olv-white);
  box-shadow: var(--olv-shadow-sm);
}
.klb-storebox .product-price .price {
  gap: 4px;
  font-size: 12px;
}
.klb-storebox .product-price .price del { font-size: 11px; }

/* Style variants passed by the widget ($carouselstyle / style-3) */
.klb-storebox.style-2 { padding: 0; border: 0; }
.klb-storebox.style-2 .store-detail { padding: 0 0 12px; }
.klb-storebox.style-3 {
  border-radius: var(--olv-radius-form);
  background-color: var(--olv-bg-gray);
  border-color: transparent;
}
.klb-storebox.style-3 .store-avatar { border-radius: var(--olv-radius-form); }
.klb-storebox.style-3 .product-item { background-color: var(--olv-white); }

/* Carousel wrapper (slick) */
.klb-vendor-carousel .slider-item { height: auto; padding: 0 7.5px; }
.klb-vendor-carousel .slick-track { display: flex; }
.klb-vendor-carousel .slick-slide { height: auto; }
.klb-vendor-carousel .slick-slide > div { height: 100%; }
@media (max-width: 575.98px) {
  .klb-storebox { padding: 15px; }
  .klb-storebox .store-avatar { flex-basis: 48px; width: 48px; height: 48px; }
  .klb-storebox .store-name { font-size: 16px; }
}
