/*
 * RL-E106-PUBLIC-DESIGN-SYSTEM-V1
 *
 * Energy 106 — single public brand palette.
 *
 * Loaded only for station ID 1 / harbour-radio
 * through the guarded Vibe templates.
 *
 * Do not add layout hacks or page-specific positioning here.
 */

body.vibe-site {

    /* Approved brand palette */

    --e106-pink: #ed1584;
    --e106-purple: #763493;
    --e106-yellow: #ecdd0e;

    /* Surfaces */

    --e106-deep: #170621;
    --e106-card: #250638;
    --e106-card-raised: #35104c;

    /* Borders */

    --e106-border: #523866;
    --e106-radius: 5px;

    /* Typography */

    --e106-white: #ffffff;
    --e106-muted: #c8b0d4;

    /*
     * Map approved colours to existing Vibe variables.
     * These affect Energy 106 only.
     */

    --vibe-primary: var(--e106-pink);
    --vibe-bg-card: var(--e106-card);
    --vibe-bg-card-raised: var(--e106-card-raised);
    --vibe-bg-sidebar: var(--e106-deep);
    --vibe-text-primary: var(--e106-white);
    --vibe-card-radius: var(--e106-radius);

    /*
     * Existing Energy 106 card and connection systems.
     */

    --e106-home-card-border: var(--e106-border);
    --e106-home-card-radius: var(--e106-radius);

    --connection-border: var(--e106-border);
    --connection-radius: var(--e106-radius);
}

/*
 * Shared homepage card colours.
 * Dimensions, positioning and interactions unchanged.
 */

body.vibe-site .vibe-homepage
.vibe-today-schedule--energy
.vibe-today-schedule__item,

body.vibe-site .vibe-homepage
.vibe-today-schedule--energy
.vibe-today-schedule__promo {

    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}

body.vibe-site .vibe-homepage
.energy-home-tiles__card {

    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}

/*
 * Energy Connection and advertising.
 * Only border presentation is standardised.
 */

body.vibe-site .e106-crew-ad-layout
.e106-crew-ad-layout__art,

body.vibe-site .e106-crew-ad-layout
.ecv3.ecv3--reference {

    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}

/*
 * Inner-page common typography.
 */

body.vibe-site.vibe-site--inner
.vibe-page-hero h1 {

    color: var(--e106-white);
}

/*
 * RL-E106-NEWS-HOMEPAGE-PALETTE-V4
 *
 * News page uses the approved Energy 106
 * homepage card colours and border system.
 *
 * No layout, image or typography changes.
 */

/*
 * RL-E106-NEWS-SHARED-TOKENS-V5
 *
 * Link legacy News colours to the approved homepage.
 * Restricted to Energy 106's News component.
 */

body.vibe-site.vibe-site--inner .energy-news-v2 {
    --buzz-bg: var(--e106-card);
    --buzz-border: var(--e106-border);
    --buzz-pink: var(--e106-pink);
}



/* Category navigation */

body.vibe-site.vibe-site--inner
.rl-redline-news__categories {
    background: var(--e106-card) !important;
    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}

/* Featured story, supporting stories and news grid */

body.vibe-site.vibe-site--inner
.rl-redline-news__featured,

body.vibe-site.vibe-site--inner
.rl-redline-news__lead-link,

body.vibe-site.vibe-site--inner
.rl-redline-news__side,

body.vibe-site.vibe-site--inner
.rl-redline-news__side-story,

body.vibe-site.vibe-site--inner
.rl-redline-news__card,

body.vibe-site.vibe-site--inner
.rl-redline-news__empty {
    background: var(--e106-card) !important;
}

/* Outer card borders */

body.vibe-site.vibe-site--inner
.rl-redline-news__featured,

body.vibe-site.vibe-site--inner
.rl-redline-news__side-story,

body.vibe-site.vibe-site--inner
.rl-redline-news__card {
    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}

/* Active category retains the Energy pink */

body.vibe-site.vibe-site--inner
.rl-redline-news__categories a.is-active {
    background: var(--e106-pink) !important;
    color: var(--e106-white) !important;
}

