/* Daystar main-site mega menu, extending Canyon's existing navigation. */


.site-main .nav-search .search-button {
    display: inline-flex;
    width: 44px;
    height: 44px;
    padding: 0;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background-color: rgba(0, 33, 71, 0.35);
    color: var(--whiteColor);
    cursor: pointer;
    font-size: 30px;
    line-height: 1;
    transition: background-color var(--transition), color var(--transition), transform var(--transition);
}

.site-main .nav-search .search-button:hover {
    background-color: rgba(0, 33, 71, 0.5);
    color: var(--mainColor);
    transform: scale(1.06);
}

.site-main .nav-search .search-button:focus-visible {
    outline: 2px solid var(--mainColor);
    outline-offset: 4px;
}

.site-main .navbar-area.style-2.sticky .nav-search .search-button {
    background-color: rgba(0, 33, 71, 0.08);
    color: var(--blackColor);
}

.site-main .navbar-area.style-2.sticky .nav-search .search-button:hover {
    background-color: rgba(0, 33, 71, 0.14);
    color: var(--mainColor);
}

@media only screen and (max-width: 991px) {
    .site-main .navbar-area .navbar .other-option .option-item .search-btn {
        display: inline-flex;
        min-height: 44px;
        padding: 10px 16px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        border: 0;
        border-radius: 999px;
        background-color: var(--blackColor);
        color: var(--whiteColor);
        cursor: pointer;
        font-family: var(--fontFamily);
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.03em;
        line-height: 1;
        text-transform: uppercase;
        transition: background-color var(--transition), color var(--transition), transform var(--transition);
    }

    .site-main .navbar-area .navbar .other-option .option-item .search-btn i {
        font-size: 22px;
        line-height: 1;
    }

    .site-main .navbar-area .navbar .other-option .option-item .search-btn:hover {
        background-color: var(--mainColor);
        color: var(--whiteColor);
        transform: translateY(-1px);
    }

    .site-main .navbar-area .navbar .other-option .option-item .search-btn:focus-visible {
        outline: 2px solid var(--whiteColor);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px var(--mainColor);
    }

    .site-main .navbar-area.style-2.sticky .navbar .other-option .option-item .search-btn {
        color: var(--whiteColor);
    }
}


@media only screen and (min-width: 992px) {
    .navbar-area .navbar .navbar-nav > .nav-item > button.nav-link {
        border: 0;
        background: transparent;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu {
        position: relative;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu {
        top: 65px;
        right: auto;
        left: 0;
        width: min(calc(var(--mega-menu-columns) * 265px), calc(100vw - 30px));
        max-height: min(70vh, 620px);
        padding: 0;
        overflow-x: hidden;
        overflow-y: auto;
        border: 1px solid #D6DADE;
        background-color: var(--whiteColor);
        box-shadow: rgba(149, 157, 165, 0.2) 0 8px 24px;
        transform: translate3d(0, 18px, 0);
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu--end {
        right: 0;
        left: auto;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu:focus-within > .mega-menu,
    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu:hover > .mega-menu {
        opacity: 1;
        visibility: visible;
        transform: translate3d(0, 0, 0);
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu:focus-within > .nav-link,
    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu:hover > .nav-link {
        color: var(--mainColor);
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu .row {
        flex-wrap: nowrap;
        min-height: 100%;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu .mega-menu__column {
        flex: 1 1 265px;
        min-width: 0;
        padding: 12px 30px;
        border-right: 1px solid #D6DADE;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu .mega-menu__column:last-child {
        border-right: 0;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu .mega-menu__list {
        margin: 0;
        padding: 0;
    }

    .navbar-area .navbar .navbar-nav > .nav-item.has-mega-menu > .mega-menu .mega-menu__title {
        margin: 0 0 8px;
        color: var(--blackColor);
        font-size: 15px;
        font-weight: 600;
        line-height: 1.4;
        text-transform: uppercase;
    }

    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .nav-link,
    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .mega-menu__label {
        display: block;
        padding: 10px 0;
        border-bottom: 1px dashed #D6DADE;
        color: var(--paragraphColor);
        font-weight: 500;
    }

    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .nav-link.active,
    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .nav-link:hover {
        color: var(--mainColor);
    }

    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item:last-child .nav-link,
    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item:last-child .mega-menu__label {
        border-bottom: 0;
    }

    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .nav-link:focus-visible {
        outline: 2px solid var(--mainColor) !important;
        outline-offset: 2px;
    }
}

.responsive-navbar .accordion-link--label {
    cursor: default;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .navbar-area .navbar .others-option .option-item:first-child {
        display: none;
    }

    .navbar-area .navbar .navbar-nav .nav-item .mega-menu .nav-item .nav-link {
        font-size: 14px;
    }
}

/* Global Utility Bar Styling (Premium Dark Cyan) */
.utility-bar {
    color: var(--whiteColor);
    background-color: var(--color-cyan-700);
    border-bottom: 1px solid rgb(0 21 45 / 28%);
}

.utility-bar__divider {
    background-color: rgb(0 21 45 / 30%);
}

.utility-bar__contacts i {
    color: var(--whiteColor);
}

.utility-bar a,
.utility-bar a:hover {
    color: var(--whiteColor);
}