/*LP Product Repeater*/
.lp-repeater-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0px;
}
.lp-repeater-row {
    display: flex;
    justify-content: center;
}
.lp-repeater-wrapper .lp-repeater {
    display: flex;
    flex-direction: row;
    gap: 60px;
    align-items: center;
	width: 100%;
	max-width: 1280px;
}

.lp-repeater-wrapper .lp-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.lp-repeater-wrapper .lp-content-wrapper h3 {
  color: var(--e-global-color-secondary);
  font-weight: 600;
}
.lp-repeater-wrapper .lp-repeater-image, .lp-repeater-wrapper .lp-content-wrapper {
    width: 100%;
}
.lp-content-wrapper .custom-divider {
  color: var(--e-global-color-accent);
}

.lp-repeater-row img {
    aspect-ratio: 1/1 !important;
    object-fit: cover;
}

@media(max-width: 1024px){
  .lp-repeater-row img {
      aspect-ratio: 3/2 !important;
      object-fit: cover;
  }
}

.lp-repeater-wrapper .lp-content-wrapper .lp-content ul {
    list-style: none; /* Remove default bullets */
    padding-left: 0; /* Optional: Remove default padding */
    margin: 0;
}

.lp-repeater-wrapper .lp-content-wrapper .lp-content ul  li {
    position: relative; /* Allows positioning the icon */
    padding-left: 1.5em; /* Add space for the icon */
    margin-bottom: 0.5em;
}
/* Remove the default Font Awesome bullet */
.lp-repeater-wrapper .lp-repeater-row .lp-repeater .lp-content-wrapper .lp-content-wrapper .lp-content ul li::before {
    display: none;
}
/* Base SVG bullet styling */
.lp-repeater-row .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.1em;
    width: 1em;
    height: 1em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.lp-repeater-row.bg-element {
  z-index: 0;
}
.lp-repeater-row.bg-element::before {
    z-index: -5 !important;

}
.lp-repeater-row.bg-element::after {
  z-index: -4!important;
}

/* Product-specific SVG bullets */
.lp-repeater-row.ov-shower .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/04/Bathtub-Icon.svg');
}

.lp-repeater-row.ov-closet .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/06/Home-Storage-Icon.svg');
}

.lp-repeater-row.ov-coating .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/04/Garage-Icon.svg');
}

.lp-repeater-row.ov-door .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/04/Door-Icon-2.svg');
}

.lp-repeater-row.ov-mudroom .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/06/home-storage-icon-2.svg');
}

.lp-repeater-row.ov-kitchen .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/04/Kitchen-Icon.svg');
}

.lp-repeater-row.ov-window .lp-repeater .lp-content-wrapper .lp-content ul li::before {
    background-image: url('/wp-content/uploads/2025/04/Window-Icon.svg');
}

	/* Create the overlay element for even rows */
.lp-repeater-wrapper .lp-repeater-row.bg-element.right::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-100%);
    width: 50vw; /* Adjust as needed */
    height: 90%; /* Adjust as needed */
    opacity: 0.15; /* Subtle overlay */
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    pointer-events: none;
    z-index: -1;
}

@media(max-width: 767px){
  .lp-repeater-row.bg-element::before {
      z-index: -5 !important;
      top: 30% !important;
      height: 30% !important;
  }
  .lp-repeater-row.bg-element::after {
    z-index: -4!important;
    top: 30% !important;
    height: 30% !important;
  }
  .lp-repeater-wrapper .lp-repeater-row.bg-element.right::after {
    z-index: 0;
    width: 90vw;
    height: 50%!important;
  }
}

/* Ensure content stays above the overlay */


.lp-repeater-row, .lp-repeater-row .lp-repeater {
    position: relative;
    z-index: 10;
}

/* Category-specific overlays for even rows */
.lp-repeater-wrapper .lp-repeater-row.bg-element.right.ov-shower::after {
    background-image: url('/wp-content/uploads/2025/03/bathroom-illustration-tb.svg')!important;
}

.lp-repeater-wrapper .lp-repeater-row.bg-element.right.ov-closet::after {
    background-image: url('/wp-content/uploads/2025/04/closet-illustration-tb.svg')!important;
}

