/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Set site container width */
body {
max-width: 1920px;
margin-right: auto;
margin-left: auto;
background: #ddd;
}

/* Sets the header to 1920px on scroll */
.fl-builder-content[data-type="header"].fl-theme-builder-header-sticky {
  max-width: 1920px;
}

/* Sets paragraph margin */
p {margin-bottom: 20px;}

/* Remove margin when this class is used on text modules */
.vwd-no-margin p  {
    margin: 0;
}

p.vwd-remove-p-margin {
	margin-bottom: 0px;
}

.vwd-checkmark-icon svg {
  width: 80px;
	height: auto;
}

.vwd-checkmark-icon {
	path{stroke:#000;}
}

/* Background color for pretext on process section */
span.vwd-highlight {		background: #F9FC37;
	  padding: 2px 6px;
	border-radius: 4px
}

/* Process Section */
.vwd-list-numbers .pp-list-item-icon {
 Color: #0074c7;
 border-bottom: 2px solid #000;
}

.vwd-list-numbers .pp-list-item-icon:after {
 content:"."
}

.vwd-arrow-right-icon path {fill:white}

.vwd-arrow-right-icon .fl-photo-content {
    padding: 25px;
    background: #000;
    border-radius: 50%;
    aspect-ratio:1;
    width: fit-content;
}

/* Packages */
.pp-pricing-table .pp-pricing-table-column .pp-pricing-table-features {
	padding-bottom: 20px;
	padding-top: 10px;
}

.pp-pricing-table .pp-pricing-table-features li {
	padding-bottom: 5px !important;
}

/* Mobile menu bottom padding */
@media ( max-width: 768px ) {
    .fl-node-o4id9gnklxwy .fl-menu ul.menu {
        padding-bottom: 10px;
    }
/* phone icon */
	.fl-photo .fl-photo-img-svg svg.wp-image-74 {
    width: 20px;
    height: 40px;
}

/* Our process arrow in circle */
@media (max-width: 768px) {
  .vwd-rotate-90 svg {
    transform: rotate(90deg);
 }
}

/* Pricing table item alignment */
.vwd-pricing-table .pp-pricing-table .pp-pricing-table-features .pp-pricing-table-item {
        flex-direction: row;
    }
}

/* Header stars */
span.vwd-five-stars:after {
	content: url("/wp-content/uploads/2025/11/five-stars.png");
	margin-left: 6px;
	display: inline-block;
	position: relative;
	top: 1px;
}

span.vwd-map-icon:before {
    content: url("/wp-content/uploads/2025/11/map-icon.png");
    margin-right: 6px;
    display: inline-block;
    position: relative;
    top: 3px; /* tweak this value (2–4px) to taste */
}


/* ============================================================
   Beaver Builder: Mobile LANDSCAPE Background Height Fix
   ------------------------------------------------------------
   Problem:
   - On mobile landscape, BB background-image columns collapse
   - Portrait mode is already correct and MUST NOT be touched

   Solution:
   - Target ONLY mobile landscape
   - Apply min-height ONLY to the column content wrapper
   - Leave portrait and desktop completely untouched
   ============================================================ */

@media (max-width: 768px) and (orientation: landscape) {

  /* 
     IMPORTANT:
     Background images in Beaver Builder columns rely on
     .fl-col-content for height.

     Applying min-height here prevents collapse in landscape
     without affecting portrait mode.
  */
  .fl-col.vwd-mobile-bg-fix > .fl-col-content {
    min-height: 400px;
  }
}


/* ============================================================
   PowerPack Hover Card – Mobile LANDSCAPE Height Fix
   ------------------------------------------------------------
   Problem:
   - PowerPack hover cards calculate height incorrectly
     in mobile landscape mode.
   - Portrait mode is already correct and must not be changed.

   Solution:
   - Target ONLY mobile landscape
   - Apply height to the element that actually controls layout:
     .pp-hover-card-container
   ============================================================ */

@media (max-width: 768px) and (orientation: landscape) {

  /* 
     IMPORTANT:
     PowerPack hover cards use a fixed-height container.
     This is the exact element you modified in DevTools.
  */
  .vwd-mobile-bg-fix .pp-hover-card-container {
    height: 400px;
  }

}

/* ============================================================
   Trust Index Review Widget Styles
============================================================ */
.vwd-black-review-widgets .ti-rating-text, /* Black Google Widgets */
.vwd-black-review-widgets .ti-rating-text span.nowrap,
.vwd-black-review-widgets .ti-rating-text a {
	color: white !important;
}


/* Hide em dash only on mobile portrait */
@media (max-width: 767px) and (orientation: portrait) {
  .hide-mdash-mobile {
    display: none;
  }
}