/* =========================================================
   Divi Overrides for Safest Places to Live
   =========================================================
   Minimal overrides to make Divi work with our custom CSS.
   Most styling is handled by styles.css.
   ========================================================= */

/* =========================================================
   Reset Divi Theme Defaults
   ========================================================= */

#main-content,
#et-main-area,
.et-l--body,
.et-l--post,
.et_pb_pagebuilder_layout,
.et_full_width_page {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Remove ALL default Divi section padding */
.et_pb_section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.et_pb_section:first-child,
.et_builder_inner_content > .et_pb_section:first-of-type {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.et_pb_gutter.et_pb_gutters3,
.et_pb_gutters3 .et_pb_column {
  padding-top: 0 !important;
}

/* Remove Divi row padding */
.et_pb_row {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* =========================================================
   Full-Width Sections
   ========================================================= */

/* Header section - full-width background with centered content */
.et_pb_section:has(.site-header),
.et_pb_section_0,
.et_pb_section_1 {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  padding: 0 !important;
  background: transparent !important;
}

.et_pb_section:has(.site-header) .et_pb_row,
.et_pb_section_0 .et_pb_row,
.et_pb_section_1 .et_pb_row {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

.et_pb_section:has(.site-header) .et_pb_column,
.et_pb_section_0 .et_pb_column,
.et_pb_section_1 .et_pb_column {
  width: 100% !important;
  max-width: 100% !important;
}

.et_pb_section:has(.site-header) .et_pb_code,
.et_pb_section:has(.site-header) .et_pb_code_inner,
.et_pb_section_0 .et_pb_code,
.et_pb_section_0 .et_pb_code_inner,
.et_pb_section_1 .et_pb_code,
.et_pb_section_1 .et_pb_code_inner {
  width: 100% !important;
  max-width: 100% !important;
}

/* Hero section - seamless connection to header */
.et_pb_section.hero,
.et_pb_section:has(.hero-image-container) {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: #1a2744 !important;
}

.et_pb_section.hero .et_pb_row,
.et_pb_section:has(.hero-image-container) .et_pb_row {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Remove the blue band - it's coming from body or wrapper background */
body,
#page-container,
#main-content,
#et-main-area,
.et-l {
  background: #ffffff !important;
}

/* =========================================================
   Dark Section Text Colors
   ========================================================= */

/* Ensure text in dark sections is readable */
.section-muted,
.section--dark,
.et_pb_section.section-muted,
.et_pb_section.section--dark {
  background: #1c203a !important;
  color: #fff !important;
}

.section-muted h2,
.section-muted h3,
.section--dark h2,
.section--dark h3,
.et_pb_section.section-muted h2,
.et_pb_section.section-muted h3,
.et_pb_section.section--dark h2,
.et_pb_section.section--dark h3 {
  color: #3ea862 !important;
}

.section-muted p,
.section--dark p,
.et_pb_section.section-muted p,
.et_pb_section.section--dark p,
.section-muted .et_pb_blurb_description,
.section--dark .et_pb_blurb_description,
.section-muted .et_pb_blurb_description p,
.section--dark .et_pb_blurb_description p {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Badge row text in dark sections */
.section-muted .badge-row p,
.section--dark .badge-row p,
.et_pb_section.section-muted .badge-row p,
.et_pb_section.section--dark .badge-row p {
  color: #333 !important;
}

/* =========================================================
   Mint Section
   ========================================================= */

.section--mint,
.et_pb_section.section--mint {
  background: #8ccba1 !important;
}

/* =========================================================
   Divi Blurb Module Fixes
   ========================================================= */

/* Make blurbs use flexbox for badge rows */
.et_pb_blurb.badge-row .et_pb_blurb_content {
  display: flex;
  align-items: center;
  gap: 24px;
}

.et_pb_blurb.badge-row .et_pb_main_blurb_image {
  margin-bottom: 0;
  flex-shrink: 0;
}

.et_pb_blurb.badge-row .et_pb_main_blurb_image img {
  width: 120px;
  height: auto;
}

/* =========================================================
   Lead Form Section
   ========================================================= */

.lead-block,
#contact.section-muted,
.et_pb_section.lead-block {
  background: #1c203a !important;
  color: #fff !important;
}

.lead-block h2,
.lead-block h3,
#contact h2,
#contact h3 {
  color: #3ea862 !important;
}

.lead-block p,
#contact p {
  color: #dfe3ff !important;
}

/* =========================================================
   Footer
   ========================================================= */

.site-footer,
.et_pb_section.site-footer {
  background: #f5f5f5 !important;
}

/* =========================================================
   Remove Divi Default Styling
   ========================================================= */

/* Remove default link underlines in nav */
.nav-menu a {
  text-decoration: none !important;
}

.nav-menu a:hover {
  text-decoration: underline !important;
}

/* Remove Divi button styling */
.et_pb_button {
  border: none !important;
}

/* Fix text module paragraph spacing */
.et_pb_text p {
  padding-bottom: 0 !important;
}

.et_pb_text p:last-child {
  margin-bottom: 0 !important;
}

/* =========================================================
   Accordion Fixes
   ========================================================= */

.et_pb_accordion .et_pb_toggle {
  border: none !important;
  background: transparent !important;
}

.et_pb_accordion .et_pb_toggle_title {
  font-weight: 700 !important;
  font-size: 12px !important;
  color: #1c213b !important;
}

.et_pb_accordion .et_pb_toggle_content {
  font-size: 11px !important;
  color: #333 !important;
}

/* =========================================================
   Testimonial Card Fixes
   ========================================================= */

.et_pb_testimonial {
  background: #fff !important;
  border: 1px solid #e6e6e6 !important;
  border-radius: 16px !important;
  padding: 18px !important;
}

/* =========================================================
   Tab Fixes
   ========================================================= */

.et_pb_tabs .et_pb_tab_active {
  color: #3ea862 !important;
}

.et_pb_tabs .et_pb_tabs_controls li.et_pb_tab_active a {
  color: #3ea862 !important;
}

/* =========================================================
   Contact Form Fixes
   ========================================================= */

.et_pb_contact_form input,
.et_pb_contact_form select,
.et_pb_contact_form textarea {
  height: 32px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  background: rgba(255,255,255,0.95) !important;
  padding: 0 10px !important;
  font-size: 12px !important;
}

.et_pb_contact_form textarea {
  height: auto !important;
  min-height: 100px !important;
}

.et_pb_contact_form .et_pb_contact_submit {
  background: #3ea862 !important;
  color: #fff !important;
  font-weight: 900 !important;
  border-radius: 6px !important;
  height: 34px !important;
}

/* =========================================================
   Hero Banner Ribbon Overrides
   ========================================================= */

/* Ensure hero section displays correctly with background image */
.et_pb_section.hero {
  padding: 0 !important;
  overflow: visible !important;
  position: relative !important;
  min-height: 600px !important;
  background-image: url('https://storage.googleapis.com/accushield-marketing-assets/spl-site-v2/assets/img/hero.png') !important;
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
}

/* Hide only the inline img since we use CSS background */
.et_pb_section.hero .hero-image {
  display: none !important;
}

/* Container should be transparent and allow centering */
.et_pb_section.hero .hero-image-container {
  background: transparent !important;
  position: relative !important;
  text-align: center !important;
}

/* Hero overlay - positioned above background, centered */
.et_pb_section.hero .hero-overlay {
  position: relative !important;
  z-index: 2 !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* Hero component centering */
.et_pb_section.hero .hero-component {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.et_pb_section.hero .et_pb_row {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
  position: relative !important;
  z-index: 2 !important;
}

.et_pb_section.hero .et_pb_column {
  overflow: visible !important;
}

/* Hero banner styling in Divi */
.hero .et_pb_code_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: visible !important;
}

/* Ensure banner fits properly */
.hero-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Hero card in Divi context */
.hero .hero-card {
  margin-top: 0 !important;
  width: 100%;
  max-width: 620px;
}

/* Search form styling in hero */
.hero .search-form {
  width: 100%;
}

.hero .search-inputs {
  display: flex !important;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
}

.hero .search-inputs input {
  flex: 1;
  min-width: 0;
  border-radius: 999px 0 0 999px !important;
}

.hero .search-inputs .btn {
  border-radius: 0 999px 999px 0 !important;
  background: #000 !important;
  color: #fff !important;
}

/* Hide old hero elements */
.hero-eyebrow-wrapper,
.hero-title-wrapper {
  display: none !important;
}

/* =========================================================
   Directory Page Layout Fixes
   ========================================================= */

/* Constrain directory content to container width */
.directory-wrapper {
  max-width: var(--container, 1200px);
  margin: 0 auto;
  padding: 0 var(--space-5, 24px);
}

/* Full-width sections need inner container */
.directory-search-section .et_pb_row,
.directory-results-section .et_pb_row {
  max-width: var(--container, 1200px) !important;
  margin: 0 auto !important;
  padding-left: var(--space-5, 24px) !important;
  padding-right: var(--space-5, 24px) !important;
}

/* Search bar alignment */
.search-bar-wrapper {
  max-width: fit-content;
  margin: 0 auto;
}

/* Results meta should align with grid */
.results-meta {
  max-width: var(--container, 1200px);
  margin: 0 auto var(--space-4, 16px);
  padding: 0;
}

/* Directory grid proper containment */
.directory-grid {
  max-width: 100%;
}

/* Ensure row modules respect container */
.directory-results-section .et_pb_code_inner {
  width: 100%;
}