/* Artyzen - Tour-specific styles */
/* This file is NOT synced across tours */

/* S Livernois - Artyzen custom fonts (self-hosted woff2) */
@font-face {
    font-family: 'Hind';
    font-weight: 400;
    font-display: swap;
    src: url('media/fonts/Hind-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Hind';
    font-weight: 600;
    font-display: swap;
    src: url('media/fonts/Hind-SemiBold.woff2') format('woff2');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 100 900;
    font-display: swap;
    src: url('media/fonts/OpenSans.woff2') format('woff2');
}

:root {
    --font-primary: 'Hind', Verdana, sans-serif;
    --font-secondary: 'Open Sans', Arial, sans-serif;
}

@media screen and (max-width: 500px) {
    /* J. Louis - Make the Artyzen mobile menu background easier to read over panoramas. */
    body.menu-top aside::before {
        opacity: 0.85 !important;
    }
}

/* J. Louis - Position the Artyzen emergency-door title at the krpano polygon pointer. */
my-tooltip.artyzen-door-tooltip {
    position: fixed;
    bottom: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    margin-top: -1.2rem;
    transform: translate(-50%, -100%);
    line-height: 1.2;
    text-align: center;
    z-index: 10000;
}

/* J. Louis - Keep the active language text centered inside the tooltip box. */
my-tooltip.artyzen-door-tooltip span-lang,
my-tooltip.artyzen-door-tooltip span-lang > span {
    display: block;
    line-height: 1.2;
    text-align: center;
}


/* =====================================================
   S Livernois - Artyzen top menu overrides
   Matches old Panotour style: transparent bar, white text,
   white dropdowns with black text, no rounded corners.
   All selectors use body.menu-top prefix to beat core specificity.
   ===================================================== */

/* S Livernois - VN logo nudged down 2px for Artyzen alignment */
#vn_logo {
    top: calc(1rem + 2px);
}

/* S Livernois - Smaller top-left logo for Artyzen */
body.menu-top section[ui] > section[logo] img {
    width: 10rem;
}

/* S Livernois - Menu bar: transparent background, no rounded corners, 5px gap between items */
body.menu-top top-menu {
    background-color: transparent;
    border-radius: 0;
    height: auto;
    gap: 5px;
}

/* S Livernois - Group titles: transparent bg, Hind font, no left border, no padding-right for dot */
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-left: none;
    padding: 1.2rem 1.8rem;
    text-transform: uppercase;
    border: 0.5px solid transparent;
    transition: border-color 0.5s ease;
}

/* S Livernois - No rounded corners on first/last items */
body.menu-top top-menu top-menu-item:first-child top-menu-item-title,
body.menu-top top-menu top-menu-item:last-child top-menu-item-title {
    border-radius: 0;
}

/* S Livernois - Border appears on hover, open, and active 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: #fafafa;
}

/* S Livernois - Remove the dot indicator circle on group titles */
body.menu-top top-menu top-menu-item > top-menu-item-title::after {
    display: none;
}

/* S Livernois - Dropdown container: white background, no rounded corners */
body.menu-top top-menu acc-menu > acc-menu-item-children {
    background-color: rgba(255, 255, 255, 0.85);
    border-radius: 0;
    border: none;
}

/* S Livernois - Dropdown arrow: white triangle to match white dropdown */
body.menu-top top-menu top-menu-item top-menu-item-menu acc-menu::before {
    border-color: transparent transparent rgba(255, 255, 255, 0.85) transparent;
}

/* S Livernois - Dropdown group titles: black text on white bg, Hind font, uppercase */
body.menu-top top-menu acc-menu acc-menu-group > acc-menu-item-title {
    font-family: var(--font-primary);
    color: #333333;
    background-color: transparent;
    border-left: none;
    border-bottom-color: #d0d0d0;
    text-transform: uppercase;
}

/* S Livernois - Dropdown group title hover: light gray */
body.menu-top top-menu acc-menu acc-menu-group > acc-menu-item-title:hover,
body.menu-top top-menu acc-menu acc-menu-group > acc-menu-item-title:focus {
    background-color: #f2f2f2;
}

/* S Livernois - Dropdown chevron: dark for white bg */
body.menu-top top-menu acc-menu acc-menu-group > acc-menu-item-title::after {
    border-bottom-color: #333333;
    border-right-color: #333333;
}

/* J. Louis - Dropdown items match top-level group title size and weight. */
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: #333333;
    text-transform: uppercase;
}

/* S Livernois - Dropdown item dividers: solid gray like Panotour */
body.menu-top top-menu acc-menu acc-menu-item:not(:last-child) > acc-menu-item-title {
    border-bottom-color: #d0d0d0;
}

/* S Livernois - Dropdown item hover: light gray */
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 - Active item uses a subtle inset border instead of a gray 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(51, 51, 51, 0.45);
    color: #000000;
}

/* S Livernois - Visited checkmark: dark for white bg */
body.menu-top top-menu acc-menu acc-menu-item.visited > acc-menu-item-title::before,
body.menu-top top-menu acc-menu acc-menu-group.visited > acc-menu-item-title::before {
    border-color: #333333;
}

/* S Livernois - Dropdown group dividers: solid gray */
body.menu-top top-menu acc-menu acc-menu-group:not(:last-child) > acc-menu-item-title {
    border-bottom-color: #d0d0d0;
}
