/**
 * Latest-products slider.
 * - When at top of frontpage (#productslider-latest): full-width section, premium "first product" block.
 * - Legacy: .latest-slider-column for in-widget use.
 * Premium dealer tone: soft depth, refined nav, card hover.
 */

/* --- Top-of-page full-width section (first product block) --- */
#productslider-latest.latest-products-top {
  width: 100%;
  max-width: none;
}

.latest-products-top .frontpage-services-latest-slider {
  width: 100%;
  max-width: none;
}

/* Brand (merke) filter: left-aligned dropdown (no pills above slider) */
.latest-products-top .latest-products-brand-filter {
  margin-bottom: 0;
}

.latest-products-brand-trigger {
  min-height: 2.75rem;
  cursor: pointer;
  background-color: transparent;
  border-color: rgba(0, 0, 0, 0.18);
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.latest-products-brand-trigger:focus {
  outline: none;
}

.latest-products-brand-trigger:focus-visible {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--color-primary, #1a1a1a);
}

/* Overlay: click outside closes dropdown */
.latest-products-brand-overlay {
  position: fixed;
  inset: 0;
  z-index: 10;
  background: transparent;
  cursor: default;
}

/* Dropdown panel: below trigger, list of options */
.latest-products-brand-dropdown {
  position: absolute;
  left: 0;
  top: 100%;
  margin-top: 0.25rem;
  min-width: 12rem;
  max-height: 18rem;
  overflow-y: auto;
  z-index: 20;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 0.25rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.latest-products-brand-option {
  display: block;
  width: 100%;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  text-align: left;
  color: #374151;
  background-color: transparent;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease;
}

.latest-products-brand-option:hover {
  background-color: rgba(0, 0, 0, 0.04);
}

.latest-products-brand-option:focus {
  outline: none;
}

.latest-products-brand-option:focus-visible {
  box-shadow: inset 0 0 0 2px var(--color-primary, #1a1a1a);
}

.latest-products-brand-option--active,
.latest-products-brand-option--active:hover {
  color: #fff;
  background-color: var(--color-primary, #1a1a1a);
}

/* Soft depth and gradient edge at bottom so CTA block reads as the section base (legacy column) */
.latest-slider-column {
  box-shadow: inset 0 -24px 32px -14px rgba(0, 0, 0, 0.05);
}

.latest-slider-column::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 0, 0, 0.06) 20%,
    rgba(0, 0, 0, 0.08) 50%,
    rgba(0, 0, 0, 0.06) 80%,
    transparent 100%
  );
  pointer-events: none;
}

/* Refined nav arrows: premium hover */
.frontpage-services-latest-slider [data-productslider="prev"],
.frontpage-services-latest-slider [data-productslider="next"] {
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.frontpage-services-latest-slider [data-productslider="prev"]:hover,
.frontpage-services-latest-slider [data-productslider="next"]:hover {
  background-color: rgba(0, 0, 0, 0.12);
}

.frontpage-services-latest-slider [data-productslider="prev"]:active,
.frontpage-services-latest-slider [data-productslider="next"]:active {
  background-color: rgba(0, 0, 0, 0.18);
}


.frontpage-services-latest-slider .container,
.frontpage-services-latest-slider .w-full {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* Brand filter: must come AFTER the .w-full rule above to win the cascade at equal specificity */
.frontpage-services-latest-slider .latest-products-brand-filter {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

.frontpage-services-latest-slider [data-productslider="productlist"] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* Ensure nav arrows sit above swiper and remain visible */
.frontpage-services-latest-slider [data-productslider="productlist"] [data-productslider="prev"],
.frontpage-services-latest-slider [data-productslider="productlist"] [data-productslider="next"] {
  position: relative;
  z-index: 20;
}

.frontpage-services-latest-slider .angular-productlist {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.frontpage-services-latest-slider .custom-swiper {
  flex: 1;
  min-height: 0;
  height: 100%;
  width: 100%;
}

.frontpage-services-latest-slider .custom-swiper .swiper-wrapper {
  height: 100%;
}

.frontpage-services-latest-slider .custom-swiper .swiper-slide {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}

/* Product card fills slide width and height */
.frontpage-services-latest-slider .swiper-slide .product {
  flex: 1;
  min-height: 0;
  height: 100%;
  width: 100%;
  max-width: 100%;
}

/* Disable card lift/shadow hover from libs.css for this slider */
.frontpage-services-latest-slider .swiper-slide .product:hover {
  box-shadow: none;
  transform: none;
}