/*
 * Jaakon Radion yhteiset design-tokenit.
 *
 * base.css sisältää yleisen teeman oletukset. Tämä tiedosto määrittelee
 * radion julkisen palveluteeman arvot niiden päälle. Sivukohtaiset sävyt
 * kuuluvat myöhemmin omiin komponentti- tai sivusääntöihinsä.
 */
body.service-theme--radio {
    --color-bg: #0f0f0f;
    --color-surface: #171717;
    --color-ink: #f5f5f5;
    --color-muted: #c8cbc5;
    --color-accent: #ff3b3b;
    --color-accent-2: #8cffb7;
    --color-accent-3: #f1c36a;
    --color-line: rgba(245, 245, 245, 0.16);
    --color-button-text: #0f0f0f;
    --nav-active-color: #8cffb7;

    /* Etusivun ja yleisten radio-sivujen perustausta. */
    --bg-grad-start: #181818;
    --bg-grad-mid: #0f0f0f;
    --bg-grad-end: #060606;

    /* Sivupinnan pohja ja erilliset tunnelma-overlayt. */
    --page-bg-start: #0c0d0f;
    --page-bg-mid: #090a0d;
    --page-bg-end: #0f1114;
    --page-glow-red: rgba(255, 59, 59, 0.08);
    --page-glow-green: rgba(140, 255, 183, 0.06);

    /* Sivunvaihtolataajan backdrop on neutraali; palkit säilyvät värillisinä. */
    --loader-backdrop: rgba(7, 8, 8, 0.72);
    --loader-bar-start: #8cffb7;
    --loader-bar-end: #ff3b3b;
    --loader-bar-glow: rgba(140, 255, 183, 0.2);

    --radio-button-bg: linear-gradient(180deg, #df4d67 0%, #c93452 100%);
    --radio-button-border: rgba(214, 63, 89, 0.78);
    --radio-button-text: #fff;
    --radio-button-shadow: 0 10px 26px rgba(201, 52, 82, 0.22);
    --radio-button-hover-bg: linear-gradient(180deg, #8cffb7 0%, #57d68f 100%);
    --radio-button-hover-border: rgba(140, 255, 183, 0.85);
    --radio-button-hover-shadow: 0 12px 30px rgba(87, 214, 143, 0.2);
    --radio-button-ghost-bg: rgba(255, 255, 255, 0.04);
    --radio-button-ghost-text: #fff;

    /* Aluekohtainen brändipaletti: pidetään sävyt yhdessä paikassa. */
    --brand-artists-border: rgba(214, 63, 89, 0.12);
    --brand-artists-glow: rgba(214, 63, 89, 0.12);
    --brand-artists-warm-glow: rgba(255, 191, 120, 0.08);
    --brand-artists-bg-start: #18141c;
    --brand-artists-bg-mid: #12151a;
    --brand-artists-bg-end: #141016;
    --brand-artists-heading: #fff3ee;
    --brand-artists-copy: rgba(255, 224, 205, 0.9);
    --brand-advertisers-border: rgba(140, 205, 255, 0.18);
    --brand-advertisers-glow: rgba(123, 175, 255, 0.26);
    --brand-advertisers-cool-glow: rgba(118, 255, 227, 0.12);
    --brand-advertisers-bg-start: #102236;
    --brand-advertisers-bg-mid: #122941;
    --brand-advertisers-bg-end: #0e1f30;
    --brand-advertisers-heading: #f2fbff;
    --brand-advertisers-copy: rgba(236, 247, 255, 0.84);
    --brand-live-accent: #e0a15b;
    --brand-member-accent: #6fb8b0;
    --brand-member-accent-soft: #9ad7d0;
    --brand-member-page-glow: rgba(111, 184, 176, 0.15);
    --brand-member-page-cool-glow: rgba(92, 126, 184, 0.12);
    --brand-member-page-bg-start: #10191b;
    --brand-member-page-bg-mid: #0a0d10;
    --brand-member-page-bg-end: #101316;
    --brand-member-profile-panel-glow: rgba(111, 184, 176, 0.1);
    --brand-member-profile-panel-cool-glow: rgba(92, 126, 184, 0.08);
    --brand-member-profile-panel-bg-start: rgba(16, 25, 27, 0.96);
    --brand-member-profile-panel-bg-end: rgba(10, 13, 16, 0.99);
    --brand-member-profile-border: rgba(111, 184, 176, 0.18);
    --brand-member-profile-active-bg: rgba(111, 184, 176, 0.09);
    --brand-member-profile-active-border: rgba(111, 184, 176, 0.52);
    --brand-member-chat-border: rgba(111, 184, 176, 0.2);
    --brand-member-chat-glow: rgba(111, 184, 176, 0.1);
    --brand-member-chat-cool-glow: rgba(92, 126, 184, 0.08);
    --brand-member-chat-bg-start: rgba(13, 27, 30, 0.84);
    --brand-member-chat-bg-end: rgba(8, 14, 18, 0.90);
    --brand-member-chat-label: rgba(154, 215, 208, 0.62);
    --brand-member-reaction-border: rgba(111, 184, 176, 0.18);
    --brand-member-reaction-bg: rgba(111, 184, 176, 0.045);
    --brand-member-reaction-border-active: rgba(111, 184, 176, 0.34);
    --brand-member-reaction-bg-active: rgba(111, 184, 176, 0.09);
    --brand-member-reaction-text: rgba(174, 226, 220, 0.88);
    --brand-member-reaction-count: rgba(174, 226, 220, 0.78);

    /* Jäsenyystagien semanttiset värit. */
    --membership-vip-border: rgba(214, 168, 92, 0.52);
    --membership-vip-bg-start: rgba(214, 168, 92, 0.2);
    --membership-vip-bg-end: rgba(168, 119, 47, 0.1);
    --membership-vip-text: #fff1c2;
    --membership-vip-shadow: rgba(143, 95, 29, 0.2);
    --membership-trial-border: rgba(126, 168, 230, 0.5);
    --membership-trial-bg-start: rgba(126, 168, 230, 0.2);
    --membership-trial-bg-end: rgba(86, 118, 172, 0.1);
    --membership-trial-text: #e6f0ff;
    --membership-yearly-border: rgba(140, 255, 183, 0.26);
    --membership-yearly-bg-start: rgba(140, 255, 183, 0.14);
    --membership-yearly-bg-end: rgba(140, 255, 183, 0.06);
    --membership-yearly-text: #dbffe8;
}