/*
    SteveKraft.com Radio seasonal layer
    The permanent Radio page remains one HTML file.
    websiteTheme controls holiday presentation.
    musicSeason controls actual station/music wording.
*/

body[data-website-theme="newyear"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,255,255,.55);
}

body[data-website-theme="valentines"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,100,150,.55);
}

body[data-website-theme="presidents"] .eyebrow {
    text-shadow: 0 0 14px rgba(120,170,255,.55);
}

body[data-website-theme="stpatricks"] .eyebrow {
    text-shadow: 0 0 14px rgba(80,220,120,.55);
}

body[data-website-theme="memorial"] .eyebrow {
    text-shadow: 0 0 14px rgba(180,200,255,.55);
}

body[data-website-theme="fourthofjuly"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,100,100,.55);
}

body[data-website-theme="laborday"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,200,100,.55);
}

body[data-website-theme="halloween"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,130,40,.7);
}

body[data-website-theme="thanksgiving"] .eyebrow {
    text-shadow: 0 0 14px rgba(220,150,70,.65);
}

body[data-website-theme="christmas"] .eyebrow {
    text-shadow: 0 0 14px rgba(255,255,255,.65);
}

#radio-seasonal-title,
#radio-stream-name,
#radio-seasonal-eyebrow {
    transition: all .35s ease;
}
/* ============================================================
   SPORTS / 2J RADIO EDITION
   Manual website theme only. Music-season behavior unchanged.
   ============================================================ */

.sports2j-radio-masthead {
    display:none;
}

body[data-website-theme="sports2j"] {
    --green:#f2d100;
    --radio-sports-yellow:#ffe600;
    --radio-sports-gold:#d7ba00;
    --radio-sports-black:#07090b;

    background:
        linear-gradient(
            135deg,
            rgba(255,230,0,.025),
            transparent 34%
        ),
        #080b0f;

    border-color:#f2d100;
}

body[data-website-theme="sports2j"] header {
    border-bottom-color:rgba(255,230,0,.58);
}

body[data-website-theme="sports2j"] .sports2j-radio-masthead {
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:20px;

    width:min(1180px,92%);
    margin:24px auto 10px;
    padding:18px 22px;

    border:1px solid rgba(255,230,0,.70);
    border-left:7px solid #ffe600;
    border-radius:14px;

    background:
        linear-gradient(
            135deg,
            rgba(19,24,29,.98),
            rgba(5,7,9,.98)
        );

    box-shadow:
        0 16px 38px rgba(0,0,0,.38),
        inset 0 0 0 1px rgba(255,230,0,.08);
}

body[data-website-theme="sports2j"]
.sports2j-radio-number {
    color:#080909;

    min-width:118px;

    padding:8px 18px;

    background:
        linear-gradient(
            135deg,
            #ffe600,
            #d7ba00
        );

    border-radius:8px;

    font-size:clamp(48px,7vw,88px);
    line-height:.90;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-.07em;
    text-align:center;

    text-shadow:
        1px 1px 0 rgba(255,255,255,.28);
}

body[data-website-theme="sports2j"]
.sports2j-radio-brand {
    min-width:0;
}

body[data-website-theme="sports2j"]
.sports2j-radio-brand strong {
    display:block;

    color:#fff;

    font-size:clamp(25px,4vw,46px);
    line-height:1;
    font-weight:900;
    font-style:italic;
    letter-spacing:.025em;
}

body[data-website-theme="sports2j"]
.sports2j-radio-brand .radio-line {
    display:block;

    margin-top:7px;

    color:#ffe600;

    font-size:clamp(17px,2.3vw,27px);
    font-weight:900;
    letter-spacing:.08em;
}

body[data-website-theme="sports2j"]
.sports2j-radio-brand .sponsor-line {
    display:block;

    margin-top:5px;

    color:#d8dde3;

    font-size:12px;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}

body[data-website-theme="sports2j"] .eyebrow {
    color:#ffe600;
}

body[data-website-theme="sports2j"] #radio-seasonal-title {
    background:
        linear-gradient(
            90deg,
            #ffffff,
            #ffe600 42%,
            #d7ba00 72%,
            #ffffff
        );

    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

