/*
 * Site menu on the public event page only: transparent over the cover image, with pill
 * buttons that carry an icon; header.js adds .is-solid once the cover has scrolled away.
 */

.event-landing-page .header-top {
    background: transparent;
    box-shadow: none;
    transition: background-color 0.25s ease, backdrop-filter 0.25s ease;
}

.event-landing-page .header-top.is-solid {
    background: rgb(20 20 20 / 78%);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}

.event-landing-page .header-top .navbar {
    min-height: 64px;
    padding-left: var(--rg-space-10);
    padding-right: var(--rg-space-10);
    background: transparent;
}

.event-landing-page .header-top .logo-area {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 var(--rg-space-8) 0 0;
    padding: 0;
    background: transparent;
}

.event-landing-page .header-top .logo-area .navbar-brand {
    padding: 0;
}

.event-landing-page .header-top .logo-area .navbar-brand img {
    height: 28px;
    width: auto;
}

/* Staff menu items over the image */
.event-landing-page .header-top .hexadash-top-menu > ul > li > a,
.event-landing-page .header-top .hexadash-top-menu > ul > li > a .las {
    color: var(--rg-color-inverse-text);
}

.event-landing-page .header-top .hexadash-top-menu > ul > li.has-subMenu > a::after {
    color: var(--rg-color-inverse-text);
}

/* Right-hand cluster: translucent pills with an icon */
.event-landing-page .header-top .navbar-right__menu {
    gap: var(--rg-space-2);
}

.event-landing-page .header-top .navbar-right__menu > li {
    margin: 0;
}

.event-landing-page .header-top .nav-booking__link,
.event-landing-page .header-top .navbar-right__menu .nav-author .nav-item-toggle,
.event-landing-page.event-landing-page #languageToggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--rg-space-2);
    height: 40px !important;
    min-width: 0 !important;
    padding: 0 14px !important;
    border-radius: var(--rg-radius-pill);
    background: rgb(255 255 255 / 14%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    color: var(--rg-color-inverse-text);
    font-size: var(--rg-font-size-base);
    transition: background var(--rg-transition);
}

.event-landing-page .header-top .nav-booking__link:hover,
.event-landing-page .header-top .nav-booking__link:focus-visible,
.event-landing-page .header-top .navbar-right__menu .nav-author .nav-item-toggle:hover,
.event-landing-page.event-landing-page #languageToggle:hover {
    background: rgb(255 255 255 / 24%);
    color: var(--rg-color-inverse-text);
}

.event-landing-page .header-top #languageToggle::before,
.event-landing-page .header-top #languageToggle::after {
    display: none !important;
}

.event-landing-page .header-top #languageToggle span,
.event-landing-page .header-top .nav-item-toggle .nav-item__title {
    color: inherit;
}

.event-landing-page .header-top .nav-language__icon {
    display: inline-block;
    font-size: 17px;
}

/* Guest "Sign in": the solid white pill */
.event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle {
    padding: 0 18px 0 14px !important;
    background: var(--rg-color-surface);
    color: var(--rg-color-ink);
}

.event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle:hover {
    background: var(--rg-color-hatch-a);
    color: var(--rg-color-ink);
}

.event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle u {
    text-decoration: none;
    color: inherit;
}

.event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle .uil {
    margin: 0 !important;
    font-size: 17px;
}

/* Mobile menu toggle in white */
.event-landing-page .header-top .navbar-right__mobileAction svg,
.event-landing-page .header-top .navbar-right__mobileAction img,
.event-landing-page .header-top .sidebar-toggle svg,
.event-landing-page .header-top .sidebar-toggle img {
    filter: brightness(0) invert(1);
}

@media (max-width: 767px) {
    .event-landing-page .header-top .navbar {
        min-height: 56px;
        padding-left: var(--rg-space-4);
        padding-right: 6px;
    }

    .event-landing-page .header-top .logo-area .navbar-brand img {
        height: 22px;
    }

    .event-landing-page .header-top .navbar-right__menu {
        gap: var(--rg-space-1);
    }

    /* Icon-only buttons on phones */
    .event-landing-page .header-top .nav-booking__link,
    .event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle {
        justify-content: center;
        width: var(--rg-control-height);
        height: var(--rg-control-height) !important;
        padding: 0 !important;
        font-size: 0;
    }

    .event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle u {
        display: none;
    }

    .event-landing-page.event-landing-page #languageToggle {
        height: var(--rg-control-height) !important;
        padding: 0 12px !important;
        background: transparent;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .event-landing-page .header-top .nav-language__icon {
        display: none;
    }

    /* A guest's mobile menu only repeats "My booking" and "Sign in", already shown as icons */
    .event-landing-page .header-top .app-top-nav--guest .navbar-right__mobileAction {
        display: none !important;
    }

    .event-landing-page .header-top .nav-booking__link,
    .event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle {
        background: transparent;
        color: var(--rg-color-inverse-text);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .event-landing-page .header-top .nav-booking__link .uil,
    .event-landing-page .header-top .app-top-nav--guest .nav-author .nav-item-toggle .uil {
        font-size: 20px;
    }
}

/*
 * Tablets with the staff menu: it does not fit next to the search box, so the search (also
 * reachable from the panel) and the user's name give way; the avatar stays.
 */
@media (min-width: 768px) and (max-width: 1439px) {
    .event-landing-page .header-top .navbar-right__menu .nav-global-search {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .event-landing-page .header-top .navbar {
        padding-left: var(--rg-space-6);
        padding-right: var(--rg-space-6);
    }

    .event-landing-page .header-top .app-top-nav .hexadash-top-menu > ul > li:not(:last-child) {
        margin-right: 14px !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .event-landing-page .header-top .navbar-right__menu .nav-author .nav-item__title {
        display: none !important;
    }

    .event-landing-page.event-landing-page #languageToggle {
        padding: 0 12px !important;
    }

    .event-landing-page .header-top .navbar-right__menu .nav-author .nav-item-toggle {
        padding: 0 4px !important;
    }

    .event-landing-page .header-top .nav-language__icon {
        display: none;
    }
}