/*!
Theme Name: Shift-Workspaces
Author: Madcraft

Version: 1.0.0
Tested up to: 8.0
Requires PHP: 8.0
*/

.accent-color,
.accent-color.menu-item a,
.accent-color.menu-item a p{
    color: #c6a275;
}

.header{
   background: #191919 !important;
}

.header.scrolled{
    background: rgba(25, 25, 25, .6) !important;
}
/* --- Desktop Styles (1025px and above) --- */
@media (min-width: 1025px) {

    .header__menu-icon{
        display: none !important;
    }
    .header .header__info {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* Target the WP Menu UL */
    .header .header__info .desktop-only-nav-list {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0;
        gap: 25px;
    }

    .header .header__info .header__nav-item {
        position: relative;
    }

    /* Submenu - Hidden State */
    .header .header__info .header__nav-sub_list {
        display: none; /* Physical removal */
        position: absolute;
        top: 100%;
        left: 0;
        width: max-content;
        min-width: 240px;
        z-index: 1000;
        box-shadow: 0 10px 30px rgba(0,0,0,0.5);
        margin-top: 30px;
    }


    .header .header__info .header__nav-item:hover > .header__nav-sub_list::before {
        content: "";
        position: absolute;
        
        /* This reaches UP into the gap */
        top: -30px; 
        left: 0;
        width: 100%;
        height: 30px; /* Must match the margin-top exactly */
        background: transparent; /* Invisible but hoverable */
        display: block;
    }
    

    /* Submenu - Hover State */
    .header .header__info .header__nav-item:hover > .header__nav-sub_list {
        display: block; /* Show menu */
        animation: navFadeIn 0.2s ease-out forwards;
        
    }
    .header .header__info .header__nav-sub_list li{
        background-color: #000000; /* Dark theme background */
    }

    .header .header__nav-item a,
    .header .header__nav-item a p{
        font-family: mr-eaves-sans, sans-serif;
        font-size: 22px;
    }
    .header .header__info .header__nav-sub_item a {
        display: block;
        padding: 12px 20px;
        color: #f3eee7;
        font-size: 22px;
        text-decoration: none;
        transition: background 0.3s ease, color 0.3s ease;
    }
    
    /* Submenu Title */
    .header .header__nav-sub-title {
        display: block;
        font-size: 22px;
        font-weight: 500;
        color: #f3eee7;
    }
    
    /* Submenu Subtext */
    .header .subtext {
        display: block;
        font-size: 18px;
        color: rgba(243, 238, 231, 0.8); /* Faded for hierarchy */
        font-weight: 400;
        line-height: 1.3;
    }
    .header .header__info .header__nav-sub_item a:hover *{
        color: #000000; /* Invert colors on hover */
    }
    .header .header__info .header__nav-sub_item a:hover {
        background-color: #f3eee7;
        color: #000000; /* Invert colors on hover */
    }

    /* Rotate icon on hover */

    .header .header__nav-item a{
        gap: 7px;
    }
    .header .header__info .header__nav-item .header__nav-icon {
        display: block !important;
        opacity: 1;
        margin-top: 2px;
    }
    
    .header .header__info .header__nav-item:hover .header__nav-icon {
        transform: rotate(180deg);
    }
}

.header__nav-item .header__nav-icon{
    display: block;
    opacity: 1;
}

.header__nav-item a svg{
    transform: none ;
}
.header .header__info .header__nav-item.is-open .header__nav-icon {
    transform: rotate(180deg);
}

/* --- Mobile Styles (1024px and below) --- */
@media (max-width: 1024px) {

    .header .subtext {
        display: block;
        font-size: 18px;
        color: rgba(243, 238, 231, 0.8); /* Faded for hierarchy */
        font-weight: 400;
        line-height: 1.3;
    }

    .header .header__nav-sub_list li a{
        max-width: 100%;
    }

    /* Hide the desktop menu containers in the main header bar */
    .header .header__info .header__left .desktop-only-nav-list,
    .header .header__info .header__right .desktop-only-nav-list {
        display: none !important;
    }

    /* If you want to hide the entire containers including any extra buttons */
    .header .header__info .header__right {
        display: none !important;
    }
    
    /* Ensure the mobile icon in header__left stays visible */
    .header .header__info .header__left {
        display: flex;
        justify-content: flex-start;
    }

    .header .header__info .header__logo {
        position: static;
        transform: none;
        margin: 0 auto;
    }

    .header__nav-item{
        flex-direction: column;
    }
    .header .header__nav-sub_list{
            position: relative !important;
        top: 0px !important;
        left: 0px !important;
        gap: 5px;
        padding-top: 15px;
    }

    .header .header__nav-item .header__nav-sub_list{
        display: none;
    }
    .header .header__nav-item.is-open .header__nav-sub_list{
        display: block;
    }

    .header .header__nav-sub_list li{
        padding: 5px 0;
        
    }
    .header .header__nav-sub_list a{
        font-size: 22px;
        max-width: max-content;
        padding: 5px 0;
    }
    
}

/* Simple Animation */
@keyframes navFadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}