body[data-website-theme="sports2j"] .button.primary,
body[data-website-theme="sports2j"] button.primary {
    color:#080909;
    background:
        linear-gradient(
            135deg,
            #ffe600,
            #d7ba00
        );
}

body[data-website-theme="sports2j"] .card,
body[data-website-theme="sports2j"] .feature-box,
body[data-website-theme="sports2j"] .player-card,
body[data-website-theme="sports2j"] .now-playing {
    border-color:rgba(255,230,0,.32);
}

body[data-website-theme="sports2j"] a:hover {
    text-decoration-color:#ffe600;
}

@media (max-width:700px) {

    body[data-website-theme="sports2j"]
    .sports2j-radio-masthead {
        grid-template-columns:1fr;

        width:92%;

        gap:12px;

        margin-top:14px;
        padding:14px;

        text-align:center;
    }

    body[data-website-theme="sports2j"]
    .sports2j-radio-number {
        width:112px;
        min-width:0;

        margin:0 auto;

        font-size:58px;
    }

    body[data-website-theme="sports2j"]
    .sports2j-radio-brand strong {
        font-size:29px;
    }

    body[data-website-theme="sports2j"]
    .sports2j-radio-brand .radio-line {
        font-size:18px;
    }

    body[data-website-theme="sports2j"]
    .sports2j-radio-brand .sponsor-line {
        font-size:10px;
        line-height:1.5;
    }
}
/* ============================================================
   DIRT EDM SPORTS / 2J RADIO V2
   Desktop-first full racing-page treatment
   ============================================================ */

body.radio-page[data-website-theme="sports2j"] {
    --r2j-yellow:#ffe500;
    --r2j-gold:#d3b700;
    --r2j-black:#050708;
    --r2j-panel:#0a1117;
    --r2j-panel2:#070b0f;
    --r2j-line:rgba(255,229,0,.72);

    margin:0;
    padding:28px;

    background:
        radial-gradient(
            circle at 50% 14%,
            rgba(255,229,0,.08),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            #050708,
            #0a0d10 55%,
            #030405
        ) !important;

    border:0 !important;
    overflow-x:hidden;
}

/* Disable the temporary V1 masthead. */
body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-masthead {
    display:none !important;
}

/* Disable the generic shared Sports outer decorations. */
body.radio-page[data-website-theme="sports2j"]::before,
body.radio-page[data-website-theme="sports2j"]::after {
    content:none !important;
    display:none !important;
}

/* ============================================================
   OUTER RACING FRAME
   ============================================================ */

.sports2j-radio-frame {
    display:none;
}

body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-frame {
    display:block;

    position:fixed;
    inset:8px;

    z-index:99990;

    pointer-events:none;

    border:
        3px solid
        var(--r2j-yellow);

    border-radius:26px;

    box-shadow:
        inset 0 0 0 5px #050708,
        inset 0 0 0 7px rgba(255,229,0,.42),
        0 0 30px rgba(255,229,0,.12);
}