/*
 * Common focus indication.
 * Preserve the approved yellow accessibility accent.
 */

body.vibe-site
.e106-crew-ad-layout__link:focus-visible {

    outline-color: var(--e106-yellow);
}

/* RL-E106-PRELAUNCH-COLOUR-V3 */

body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href],
body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href] span,
body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href] font {
    color: var(--e106-pink) !important;
    text-decoration-color: currentColor;
}

body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href]:hover,
body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href]:hover span,
body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href]:hover font {
    color: var(--e106-white) !important;
}

body.vibe-site.vibe-site--inner
.vibe-custom-page--energy-complaints a[href]:focus-visible {
    outline: 2px solid var(--e106-yellow);
    outline-offset: 3px;
}


/*
 * RL-E106-RELATED-NEWS-COLOURS-V6
 *
 * More From Energy Buzz:
 * use the approved shared Energy 106 card colours.
 *
 * Existing dimensions, imagery and responsive layout
 * are deliberately left unchanged.
 */

body.vibe-site.vibe-site--inner
.vibe-news-article__more
.vibe-news-article__more-card {
    background: var(--e106-card) !important;
    border-color: var(--e106-border) !important;
    border-radius: var(--e106-radius) !important;
}


/*
 * RL-E106-INTERNAL-WEATHER-RESTYLE-V1
 *
 * Existing Vibe Weather module.
 * Energy 106 internal-page sidebar only.
 * Presentation changes only.
 */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather {
    --vibe-primary: var(--e106-pink, #ed1584);
    --vibe-muted: var(--e106-muted, #c8b0d4);

    margin-bottom: 16px;
    overflow: hidden;
    border: 1px solid var(--e106-border, #523866) !important;
    border-radius: var(--e106-radius, 5px) !important;
    background: var(--e106-card, #250638) !important;
    color: #fff;
    box-shadow: none !important;
}

/* Remove legacy full-width pink strip. */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather::before {
    display: none !important;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-content-block__body {
    padding: 17px 18px 18px !important;
}

/* Weather / Belfast masthead */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__masthead {
    gap: 10px;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--e106-border, #523866);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__brand {
    gap: 9px;
    color: var(--e106-pink, #ed1584);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__brand strong {
    color: #fff !important;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .045em;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__brand svg {
    width: 23px;
    height: 21px;
    flex-basis: 23px;
    color: var(--e106-pink, #ed1584);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__masthead-location {
    gap: 5px;
    color: var(--e106-muted, #c8b0d4);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__masthead-location span {
    color: var(--e106-muted, #c8b0d4);
    font-size: 10px;
    font-weight: 850;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__masthead-location svg {
    color: var(--e106-pink, #ed1584);
}

/* Current temperature */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__hero {
    gap: 12px;
    padding: 19px 0 18px;
    border-bottom: 1px solid var(--e106-border, #523866);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__today {
    gap: 7px;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__today span {
    color: var(--e106-muted, #c8b0d4) !important;
    font-size: 14px !important;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__today strong {
    color: #fff !important;
    font-size: 37px !important;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.035em;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__condition {
    margin-top: 5px;
    color: var(--e106-muted, #c8b0d4) !important;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 650;
}

/* Forecast action */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__forecast-link {
    gap: 7px;
    color: var(--e106-yellow, #ecdd0e) !important;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 900;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__forecast-link svg {
    width: 16px;
    height: 16px;
    color: var(--e106-yellow, #ecdd0e);
}

/* Five-day forecast */

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__forecast {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    padding-top: 16px;
    padding-bottom: 2px;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day {
    min-width: 0;
    padding: 0 4px;
    text-align: center;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day + .vibe-sidebar-weather__day {
    border-left: 1px solid var(--e106-border, #523866);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day-name {
    color: #fff !important;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .025em;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day-icon {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    margin: 9px auto;
    color: var(--e106-pink, #ed1584);
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day-icon svg {
    width: 27px;
    height: 27px;
    max-width: 100%;
    max-height: 100%;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day-high {
    color: #fff !important;
    font-size: 17px;
    line-height: 1.1;
    font-weight: 950;
}

body.vibe-site.vibe-site--inner
.vibe-page-sidebar
.vibe-sidebar-content-block--weather
.vibe-sidebar-weather__day-low {
    margin-top: 4px;
    color: var(--e106-muted, #c8b0d4) !important;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;
}

/* Responsive sidebar widths */

@media (max-width: 767px) {
    body.vibe-site.vibe-site--inner
    .vibe-page-sidebar
    .vibe-sidebar-content-block--weather
    .vibe-sidebar-content-block__body {
        padding: 16px !important;
    }

    body.vibe-site.vibe-site--inner
    .vibe-page-sidebar
    .vibe-sidebar-content-block--weather
    .vibe-sidebar-weather__today span {
        font-size: 13px !important;
    }

    body.vibe-site.vibe-site--inner
    .vibe-page-sidebar
    .vibe-sidebar-content-block--weather
    .vibe-sidebar-weather__today strong {
        font-size: 33px !important;
    }

    body.vibe-site.vibe-site--inner
    .vibe-page-sidebar
    .vibe-sidebar-content-block--weather
    .vibe-sidebar-weather__forecast {
        grid-template-columns: repeat(5, minmax(48px, 1fr));
        overflow-x: auto;
    }
}


/* RL-E106-WHATSAPP-CLEAN-V3 START */

/* Native RadioLaunch WhatsApp block — Energy 106 */

.vibe-site .vibe-sidebar-content-block--whatsapp-studio {
    display: block;
    width: 100%;
    padding: 0 !important;
    margin: 0;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    container-type: inline-size;
}

.vibe-site .e106-wa3-card,
.vibe-site .e106-wa3-card * {
    box-sizing: border-box;
}

.vibe-site .e106-wa3-card {
    display: grid;
    grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
    align-items: center;
    gap: 18px;

    width: 100%;
    min-width: 0;
    min-height: 250px;
    padding: 24px 27px;

    border: 1px solid var(--e106-border, #523866);
    border-radius: 9px;
    background: var(--e106-deep, #170621);
    box-shadow: none;
    overflow: hidden;
}

.vibe-site .e106-wa3-art {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
}

.vibe-site .e106-wa3-art svg {
    display: block;
    width: 100%;
    max-width: 340px;
    height: auto;
    overflow: visible;
}

.vibe-site .e106-wa3-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 13px;
    width: 100%;
    min-width: 0;
}

.vibe-site .e106-wa3-heading {
    display: flex;
    flex-direction: column;
    gap: 0;

    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;

    font-family: inherit;
    font-size: clamp(25px, 7cqw, 58px);
    font-weight: 900;
    line-height: .93;
    letter-spacing: -.055em;
    text-transform: uppercase;
    text-align: left;
}

.vibe-site .e106-wa3-heading-white {
    display: block;
    color: #ffffff;
}

.vibe-site .e106-wa3-heading-pink {
    display: block;
    color: var(--e106-pink, #ed1584);
}

.vibe-site .e106-wa3-number-line {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 0;
}

.vibe-site .e106-wa3-whatsapp {
    display: block;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    color: #ffffff;
}

.vibe-site .e106-wa3-number {
    display: block;
    min-width: 0;
    color: var(--e106-yellow, #ecdd0e);

    font-family: inherit;
    font-size: clamp(16px, 4.4cqw, 35px);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.025em;
    white-space: nowrap;
}

.vibe-site a.e106-wa3-button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    width: min(100%, 285px);
    min-width: 0;
    min-height: 49px;
    padding: 11px 18px;

    border: 1px solid var(--e106-pink, #ed1584);
    border-radius: 6px;

    background: var(--e106-pink, #ed1584);
    color: #ffffff !important;

    font-family: inherit;
    font-size: clamp(13px, 2.6cqw, 19px);
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    text-decoration: none !important;

    transition: filter .15s ease;
}

.vibe-site a.e106-wa3-button span {
    display: block;
    color: inherit;
}

.vibe-site a.e106-wa3-button svg {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    color: #ffffff;
}

.vibe-site a.e106-wa3-button:hover {
    background: var(--e106-pink, #ed1584);
    color: #ffffff !important;
    filter: brightness(.88);
    transform: none !important;
}

.vibe-site a.e106-wa3-button:focus-visible {
    outline: 2px solid var(--e106-yellow, #ecdd0e);
    outline-offset: 3px;
}

/* Scale the same artwork for narrower sidebars. */

@container (max-width: 590px) {

    .vibe-site .e106-wa3-card {
        gap: 10px;
        min-height: 175px;
        padding: 15px;
    }

    .vibe-site .e106-wa3-content {
        gap: 9px;
    }

    .vibe-site .e106-wa3-heading {
        font-size: clamp(20px, 7cqw, 41px);
    }

    .vibe-site .e106-wa3-number-line {
        gap: 7px;
    }

    .vibe-site .e106-wa3-whatsapp {
        flex-basis: 27px;
        width: 27px;
        height: 27px;
    }

    .vibe-site .e106-wa3-number {
        font-size: clamp(14px, 4.3cqw, 25px);
    }

    .vibe-site a.e106-wa3-button {
        min-height: 38px;
        padding: 8px 11px;
        font-size: clamp(12px, 2.8cqw, 15px);
    }

    .vibe-site a.e106-wa3-button svg {
        flex-basis: 16px;
        width: 16px;
        height: 16px;
    }
}

@container (max-width: 390px) {

    .vibe-site .e106-wa3-card {
        grid-template-columns: minmax(0, 36%) minmax(0, 1fr);
        gap: 8px;
        min-height: 150px;
        padding: 12px;
    }

    .vibe-site .e106-wa3-content {
        gap: 8px;
    }

    .vibe-site .e106-wa3-heading {
        font-size: clamp(18px, 7cqw, 27px);
    }

    .vibe-site .e106-wa3-number {
        font-size: clamp(12px, 4.3cqw, 17px);
    }

    .vibe-site .e106-wa3-whatsapp {
        flex-basis: 22px;
        width: 22px;
        height: 22px;
    }

    .vibe-site a.e106-wa3-button {
        min-height: 34px;
        gap: 6px;
        padding: 7px 9px;
        font-size: 11px;
    }

    .vibe-site a.e106-wa3-button svg {
        flex-basis: 13px;
        width: 13px;
        height: 13px;
    }
}

/* RL-E106-WHATSAPP-CLEAN-V3 END */

/* RL-E106-WHATSAPP-CLICK-FIX-V1 START */

/* Keep decorative artwork behind interactive content. */

.vibe-site .e106-wa3-card {
    position: relative;
    isolation: isolate;
}

.vibe-site .e106-wa3-art {
    position: relative;
    z-index: 1;
    pointer-events: none !important;
}

.vibe-site .e106-wa3-art svg {
    pointer-events: none !important;
}

.vibe-site .e106-wa3-content {
    position: relative;
    z-index: 5;
    pointer-events: auto !important;
}

/* Ensure the actual WhatsApp link receives clicks. */

.vibe-site
.vibe-sidebar-content-block--whatsapp-studio
.e106-wa3-content
a.e106-wa3-button {
    position: relative !important;
    z-index: 10 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    touch-action: manipulation;
}

/* Decorative elements must not intercept clicks. */

.vibe-site .e106-wa3-button svg,
.vibe-site .e106-wa3-button span,
.vibe-site .e106-wa3-button::before,
.vibe-site .e106-wa3-button::after {
    pointer-events: none !important;
}

/* RL-E106-WHATSAPP-CLICK-FIX-V1 END */


/* RL-E106-WHATSAPP-NUMBER-LINK-V1 START */

.vibe-site .e106-wa3-number-line a.e106-wa3-number-link {
    display: inline-flex !important;
    align-items: center;
    position: relative;
    z-index: 10;
    width: max-content;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0 !important;
    background: transparent !important;
    color: var(--e106-yellow, #ecdd0e) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
}

.vibe-site .e106-wa3-number-link .e106-wa3-number {
    color: var(--e106-yellow, #ecdd0e) !important;
}

.vibe-site .e106-wa3-number-link:hover .e106-wa3-number {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.vibe-site .e106-wa3-number-link:focus-visible {
    outline: 2px solid var(--e106-yellow, #ecdd0e);
    outline-offset: 4px;
    border-radius: 2px;
}

/* RL-E106-WHATSAPP-NUMBER-LINK-V1 END */

/* RL-E106-WHATSAPP-NUMBER-HOVER-V2 START */
.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:hover,
.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:hover .e106-wa3-number,
.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:active,
.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:active .e106-wa3-number {
    color: var(--e106-pink, #ed1584) !important;
    text-decoration: none !important;
}

.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:hover *,
.vibe-site .e106-wa3-number-line a.e106-wa3-number-link:active * {
    text-decoration: none !important;
}

.vibe-site .e106-wa3-number-line a.e106-wa3-number-link .e106-wa3-number {
    transition: color .18s ease;
}
/* RL-E106-WHATSAPP-NUMBER-HOVER-V2 END */



/* RL-E106-OUTOUT-EVENT-V1 START */

.vibe-site .vibe-sidebar-content-block--out-out {
    display:block;
    width:100%;
    margin:0;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
    container-type:inline-size;
}

.vibe-site .e106-outout-card,
.vibe-site .e106-outout-card * {
    box-sizing:border-box;
}

.vibe-site .e106-outout-card {
    position:relative;
    isolation:isolate;
    display:flex;
    align-items:center;
    width:100%;
    min-width:0;
    min-height:185px;
    aspect-ratio:2.45 / 1;
    padding:clamp(14px,3.8cqw,28px);
    border:1px solid var(--e106-border,#523866);
    border-radius:8px;
    background:var(--e106-deep,#170621);
    overflow:hidden;
    color:#fff;
}

.vibe-site .e106-outout-art {
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
        radial-gradient(ellipse at 91% 15%,
            rgba(185,50,255,.55),transparent 44%),
        linear-gradient(115deg,
            #170621 8%,#250638 60%,#441169 100%);
}

.vibe-site .e106-outout-art img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:right center;
    opacity:.85;
}

.vibe-site .e106-outout-art::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,
        rgba(23,6,33,.97) 0%,
        rgba(23,6,33,.94) 34%,
        rgba(23,6,33,.45) 76%,
        rgba(23,6,33,.08) 100%);
}

.vibe-site .e106-outout-beams {
    position:absolute;
    inset:-25% -15%;
    z-index:1;
    pointer-events:none;
    opacity:.85;
    background:linear-gradient(125deg,
       transparent 53%,
       rgba(133,20,215,.75) 53%,
       rgba(133,20,215,.75) 62%,
       transparent 62%,
       transparent 88%,
       rgba(133,20,215,.65) 88%,
       rgba(133,20,215,.65) 94%,
       transparent 94%);
}

.vibe-site .e106-outout-content {
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:clamp(6px,1.3cqw,13px);
    width:100%;
    min-width:0;
}

.vibe-site .e106-outout-kicker {
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:.22em;
    font-size:clamp(23px,6.8cqw,58px);
    font-weight:900;
    line-height:.9;
    letter-spacing:-.045em;
    text-transform:uppercase;
}

.vibe-site .e106-outout-kicker span:first-child {
    color:#fff;
}

.vibe-site .e106-outout-kicker span:nth-child(2) {
    color:var(--e106-pink,#ed1584);
}

.vibe-site .e106-outout-name {
    margin:0 !important;
    padding:0 !important;
    max-width:100%;
    color:var(--e106-yellow,#ecdd0e) !important;
    font-size:clamp(35px,10cqw,84px);
    font-weight:950;
    line-height:.96;
    letter-spacing:-.055em;
    text-transform:uppercase;
    overflow-wrap:anywhere;
}

.vibe-site .e106-outout-meta {
    display:flex;
    flex-wrap:wrap;
    gap:.45em;
    align-items:center;
    margin:0 !important;
    color:#fff !important;
    font-size:clamp(10px,2.65cqw,21px);
    font-weight:800;
    letter-spacing:.11em;
    line-height:1.3;
    text-transform:uppercase;
}

.vibe-site .e106-outout-dot {
    color:#fff;
}

.vibe-site a.e106-outout-button {
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    width:min(100%,230px);
    min-height:43px;
    padding:9px 15px;
    border:0;
    border-radius:6px;
    background:var(--e106-pink,#ed1584);
    color:#fff !important;
    font-size:clamp(12px,3cqw,20px);
    font-weight:800;
    line-height:1.2;
    text-decoration:none !important;
    cursor:pointer;
    transition:filter .15s ease;
}

.vibe-site a.e106-outout-button:hover {
    color:#fff !important;
    text-decoration:none !important;
    filter:brightness(.88);
    transform:none !important;
}

.vibe-site a.e106-outout-button:focus-visible {
    outline:2px solid var(--e106-yellow,#ecdd0e);
    outline-offset:3px;
}

.vibe-site a.e106-outout-button svg {
    display:block;
    flex:0 0 19px;
    width:19px;
    height:19px;
}

@container (max-width:410px) {
    .vibe-site .e106-outout-card {
        min-height:165px;
        padding:14px;
    }
    .vibe-site .e106-outout-content {
        gap:8px;
    }
    .vibe-site .e106-outout-kicker {
        font-size:clamp(21px,6.5cqw,32px);
    }
    .vibe-site .e106-outout-name {
        font-size:clamp(32px,9.2cqw,44px);
    }
    .vibe-site .e106-outout-meta {
        font-size:clamp(9px,2.4cqw,12px);
    }
    .vibe-site a.e106-outout-button {
        min-height:36px;
        width:min(100%,170px);
        font-size:12px;
    }
}

/* RL-E106-OUTOUT-EVENT-V1 END */


/* RL-E106-OUTOUT-DESIGN-V2 START */

/*
 * Energy 106 OUT OUT
 * Preserve existing button height, border and colours.
 */

.vibe-site .vibe-sidebar-content-block--out-out
a.e106-outout-button {
    width: min(100%, 210px) !important;
    text-transform: uppercase !important;
}

@container (max-width: 410px) {
    .vibe-site .vibe-sidebar-content-block--out-out
    a.e106-outout-button {
        width: min(100%, 165px) !important;
    }
}

/* RL-E106-OUTOUT-DESIGN-V2 END */


/* RL-E106-OUTOUT-FIXED-HEIGHT-V3 START */

/*
 * Lock the card to its existing width-based ratio.
 * A wrapping title must not increase card height.
 */

.vibe-site .vibe-sidebar-content-block--out-out
.e106-outout-card {
    height: max(185px, 40.81633cqw) !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
}

/*
 * Keep event titles within two lines.
 */

.vibe-site .vibe-sidebar-content-block--out-out
.e106-outout-name {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    max-width: 100%;
}

/*
 * Automatically reduce the font for long names.
 */

.vibe-site .vibe-sidebar-content-block--out-out
.e106-outout-name--long {
    font-size: clamp(24px, 5.8cqw, 46px) !important;
    line-height: .96 !important;
}

.vibe-site .vibe-sidebar-content-block--out-out
.e106-outout-name--very-long {
    font-size: clamp(19px, 4.75cqw, 38px) !important;
    line-height: .96 !important;
}

/*
 * Allow tighter spacing only when titles are long.
 */

.vibe-site .e106-outout-card:has(
    .e106-outout-name--long,
    .e106-outout-name--very-long
) .e106-outout-content {
    gap: clamp(4px, 1cqw, 9px);
}

/*
 * Preserve responsive fixed-height behaviour.
 */

@container (max-width:410px) {
    .vibe-site .vibe-sidebar-content-block--out-out
    .e106-outout-card {
        height: max(165px, 40.81633cqw) !important;
    }

    .vibe-site .vibe-sidebar-content-block--out-out
    .e106-outout-name--long {
        font-size: clamp(17px, 5.4cqw, 23px) !important;
    }

    .vibe-site .vibe-sidebar-content-block--out-out
    .e106-outout-name--very-long {
        font-size: clamp(15px, 4.65cqw, 20px) !important;
    }
}

/* RL-E106-OUTOUT-FIXED-HEIGHT-V3 END */


/* RL-E106-OUTOUT-ANCHORED-V5 START */

/*
 * Keep the existing V3 card height.
 * Only change internal positioning.
 */

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-card {
    align-items: stretch !important;
}

/*
 * Four permanent layout rows:
 * 1 OUT OUT
 * 2 Event title
 * 3 Date / venue
 * 4 Ticket button
 */

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-content {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows:
        max-content
        minmax(0, 1fr)
        max-content
        max-content !important;
    align-content: stretch !important;
    align-items: start !important;
    justify-items: start !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    padding-top: clamp(0px, 1cqw, 8px) !important;
    gap: clamp(5px, 1cqw, 10px) !important;
}

/*
 * Heading never changes position.
 */

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-kicker {
    grid-row: 1;
    align-self: start !important;
    margin: 0 !important;
}

/*
 * The event title has its own reserved row.
 * Its content cannot push other rows around.
 */

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-name {
    grid-row: 2;
    display: block !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    line-height: .96 !important;
    text-wrap: normal !important;
    margin: 0 !important;
}

/*
 * Date and venue stay on one fixed row.
 * Very long venue names truncate rather
 * than making the card taller.
 */

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-meta {
    grid-row: 3;
    align-self: center !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    margin: 0 !important;
}

.vibe-site
.vibe-sidebar-content-block--out-out
.e106-outout-meta span:last-child {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*
 * Button remains in the same position
 * and retains existing dimensions.
 */

.vibe-site
.vibe-sidebar-content-block--out-out
a.e106-outout-button {
    grid-row: 4;
    align-self: end !important;
    justify-self: start !important;
    margin: 0 !important;
}

/* RL-E106-OUTOUT-ANCHORED-V5 END */

/* E106 DESKTOP RESPONSIVENESS V5 START */
/*
 * Energy 106 homepage only.
 * Prevent the recent-track content column from
 * demanding its full intrinsic text width.
 * Mobile rules and other stations are not changed.
 */
@media screen and (min-width: 981px) and (max-width: 1440px) {
  body.vibe-site .vibe-homepage
  .vibe-home-recent-slot
  .vibe-sidebar-recent__track {
    grid-template-columns:
      64px minmax(0, 1fr) max-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}
/* E106 DESKTOP RESPONSIVENESS V5 END */

/* E106 DESKTOP FOOTER OVERFLOW V11B START */
/*
 * ENERGY 106 ONLY
 *
 * V10 established that an unwanted horizontal
 * translate on the footer app/social sections
 * caused document overflow at desktop widths.
 *
 * Preserve the existing footer grid, links,
 * spacing, colours and typography.
 *
 * Mobile is excluded.
 */
@media screen and (min-width: 1181px) and (max-width: 1365px) {
  html body.vibe-site
  .vibe-footer--v2
  .vibe-footer-v2__connect
  > .vibe-footer-v2__app-section,

  html body.vibe-site
  .vibe-footer--v2
  .vibe-footer-v2__connect
  > .vibe-footer-v2__social-section {
    translate: none !important;
  }
}
/* E106 DESKTOP FOOTER OVERFLOW V11B END */

/* E106-MAIN-NAV-UPPERCASE-V119 */
body.vibe-site nav.vibe-navigation a {
    text-transform: uppercase !important;
}

/* E106-CMS-TEXT-LINKS-V126
   Plain hyperlinks in CMS-created page content.
   Replaces the Public File-only V124 rule.
*/
body.vibe-site .vibe-custom-page__content a[href]:not([class]):is(:link, :visited),
body.vibe-site .vibe-custom-page__content a[href]:not([class]) :is(span, font) {
    color: var(--e106-pink, #ed1584) !important;
    text-decoration: none !important;
}

body.vibe-site .vibe-custom-page__content a[href]:not([class]):is(:hover, :focus-visible),
body.vibe-site .vibe-custom-page__content a[href]:not([class]):is(:hover, :focus-visible) :is(span, font) {
    color: #ffffff !important;
    text-decoration: none !important;
}


/* RL-E106-SIDEBAR-COLOURS-V1
   WhatsApp card background only.
   Original artwork, borders and dimensions preserved.
*/
body.vibe-site
.vibe-sidebar-content-block--whatsapp-studio
.e106-wa3-card {
    background: #1D062D !important;
}