/* Single Location */
.single-location .hero-text{
    justify-content: center;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
} 

 
.flex{
    display: flex;
    display: -webkit-flex;
    width: 100%;
    
}
.flex.aligncenter{
        justify-content: center;
}
.hero-text  a.design-btn{
    margin-top: 20px;
    font-size: 20px !important;
}
@media (max-width: 828px) {
    .hero-text  a.design-btn{
        font-size: 18px !important;
    }
}

.video-block{
    width: 100% !important;
}

.video-block,
img.productivity__image {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    translate: none !important;
    rotate: none !important;
    scale: none !important;
    transition: none !important;
}

.design-btn.gold{
    background: #c6a275;
    color: #000000;
}
.design-btn.gold:hover{
    background: #f3eee7;
}
.hero-text {
    align-items: center;    /* Centers everything horizontally */
}
/* Target the specific flex container inside hero-text */
.hero-text .flex.aligncenter {
    display: flex !important;
    flex-direction: column !important; /* Forces vertical stacking */
    align-items: flex-start;           /* Aligns items to the left */
    gap: 10px;                         /* Exact space between button and address */
    margin-top: 15px;
    justify-content: center !important;
    margin-top: 30px !important;
}

/* Force every child (button, p, span) to be its own line */
.hero-text .flex.aligncenter > * {
    flex: 0 0 100%;
    width: 100%;
    margin: 0 !important;    /* Removes the "strange height" from <p> margins */
    display: block;
}

/* Specifically fix the button if it's trying to be inline */
.hero-text .flex.aligncenter .design-btn {
    width: max-content;               /* Button only as wide as its text */
    display: flex;
    text-align: center;
    margin: 0 auto !important;
}

/* Hide that empty <p> tag that often appears in WP editors */
.hero-text .flex.aligncenter p:empty {
    display: none !important;
}

.hero-text .address{
    padding-top: 0px;
}

/* END Single Location */

.fancybox-button.fancybox-button--close{
    background: #ffffff;
    opacity: 0.8;
}
.fancybox-button.fancybox-button--close:hover{
    opacity: 1;
}


.footer__contact__made a{
    font-size: 19px;
    font-weight: 500;
}

.accent-color.menu-item a {
    background: #c6a275;
    color: #000000;
    padding: 10px 20px;
    width: max-content;
}
.accent-color.menu-item a p{
    color: #000000;
    font-weight: 500;
}
.accent-color.menu-item a:hover {
    background: #ffffff;
}


/* Hero overlay */
@media (min-width: 881px) {
    
    .home .hero,
    .home .hero-video,
    .home .hero-videos{
        min-height: 600px;
    }
    
    .hero-overlay{
        position: absolute;
        top: 0px; width: 100%; height: 100%;
        display: flex;
        align-items: center;
        padding: 0 1rem;
        
    }
    
    .hero-overlay .inner{
        max-width: 900px;
        margin: 0 auto;
        background: #000000;
                padding: 50px;
    }
    
    .hero-overlay h1{
        font-size: 50px;
        width: 100%;
    }
    
    .hero-overlay .content-text p{
    width: 100%;
        padding-top: 20px;
    }

}

.mobile-only{
    display: none;
}

@media (max-width: 880px) {
    .mobile-only{
        display: block;
    }
    .home .hero,
    .home .hero-video,
    .home .hero-videos{
        min-height: 300px;
        height: 100%;
        margin: 0px;
    }

    .hero-overlay{
            display: none;
    }
}

.content.mobile-only .content-text,
.hero .content-text {
    flex-direction: column;
    justify-content: center;
}
.content.mobile-only .content-text .design-btn,
.hero .content-text .design-btn{
    margin: 0 auto;
}

.content.mobile-only .content-text p{
    width: 100%;
}

@media (min-width: 769px) {
    .posts-location .posts-location-image > img{
        margin-left: -40px;
    }
}
.posts-location__item-button{
    gap: 10px;
    display: flex;
    flex-direction: column;
}

.posts-location__item .explore-trigger.active{
    background: #ffffff !important;
}
.posts-location__item:hover .explore-trigger.active{
    background: #c6a275 !important;
}

.posts-location__item .more *{
    color: #f3eee7;
    font-weight: 300;
    font-size: 18px;    
}
.posts-location__item:hover .more *{
    color: #191919;   

}
.posts-location__item .more .heading {
    margin-top: 10px;
    font-weight: 600;
    font-size: 20px;
}