/* Transparent navbar and full-height hero styles */

/* Make the hero section full viewport height */
.elementor-element-5f1686c9 {
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    background-color: transparent !important;
    padding-top: 80px !important;
}

/* Adjust hero section padding on mobile */
@media (max-width: 767px) {
    .elementor-element-5f1686c9 {
        padding-top: 60px !important;
    }
}

/* Hero section video container - Override Elementor's invisible class */
.hero-video-section.elementor-invisible,
.hero-video-section {
    position: relative !important;
    overflow: hidden !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Full-screen background video */
.hero-background-video {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    width: auto !important;
    height: auto !important;
    transform: translate(-50%, -50%) !important;
    object-fit: cover !important;
    z-index: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    pointer-events: none !important;
}

.hero-background-video::-webkit-media-controls {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.hero-background-video::-webkit-media-controls-enclosure {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.hero-background-video::-webkit-media-controls-panel {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.hero-background-video::-webkit-media-controls-play-button {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-timeline {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-current-time-display {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-time-remaining-display {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-mute-button {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-volume-slider {
    display: none !important;
}

.hero-background-video::-webkit-media-controls-fullscreen-button {
    display: none !important;
}

/* Ensure content appears above video */
.hero-video-section > .elementor-element {
    position: relative !important;
    z-index: 1 !important;
}

/* Make header transparent by default */
.top_panel.top_panel_custom {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background-color: transparent !important;
    transition: background-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* Remove background from header container */
.top_panel .elementor-element-8cf575c {
    background-color: transparent !important;
}

/* Force transparent background on mobile for header containers */
@media (max-width: 1279px) {
    .top_panel,
    .top_panel > div,
    .top_panel .elementor-element-8cf575c,
    .top_panel .elementor,
    .top_panel .e-con {
        background-color: transparent !important;
        background-image: none !important;
    }

    /* Only add white background when scrolled */
    .top_panel.scrolled,
    .top_panel.scrolled > div,
    .top_panel.scrolled .elementor-element-8cf575c,
    .top_panel.scrolled .elementor,
    .top_panel.scrolled .e-con {
        background-color: #ffffff !important;
    }
}

/* Style the logo and menu items for visibility on transparent background */
.top_panel .logo_image {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

.top_panel .trx-addons-menu-link-text,
.top_panel .trx-addons-toggle-text {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    transition: color 0.3s ease, text-shadow 0.3s ease;
}

.top_panel .trx-addons-menu-link-text:hover {
    color: #f0f0f0 !important;
}

/* Styles for when navbar is scrolled (white background) */
.top_panel.scrolled {
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}

.top_panel.scrolled .elementor-element-8cf575c {
    background-color: #ffffff !important;
}

.top_panel.scrolled .logo_image {
    filter: none;
}

.top_panel.scrolled .trx-addons-menu-link-text,
.top_panel.scrolled .trx-addons-toggle-text {
    color: #000000 !important;
    text-shadow: none !important;
}

.top_panel.scrolled .trx-addons-toggle-text svg {
    fill: #000000 !important;
}

/* SVG icon color for hamburger menu */
.top_panel .trx-addons-toggle-text svg {
    fill: #ffffff;
    transition: fill 0.3s ease;
}

/* Ensure page content starts below the header */
.page_wrap {
    position: relative;
}

/* Add padding to prevent content from hiding behind fixed header */
.page_content_wrap {
    padding-top: 0 !important;
}

/* Ensure the hero section is positioned correctly */
.content_wrap_fullscreen {
    position: relative;
}

/* Remove any white backgrounds from page wrappers that might cover the video */
.post_content.entry-content,
.elementor.elementor-5590 {
    background-color: transparent !important;
}

/* Ensure post item doesn't have white background */
.post_item_single {
    background-color: transparent !important;
}

/* Mobile menu transparency fixes */
/* Make mobile menu background transparent when in hero section */
.menu_mobile_overlay {
    background-color: rgba(0, 0, 0, 0.95) !important;
    transition: background-color 0.3s ease;
}

.menu_mobile {
    background-color: transparent !important;
}

.menu_mobile_inner {
    background-color: transparent !important;
}

/* When navbar is NOT scrolled (in hero section), make mobile menu transparent */
.top_panel:not(.scrolled) ~ .menu_mobile_overlay,
.top_panel:not(.scrolled) .menu_mobile_overlay {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

.top_panel:not(.scrolled) ~ .menu_mobile,
.top_panel:not(.scrolled) .menu_mobile {
    background-color: transparent !important;
}

.top_panel:not(.scrolled) ~ .menu_mobile_inner,
.top_panel:not(.scrolled) .menu_mobile_inner {
    background-color: transparent !important;
}

/* When navbar IS scrolled (out of hero section), mobile menu can be white */
.top_panel.scrolled ~ .menu_mobile_overlay,
.top_panel.scrolled .menu_mobile_overlay {
    background-color: rgba(255, 255, 255, 0.98) !important;
}

.top_panel.scrolled ~ .menu_mobile,
.top_panel.scrolled .menu_mobile {
    background-color: #ffffff !important;
}

.top_panel.scrolled ~ .menu_mobile_inner,
.top_panel.scrolled .menu_mobile_inner {
    background-color: #ffffff !important;
}

/* Alternative selectors for common mobile menu patterns */
.sc_layouts_menu_mobile_overlay {
    transition: background-color 0.3s ease;
}

.top_panel:not(.scrolled) .sc_layouts_menu_mobile_overlay {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

.top_panel.scrolled .sc_layouts_menu_mobile_overlay {
    background-color: rgba(255, 255, 255, 0.98) !important;
}

.sc_layouts_menu_mobile,
.sc_layouts_menu_mobile_inner {
    transition: background-color 0.3s ease;
}

.top_panel:not(.scrolled) .sc_layouts_menu_mobile,
.top_panel:not(.scrolled) .sc_layouts_menu_mobile_inner {
    background-color: transparent !important;
}

.top_panel.scrolled .sc_layouts_menu_mobile,
.top_panel.scrolled .sc_layouts_menu_mobile_inner {
    background-color: #ffffff !important;
}