/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here for Sidebar 12/23
    display: inline-block; is important else all content is not clickable
*/
/* Base styles for #page-with-sidebar1 */
#page-with-sidebar {
    max-width: 100%;
    margin: 0 auto; /* Center the content horizontally */
    display: block; /* Block display for modern layout handling */
    padding: 0 20px; /* Add padding instead of margin for better control */
    box-sizing: border-box; /* Ensure padding is included in the element's width */
}

/* Container styles */
.template-container {
    width: 100%;
    max-width: 100%; /* Optional: max-width to prevent stretching too wide */
    margin: 0 auto; /* Center the container if it has a max-width */
    box-sizing: border-box; /* Ensure padding/border are included in width calculations */
}

/* Floating layout for content and sidebar */
#page-with-sidebar .page-content {
    width: 70%;
    float: left;
    padding-left: 0;
}

#page-with-sidebar .sidebar {
    width: 30%;
    float: right;
}

/* Clearfix to handle floated elements */
#page-with-sidebar::after {
    content: "";
    display: table;
    clear: both;
}

/* Responsive styles */
@media(max-width: 1279px) {
    #page-with-sidebar {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media(max-width: 767px) {
    #page-with-sidebar .page-content {
        width: 100%;
        float: none; /* Remove float for full-width layout */
        padding-right: 0;
    }

    #page-with-sidebar .sidebar {
        width: 100%;
        float: none; /* Remove float for full-width layout */
        margin-left: 0;
        margin-bottom: 20px; /* Add spacing below the sidebar */
    }
}