
/* Beverly Hills Roofing banner slider fix: Banner 1-6 JS slider + white readable overlay text */
.aa-banner-js-slider,
.aa-banner-js-slider .u-carousel-inner {
  position: relative !important;
  overflow: hidden !important;
}

.aa-banner-js-slider .u-carousel-item {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.aa-banner-js-slider .u-carousel-item.u-active {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.aa-banner-js-slider .u-sheet {
  min-height: 420px !important;
}

.aa-banner-js-slider h1,
.aa-banner-js-slider h2,
.aa-banner-js-slider h3,
.aa-banner-js-slider h4,
.aa-banner-js-slider p,
.aa-banner-js-slider span,
.aa-banner-js-slider .u-title,
.aa-banner-js-slider .u-text,
.aa-banner-js-slider a:not(.u-btn),
.aa-banner-js-slider .u-btn {
  color:#ffffff !important;
  text-shadow:0 3px 12px rgba(0,0,0,0.72) !important;
}

.aa-banner-js-slider .u-carousel-indicators {
  z-index: 20 !important;
}

.aa-banner-js-slider .u-carousel-indicators li {
  cursor: pointer !important;
  border:2px solid #ffffff !important;
  background-color:rgba(255,255,255,0.55) !important;
}

.aa-banner-js-slider .u-carousel-indicators li.u-active {
  background-color:#E8404E !important;
  border-color:#ffffff !important;
}

.aa-banner-js-slider .u-carousel-control {
  z-index: 20 !important;
}

@media (max-width: 767px) {
  .aa-banner-js-slider .u-sheet {
    min-height: 360px !important;
  }

  .aa-banner-js-slider h1,
  .aa-banner-js-slider .u-title {
    font-size: 1.8rem !important;
    line-height: 1.18 !important;
  }

  .aa-banner-js-slider .u-btn {
    font-size: 0.95rem !important;
    white-space: normal !important;
  }
}



/* Final instant quote cleanup */
.aa-banner-js-slider,
.aa-banner-js-slider *,
.aa-banner-js-slider h1,
.aa-banner-js-slider h2,
.aa-banner-js-slider h3,
.aa-banner-js-slider h4,
.aa-banner-js-slider p,
.aa-banner-js-slider span,
.aa-banner-js-slider a,
.aa-banner-js-slider .u-text,
.aa-banner-js-slider .u-title,
.aa-banner-js-slider [class*="u-text"] {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:0 3px 12px rgba(0,0,0,0.75) !important;
}

/* Fade in/out slider behavior */
.aa-banner-js-slider,
.aa-banner-js-slider .u-carousel-inner {
  position: relative !important;
  overflow: hidden !important;
  min-height: 420px !important;
}

.aa-banner-js-slider .u-carousel-item {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  min-height: 420px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transition: opacity 900ms ease-in-out, visibility 900ms ease-in-out !important;
}

.aa-banner-js-slider .u-carousel-item.u-active {
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 2 !important;
  pointer-events: auto !important;
}

.aa-banner-js-slider .u-sheet {
  min-height: 420px !important;
  position: relative !important;
  z-index: 3 !important;
}

/* Instant Quote: What Will My Roof Cost? must be red */
.aa-roof-tool-title,
.what-will-my-roof-cost,
.what-would-my-roof-cost,
#instant-quote-tool h1,
#instant-quote-tool h2,
#instant-quote-tool h3,
#roof-estimate-tool h1,
#roof-estimate-tool h2,
#roof-estimate-tool h3 {
  color:#D01A28 !important;
  -webkit-text-fill-color:#D01A28 !important;
}

/* Hide the duplicate blue progress text: Name / Phone / Address / Estimate */
.instant-quote-progress,
.roof-progress-labels,
.roof-tool-progress-labels,
.aa-step-labels,
.step-labels,
.progress-words,
.progress-labels {
  display: none !important;
}

/* Hide browser/Google suggestion dropdowns if any old autocomplete code exists */
.pac-container,
.address-suggestions,
.autocomplete-suggestions,
.suggestions,
.datalist-suggestions {
  display: none !important;
  visibility: hidden !important;
}

/* Keep mobile banner readable */
@media (max-width: 767px) {
  .aa-banner-js-slider,
  .aa-banner-js-slider .u-carousel-inner,
  .aa-banner-js-slider .u-carousel-item,
  .aa-banner-js-slider .u-sheet {
    min-height: 360px !important;
  }
}