.lp-repeater-wrapper .lp-repeater-row.bg-element.right.ov-coating::after {
    background-image: url('/wp-content/uploads/2025/05/coatings-illustration-tb.svg')!important;
}

.lp-repeater-wrapper .lp-repeater-row.bg-element.right.ov-door::after {
    background-image: url('/wp-content/uploads/2025/04/door-illustration-tb.svg')!important;
}

.lp-repeater-row.bg-element.right.ov-mudroom::after {
    background-image: url('/wp-content/uploads/2025/04/mudroom-illustration-tb.svg')!important;
}

.lp-repeater-row.bg-element.right.ov-kitchen::after {
    background-image: url('/wp-content/uploads/2025/04/kitchen-illustration-tb.svg')!important;
}

.lp-repeater-row.bg-element.right.ov-window::after {
    background-image: url('/wp-content/uploads/2025/02/window-illustration-tb.svg')!important;
}

/* Responsive updates */
@media(min-width: 1025px){
  .lp-repeater-wrapper .lp-repeater-row:nth-child(even) .lp-repeater {
    flex-direction: row-reverse;
  }
}

@media(max-width: 1024px){
  .lp-repeater-wrapper .lp-repeater-row .lp-repeater {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 30px;
  }
  .lp-repeater-wrapper {
      display: flex;
      gap: 0px;
  }
  .lp-repeater-wrapper .lp-content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
}

@media(max-width: 767px){
  .lp-repeater-wrapper .lp-repeater-row .lp-repeater {
      display: flex;
      flex-direction: column;
      gap: 20px;
      align-items: center;
  }
  .lp-repeater-wrapper {
      display: flex;
      gap: 0px;
  }

}

/*LP Icon Repeater*/

.icon-block-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Always 3 columns */
    gap: 2rem; /* Space between grid items */
    justify-content: center; /* Center-align rows if items don't fill the last row */
    align-items: stretch; /* Ensure all items have the same height */
}

.icon-block-wrapper .icon-block {
    display: flex;
    flex-direction: column; /* Stack icon and text vertically */
    align-items: center; /* Center align content inside each block */
    justify-content: center; /* Vertically center content */
    text-align: center;
    height: 100%; /* Ensure all items have the same height */
}

.icon-block-wrapper p.icon-content {
  margin-top: 12px;
  font-weight: 600;
}

.icon-block-wrapper .icon {
    display: inline-flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    align-items: center;
    margin: 0 auto 0.5rem; /* Center and add spacing */
}

.icon-block-wrapper .icon svg, .icon-block-wrapper .icon i {
    max-width: 3rem;
    max-height: 3rem;
    width: auto;
    height: auto;
    fill: var(--e-global-color-accent); /* Makes SVG inherit the text color */
}

.icon-block-wrapper .icon i {
    font-size: 3rem; /* Ensure FontAwesome icons match SVG sizing */
    color: var(--e-global-color-accent);
}

@media (min-width: 768px) {
    .icon-block-wrapper {
        gap: 2rem; /* Increase spacing on larger screens */
    }
}

/* Service Repeater */
.service-repeater {
  display: flex;
  flex-direction: column;
}

.service-repeater .repeater-item:not(:has(.repeater-content)) {
  margin-bottom: 1.2em;
}
.service-repeater img {
    max-width: 450px!important;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    margin-bottom: var(--spacing-24);
}

.service-repeater .repeater-content {
  margin-top: var(--spacing-16);
}

.service-repeater .custom-divider {
  color: var(--e-global-color-397ad69);
}

/* Constrain and left-align the BA carousel */
.service-repeater .ba-wrapper {
  max-width: 450px;
  margin: 0;
}

/* Carousel fills the wrapper width */
.service-repeater .ba-wrapper .ba-carousel {
  width: 450px;
	padding-bottom: unset!important;
	margin-bottom: var(--spacing-24);
}

/* Remove Slick’s default gradient fades */
.service-repeater .ba-carousel.slick-carousel::before,
.service-repeater .ba-carousel.slick-carousel::after {
  background: none;
}

