:root {
    --tf-bg: #02000d;
    --tf-bg2: #05021a;
    --tf-panel: #071126;
    --tf-panel2: #0b1430;

    --tf-blue: #008cff;
    --tf-cyan: #23bdff;

    --tf-purple: #7434e8;
    --tf-pink: #ff008c;
    --tf-pink-light: #ff31ad;

    --tf-white: #ffffff;
    --tf-muted: #b9c8dc;

    --tf-border: #235da0;

    --tf-gradient:
        linear-gradient(
            135deg,
            #008cff 0%,
            #364cff 42%,
            #872ee5 68%,
            #ff008c 100%
        );
}

/* PAGINA */
html,
body {
    background:
        radial-gradient(
            circle at 80% 0,
            rgba(255, 0, 140, .09),
            transparent 30%
        ),
        radial-gradient(
            circle at 10% 20%,
            rgba(0, 140, 255, .08),
            transparent 30%
        ),
        var(--tf-bg) !important;
}

/* HEADER */
.new-site-header {
    background:
        linear-gradient(
            90deg,
            #020b18,
            #05051c 55%,
            #10031b
        ) !important;

    border-bottom:
        1px solid rgba(0, 140, 255, .45) !important;
}

/* MENU */
.new-main-nav a {
    color: #edf5ff !important;
}

.new-main-nav a:hover,
.new-main-nav a.active {
    color: #fff !important;

    background: var(--tf-gradient) !important;

    border-color: #24baff !important;

    box-shadow:
        0 0 12px rgba(0, 140, 255, .38),
        0 0 20px rgba(255, 0, 140, .22) !important;
}

/* LUISTER LIVE HEADER */
.header-listen-button {
    color: #fff !important;

    background: var(--tf-gradient) !important;

    border:
        1px solid rgba(54, 193, 255, .8) !important;

    box-shadow:
        0 0 13px rgba(0, 140, 255, .40),
        0 0 25px rgba(255, 0, 140, .20) !important;
}

/* HERO KNOPPEN */
.new-primary-button,
.button.primary,
.listen-live-button {
    color: #fff !important;

    background: var(--tf-gradient) !important;

    border:
        1px solid #36bdff !important;

    box-shadow:
        0 10px 25px rgba(0, 140, 255, .25),
        0 0 20px rgba(255, 0, 140, .18) !important;
}

.new-primary-button:hover,
.button.primary:hover,
.header-listen-button:hover {
    filter: brightness(1.13);

    box-shadow:
        0 0 17px rgba(0, 174, 255, .55),
        0 0 30px rgba(255, 0, 140, .34) !important;
}

/* TWEEDE KNOP */
.new-secondary-button,
.button.secondary {
    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            rgba(0, 140, 255, .12),
            rgba(255, 0, 140, .12)
        ) !important;

    border:
        1px solid #7257d8 !important;
}

/* HOMEPAGE KAARTEN */
.radio-dashboard-card,
.cards article,
.hero-live-card,
.live-player-card,
.public-news-card,
.dj-card,
.contact-card,
.program-day-card {
    background:
        radial-gradient(
            circle at top right,
            rgba(255, 0, 140, .08),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #09152d,
            #04091a
        ) !important;

    border:
        1px solid #245f9e !important;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .42) !important;
}

/* KAART HOVER */
.radio-dashboard-card:hover,
.cards article:hover,
.public-news-card:hover,
.dj-card:hover {
    border-color: #ae35de !important;

    box-shadow:
        0 0 15px rgba(0, 140, 255, .20),
        0 0 22px rgba(255, 0, 140, .15) !important;
}

/* KAART KOPPEN */
.dashboard-card-header {
    border-bottom:
        1px solid rgba(71, 96, 190, .55) !important;
}

.dashboard-icon,
.dj-card-label,
.dj-eyebrow,
.eyebrow {
    color: var(--tf-pink-light) !important;
}

/* PROGRAMMA LIVE */
.home-schedule-item.is-current {
    background:
        linear-gradient(
            90deg,
            #006fe9,
            #563bd3 58%,
            #bc177f
        ) !important;

    border-left:
        4px solid #24bcff !important;
}

/* VERZOEKJE KNOP */
.home-request-form button {
    color: #fff !important;

    background: var(--tf-gradient) !important;

    border:
        1px solid #25baff !important;

    box-shadow:
        0 0 14px rgba(0, 140, 255, .30),
        0 0 18px rgba(255, 0, 140, .18) !important;
}

/* INVOERVELDEN */
.home-request-form input,
input,
textarea,
select {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #06122b,
            #060c20
        ) !important;

    border:
        1px solid #315c99 !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--tf-pink) !important;

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(255, 0, 140, .11) !important;
}

