/* ========================================
   TOUR COLORS (Bobby J)
   ======================================== */

:root {
    /* Primary Brand Color - Conrad Gold/Brown */
    --primary-color: #A27A5A;
    --primary-color-rgb: 162, 122, 90;

    /* Secondary Brand Color */
    --secondary-color: #000000;
    --secondary-color-rgb: 0, 0, 0;
}

/* ========================================
   BRANDING CUSTOMIZATIONS
   ======================================== */

:root {
    /* Logo Height Override
       Source: index.css (line 104)
       Conrad uses auto height, Hilton uses 14rem */
    --logo-height: auto;
}

/* ========================================
   UI ELEMENT CUSTOMIZATIONS
   ======================================== */

/* Hide Multi-Language Button
   Source: btns.css (lines 213-223)
   Language selector button hidden for Conrad tour only.
   Button is located bottom-left on both desktop and mobile. */
section[btns] my-btn.lang {
    display: none !important;
}

/* ========================================
   GLASSMORPHISM OVERRIDES - DARK MODE
   C Gratiot - Dark black buttons/description to match Hilton
   ======================================== */

body {
    --glass-bg: rgba(0, 0, 0, 0.7);
    --glass-blur: blur(16px) saturate(180%) brightness(0.5);
    --btn-icon-color: #ffffff;
}

/* C Gratiot - White icons for dark mode buttons */
section[btns][common] my-btn svg path,
section[btns][common] my-btn svg circle,
section[btns][common] my-btn svg rect {
    fill: #ffffff !important;
}

/* ========================================
   DOTS MENU - PRIMARY COLOR RINGS
   C Gratiot - Use tour primary color for dots
   ======================================== */

dots-menu dots-menu-item .dot_ring {
    fill: var(--primary-color, #A27A5A) !important;
}

/* ========================================
   DOTS POSITION - NO AUDIO BUTTON
   C Gratiot - Move dots right to fill gap (no audio button in Conrad)
   Desktop only - mobile uses flexbox layout
   ======================================== */

@media screen and (min-width: 501px) {
    section[nav_dots] {
        right: 15rem; /* Core is 19rem, reduced by ~4rem (one button width) */
    }

    #group-title {
        right: 15rem;
    }
}