/* Keep the BA viewport responsive with a fixed ratio */
.service-repeater .ba-carousel .ba-container {
  width: 450px;
  aspect-ratio: 3 / 2;
  position: relative;
  background-size: cover;
  background-position: center;
}

/* Let slides/track auto-size in height */
.service-repeater .ba-carousel .slick-list { height: auto !important; }
.service-repeater .ba-carousel .slick-track,
.service-repeater .ba-carousel .slick-slide { height: auto; }

@media(max-width: 767px){
	.service-repeater img {
    max-width: 100%!important;
		width: 100%!important;
}
}

/* Global Row Styling */
.location-repeater .global-row {
    display: flex;
}

.location-repeater .global-row a {
  text-decoration: underline;
  text-underline-offset: 2px;
}


.location-repeater .global-row-inner {
    max-width: 1280px; /* Default site content width; adjustable */
    margin: 0 auto;
    display: flex;
    gap: 60px;
      flex-direction: row;
}

.location-repeater .global-row .repeater-img img {
    aspect-ratio: 3/2 !important;
    object-fit: cover;
}

.lp-repeater .global-row .lp-repeater-img img {
    aspect-ratio: 1/1 !important;
    object-fit: cover;
}

.location-repeater .global-row .repeater-img, .global-row .repeater-wrapper {
  width: 100%;
}

.location-repeater .global-row .repeater-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.location-repeater .global-row .repeater-wrapper .repeater-content {
  margin-top: 8px;
}
.location-repeater .repeater-wrapper .repeater-heading h2 {
  margin-bottom: 0px!important;
}
/* Alternating Rows (Desktop) */
@media (min-width: 1025px) {
   .location-repeater .global-row:nth-child(even) .global-row-inner {
        flex-direction: row-reverse !important;
    }

    .location-repeater .global-row .repeater-img img {
      aspect-ratio: unset!important;
      height: 100%!important;
    }
}

/* Responsive Gaps */
@media (max-width: 1024px) {
    .location-repeater .global-row .global-row-inner {
        gap: 30px;
        flex-direction: column;
    }

    .location-repeater .global-row .repeater-wrapper {
      gap: 12px;
    }
    .location-repeater .global-row .repeater-wrapper .repeater-content {
      margin-top: 8px;
    }
    .location-repeater .global-row .repeater-img img {
        aspect-ratio: 3/2 !important;
        object-fit: cover;
    }
}

@media (max-width: 767px) {
    .location-repeater .global-row .global-row-inner{
        gap: 20px;
    }
    .location-repeater .global-row .repeater-wrapper {
      gap: 8px;
    }
    .location-repeater .global-row .repeater-wrapper .repeater-content {
      margin-top: 8px;
    }
}

/* Dynamic Style Classes */
.style-light {
    background: var(--e-global-color-0e0f0be);
}

.style-tb {
    background: var(--e-global-color-accent);
}

.style-rb {
    background: var(--e-global-color-secondary);
}

.style-o {
    background: var(--e-global-color-90a6ef8);
}

/* Repeater Icon Styling */
.location-repeater .repeater-wrapper .repeater-icon i {
    font-size: 36px;
    padding: 18px;
    border-radius: 100%;
}

@media (max-width: 1024px) {
    .location-repeater .repeater-wrapper .repeater-icon i {
        font-size: 30px !important;
        padding: 14px !important;
    }
}

@media (max-width: 767px) {
  .location-repeater   .repeater-wrapper .repeater-icon i {
        font-size: 24px !important;
        padding: 12px !important;
    }
}


.location-repeater .style-light .repeater-wrapper .repeater-heading h2 {
	color: var(--e-global-color-primary)!important;
}

.location-repeater .style-light .custom-divider {
	color: var(--e-global-color-accent);
}

.location-repeater .style-light .repeater-wrapper a {
  color: var(--e-global-color-primary);
}

.location-repeater .style-tb .custom-divider, .style-o .custom-divider {
	color: var(--e-global-color-secondary);
}

.location-repeater .style-light .repeater-wrapper a {
  color: var(--e-global-color-primary);
}

.location-repeater .style-rb .custom-divider {
	color: var(--e-global-color-397ad69);
}

.location-repeater .style-rb h3 {
color: var(--e-global-color-397ad69);
}

