/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.10.1.1745806111
Updated: 2025-04-28 07:38:31

/* Targeting the site identity/logo within the desktop header 
  to override the default theme padding.
*/
#ast-desktop-header .ast-site-identity {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/* --- Homepage Hero Section Adjustments --- */

/* 1. Force the removal of vertical space above the main content area */
body #primary {
    margin-top: 0 !important;
}

/* --- Make Homepage Hero fill the viewport on non-bobile devices (wider than 922px, which is the theme's breakpoint for mobile menu)--- */
/*@media (min-width: 922px) {*/
    
/*    #metaslider-id-207 {*/
/*	    height: calc(100vh - 80px) !important;*/
/*    }*/

/*    #metaslider_container_207 img {*/
/*	    object-fit: cover !important;*/
/*	    height: calc(100vh - 80px) !important;*/
/*    }*/
/*}*/

/*
 * Fix for Main Menu Sub-menus Opening Off-Screen
 * -------------------------------------------------
 * This targets second-level (and deeper) sub-menus and makes them open
 * to the left of the parent item instead of the default right.
*/
#ast-desktop-header #ast-hf-menu-1 .sub-menu .sub-menu {
    left: auto !important;
    right: 100% !important;
}

/* Footer Styling
*/

.custom-footer-container {
    font-family: inherit; /* Use the theme's default font */
    /* color: #333;  Dark gray text color, change as needed */
    padding: 2em 1em;
    width: 100%;
    box-sizing: border-box;
}

.custom-footer-row1 {
    display: flex;
    flex-wrap: wrap; /* Allows columns to stack on smaller screens */
    gap: 2em; /* Space between columns */
    margin-bottom: 2em;
}

.custom-footer-col {
    flex: 1; /* Each column will try to take equal space */
    min-width: 280px; /* Prevents columns from getting too squished */
}

.custom-footer-col h4 {
    margin-top: 0;
    font-weight: bold;
    /* color: #1e293b;  A slightly darker color for headings */
    margin-bottom: 1em;
}

.cert-images {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: center;

}

/*.quick-links {*/
/*    justify-content: flex-start;*/
/*}*/

.contact-info p {
    margin: 0 0 0.8em 0;
    line-height: 1.6;
}

.contact-info p i a {
    margin-right: 10px;
    /* color: #8f5f25;  Your theme's primary color */
    width: 20px;
    text-align: center;
    /*justify-content: flex-start;*/
}

.social-icons a {
    font-size: 1.5em;
    color: #334155;
    margin-right: 15px;
    text-decoration: none;
    transition: color 0.3s ease;
}

/* .social-icons a:hover {
     color: #045cb4;
} */

.map-container {
    position: relative;
    overflow: hidden;
    padding-top: 75%; /* Aspect ratio for the map, adjust if needed */
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/*  .custom-footer-row2 {
    text-align: center;
    padding-top: 1.5em;
    border-top: 1px solid #e2e8f0;   
    font-size: 0.9em;
    color: #475569;
  }
 
   .custom-footer-row2 a {
    color: #1e293b;
    font-weight: bold;
    text-decoration: none;
   }
   .custom-footer-row2 a:hover {
    text-decoration: underline;
   }
 */
 
/*
 * Force a Two-Column Layout on Single Product Pages using CSS Grid
 */

/* 1. Target the main product container and turn it into a grid */
.single-product div.product {
    display: grid;
    /* Create two columns. The right column is slightly larger. Adjust as needed. */
    grid-template-columns: 0.9fr 1.1fr; 
    /* Create a gap between the gallery and the summary */
    gap: 40px; 
}

/* 2. Target the gallery and summary elements */
.single-product .woocommerce-product-gallery,
.single-product .summary.entry-summary {
    /* Ensure they don't have a width that interferes with the grid */
    width: 100% !important; 
    float: none !important;
}

/* 3. Make the tabs section span the full width */
.single-product div.product .woocommerce-tabs {
    /* This tells the element to start at the first grid line (-1 means the last) */
    grid-column: 1 / -1; 
}

/* 4. On mobile devices, stack the grid into a single column */
@media (max-width: 768px) {
    .single-product div.product {
        /* Switch to a single column layout */
        grid-template-columns: 1fr;
    }

    /* On mobile, the tabs don't need the span rule, so resetting it */
    .single-product div.product .woocommerce-tabs {
        grid-column: auto;
    }
}
