/* ENERGY 106 PRESENTER PROFILE V3 */
/* Homepage palette, Vibe sidebar unchanged. */

.energy-profile-v3 {
    --ep-pink:var(--vibe-button-bg, #ed1584);
    --ep-pink-hover:var(--vibe-button-bg-hover, #d71379);
    --ep-yellow:#ffe100;
    --ep-plum:#210836;
    --ep-panel:var(--vibe-bg-panel, #250638);
    --ep-card:var(--vibe-bg-card, #2d083d);
    --ep-border:var(--vibe-border-medium, #522761);
    --ep-muted:var(--vibe-text-secondary, #baa2c7);
    width:100%;
    min-width:0;
    color:#fff;
    font-family:inherit;
}

.energy-profile-v3 *,
.energy-profile-v3 *::before,
.energy-profile-v3 *::after {
    box-sizing:border-box;
}

.energy-profile-v3 h1,
.energy-profile-v3 h2,
.energy-profile-v3 h3 {
    font-family:Rubik,Arial,sans-serif;
    color:#fff;
}

/* HERO */

.energy-profile-v3__hero {
    position:relative;
    display:flex;
    align-items:center;
    min-height:360px;
    overflow:hidden;
    border: 1px solid #522761;
    border-radius:4px 4px 0 0;
    background-color:var(--ep-plum);
    background-image:
        linear-gradient(90deg,rgba(23,4,40,.98) 0%,rgba(23,4,40,.87) 28%,rgba(23,4,40,.32) 53%,rgba(23,4,40,0) 88%),var(--ep-photo,linear-gradient(120deg,#210836,#522761));
    background-size:cover;
    background-position:center;

    background-clip: padding-box;
}

.energy-profile-v3__hero-content {
    position:relative;
    z-index:1;
    width:min(65%,630px);
    padding:24px 27px;
}

.energy-profile-v3__eyebrow {
    display:block;
    color:var(--ep-yellow);
    font-size:11px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.energy-profile-v3__hero h1 {
    margin:12px 0 16px;
    font-size:clamp(34px,4.3vw,59px);
    line-height:1;
    font-weight:950;
    letter-spacing:-.04em;
    text-transform:uppercase;
    overflow-wrap:break-word;
}

.energy-profile-v3__hero h1 small {
    display:block;
    margin-top:10px;
    font-size:.62em;
}

.energy-profile-v3__hero h1 strong {
    color:var(--ep-pink);
    font-weight:inherit;
}

.energy-profile-v3__schedule {
    color:#ffe100;
    font-size:17px;
    font-weight:900;
    text-transform:uppercase;
    margin-bottom:12px;
}

.energy-profile-v3__description {
    max-width:490px;
    color:#f6ebfc;
    font-size:14px;
    line-height:1.5;
    margin:0 0 18px;
}

.energy-profile-v3__onair {
    display:inline-block;
    padding:6px 10px;
    background:var(--ep-yellow);
    color:#23072c;
    border-radius:4px;
    font-weight:900;
    font-size:11px;
    margin-bottom:12px;
}

.energy-profile-v3__hero-actions {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:19px;
}

.energy-profile-v3__button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 15px;
    min-height:42px;
    border-radius:5px;
    font-size:12px;
    font-weight:900;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
}

.energy-profile-v3__button--pink {
    background:var(--ep-pink);
    border:1px solid var(--ep-pink);
    color:#fff;
}

.energy-profile-v3__button--outline {
    background:rgba(49,18,69,.8);
    border:1px solid #854299;
    color:#fff;
}

/* CONTACT STRIP */

.energy-profile-v3__contact {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    padding:10px 14px;
    margin-bottom:17px;
    min-height:60px;
    background:var(--ep-panel);
    border:1px solid var(--ep-border);
    border-top:0;
    border-radius:0 0 4px 4px;
}

.energy-profile-v3__contact > strong {
    color:#fff;
    font-size:11px;
    font-weight:900;
    margin-right:auto;
}

.energy-profile-v3__socials {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:0;
}

.energy-profile-v3__socials a,
.energy-profile-v3__socials button {
    padding:8px 10px;
    border:1px solid var(--ep-border);
    border-radius:5px;
    background:var(--ep-card);
    color:#fff;
    font:inherit;
    font-size:11px;
    text-decoration:none;
    cursor:pointer;
}

.energy-profile-v3__socials a:hover,
.energy-profile-v3__socials button:hover {
    border-color:var(--ep-border);
}

.energy-profile-v3__sponsor {
    margin-left:auto;
    max-width:210px;
}

.energy-profile-v3__sponsor a,
.energy-profile-v3__sponsor {
    display:flex;
    align-items:center;
    gap:9px;
    color:#fff;
    text-decoration:none;
}

.energy-profile-v3__sponsor span {
    font-size:9px;
    color:var(--ep-muted);
}

.energy-profile-v3__sponsor strong {
    display:block;
    font-size:12px;
    color:#fff;
}

.energy-profile-v3__sponsor img {
    max-width:58px;
    max-height:45px;
    object-fit:contain;
}


/* ENERGY-REFERENCE-COMPACT-V4 */

.energy-profile-v3__hero-actions {
    margin-top: 13px;
}

.energy-profile-v3__hero-actions
.energy-profile-v3__button--pink {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.energy-profile-v3__hero-actions svg {
    display: block;
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
}

.energy-profile-v3__socials a,
.energy-profile-v3__socials button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 7px 13px;
    border: 0;
    border-left: 1px solid var(--ep-border);
    border-radius: 0;
    background: transparent;
    color: var(--ep-muted);
}

.energy-profile-v3__socials svg {
    width: 21px;
    height: 21px;
    flex: 0 0 21px;
    color: var(--ep-pink);
}

.energy-profile-v3__socials a:hover,
.energy-profile-v3__socials button:hover {
    color: #fff;
    background: transparent;
}

@media (max-width: 790px) {
    .energy-profile-v3__hero {
        min-height: 340px;
    }

    .energy-profile-v3__hero-content {
        padding: 24px;
    }
}

/* END ENERGY-REFERENCE-COMPACT-V4 */

/* MAIN TWO COLUMNS */

.energy-profile-v3__content {
    display:grid;
    grid-template-columns:
        minmax(0,1.65fr) minmax(0,1fr);
    gap:15px;
    align-items:start;
}

.energy-profile-v3__playlist,
.energy-profile-v3__right {
    min-width:0;
}

.energy-profile-v3__right {
    display:grid;
    gap:15px;
}

.energy-profile-v3__card,
.energy-profile-v3__playlist
.vibe-presenter-played {
    background:var(--ep-panel) !important;
    border:1px solid var(--ep-border) !important;
    border-radius:9px !important;
    margin:0 !important;
    padding:17px !important;
    color:#fff;
}

.energy-profile-v3__card h2 {
    position:relative;
    padding-left:14px;
    margin:0 0 12px;
    font-size:21px;
    font-weight:900;
    text-transform:uppercase;
}

.energy-profile-v3__card h2::before {
    content:"";
    position:absolute;
    left:0;
    top:2px;
    bottom:2px;
    width:4px;
    background:var(--ep-pink);
}

.energy-profile-v3__card-title p {
    color:var(--ep-muted);
    font-size:12px;
    line-height:1.45;
    margin:0 0 14px;
}

/* PLAYLIST — EXISTING SERVER AND JS CONTROLS */

.energy-profile-v3__playlist
.vibe-presenter-played__reference-title h2 {
    color:#fff !important;
    font-size:clamp(19px,2vw,25px) !important;
}

.energy-profile-v3__playlist
.vibe-presenter-played__reference-header p {
    color:var(--ep-muted) !important;
}

.energy-profile-v3__playlist
.vibe-presenter-played__full-link {
    color:var(--ep-pink) !important;
}

.energy-profile-v3__playlist
.rl-recently-played__table-head {
    background:#190821 !important;
}

.energy-profile-v3__playlist
.rl-recently-played-track {
    border-color:var(--ep-border);
}

/* LATEST SHOW */

.energy-profile-v3__artwork {
    position:relative;
    display:block;
    width:100%;
    aspect-ratio:16 / 8;
    background:var(--ep-card);
    border-radius:6px;
    overflow:hidden;
}

.energy-profile-v3__artwork img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.energy-profile-v3__artwork > strong {
    display:grid;
    place-items:center;
    height:100%;
    color:#fff;
}

.energy-profile-v3__artwork > span {
    position:absolute;
    right:12px;
    bottom:12px;
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    background:var(--ep-pink);
    color:#fff;
    border-radius:50%;
}

.energy-profile-v3__card h3 {
    margin:11px 0 5px;
    font-size:15px;
}

.energy-profile-v3__metadata {
    display:flex;
    justify-content:space-between;
    gap:8px;
    font-size:11px;
    color:var(--ep-muted);
}

.energy-profile-v3__episode-actions {
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:8px;
    margin-top:13px;
}

.energy-profile-v3__episode-actions a,
.energy-profile-v3__episode-actions button {
    display:grid;
    place-items:center;
    min-height:41px;
    padding:9px;
    border-radius:5px;
    font-size:11px;
    font-weight:900;
    text-align:center;
    cursor:pointer;
}

.energy-profile-v3__episode-actions a {
    background:var(--ep-pink);
    border:1px solid var(--ep-pink);
    color:#fff;
    text-decoration:none;
}

.energy-profile-v3__episode-actions button {
    background:var(--ep-card);
    color:#fff;
    border:1px solid var(--ep-border);
}

.energy-profile-v3__share[hidden] {
    display:none !important;
}

.energy-profile-v3__share {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:10px;
    padding:11px;
    border-radius:5px;
    background:var(--ep-plum);
}

.energy-profile-v3__share a,
.energy-profile-v3__share button {
    background:none;
    border:0;
    color:#fff;
    font-size:11px;
    cursor:pointer;
    text-decoration:none;
}

/* SHOW FEATURES */

.energy-profile-v3__feature {
    display:flex;
    gap:12px;
    padding:12px 0;
    border-top:1px solid var(--ep-border);
}

.energy-profile-v3__feature > span {
    font-size:23px;
    color:var(--ep-pink);
}

.energy-profile-v3__feature strong {
    color:#fff;
    font-size:12px;
}

.energy-profile-v3__feature p {
    color:var(--ep-muted);
    font-size:12px;
    line-height:1.4;
    margin:4px 0 0;
}

.energy-profile-v3__more {
    text-align:right;
    color:var(--ep-pink);
    text-decoration:none;
    font-size:12px;
    font-weight:900;
}

.energy-profile-v3__bio {
    margin-top:15px !important;
}

.energy-profile-v3__bio p {
    color:var(--ep-muted);
    white-space:pre-line;
    line-height:1.55;
}

/* RESPONSIVE — NEVER CHANGE THE VIBE SIDEBAR */

@media (max-width:1000px) {
    .energy-profile-v3__hero-content {
        width:74%;
    }

    .energy-profile-v3__content {
        grid-template-columns:
            minmax(0,1.25fr) minmax(260px,1fr);
    }
}

@media (max-width:790px) {
    .energy-profile-v3__content {
        grid-template-columns:1fr;
    }

    .energy-profile-v3__hero-content {
        width:100%;
        padding:26px;
    }

    .energy-profile-v3__hero {
        background-image:
            linear-gradient(
                90deg,
                rgba(23,4,40,.96),
                rgba(23,4,40,.72)
            ),
            var(--ep-photo,linear-gradient(
                120deg,#210836,#522761
            ));
    }
}

@media (max-width:480px) {
    .energy-profile-v3__hero h1 {
        font-size:36px;
    }

    .energy-profile-v3__hero-content {
        padding:23px 17px;
    }

    .energy-profile-v3__hero-actions {
        gap:7px;
    }

    .energy-profile-v3__button {
        font-size:11px;
        padding:10px;
    }

    .energy-profile-v3__card,
    .energy-profile-v3__playlist
    .vibe-presenter-played {
        padding:13px !important;
    }
}


/* ENERGY-HOMEPAGE-PALETTE-V4 */
/* Match live Vibe homepage interaction colours. */

.energy-profile-v3
.energy-profile-v3__button--pink:hover,
.energy-profile-v3
.energy-profile-v3__button--pink:focus-visible,
.energy-profile-v3
.energy-profile-v3__episode-actions a:hover,
.energy-profile-v3
.energy-profile-v3__episode-actions a:focus-visible {
    background:var(--ep-pink-hover);
    border-color:var(--ep-pink-hover);
    color:#fff;
}

.energy-profile-v3
.energy-profile-v3__socials a:hover,
.energy-profile-v3
.energy-profile-v3__socials button:hover {
    border-color:var(--ep-border);
    color:#fff;
}

.energy-profile-v3
.energy-profile-v3__more:hover,
.energy-profile-v3
.energy-profile-v3__more:focus-visible,
.energy-profile-v3
.vibe-presenter-played__full-link:hover {
    color:var(--ep-pink-hover) !important;
}

/* END ENERGY-HOMEPAGE-PALETTE-V4 */


/* ENERGY-PRESENTER-HOMEPAGE-V5 */
/* Match Energy 106 homepage palette with subtle yellow. */


.energy-profile-v3
.energy-profile-v3__button--pink:hover,
.energy-profile-v3
.energy-profile-v3__episode-actions a:hover {
    background: var(--vibe-button-bg-hover, #d71379);
    border-color: var(--vibe-button-bg-hover, #d71379);
    color: #fff;
}

/* END ENERGY-PRESENTER-HOMEPAGE-V5 */







/* ENERGY-SOCIAL-COLOURS-FINAL-V1 */

/* Normal: homepage lavender */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a span,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button span {
    color: #baa2c7 !important;
    opacity: 1 !important;
}

/* Hover and keyboard focus: solid white text */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:hover,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:focus-visible,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:hover,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:focus-visible,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:hover span,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:focus-visible span,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:hover span,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:focus-visible span {
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Icons remain Energy pink at all times */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials svg,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:hover svg,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:hover svg {
    color: #ed1584 !important;
    opacity: 1 !important;
}

/* Divider colour never changes */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:hover,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials a:focus-visible,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:hover,
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials button:focus-visible {
    border-left-color: #522761 !important;
    background: transparent !important;
}

/* END ENERGY-SOCIAL-COLOURS-FINAL-V1 */


/* ENERGY-SOCIAL-REAL-DASHES-V2 */

/* Keep the Follow heading and social links together. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__contact > strong {
    margin-right: 0 !important;
    flex: 0 0 auto;
}

/* Compact row; sponsor can still sit on the right. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 !important;
    width: auto;
    margin-left: 4px !important;
    margin-right: 0 !important;
}

/* Actual dash separators from Blade. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials
.energy-profile-v3__social-separator {
    display: inline-block !important;
    flex: 0 0 auto;
    padding: 0 10px;
    color: #895b99 !important;
    font-size: 17px;
    font-weight: 400;
    line-height: 1;
    opacity: 1 !important;
}

/* Remove the old vertical link dividers. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials > a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0 !important;
    padding: 7px 4px !important;
    background: transparent !important;
}

/* Suppress any old CSS-generated dash. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials > a::before {
    content: none !important;
    display: none !important;
}

/* Existing pink icons and white hover remain. */
body.vibe-site .energy-profile-v3
.energy-profile-v3__socials > a:hover {
    color: #fff !important;
    border: 0 !important;
}

/* END ENERGY-SOCIAL-REAL-DASHES-V2 */