.location-repeater .style-tb h3,  .location-repeater .style-o h3{
  color: var(--e-global-color-secondary);
}

.location-repeater .style-tb .repeater-wrapper a {
  color: var(--e-global-color-0e0f0be);
}
.location-repeater .style-tb .repeater-wrapper a:hover {
  color: white;
}

.location-repeater .style-rb .repeater-wrapper a {
  color: var(--e-global-color-accent);
}

.location-repeater .style-rb .repeater-wrapper a:hover {
  color: var(--e-global-color-397ad69);
}

.location-repeater .style-o .repeater-wrapper a {
  color: white;
}

.location-repeater .style-o .repeater-wrapper a:hover {
  color: var(--e-global-color-0e0f0be);
}



.location-repeater	.style-light .repeater-wrapper .repeater-icon i {
		color: white!important;
		background-color: var(--e-global-color-accent)!important;
	}

.location-repeater	.style-tb .repeater-wrapper .repeater-icon i {
		color: white!important;
		background-color: var(--e-global-color-secondary)!important;
	}

.location-repeater	.style-rb .repeater-wrapper .repeater-icon i, .location-repeater	.style-o .repeater-wrapper .repeater-icon i  {
		color: var(--e-global-color-secondary)!important;
		background-color: white!important;
	}

.location-repeater .repeater-wrapper .repeater-heading h2, .repeater-wrapper .repeater-content {
	color: white!important;
}

.style-light .repeater-content {
	color: unset!important;
}

.repeater-wrapper .btn a {
	margin-top: 1em;
	gap: 14px
}

.location-repeater .repeater-wrapper .repeater-icon i {
	font-size: 36px;
	padding: 18px;
	border-radius: 100%;
}

/* Alternating Rows (Desktop) */
@media (min-width: 1025px) {
  .location-repeater .global-row:nth-child(even) {
        flex-direction: row-reverse !important;
    }
}

@media(max-width: 1024px){
	.location-repeater .repeater-wrapper .repeater-icon i {
	font-size: 36px!important;
	padding: 18px!important;;

}

	@media(max-width: 767px){
	.location-repeater .repeater-wrapper .repeater-icon i {
	font-size: 24px!important;
	padding: 12px!important;

}
}

/* Fixed Background Overlay */
.location-repeater .global-row.logo-overlay-o::before {
  content: "";
  position: absolute; /* Allows the fixed scrolling effect */
  top: 0;
  left: 0;
  background-image: url('/wp-content/uploads/2024/12/logo-overlay-o.svg');
  background-repeat: no-repeat;
	background-attachment: scroll;
  background-size: 60vw;
  background-position: center left; /* Default centered alignment */
  opacity: 1; /* Apply opacity to the overlay only */
  pointer-events: none; /* Prevents interactions */
  z-index: 0;
}

.location-repeater .global-row.logo-overlay-tb::before {
  content: "";
  position: absolute; /* Allows the fixed scrolling effect */
  top: 0;
  left: 0;
  background-image: url('/wp-content/uploads/2024/12/logo-overlay-tb.svg');
  background-repeat: no-repeat;
	background-attachment: scroll;
  background-size: 60vw;
  background-position: center left; /* Default centered alignment */
  opacity: 1; /* Apply opacity to the overlay only */
  pointer-events: none; /* Prevents interactions */
  z-index: 0;
}

.location-repeater .global-row.logo-overlay-db::before {
  content: "";
  position: absolute; /* Allows the fixed scrolling effect */
  top: 0;
  left: 0;
  background-image: url('/wp-content/uploads/2024/12/logo-overlay-db.svg');
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: 60vw;
  background-position: center left; /* Default centered alignment */
  opacity: 1; /* Apply opacity to the overlay only */
  pointer-events: none; /* Prevents interactions */
  z-index: 0;
}

@media (min-width: 1025px) {
    .location-repeater .global-row:nth-child(even) .logo-overlay-db::before,
    .location-repeater .global-row:nth-child(even) .logo-overlay-tb::before,
    .location-repeater .global-row:nth-child(even) .logo-overlay-o::before {
        background-position: center right;
    }
}
