/*
 Theme Name:   Zooly Dark Theme
 Theme URI:    # Optional: Link to theme description or repository
 Description:  Child theme for Hello Elementor with dark mode styling.
 Author:       # Your name or company
 Author URI:   # Optional: Link to your website
 Template:     hello-elementor
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  zooly-dark-theme
*/



/* Add your custom dark mode CSS below this line */

/* Prevent scrollbars when embedded in iframe */
html, body {
    overflow: hidden !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

body {
    padding-top: 100px;
    background-color: #000000;
    /* color: #ffffff; */
}

/* Adjust link colors */
a {
    color: #cccccc;
    /* Lighter gray for links */
}

h1.entry-title {
    display: none;
}

.page-header {
    display: none;
}

a:hover {
    /* color: #ffffff; */
    /* White on hover */
}

/* Target Elementor elements specifically if needed */
.elementor-section {
    /* Sometimes Elementor sections override body styles */
    background-color: #000000 !important;
}

/* Prevent Elementor elements from causing horizontal scroll */
.elementor-section,
.elementor-container,
.elementor-column-wrap,
.elementor-widget-wrap,
.elementor-row {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Ensure all content fits within viewport on mobile */
@media screen and (max-width: 620px) {
    body, html {
        overflow: hidden !important;
    }
    
    .elementor-section {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .elementor-container {
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

@media screen and (max-width: 575px) {
    /* Extra protection against horizontal scroll on very small screens */
    * {
        max-width: 100% !important;
    }
    
    img, video, iframe {
        max-width: 100% !important;
        height: auto !important;
    }
}

.elementor-widget-container,
.elementor-widget-container p,
.elementor-widget-text-editor,
.elementor-heading-title {
    /* Target common Elementor text containers */
    /* color: #ffffff !important; */
}

/* Add more specific rules as needed */