/*
 * RC Mobile Nav v1.2.0
 */

.rcmn {
    display: none;
}

@media (max-width: 600px) {
    #rc-roxy-root.rc-roxy-nav-docked {
        bottom: var(--rcmn-roxy-bottom) !important;
    }
}

@media (max-width: 767px) {
    :root {
        --rcmn-height: 68px;
        --rcmn-red: #cc0000;
        --rcmn-black: #000;
    }

    body {
        padding-bottom: calc(var(--rcmn-height) + env(safe-area-inset-bottom, 0px)) !important;
    }

    .rcmn {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9990;
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        width: 100%;
        height: calc(var(--rcmn-height) + env(safe-area-inset-bottom, 0px));
        padding: 0 0 env(safe-area-inset-bottom, 0px);
        margin: 0;
        background: var(--rcmn-red);
        border: 0;
        border-top: 4px solid var(--rcmn-black);
        border-radius: 0;
        box-shadow: none;
        overflow: hidden;
        box-sizing: border-box;
    }

    .rcmn__item {
        position: relative;
        display: flex;
        min-width: 0;
        height: calc(var(--rcmn-height) - 4px);
        padding: 7px 3px 6px;
        margin: 0;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 2px;
        color: #fff !important;
        background: transparent;
        border: 0;
        border-radius: 0;
        text-decoration: none !important;
        text-align: center;
        box-sizing: border-box;
        -webkit-tap-highlight-color: transparent;
        transition: none;
    }

    .rcmn__item:hover,
    .rcmn__item:focus,
    .rcmn__item:active {
        color: #fff !important;
        background: var(--rcmn-black);
        text-decoration: none !important;
    }

    .rcmn__item.is-active {
        background: var(--rcmn-black);
        color: #fff !important;
    }

    .rcmn__icon {
        display: flex;
        width: 24px;
        height: 24px;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .rcmn__icon svg {
        display: block;
        width: 23px;
        height: 23px;
        fill: currentColor;
    }

    .rcmn__label {
        display: block;
        max-width: 100%;
        overflow: hidden;
        color: inherit;
        font-family: "Roboto Condensed", "Arial Narrow", "Helvetica Neue Condensed", Arial, sans-serif !important;
        font-size: 10px;
        font-stretch: condensed;
        font-weight: 800;
        line-height: 1;
        letter-spacing: -0.15px;
        text-transform: uppercase;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.admin-bar .rcmn {
        bottom: 0;
    }
}

@media (min-width: 768px) {
    .rcmn {
        display: none !important;
    }
}


/*
 * Consent/privacy dialogs must always win.
 * JS adds this body class whenever a known consent UI is visibly open.
 */
body.rcmn-consent-open .rcmn {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}


/*
 * Exact Rock Confidential privacy-bar handling.
 * The privacy banner is forced above normal page chrome. JS hides the nav
 * while this banner is actually visible.
 */
.privacy-bar.privacy-bottom {
    z-index: 1000001 !important;
}

@media (max-width: 767px) {
    body.rcmn-consent-open .rcmn {
        display: none !important;
    }
}

/* 1.1.8: leave scrolling room for the fixed navigation on artist profiles.
   Also keep anchor jumps above the bottom bar on narrow screens. */
@media (max-width: 767px) {
  body.single-rc_artist { padding-bottom:calc(var(--rcmn-height) + 100px + env(safe-area-inset-bottom,0px))!important; }
  body.single-rc_artist .rc-artist-nav,
  body.single-rc_artist .rc-artist-radio-embed,
  body.single-rc_artist [id^="rc-artist-"] { scroll-margin-bottom:calc(var(--rcmn-height) + 20px); }
}

/* 1.1.9: the embedded cross-origin player needs the bottom of the screen. */
@media (max-width:767px) {
 body.single-rc_artist.rcmn-radio-active .rcmn {transform:translateY(110%);pointer-events:none;visibility:hidden}
 /* Roxy stays reachable above the lower right edge of the embedded radio. */
 body.single-rc_artist.rcmn-radio-active #rc-roxy-root:not(.rc-roxy-open):not(.rc-roxy-keyboard) {opacity:0;pointer-events:none}
 body.single-rc_artist .rc-artist-radio-embed {scroll-margin-top:12px}
}
