/* J. Louis - Hotel Indigo tour-owned branding and Panotour-parity layout overrides. */

@font-face {
    font-family: 'Proxima Nova';
    font-weight: 400 700;
    font-display: swap;
    src: url('media/fonts/proxima_nova.ttf') format('truetype');
}

:root {
    --font-primary: 'Proxima Nova', Arial, sans-serif;
    --primary-color: #4c286f;
    --primary-color-rgb: 76, 40, 111;
}

/* J. Louis - Scale the tall Hotel Indigo mark to the published tour's restrained desktop footprint. */
body.menu-top section[ui] > section[logo] img {
    width: 12rem;
}

/* J. Louis - Recreate the transparent Panotour top menu with separated outlined group titles. */
body.menu-top top-menu {
    background-color: transparent;
    border-radius: 0;
    height: auto;
    gap: 0.5rem;
}

body.menu-top top-menu top-menu-item top-menu-item-title {
    font-family: var(--font-primary);
    font-size: 1.4rem;
    font-weight: 600;
    background-color: transparent;
    border: 1px solid transparent;
    border-left: 1px solid transparent;
    border-radius: 0;
    padding: 1.2rem 1.8rem;
    text-transform: uppercase;
    transition: border-color 0.3s ease;
}

/* J. Louis - Outline the hovered, open, or currently active Hotel Indigo menu group. */
body.menu-top top-menu top-menu-item:hover > top-menu-item-title,
body.menu-top top-menu top-menu-item.open > top-menu-item-title,
body.menu-top top-menu top-menu-item:has(acc-menu-item.active) > top-menu-item-title {
    border-color: #ffffff;
}

/* J. Louis - The legacy group treatment used an outline instead of the core circular indicator. */
body.menu-top top-menu top-menu-item > top-menu-item-title::after {
    display: none;
}

/* J. Louis - Keep scene dropdowns light, square, and readable over the panorama. */
body.menu-top top-menu acc-menu > acc-menu-item-children {
    background-color: rgba(255, 255, 255, 0.9);
    border: 0;
    border-radius: 0;
}

body.menu-top top-menu top-menu-item top-menu-item-menu acc-menu::before {
    border-color: transparent transparent rgba(255, 255, 255, 0.9) transparent;
}

body.menu-top top-menu acc-menu acc-menu-item > acc-menu-item-title {
    font-family: var(--font-primary);
    font-size: 1.4rem;
    font-weight: 600;
    color: #292929;
    text-transform: uppercase;
}

body.menu-top top-menu acc-menu acc-menu-item:not(:last-child) > acc-menu-item-title {
    border-bottom-color: #d0d0d0;
}

body.menu-top top-menu acc-menu acc-menu-item > acc-menu-item-title:hover,
body.menu-top top-menu acc-menu acc-menu-item > acc-menu-item-title:focus {
    background-color: #f2f2f2;
}

/* J. Louis - Mark the active scene with a quiet inset border rather than a heavy fill. */
body.menu-top top-menu acc-menu acc-menu-item.active > acc-menu-item-title {
    background-color: transparent;
    box-shadow: inset 0 0 0 1px rgba(41, 41, 41, 0.45);
    color: #000000;
}

body.menu-top top-menu acc-menu acc-menu-item.visited > acc-menu-item-title::before {
    border-color: #292929;
}

/* J. Louis - Keep the global Hotel Indigo dot group aligned for a tour without an audio button. */
@media screen and (min-width: 501px) {
    section[nav_dots],
    #group-title {
        right: 15rem;
    }
}

/* J. Louis - Give the responsive side menu a branded readable surface over bright pano regions. */
@media screen and (max-width: 1100px) {
    body.aside aside {
        background-color: rgba(35, 20, 48, 0.82) !important;
    }

    aside section[logo] img {
        max-width: 18rem;
        max-height: 13rem;
        object-fit: contain;
    }
}