/*
Theme Name: Enfold Child
Description: A child theme created by Boost Leads Digital Marketing
Version: 1.0
Author: Boost Leads Digital Marketing
Author URI: https://boostleads.ca
Template: enfold
*/


/*Add your own styles here:*/


/* Making YT video embeds responsive */
.embed-container { 
	position: relative; 
	padding-bottom: 56.25%; 
	margin-bottom: 4%;
	height: 0; 
	overflow: hidden; 
	max-width: 100%; 
} 

.embed-container iframe, .embed-container object, .embed-container embed { 
	position: absolute; 
	top: 0; left: 0; 
	width: 100%; 
	height: 100%; 
}

/* END of Making YT video embeds responsive */


#top .fullsize .flex_column .template-blog h2.post-title.entry-title {
    text-align: center;
}

@media only screen and (min-width: 600px) {
	.col-2-s {
		width:49%; 
		display:inline-block;
		vertical-align: top;
		padding: 10px 5px;
	}
}	

/*---Preventing ads from covering content on the page ---*/
.google-auto-placed.ap_container {
    display: inline-block !important;
	margin-bottom: 10%;
}

/*---Aligning BMC button to the center ---*/
.avia_codeblock.buy-me-a-coffee {
    text-align: center;
}

/*---Search resutls syling ---*/
.search-result-counter {
    padding: 0;
}

.search-result-counter img {
	width: 100%;
	height: 100%;
	border-radius: 100px;
}

@media only screen and (min-width: 600px) {
	.relevant-patterns {
		column-count:3;	
	}

	div#grow-me-in-content-recs-root {
    	display: none;
	}
}	


/* --- Search Results Modern Side-by-Side Layout --- */

/* 1. Set the main container to a grid layout */
.template-search .post-entry .entry-content-wrapper {
    display: grid;
    grid-template-columns: 180px 1fr; /* 180px is the thumb size; 1fr is the rest of the space */
    grid-column-gap: 30px;            /* Spacing between image and text */
    grid-row-gap: 5px;
    align-items: start;
    padding-bottom: 30px;             /* Spacing between different search results */
    border-bottom: 1px solid #ebebe b; /* Optional: adds a subtle separator */
    margin-bottom: 30px;
}

/* 2. Make the header "invisible" to the grid so its children (image, title, meta) 
      can be placed directly into the columns defined above */
.template-search .post-entry .entry-content-header {
    display: contents;
}

/* 3. Force the image into the first column and let it span all text rows */
.template-search .post-entry .search-result-image {
    grid-column: 1;
    grid-row: 1 / span 10; /* Ensure it stays on the left of everything */
    margin: 0 !important;
}

.template-search .post-entry .search-result-image img {
    border-radius: 4px;    /* Optional: slightly rounded corners for a modern look */
    width: 100%;           /* Scale to fit the 180px column */
    height: auto;
}

/* 4. Align all text elements to the second column */
.template-search .post-entry .post-title,
.template-search .post-entry .post-meta-infos,
.template-search .post-entry .entry-content {
    grid-column: 2;
    margin-left: 0 !important;
    padding-left: 0 !important;
    clear: none !important; /* Prevent Enfold's default floats from breaking the grid */
}

/* 5. Title styling refinement */
.template-search .post-entry .post-title {
    margin-top: 0 !important;
    padding-bottom: 5px;
    font-size: 1.4em;
}

/* 6. Meta info (date/category) styling */
.template-search .post-entry .post-meta-infos {
    font-size: 0.9em;
    color: #888;
    margin-bottom: 15px !important;
}

/* 7. The excerpt text */
.template-search .post-entry .entry-content p {
    margin: 0;
    line-height: 1.6;
}

/* 8. Handle the result counter (the "1", "2", "3" numbers) 
      Hiding it often makes the layout much cleaner. */
.template-search .post-entry .search-result-counter {
    display: none; 
}

/* Responsive: On mobile, stack them vertically */
@media only screen and (max-width: 767px) {
    .template-search .post-entry .entry-content-wrapper {
        display: block; /* Switch back to standard stacking */
    }
    
    .template-search .post-entry .search-result-image {
        margin-bottom: 15px !important;
        width: 100px; /* Smaller image on mobile */
    }
}