<?php
/**
 * Dynamic CSS file - Generated from database colors
 * This file outputs CSS with colors from the database
 */
header('Content-Type: text/css');
require_once __DIR__ . '/config.php';

// Helper function to get color from database
function get_color($key, $default)
{
    static $colors = [];
    if (!isset($colors[$key])) {
        $conn = get_db_connection();
        if ($conn && !$conn->connect_error) {
            $result = $conn->query("SELECT setting_value FROM website_settings WHERE setting_key = '$key' LIMIT 1");
            if ($result && $row = $result->fetch_assoc()) {
                $colors[$key] = trim($row['setting_value']);
            } else {
                $colors[$key] = $default;
            }
        } else {
            $colors[$key] = $default;
        }
    }
    return $colors[$key];
}

// Get all colors from database
$site_color = get_color('site_color', '#F49321');
$primary_color = get_color('primary_color', '#1C418C');
$secondary_color = get_color('secondary_color', '#68BA62');
$text_color = get_color('text_color', '#333333');
$text_light_color = get_color('text_light_color', '#707070');
$background_color = get_color('background_color', '#FFFFFF');
$background_light_color = get_color('background_light_color', '#F4F4F4');
$border_color = get_color('border_color', '#D1D1D1');
$accent_color = get_color('accent_color', '#BD921E');
$link_color = get_color('link_color', '#18BCA9');
$link_hover_color = get_color('link_hover_color', '#008A81');
$button_bg_color = get_color('button_bg_color', '#F49321');
$button_text_color = get_color('button_text_color', '#FFFFFF');
$button_hover_color = get_color('button_hover_color', '#d67d1a');
$header_bg_color = get_color('header_bg_color', '#FFFFFF');
$header_text_color = get_color('header_text_color', '#333333');
$footer_bg_color = get_color('footer_bg_color', '#3A3A37');
$footer_text_color = get_color('footer_text_color', '#FFFFFF');
// Additional colors
$error_color = get_color('error_color', '#DB2323');
$warning_color = get_color('warning_color', '#FFD500');
$success_color = get_color('success_color', '#68BA62');
$info_color = get_color('info_color', '#18BCA9');
$svg_color_1 = get_color('svg_color_1', '#525F66');
$svg_color_2 = get_color('svg_color_2', '#8FA7B3');
$overlay_color = get_color('overlay_color', '#000000');
$shadow_color = get_color('shadow_color', '#000000');
$services_heading_color = get_color('services_heading_color', '#F49321');
$footer_link_color = get_color('footer_link_color', '#FFFFFF');
$footer_heading_color = get_color('footer_heading_color', '#FFFFFF');
?>
/* Dynamic CSS - Colors from Database */
:root {
--site-color: <?php echo $site_color; ?>;
--primary-color: <?php echo $primary_color; ?>;
--secondary-color: <?php echo $secondary_color; ?>;
--text-color: <?php echo $text_color; ?>;
--text-light-color: <?php echo $text_light_color; ?>;
--background-color: <?php echo $background_color; ?>;
--background-light-color: <?php echo $background_light_color; ?>;
--border-color: <?php echo $border_color; ?>;
--accent-color: <?php echo $accent_color; ?>;
--link-color: <?php echo $link_color; ?>;
--link-hover-color: <?php echo $link_hover_color; ?>;
--button-bg-color: <?php echo $button_bg_color; ?>;
--button-text-color: <?php echo $button_text_color; ?>;
--button-hover-color: <?php echo $button_hover_color; ?>;
--header-bg-color: <?php echo $header_bg_color; ?>;
--header-text-color: <?php echo $header_text_color; ?>;
--footer-bg-color: <?php echo $footer_bg_color; ?>;
--footer-text-color: <?php echo $footer_text_color; ?>;
--error-color: <?php echo $error_color; ?>;
--warning-color: <?php echo $warning_color; ?>;
--success-color: <?php echo $success_color; ?>;
--info-color: <?php echo $info_color; ?>;
--svg-color-1: <?php echo $svg_color_1; ?>;
--svg-color-2: <?php echo $svg_color_2; ?>;
--overlay-color: <?php echo $overlay_color; ?>;
--shadow-color: <?php echo $shadow_color; ?>;
--services-heading-color: <?php echo $services_heading_color; ?>;
--footer-link-color: <?php echo $footer_link_color; ?>;
--footer-heading-color: <?php echo $footer_heading_color; ?>;
/* Consistency Variables */
--white: #ffffff;
--font-heading: 'Outfit', sans-serif;
--font-body: 'Plus Jakarta Sans', sans-serif;
--radius-md: 12px;
--radius-lg: 24px;
}

