/*
 Theme Name:  Volport Child
 Template:    volport
 Text Domain: volport-child
*/

/**
 * Header stacking + sticky menu
 * - Keep header above hero/slider overlays
 * - Additional CSS previously forced position:relative on .header-sticky which
 *   overrode the theme .sticky-on { position:fixed } — menu vanished on scroll.
 */
.color-header.header-sticky:not(.sticky-on),
.transparent-header.header-sticky:not(.sticky-on) {
  position: relative;
  z-index: 10001;
}
.color-header.header-sticky.sticky-on,
.transparent-header.header-sticky.sticky-on,
.header-sticky.sticky-on,
.sticky-on.color-header {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 10001 !important;
}
body.elementor-page-219 .elementor-element.elementor-element-26ac76b {
  z-index: 1 !important;
}
.slider-overlay:before {
  pointer-events: none;
  z-index: 0;
}
.slider-overlay > * {
  position: relative;
  z-index: 1;
}

/**
 * Equalize paired CTA buttons sitewide (Contact Us ↔ Explore More / left CTA).
 * Contact Us Elementor buttons were shorter/uneven vs the left button.
 */
a.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-sm {
  box-sizing: border-box !important;
  min-height: 48px !important;
  height: 48px !important;
  padding: 0 28px !important;
  line-height: 48px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  display: inline-block !important;
  text-align: center !important;
  vertical-align: middle;
}
/* Hero primary (Get a Free Quote) stays theme .v-btn; keep secondary hero CTAs aligned if present */
.hero__btn a.elementor-button,
.slider__btn a.elementor-button,
.slider__content a.elementor-button {
  box-sizing: border-box !important;
  min-height: 60px !important;
  height: 60px !important;
  padding: 0 35px !important;
  line-height: 60px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  display: inline-block !important;
  text-align: center !important;
  border-radius: 5px;
}

/**
 * Desktop: align Explore/Learn More + Contact Us on one row.
 * Contact Us was Elementor "Absolute" with large top offsets → sat lower than Explore More.
 */
@media (min-width: 1024px) {
  /* Pull Contact Us out of broken absolute positioning */
  .elementor-widget-button.elementor-absolute {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
  .elementor-widget-button.elementor-absolute > .elementor-widget-container {
    margin: 0 !important;
  }

  /* Columns that contain CTA button pairs: heading full-width, buttons on one row */
  .elementor-widget-wrap:has(> .elementor-widget-button.elementor-absolute),
  .elementor-widget-wrap:has(> .elementor-widget-button + .elementor-widget-button) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    column-gap: 12px;
    row-gap: 12px;
  }
  .elementor-widget-wrap:has(> .elementor-widget-button) > .elementor-widget-heading {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .elementor-widget-wrap:has(> .elementor-widget-button) > .elementor-widget-button {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Keep visual order: Explore/Learn More (left) then Contact Us (right)
     when Contact Us is first in the DOM (absolute left it looking right). */
  .elementor-element-e28b842 > .elementor-widget-wrap > .elementor-element-26f3a69,
  .elementor-element-f1ef149 > .elementor-widget-wrap > .elementor-element-c8f82ba {
    order: 1;
  }
  .elementor-element-e28b842 > .elementor-widget-wrap > .elementor-element-5c87c1f,
  .elementor-element-f1ef149 > .elementor-widget-wrap > .elementor-element-6a72710 {
    order: 2;
  }
  .elementor-element-e28b842 > .elementor-widget-wrap > .elementor-element-56a2a32,
  .elementor-element-f1ef149 > .elementor-widget-wrap > .elementor-element-38eae65 {
    order: 3;
  }

  /* Service cards (Learn More row): equal column height + shared button baseline */
  .elementor-section:has(.services__wrapper-4) > .elementor-container {
    align-items: stretch !important;
  }
  .elementor-section:has(.services__wrapper-4) > .elementor-container > .elementor-column {
    display: flex;
  }
  .elementor-section:has(.services__wrapper-4) > .elementor-container > .elementor-column > .elementor-widget-wrap {
    display: flex !important;
    flex-direction: column !important;
    width: 100%;
    height: 100%;
  }
  .elementor-section:has(.services__wrapper-4) > .elementor-container > .elementor-column > .elementor-widget-wrap > .elementor-widget {
    flex: 1 1 auto;
    display: flex !important;
    flex-direction: column;
    width: 100%;
  }
  .elementor-section:has(.services__wrapper-4) .elementor-widget-container,
  .elementor-section:has(.services__wrapper-4) .services__wrapper-4 {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto;
    height: 100% !important;
    margin-bottom: 0 !important;
  }
  .elementor-section:has(.services__wrapper-4) .services__btn {
    margin-top: auto !important;
  }
}

/* Increase blog post content container width */
.blog-details-area .container {
    max-width: 1400px !important;
}

/* Increase content wrapper width for better readability */
.blog-details-area .blog__details-wrapper {
    max-width: 100%;
}

/* Ensure content area uses full width on larger screens */
@media (min-width: 1200px) {
    .blog-details-area .blog-post-items {
        max-width: 100%;
    }
    
    /* Set content column to 75% */
    .blog-details-area .col-lg-8 {
        flex: 0 0 75%;
        max-width: 75%;
    }
    
    /* Set sidebar to 25% */
    .blog-details-area .col-lg-4 {
        flex: 0 0 25%;
        max-width: 25%;
    }
    
    .blog-details-area .col-lg-12 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Reduce spacing between content and sidebar */
@media (min-width: 1200px) {
    .blog-details-area .blog__details-wrapper.mr-35 {
        margin-right: 15px !important;
    }
    
    .blog-details-area .news-sidebar {
        padding-left: 15px;
    }
    
    .blog-details-area .blog-post-items {
        padding-right: 0;
    }
}

/* Fix existing search box - make input larger and button smaller */
.n-sidebar-widget .wp-block-search .wp-block-search__input {
    padding-right: 45px !important;
}

.n-sidebar-widget .wp-block-search .wp-block-search__button {
    width: 35px !important;
    min-width: 35px !important;
    max-width: 35px !important;
    font-size: 12px !important;
    padding: 0 !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
    position: relative !important;
}

.n-sidebar-widget .wp-block-search .wp-block-search__button::before {
    content: "\f002" !important;
    font-family: "Font Awesome 5 Pro" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    text-indent: 0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

/* Remove the "Search" label if it exists above the form */
.n-sidebar-widget .sidebar-title h4 {
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 600;
    color: #1a1a2b;
    border-bottom: 2px solid #eeeeee;
    padding-bottom: 12px;
}