body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-frame::before,
body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-frame::after {
    position:absolute;

    top:88px;
    bottom:88px;

    width:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    background:
        linear-gradient(
            180deg,
            #0c1116,
            #050708
        );

    border:
        1px solid
        rgba(255,229,0,.62);

    font-size:12px;
    font-weight:900;
    letter-spacing:.16em;

    writing-mode:vertical-rl;
    text-orientation:mixed;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-frame::before {
    content:"DIRT EDM  •  INTERNET RADIO";

    left:8px;
}

body.radio-page[data-website-theme="sports2j"]
.sports2j-radio-frame::after {
    content:"2J  •  KRAFT RACING  •  630 AUTO";

    right:8px;

    color:var(--r2j-yellow);
}

/* ============================================================
   HEADER / NAV
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
header {
    position:relative;

    width:min(1280px,calc(100% - 92px));

    margin:12px auto 0;

    border:
        1px solid
        rgba(255,229,0,.52);

    border-bottom:
        3px solid
        var(--r2j-yellow);

    border-radius:
        18px
        18px
        0
        0;

    background:
        linear-gradient(
            180deg,
            rgba(7,11,15,.98),
            rgba(3,5,7,.98)
        );

    box-shadow:
        0 16px 38px rgba(0,0,0,.48);

    overflow:hidden;
}

body.radio-page[data-website-theme="sports2j"]
header::after {
    content:"SPORTS / 2J THEME";

    position:absolute;

    right:20px;
    top:50%;

    transform:translateY(-50%);

    padding:
        8px
        18px;

    color:#060708;

    background:
        linear-gradient(
            135deg,
            #ffe500,
            #d1b500
        );

    clip-path:
        polygon(
            9% 0,
            100% 0,
            91% 100%,
            0 100%
        );

    font-size:12px;
    line-height:1;
    font-weight:1000;
    font-style:italic;
    letter-spacing:.08em;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
header .container.nav {
    width:100%;
    max-width:none;

    padding:
        14px
        200px
        14px
        24px;
}

body.radio-page[data-website-theme="sports2j"]
header .brand {
    gap:14px;

    color:#fff;

    font-size:20px;
    font-weight:900;
    font-style:italic;
    letter-spacing:.06em;
}

body.radio-page[data-website-theme="sports2j"]
header .brand-mark {
    width:54px;
    height:54px;

    border:
        1px solid
        rgba(255,229,0,.72);

    border-radius:50%;

    box-shadow:
        0 0 18px
        rgba(255,229,0,.12);
}

body.radio-page[data-website-theme="sports2j"]
header nav {
    gap:26px;
}

body.radio-page[data-website-theme="sports2j"]
header nav a {
    color:#e8edf2;

    font-size:13px;
    font-weight:700;
}

body.radio-page[data-website-theme="sports2j"]
header nav a:hover {
    color:var(--r2j-yellow);
}

/* ============================================================
   MAIN RACING SHELL
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
main {
    position:relative;

    width:min(1280px,calc(100% - 92px));

    margin:0 auto;

    padding-bottom:24px;

    border-left:
        3px solid
        var(--r2j-yellow);

    border-right:
        3px solid
        var(--r2j-yellow);

    background:
        linear-gradient(
            180deg,
            rgba(4,7,10,.98),
            rgba(6,9,12,.98)
        );

    box-shadow:
        0 22px 60px rgba(0,0,0,.48);
}

/* ============================================================
   HERO
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
.hero {
    position:relative;

    min-height:410px;

    padding:
        54px
        58px;

    display:flex;
    align-items:center;

    overflow:hidden;

    border-bottom:
        3px solid
        var(--r2j-yellow);

    background:
        linear-gradient(
            90deg,
            rgba(3,5,7,.97) 0%,
            rgba(3,5,7,.90) 31%,
            rgba(3,5,7,.42) 55%,
            rgba(3,5,7,.12) 100%
        ),
        url("/Graphics/Sports2J/stevekraft-sports2j-homepage.png")
        center 27% / cover no-repeat !important;
}

body.radio-page[data-website-theme="sports2j"]
.hero::before {
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        linear-gradient(
            135deg,
            transparent 0 65%,
            rgba(255,229,0,.05) 65% 67%,
            transparent 67% 100%
        );
}

body.radio-page[data-website-theme="sports2j"]
.hero::after {
    content:"2J";

    position:absolute;

    right:34px;
    bottom:18px;

    color:rgba(255,229,0,.10);

    font-size:132px;
    line-height:.8;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-.08em;
}

body.radio-page[data-website-theme="sports2j"]
.hero-grid {
    position:relative;
    z-index:2;

    width:100%;

    display:block;

    margin:0;
}

body.radio-page[data-website-theme="sports2j"]
.hero-grid > div:first-child {
    max-width:570px;
}

body.radio-page[data-website-theme="sports2j"]
#radio-seasonal-eyebrow {
    margin-bottom:10px;

    color:var(--r2j-yellow);

    font-size:13px;
    font-weight:1000;
    font-style:italic;
    letter-spacing:.28em;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
#radio-seasonal-title {
    margin:0;

    color:#fff !important;

    background:none !important;

    font-size:
        clamp(
            64px,
            8vw,
            112px
        );

    line-height:.86;

    font-weight:1000;
    font-style:italic;
    letter-spacing:-.055em;

    text-shadow:
        5px 5px 0 rgba(0,0,0,.65),
        0 0 28px rgba(255,229,0,.10);
}

body.radio-page[data-website-theme="sports2j"]
#radio-seasonal-title::after {
    content:"";

    display:inline-block;

    width:30%;

    height:.16em;

    margin-left:.08em;

    transform:skewX(-24deg);

    background:
        var(--r2j-yellow);

    vertical-align:.17em;
}

body.radio-page[data-website-theme="sports2j"]
.hero p {
    max-width:560px;

    margin-top:20px;

    color:#d5dbe2;

    font-size:17px;
    line-height:1.7;
}

body.radio-page[data-website-theme="sports2j"]
.hero p::after {
    content:"MUSIC DRIVES US FORWARD";

    display:block;

    margin-top:28px;

    color:#fff;

    font-size:12px;
    font-weight:900;
    font-style:italic;
    letter-spacing:.30em;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
.status-card {
    display:none !important;
}

/* ============================================================
   PRIMARY TWO-COLUMN CONTENT
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
.main-grid {
    width:auto;
    max-width:none;

    margin:0;

    padding:
        28px
        42px
        20px;

    display:grid;

    grid-template-columns:
        minmax(0,1.12fr)
        minmax(360px,.88fr);

    gap:18px;

    align-items:start;
}

body.radio-page[data-website-theme="sports2j"]
.main-grid > .card {
    margin:0;

    border:
        1px solid
        rgba(255,229,0,.66);

    border-radius:16px;

    background:
        linear-gradient(
            155deg,
            rgba(12,18,23,.98),
            rgba(6,10,13,.98)
        );

    box-shadow:
        inset 0 0 0 1px rgba(255,229,0,.06),
        0 18px 38px rgba(0,0,0,.28);
}

body.radio-page[data-website-theme="sports2j"]
.main-grid > .card .card-body {
    padding:28px 30px;
}

body.radio-page[data-website-theme="sports2j"]
.main-grid h2 {
    margin:
        0
        0
        14px;

    color:#fff;

    font-size:34px;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-.02em;
}

body.radio-page[data-website-theme="sports2j"]
.main-grid h2::after {
    content:" //";

    color:var(--r2j-yellow);

    font-weight:1000;
}

body.radio-page[data-website-theme="sports2j"]
.main-grid p {
    color:#bcc6d0;
}

/* ============================================================
   LISTEN LIVE / PLAYER
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
.stream-box {
    margin-top:18px;

    padding:18px;

    border:
        1px solid
        rgba(125,154,180,.35);

    border-radius:14px;

    background:
        linear-gradient(
            180deg,
            #071016,
            #05090d
        );

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.02);
}

body.radio-page[data-website-theme="sports2j"]
.station-name {
    align-items:center;
}

body.radio-page[data-website-theme="sports2j"]
.station-name strong {
    color:#fff;

    font-size:21px;
}

body.radio-page[data-website-theme="sports2j"]
.station-name span {
    color:#ff315e;

    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
#radioPlayer {
    width:100%;

    margin:
        16px
        0
        14px;
}

body.radio-page[data-website-theme="sports2j"]
.stream-now-playing {
    padding:15px 16px;

    border:
        1px solid
        rgba(120,150,175,.22);

    border-radius:12px;

    background:
        #04080c;
}

body.radio-page[data-website-theme="sports2j"]
#skStreamState {
    color:#42e675;

    font-weight:1000;
}

body.radio-page[data-website-theme="sports2j"]
.now-playing-label {
    color:#8393a5;

    font-size:11px;
    font-weight:900;
    letter-spacing:.14em;

    text-transform:uppercase;
}

body.radio-page[data-website-theme="sports2j"]
#skNowPlaying {
    margin-top:5px;

    color:#fff;

    font-size:18px;
    font-weight:800;
    line-height:1.35;
}

body.radio-page[data-website-theme="sports2j"]
.action-row {
    gap:10px;
}

body.radio-page[data-website-theme="sports2j"]
.action-row .button {
    border-color:
        rgba(255,229,0,.38);
}

body.radio-page[data-website-theme="sports2j"]
.action-row .button.primary {
    color:#050708 !important;

    background:
        linear-gradient(
            135deg,
            #ffe500,
            #d0b500
        ) !important;
}

body.radio-page[data-website-theme="sports2j"]
.action-row .button.green {
    color:var(--r2j-yellow);

    background:#0c1116;
}

/* ============================================================
   SUPPORT PANEL
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
.support-card {
    position:relative;
}

body.radio-page[data-website-theme="sports2j"]
.support-card::after {
    content:"2J";

    position:absolute;

    right:18px;
    bottom:8px;

    color:
        rgba(255,229,0,.055);

    font-size:96px;
    font-weight:1000;
    font-style:italic;
    line-height:1;
}

body.radio-page[data-website-theme="sports2j"]
.support-links {
    gap:12px;
}

body.radio-page[data-website-theme="sports2j"]
.support-link {
    position:relative;

    padding:
        17px
        46px
        17px
        58px;

    border:
        1px solid
        rgba(255,229,0,.42);

    border-radius:10px;

    background:
        linear-gradient(
            145deg,
            rgba(15,21,26,.98),
            rgba(7,11,14,.98)
        );
}

body.radio-page[data-website-theme="sports2j"]
.support-link::before {
    content:"★";

    position:absolute;

    left:18px;
    top:50%;

    transform:translateY(-50%);

    color:var(--r2j-yellow);

    font-size:23px;
}

body.radio-page[data-website-theme="sports2j"]
.support-link::after {
    content:"›";

    position:absolute;

    right:18px;
    top:50%;

    transform:translateY(-52%);

    color:#fff;

    font-size:34px;
}

body.radio-page[data-website-theme="sports2j"]
.support-link strong {
    color:#fff;
}

body.radio-page[data-website-theme="sports2j"]
.support-link span {
    color:#aeb8c2;
}

body.radio-page[data-website-theme="sports2j"]
.socials a {
    border-color:
        rgba(255,229,0,.30);

    background:
        #091016;
}

/* ============================================================
   LOWER TOOLS
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
.link-grid {
    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:10px;
}

body.radio-page[data-website-theme="sports2j"]
.link-card {
    border-color:
        rgba(255,229,0,.24);

    background:#071016;
}

body.radio-page[data-website-theme="sports2j"]
.world {
    border-color:
        rgba(255,229,0,.24);
}

/* ============================================================
   FOOTER
   ============================================================ */

body.radio-page[data-website-theme="sports2j"]
footer {
    width:min(1280px,calc(100% - 92px));

    margin:
        0
        auto
        12px;

    border:
        3px solid
        var(--r2j-yellow);

    border-top:
        1px solid
        rgba(255,229,0,.52);

    border-radius:
        0
        0
        18px
        18px;

    background:
        #05080b;
}

body.radio-page[data-website-theme="sports2j"]
footer::before {
    content:"BROADCASTING 24 HOURS A DAY";

    display:block;

    padding-top:8px;

    color:var(--r2j-yellow);

    font-size:10px;
    font-weight:900;
    font-style:italic;
    letter-spacing:.28em;

    text-align:center;
}

/* ============================================================
   DESKTOP-FIRST RESPONSIVE SAFETY
   Final phone design will be tuned after desktop approval.
   ============================================================ */

@media (max-width:900px) {

    body.radio-page[data-website-theme="sports2j"] {
        padding:8px;
    }

    body.radio-page[data-website-theme="sports2j"]
    .sports2j-radio-frame {
        display:none;
    }

    body.radio-page[data-website-theme="sports2j"]
    header,
    body.radio-page[data-website-theme="sports2j"]
    main,
    body.radio-page[data-website-theme="sports2j"]
    footer {
        width:100%;
    }

    body.radio-page[data-website-theme="sports2j"]
    header::after {
        display:none;
    }

    body.radio-page[data-website-theme="sports2j"]
    header .container.nav {
        padding:
            12px
            18px;
    }

    body.radio-page[data-website-theme="sports2j"]
    .hero {
        min-height:360px;

        padding:
            38px
            28px;

        background-position:
            center 24% !important;
    }

    body.radio-page[data-website-theme="sports2j"]
    .main-grid {
        grid-template-columns:1fr;

        padding:
            18px;
    }
}