header {
background-color: var(--header-bg-color);
}

body {
padding-top: 106px !important;
}

@media (max-width: 991px) {
body {
padding-top: 100px !important;
}
}

/* Dark Mode Variables */
[data-theme="dark"] {
--background-color: #252627;
--background-light-color: #2d2e30;
--text-color: #f0f0f0;
--text-light-color: #b0b0b0;
--border-color: #222222;
--header-bg-color: #252627;
--header-text-color: #f0f0f0;
--footer-bg-color: #252627;
--footer-text-color: #f0f0f0;
--link-color: #26d0bb;
--link-hover-color: #18bca9;
--shadow-color: rgba(0, 0, 0, 0.6);
--overlay-color: rgba(0, 0, 0, 0.85);

/* System Overrides */
background-color: var(--background-color) !important;
color: var(--text-color) !important;
}

[data-theme="dark"] body {
background-color: var(--background-color) !important;
color: var(--text-color) !important;
}

[data-theme="dark"] header {
background-color: var(--header-bg-color) !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
border-bottom: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .navbar-toggler {
background-color: rgba(255, 255, 255, 0.05) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .navbar-toggler-icon {
filter: invert(1) brightness(2);
}

[data-theme="dark"] .elementor-section,
[data-theme="dark"] .elementor-column,
[data-theme="dark"] .elementor-widget-wrap,
[data-theme="dark"] .hero-section {
background-color: transparent !important;
}

[data-theme="dark"] p,
[data-theme="dark"] li,
[data-theme="dark"] .elementor-text-editor,
[data-theme="dark"] .process-step p,
[data-theme="dark"] .section-header p,
[data-theme="dark"] .feature-text p,
[data-theme="dark"] .info-item p,
[data-theme="dark"] .info-item a,
[data-theme="dark"] small,
[data-theme="dark"] .text-muted {
color: var(--text-light-color) !important;
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] .elementor-heading-title,
[data-theme="dark"] .stat-label {
color: var(--text-color) !important;
}

[data-theme="dark"] .trust-item span,
[data-theme="dark"] .trust-item i {
color: var(--site-color) !important;
}

/* Preserve Brand Colors */
[data-theme="dark"] h1 span,
[data-theme="dark"] h2 span,
[data-theme="dark"] .hero-content h1 span,
[data-theme="dark"] .section-header h2 span {
color: var(--site-color) !important;
}

[data-theme="dark"] .process-step:not(:last-child)::after {
border-top-color: #333333 !important;
}

[data-theme="dark"] .step-number {
box-shadow: 0 10px 20px rgba(0,0,0,0.5) !important;
}

/* Home Page Section Overrides */
[data-theme="dark"] .testimonials-section,
[data-theme="dark"] .faq-section,
[data-theme="dark"] .cta-section,
[data-theme="dark"] .process-section,
[data-theme="dark"] .why-choose-us,
[data-theme="dark"] .subpage-hero,
[data-theme="dark"] .section-padding.bg-light {
background-color: #252627 !important;
}

[data-theme="dark"] .subpage-hero {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .breadcrumb-container {
background: #1e293b !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .breadcrumb-container a,
[data-theme="dark"] .breadcrumb-container span {
color: #a0aec0 !important;
}

[data-theme="dark"] .pro-card {
background-color: #1e293b !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .service-content,
[data-theme="dark"] .service-content p,
[data-theme="dark"] .service-content li {
color: #e2e8f0 !important;
}

[data-theme="dark"] .related-list a h6 {
color: #e2e8f0 !important;
}

[data-theme="dark"] .related-list a:hover h6 {
color: var(--primary-color) !important;
}

/* FAQ & Accordion Dark Mode */
[data-theme="dark"] .accordion-item {
background-color: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .accordion-button {
background-color: transparent !important;
color: #ffffff !important;
}

[data-theme="dark"] .accordion-button:not(.collapsed) {
background-color: rgba(255, 255, 255, 0.05) !important;
color: var(--primary-color) !important;
}

[data-theme="dark"] .accordion-body {
background-color: transparent !important;
color: #cbd5e0 !important;
}

[data-theme="dark"] .accordion-button::after {
filter: invert(1) brightness(2);
}

[data-theme="dark"] .btn-outline-dark {
color: #ffffff !important;
border-color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .btn-outline-dark:hover {
background-color: #ffffff !important;
color: #000000 !important;
}

/* Popup Dark Mode - Force Theme Color on All Containers */
[data-theme="dark"] .elementor-popup-modal,
[data-theme="dark"] .elementor-popup-modal .dialog-widget-content,
[data-theme="dark"] .elementor-popup-modal .dialog-message,
[data-theme="dark"] .elementor-popup-modal .elementor,
[data-theme="dark"] .elementor-popup-modal .elementor-element,
[data-theme="dark"] .elementor-popup-modal .e-con,
[data-theme="dark"] .elementor-popup-modal .e-con-inner,
[data-theme="dark"] .elementor-popup-modal .e-parent,
[data-theme="dark"] .elementor-popup-modal .e-child,
[data-theme="dark"] .elementor-popup-modal .elementor-widget-container {
background-color: #252627 !important;
background-image: none !important;
border-color: var(--site-color) !important;
}

[data-theme="dark"] .elementor-popup-modal .dialog-widget-content {
border: 1px solid var(--site-color) !important;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9), 0 0 20px
rgba(<?php echo hex2rgb($site_color)[0] . ',' . hex2rgb($site_color)[1] . ',' . hex2rgb($site_color)[2]; ?>, 0.1)
!important;
}

/* Homepage Custom Modal Dark Mode */
[data-theme="dark"] .custom-modal {
background-color: #252627 !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .modal-title-text {
color: #ffffff !important;
}

[data-theme="dark"] .modal-desc-text {
color: #cbd5e0 !important;
}

[data-theme="dark"] .modal-badge {
color: var(--site-color) !important;
}

[data-theme="dark"] .close-modal-btn {
color: #ffffff !important;
opacity: 0.7;
}

[data-theme="dark"] .elementor-popup-modal .elementor-heading-title {
color: var(--site-color) !important;
font-weight: 800 !important;
}

/* Global Popup "Click to Call" - Branded Red */
.elementor-popup-modal .elementor-element-569d08b .elementor-button {
background-color: var(--primary-color) !important;
color: #ffffff !important;
border-radius: 50px !important;
}

/* Call Button - Branded Red Overrides for Dark Mode */
[data-theme="dark"] .elementor-popup-modal .elementor-element-569d08b .elementor-button {
background-color: var(--primary-color) !important;
color: #ffffff !important;
border-radius: 50px !important;
}

[data-theme="dark"] .elementor-popup-modal .dialog-close-button:hover i {
opacity: 1;
color: var(--primary-color) !important;
}

/* Call Button - Branded Red */
[data-theme="dark"] .elementor-popup-modal .elementor-element-569d08b .elementor-button {
background-color: var(--primary-color) !important;
color: #ffffff !important;
border-radius: 50px !important;
}

/* Book Button - Branded Orange */
[data-theme="dark"] .elementor-popup-modal .elementor-element-5eb03f4 .elementor-button {
background-color: var(--site-color) !important;
color: #ffffff !important;
border-radius: 50px !important;
}

/* Footer Dark Mode */
[data-theme="dark"] footer {
background-color: #252627 !important;
border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .footer-col h2,
[data-theme="dark"] .footer-col h3,
[data-theme="dark"] .contact-item strong {
color: #ffffff !important;
}

[data-theme="dark"] footer,
[data-theme="dark"] .footer-desc,
[data-theme="dark"] .contact-item span,
[data-theme="dark"] .contact-item a,
[data-theme="dark"] .footer-bottom,
[data-theme="dark"] .footer-bottom span {
color: #e2e8f0 !important;
}

[data-theme="dark"] .footer-links a {
color: #cbd5e0 !important;
}

[data-theme="dark"] .footer-links a:hover,
[data-theme="dark"] .contact-item a:hover {
color: var(--primary-color) !important;
}

[data-theme="dark"] .social-icons a {
background-color: rgba(255, 255, 255, 0.1) !important;
color: #ffffff !important;
}

[data-theme="dark"] .social-icons a:hover {
background-color: var(--primary-color) !important;
color: #ffffff !important;
}

/* Footer Floating Call Button - Branded Red */
.elementor-element-56a70ec .elementor-button {
background-color: var(--primary-color) !important;
color: #ffffff !important;
}

.elementor-element-56a70ec .elementor-button:hover {
background-color: var(--primary-color) !important;
filter: brightness(1.1) !important;
transform: scale(1.05) !important;
}

/* Footer Contact Phone - Branded Red */
.contact-item a[href^="tel:"] {
color: var(--primary-color) !important;
font-weight: 700 !important;
}

[data-theme="dark"] .contact-item a[href^="tel:"] {
color: var(--primary-color) !important;
}

/* Homepage Stats & Financing Visibility Fixes */
.stat-number {
color: #ffffff !important; /* Fix for visibility on red background */
}

.financing-banner {
color: #ffffff !important;
}

[data-theme="dark"] .stats-section,
[data-theme="dark"] .financing-banner {
background-color: #252627 !important;
background-image: none !important;
border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .stat-number {
color: var(--site-color) !important;
}

[data-theme="dark"] .stat-label,
[data-theme="dark"] .financing-banner h3,
[data-theme="dark"] .financing-banner p {
color: #ffffff !important;
}

[data-theme="dark"] .financing-btn {
background-color: var(--primary-color) !important;
color: #ffffff !important;
border: none !important;
}

[data-theme="dark"] .financing-btn:hover {
background-color: var(--primary-color) !important;
filter: brightness(1.1) !important;
}

/* Appointment Form & Section Buttons - Branded Orange */
[data-theme="dark"] .submit-btn,
[data-theme="dark"] .hero-btn,
[data-theme="dark"] .modal-action-btn {
background-color: var(--button-bg-color) !important;
color: #ffffff !important;
border: none !important;
}

[data-theme="dark"] .submit-btn:hover,
[data-theme="dark"] .hero-btn:hover,
[data-theme="dark"] .modal-action-btn:hover {
filter: brightness(1.2) !important;
box-shadow: 0 10px 25px
rgba(<?php echo hex2rgb($button_bg_color)[0] . ',' . hex2rgb($button_bg_color)[1] . ',' . hex2rgb($button_bg_color)[2]; ?>,
0.4) !important;
}
[data-theme="dark"] .why-choose-us,
[data-theme="dark"] .trust-bar,
[data-theme="dark"] .appointment-section {
background-color: var(--background-color) !important;
background-image: none !important;
}

[data-theme="dark"] .appointment-info h2,
[data-theme="dark"] .appointment-info p,
[data-theme="dark"] .section-header h2 {
color: #ffffff !important;
}

[data-theme="dark"] .service-card,
[data-theme="dark"] .contact-method,
[data-theme="dark"] .testimonial-video-card,
[data-theme="dark"] .contact-info-card {
background-color: var(--background-light-color) !important;
border-color: var(--border-color) !important;
}

[data-theme="dark"] .appointment-form-card {
background-color: #111111 !important;
box-shadow: 0 30px 60px rgba(0,0,0,0.8) !important;
}

[data-theme="dark"] .form-control-custom {
background-color: #1a1a1a !important;
border-color: #333333 !important;
color: #ffffff !important;
}

[data-theme="dark"] .form-label {
color: #a0aec0 !important;
}

[data-theme="dark"] .hero-overlay {
background: rgba(0, 0, 0, 0.7) !important;
}

/* Fix for Video visibility */
[data-theme="dark"] video {
filter: brightness(0.9);
}

[data-theme="dark"] .elementor-button {
box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
}

[data-theme="dark"] .elementor-card,
[data-theme="dark"] .elementor-icon-box-wrapper {
background-color: var(--background-light-color) !important;
border-color: var(--border-color) !important;
}

[data-theme="dark"] footer {
background-color: var(--footer-bg-color) !important;
border-top: 1px solid var(--border-color) !important;
}

[data-theme="dark"] footer a {
color: var(--link-color) !important;
}

[data-theme="dark"] footer a:hover {
color: var(--link-hover-color) !important;
}

[data-theme="dark"] .our-services-list a,
[data-theme="dark"] .menu-services-list a {
color: #ffffff !important;
}

[data-theme="dark"] .elementor-widget-divider .elementor-divider-separator {
border-top-color: var(--border-color) !important;
}

/* Ensure logo remains visible and professional in dark mode */
[data-theme="dark"] .logo-wrapper {
filter: drop-shadow(0 0 5px rgba(255,255,255,0.1));
}

/* Fix for potential white backgrounds on inputs and form elements */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
background-color: var(--background-light-color) !important;
color: var(--text-color) !important;
border: 1px solid var(--border-color) !important;
}

/* Override Elementor colors with dynamic colors */
.elementor-kit-10 {
--e-global-color-primary: <?php echo $site_color; ?>;
}

/* Button styling */
.elementor-button,
.submit-btn,
.hero-btn,
.modal-action-btn {
background-color: <?php echo $button_bg_color; ?> !important;
color: <?php echo $button_text_color; ?> !important;
border-color: <?php echo $button_bg_color; ?> !important;
}

.elementor-button:hover,
.submit-btn:hover,
.hero-btn:hover,
.modal-action-btn:hover {
background-color: <?php echo $button_hover_color; ?> !important;
border-color: <?php echo $button_hover_color; ?> !important;
}

/* Links */
a {
color: <?php echo $link_color; ?>;
}

a:hover {
color: <?php echo $link_hover_color; ?>;
}

/* Text colors */
body {
color: <?php echo $text_color; ?>;
}

/* Header */
.elementor-element-dec2be6 {
background-color: <?php echo $header_bg_color; ?> !important;
}

/* Control Header Background Image Height - Prevent Expansion (no clipping) */
.elementor-element-dec2be6,
.elementor-element-dec2be6 .elementor-background-overlay {
min-height: auto !important;
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat !important;
}

.elementor-element-dec2be6[style*="background-image"] {
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat !important;
}

/* Compact header padding on mobile so brick area isn’t too tall */
@media (max-width: 768px) {
.elementor-element-dec2be6 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}

/* Elementor adds a spacer section with fixed height for sticky headers.
On mobile we force it to shrink so the brick band isn’t locked to desktop height. */
.elementor-element-dec2be6.elementor-sticky__spacer {
height: auto !important;
min-height: 0 !important;
}

/* Remove extra padding/margins from inner header section so height is driven by logo/menu only */
.elementor-element-db6b693,
.elementor-element-dec2be6 .elementor-top-column,
.elementor-element-dec2be6 .elementor-widget-wrap,
.elementor-element-dec2be6 .elementor-container {
padding-top: 0 !important;
padding-bottom: 0 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
}

/* Header container keeps flex centering but can grow for dropdowns */
.elementor-element-dec2be6 .elementor-container {
display: flex !important;
align-items: center !important;
}

.elementor-element-dec2be6 .elementor-column {
display: flex !important;
align-items: center !important;
}

/* Footer */
footer {
background-color: <?php echo $footer_bg_color; ?> !important;
color: <?php echo $footer_text_color; ?> !important;
}

/* Footer service links */
footer .our-services-list a,
footer .our-services-list li a {
color: <?php echo $footer_link_color; ?> !important;
}

/* Footer "Our Chimney & Fireplace Services" heading */
footer .elementor-element-de3f2ad .elementor-heading-title,
footer h2.elementor-heading-title:contains("Our Chimney") {
color: <?php echo $services_heading_color; ?> !important;
}

/* Footer headings (Service Area, Phone Number, Email Address) */
footer .elementor-image-box-title {
color: <?php echo $footer_heading_color; ?> !important;
}

/* Header Navigation Menu Hover Color */
.e-n-menu-title:hover,
.e-n-menu-title-container:hover,
.e-n-menu-title:hover .e-n-menu-title-text,
.e-n-menu-title-container:hover .e-n-menu-title-text {
color: <?php echo $site_color; ?> !important;
}

/* About Us Dropdown Menu Hover Color */
.e-n-menu-content .menu-list a:hover,
.e-n-menu-content .menu-list li a:hover {
color: <?php echo $site_color; ?> !important;
}

/* Our Services Dropdown Menu Hover Color */
.e-n-menu-content .menu-services-list a:hover,
.e-n-menu-content .menu-services-list li a:hover {
color: <?php echo $site_color; ?> !important;
}

/* Header Logo - Increased Size */
.elementor-element-8b422bd,
.elementor-element-8b422bd .elementor-widget-container {
display: flex !important;
align-items: center !important;
height: 100% !important;
overflow: hidden !important;
}

.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
width: 100% !important;
max-width: 100% !important;
height: 180px !important;
max-height: 180px !important;
object-fit: contain !important;
object-position: left center !important;
display: block !important;
}

/* Responsive logo sizing - prevent menu push */
@media (max-width: 1400px) {
.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
height: 160px !important;
max-height: 160px !important;
}
}

@media (max-width: 1200px) {
.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
height: 140px !important;
max-height: 140px !important;
}
}

@media (max-width: 1024px) {
.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
height: 120px !important;
max-height: 120px !important;
}
}

@media (max-width: 768px) {
.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
height: 100px !important;
max-height: 100px !important;
}
}

@media (max-width: 480px) {
.elementor-element-8b422bd img,
.elementor-element-8b422bd .elementor-widget-container img,
.elementor-widget-theme-site-logo img {
height: 85px !important;
max-height: 85px !important;
}
}

/* Ensure logo column doesn't push menu */
.elementor-element-f25cad0 {
flex: 0 0 auto !important;
max-width: 25% !important;
overflow: hidden !important;
}

@media (max-width: 1024px) {
.elementor-element-f25cad0 {
max-width: 30% !important;
}
}

@media (max-width: 768px) {
.elementor-element-f25cad0 {
/* Allow logo column to grow but still reserve reasonable space on small tablets */
max-width: 40% !important;
}
}

/* --- Mobile header responsiveness tweaks --- */
@media (max-width: 768px) {
/* Keep logo and toggle on a single row, spaced left/right and vertically centered */
.elementor-element-dec2be6 .elementor-container {
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: space-between !important;
}

/* Logo column: auto width, keep logo on the left */
.elementor-element-f25cad0 {
flex: 0 0 auto !important;
max-width: 50% !important;
justify-content: flex-start !important;
}

/* Menu column: auto width, align toggle to the right */
.elementor-element-8ccbd74 {
flex: 0 0 auto !important;
max-width: 50% !important;
justify-content: flex-end !important;
text-align: right !important;
}

/* Make sure the hamburger button itself is vertically centered and not too tall */
.elementor-element-8ccbd74 .e-n-menu-toggle {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
height: 44px !important;
width: 44px !important;
padding: 0 !important;
}

/* Hide header phone button / number on mobile */
.elementor-element-e467d82,
.elementor-element-da61cfe,
.elementor-element-e467d82 .elementor-button-text {
display: none !important;
}
}

/* Reduce Menu Background Image Size */
.elementor-element-cf17b2c,
.elementor-element-cf17b2c .elementor-widget-container,
.e-n-menu-wrapper {
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
}

.elementor-element-cf17b2c[style*="background-image"],
.elementor-element-cf17b2c .elementor-widget-container[style*="background-image"],
.e-n-menu-wrapper[style*="background-image"] {
background-size: 40% auto !important;
}