/* DJ KNOP */
.dj-week-button,
.dj-live-button {
    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            #071a35,
            #101334
        ) !important;

    border:
        1px solid #596bc7 !important;
}

.dj-week-button:hover,
.dj-live-button:hover {
    background: var(--tf-gradient) !important;
}

/* LIVE BADGE */
.hero-live-card-header span:not(.eyebrow),
.live-badge {
    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            #b70070,
            #ff008c
        ) !important;

    box-shadow:
        0 0 15px rgba(255, 0, 140, .42) !important;
}

/* DJ FOTO RAND */
.hero-live-avatar,
.dj-photo {
    border-color: #188fff !important;

    box-shadow:
        0 0 0 3px rgba(0, 140, 255, .12),
        0 0 20px rgba(255, 0, 140, .18) !important;
}

/* EQUALIZER */
.hero-equalizer i,
.footer-wave i {
    background:
        linear-gradient(
            180deg,
            #ff008c 0%,
            #8136ec 45%,
            #008cff 100%
        ) !important;
}

/* LINKS */
.dashboard-card-header > a,
.request-queue-link,
.read-more {
    color: #37baff !important;
}

.dashboard-card-header > a:hover,
.request-queue-link:hover {
    color: #ff38ae !important;
}

/* VOORDELENBALK */
.radio-benefits,
.radio-features {
    background:
        linear-gradient(
            90deg,
            #052558 0%,
            #173982 30%,
            #453292 58%,
            #741d78 78%,
            #b00070 100%
        ) !important;
}

.radio-benefit-icon,
.radio-features > div > span {
    color: #22b8ff !important;
}

/* FOOTER */
.radio-footer {
    background:
        radial-gradient(
            circle at top right,
            rgba(255, 0, 140, .10),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #030b1b,
            #02000d
        ) !important;
}

.radio-footer-player {
    background:
        linear-gradient(
            145deg,
            #071831,
            #110923
        ) !important;

    border:
        1px solid #3b55a4 !important;
}

/* FOOTER PLAY */
.footer-play-button {
    color: #fff !important;

    background: var(--tf-gradient) !important;

    border:
        2px solid #27baff !important;

    box-shadow:
        0 0 20px rgba(0, 140, 255, .40),
        0 0 27px rgba(255, 0, 140, .25) !important;
}

/* FOOTER LINKS */
.radio-footer-column a:hover,
.footer-links a:hover {
    color: #ff38ae !important;
}

/* ONDERLIJNEN */
.radio-footer-column,
.radio-footer-bottom {
    border-color:
        rgba(64, 100, 170, .45) !important;
}

/* MOBIEL */
@media (max-width: 900px) {
    .new-main-nav {
        background:
            radial-gradient(
                circle at 80% 10%,
                rgba(255, 0, 140, .13),
                transparent 30%
            ),
            linear-gradient(
                180deg,
                #020a18,
                #08031a
            ) !important;
    }

    .new-menu-toggle {
        border-color: #4b52b5 !important;
    }
}

/* =========================================================
   GASTENBOEK MENU - ZICHTBAAR OP NORMALE DESKTOPBREEDTES
   ========================================================= */

@media (min-width: 901px) and (max-width: 1250px) {
    .new-site-header {
        grid-template-columns: 105px minmax(0, 1fr) auto !important;
        gap: 10px !important;
        padding: 8px 14px !important;
    }

    .new-brand {
        width: 100px !important;
    }

    .new-brand img {
        max-height: 78px !important;
    }

    .new-main-nav {
        min-width: 0 !important;
        gap: 1px !important;
        justify-content: center !important;
    }

    .new-main-nav a {
        flex: 0 0 auto !important;
        padding: 8px 6px !important;
        font-size: .68rem !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
    }

    .header-listen-button {
        min-height: 40px !important;
        padding: 8px 11px !important;
        gap: 5px !important;
        font-size: .72rem !important;
        white-space: nowrap !important;
    }
}

/* Gastenboek is het laatste menu-item, direct naast Chat */
.new-main-nav a[href="/gastenboek"] {
    display: inline-flex !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    white-space: nowrap !important;
}

/* Op brede desktops iets meer ruimte */
@media (min-width: 1251px) {
    .new-main-nav {
        gap: 5px !important;
    }

    .new-main-nav a {
        padding-inline: 9px !important;
    }
}


/* HOME VERZOEK DJ SELECT */
.home-request-form select {
    width: 100% !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
    color: #fff !important;
    background: linear-gradient(180deg,#06122b,#060c20) !important;
    border: 1px solid #315c99 !important;
    border-radius: 7px !important;
}