/*
SportyPress v1.7 - PALETTE SKINS LAYER
==========================================================================
Loaded LAST (after palettes.css + modern.css) so it wins the cascade.

Architecture:
  css/palettes.css   = THE CLASSIC DEFAULT LOOK, restored verbatim from the
                       user's original file (8 classic palettes + the whole
                       classic styling layer). DO NOT EDIT THAT FILE.
  css/modern.css     = the v1.1+ redesign layer (unchanged).
  css/palette-skins.css (this file) =
      1. Classic compat tokens (v1.3-equivalent defaults on body)
      2. The v1.6 palette families:
           Light Variants - classic consistency + tinted light page background
           Dark Variants  - the opposite: black/gray page, dark cards,
                            text ALWAYS white, LIGHT rollover colors
           Sporty         - suggested sport-news palettes (light + dark)
      3. body.palette-custom base (classic values; the Customizer writes
         the user's saved colors inline AFTER this sheet)
      4. Variable-ized re-declarations of the classic surface/text rules:
         every fallback value is the EXACT classic value, so the Classic
         Default look is byte-for-byte unchanged - but Dark Variants flip
         cards, text and borders via the same variables.
      5. The v1.2 secondary-accent + tint tail rules (v1.3 behavior).

Every palette keeps the user's consistency doctrine:
  - LIGHT: black text on white cards, WHITE text on the strong accent,
    rollover/link colors inside the palette family.
  - DARK:  white text always, LIGHT rollover colors, bright accent.
*/

/* ----------------------------------------------------------------------
 1. CLASSIC COMPAT TOKENS (v1.3-equivalent)
    Only the tokens modern.css consumes. Text tokens are deliberately NOT
    defined here: the classic rules below fall back to their exact classic
    values, and modern.css keeps its own #1c1e25 / #3d4350 fallbacks - the
    rendered Classic Default is identical to v1.3.
    The classic page background (#eaeaea) lives in palettes.css.
    --sp-on-accent = readable text ON the accent (breaking-news ticker,
    badges): white on dark accents, near-black on bright accents.
---------------------------------------------------------------------- */
body {
  --sp-accent-2: #2E3A8C;            /* classic secondary accent */
  --sp-tint: rgba(199,9,9,.07);      /* classic red wash */
  --sp-body-bg: #f1f3f6;             /* boxed wrapper bg (page bg = palettes.css #eaeaea) */
  --sp-content-bg: #ffffff;          /* content cards */
  --sp-on-accent: #ffffff;           /* white letters on the classic red */
}


/* ----------------------------------------------------------------------
 2. LIGHT VARIANTS - classic consistency + tinted light page background.
    Text colors are NOT set: the classic black-on-white text stays.
    Page background renders through body.sp-palette-bg (modern.css)
    + --sp-body-bg below.
---------------------------------------------------------------------- */

body.palette-royal-blue { /* Royal Blue */
  --sp-accent: #1e56a0;
  --sp-accent-rgb: 30,86,160;
  --sp-accent-2: #10275a;
  --sp-hover: #10275a;
  --sp-dark: #0d1b2a;
  --sp-dropdown: #16273b;
  --sp-dark2: #122234;
  --sp-tint: rgba(30,86,160,.08);
  --sp-body-bg: #e9eef6;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e7ecf4;
  --sp-border: #dbe4ef;
  --sp-on-accent: #ffffff;
  --newses-accent: #1e56a0;
}

body.palette-emerald { /* Emerald Green */
  --sp-accent: #0f8a5f;
  --sp-accent-rgb: 15,138,95;
  --sp-accent-2: #0a5c40;
  --sp-hover: #0a5c40;
  --sp-dark: #0c2119;
  --sp-dropdown: #12301f;
  --sp-dark2: #102a1d;
  --sp-tint: rgba(15,138,95,.08);
  --sp-body-bg: #e7f2ec;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e4efe9;
  --sp-border: #d8e7df;
  --sp-on-accent: #ffffff;
  --newses-accent: #0f8a5f;
}

body.palette-gold { /* Royal Gold */
  --sp-accent: #c9a227;
  --sp-accent-rgb: 201,162,39;
  --sp-accent-2: #8a6d1d;
  --sp-hover: #8a6d1d;
  --sp-dark: #14110a;
  --sp-dropdown: #241e10;
  --sp-dark2: #1e1a0e;
  --sp-tint: rgba(201,162,39,.08);
  --sp-body-bg: #f6f1e3;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f2ecda;
  --sp-border: #e9e1c9;
  --sp-on-accent: #292313;
  --newses-accent: #c9a227;
}

body.palette-burgundy { /* Burgundy Wine */
  --sp-accent: #8e1f2f;
  --sp-accent-rgb: 142,31,47;
  --sp-accent-2: #5e1420;
  --sp-hover: #5e1420;
  --sp-dark: #1d0f13;
  --sp-dropdown: #2a161b;
  --sp-dark2: #241217;
  --sp-tint: rgba(142,31,47,.08);
  --sp-body-bg: #f5e9ea;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #efe2e4;
  --sp-border: #e5d5d8;
  --sp-on-accent: #ffffff;
  --newses-accent: #8e1f2f;
}

body.palette-teal-gold { /* Teal & Gold */
  --sp-accent: #0e7490;
  --sp-accent-rgb: 14,116,144;
  --sp-accent-2: #0a556b;
  --sp-hover: #0a556b;
  --sp-dark: #0e1e25;
  --sp-dropdown: #142a33;
  --sp-dark2: #112530;
  --sp-tint: rgba(14,116,144,.08);
  --sp-body-bg: #e7f0f3;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e2edf1;
  --sp-border: #d5e5ea;
  --sp-on-accent: #ffffff;
  --newses-accent: #0e7490;
}

body.palette-plum { /* Plum Violet */
  --sp-accent: #6b4fa0;
  --sp-accent-rgb: 107,79,160;
  --sp-accent-2: #4a3473;
  --sp-hover: #4a3473;
  --sp-dark: #150e22;
  --sp-dropdown: #251c33;
  --sp-dark2: #1e1730;
  --sp-tint: rgba(107,79,160,.08);
  --sp-body-bg: #edeaf5;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e7e2f0;
  --sp-border: #dad3e6;
  --sp-on-accent: #ffffff;
  --newses-accent: #6b4fa0;
}

body.palette-sunset-orange { /* Sunset Orange */
  --sp-accent: #d9531e;
  --sp-accent-rgb: 217,83,30;
  --sp-accent-2: #993912;
  --sp-hover: #993912;
  --sp-dark: #1f1108;
  --sp-dropdown: #33200f;
  --sp-dark2: #29190c;
  --sp-tint: rgba(217,83,30,.08);
  --sp-body-bg: #f8efe6;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f2e6da;
  --sp-border: #ead9c9;
  --sp-on-accent: #ffffff;
  --newses-accent: #d9531e;
}

body.palette-gray { /* Steel Gray */
  --sp-accent: #5a6472;
  --sp-accent-rgb: 90,100,114;
  --sp-accent-2: #3a414d;
  --sp-hover: #3a414d;
  --sp-dark: #22262e;
  --sp-dropdown: #2c313a;
  --sp-dark2: #272b33;
  --sp-tint: rgba(90,100,114,.08);
  --sp-body-bg: #ecedee;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e8eaec;
  --sp-border: #dcdee1;
  --sp-on-accent: #ffffff;
  --newses-accent: #5a6472;
}


/* ----------------------------------------------------------------------
 3. DARK VARIANTS - the OPPOSITE of the classic look, now following the
    GRAPHITE pattern the user picked: gray page background + near-black
    cards (some a lighter gray), text ALWAYS white, rollovers in LIGHT
    colors (--sp-hover), bright accents. --sp-title-color is required:
    section titles otherwise inherit --sp-dark (near black) and would
    vanish on the dark page.
---------------------------------------------------------------------- */

body.palette-midnight { /* Midnight Dark */
  --sp-accent: #e53935;
  --sp-accent-rgb: 229,57,53;
  --sp-accent-2: #c22e2b;
  --sp-hover: #f58c87;
  --sp-dark: #101114;
  --sp-dropdown: #1e2126;
  --sp-dark2: #15171b;
  --sp-tint: rgba(229,57,53,.14);
  --sp-body-bg: #232629;
  --sp-content-bg: #0f1113;
  --sp-muted-bg: #17191d;
  --sp-border: #2c2f34;
  --sp-on-accent: #ffffff;
  --sp-text-strong: #f5f6f8;
  --sp-text-body: #b3b8bd;
  --sp-text-muted: #8d9297;
  --sp-title-color: #f5f6f8;
  --newses-accent: #e53935;
}

body.palette-carbon-blue { /* Carbon Blue */
  --sp-accent: #3b8fe0;
  --sp-accent-rgb: 59,143,224;
  --sp-accent-2: #2f76b4;
  --sp-hover: #9cc4f0;
  --sp-dark: #101216;
  --sp-dropdown: #1d222b;
  --sp-dark2: #14171d;
  --sp-tint: rgba(59,143,224,.14);
  --sp-body-bg: #26292e;
  --sp-content-bg: #0f1215;
  --sp-muted-bg: #171a1f;
  --sp-border: #2e3237;
  --sp-on-accent: #ffffff;
  --sp-text-strong: #f4f6f9;
  --sp-text-body: #b3bac6;
  --sp-text-muted: #8a93a0;
  --sp-title-color: #f4f6f9;
  --newses-accent: #3b8fe0;
}

body.palette-dark-emerald { /* Forest Dark */
  --sp-accent: #2bb673;
  --sp-accent-rgb: 43,182,115;
  --sp-accent-2: #23915c;
  --sp-hover: #8fddb4;
  --sp-dark: #101312;
  --sp-dropdown: #1c241f;
  --sp-dark2: #141a17;
  --sp-tint: rgba(43,182,115,.14);
  --sp-body-bg: #232729;
  --sp-content-bg: #0f1311;
  --sp-muted-bg: #171b18;
  --sp-border: #2c3230;
  --sp-on-accent: #12261e;
  --sp-text-strong: #f2f7f4;
  --sp-text-body: #b1bcb4;
  --sp-text-muted: #8a988f;
  --sp-title-color: #f2f7f4;
  --newses-accent: #2bb673;
}

body.palette-dark-gold { /* Black & Gold */
  --sp-accent: #d4af37;
  --sp-accent-rgb: 212,175,55;
  --sp-accent-2: #ae8f2c;
  --sp-hover: #edd98f;
  --sp-dark: #131109;
  --sp-dropdown: #221c11;
  --sp-dark2: #18140c;
  --sp-tint: rgba(212,175,55,.14);
  --sp-body-bg: #262422;
  --sp-content-bg: #121110;
  --sp-muted-bg: #191715;
  --sp-border: #322e28;
  --sp-on-accent: #2b2515;
  --sp-text-strong: #f7f5ee;
  --sp-text-body: #b8b4a6;
  --sp-text-muted: #94907f;
  --sp-title-color: #f7f5ee;
  --newses-accent: #d4af37;
}

body.palette-dark-burgundy { /* Wine Dark */
  --sp-accent: #c93a4a;
  --sp-accent-rgb: 201,58,74;
  --sp-accent-2: #a22e3b;
  --sp-hover: #efa0a9;
  --sp-dark: #121012;
  --sp-dropdown: #201a1e;
  --sp-dark2: #171417;
  --sp-tint: rgba(201,58,74,.14);
  --sp-body-bg: #272325;
  --sp-content-bg: #111012;
  --sp-muted-bg: #181619;
  --sp-border: #322c2f;
  --sp-on-accent: #ffffff;
  --sp-text-strong: #f8f2f3;
  --sp-text-body: #bcb2b5;
  --sp-text-muted: #978b8f;
  --sp-title-color: #f8f2f3;
  --newses-accent: #c93a4a;
}

body.palette-dark-teal { /* Deep Teal */
  --sp-accent: #22a7c0;
  --sp-accent-rgb: 34,167,192;
  --sp-accent-2: #1b869a;
  --sp-hover: #93d6e5;
  --sp-dark: #101415;
  --sp-dropdown: #1d2427;
  --sp-dark2: #141a1c;
  --sp-tint: rgba(34,167,192,.14);
  --sp-body-bg: #232829;
  --sp-content-bg: #0f1314;
  --sp-muted-bg: #171b1c;
  --sp-border: #2c3233;
  --sp-on-accent: #10242a;
  --sp-text-strong: #f0f6f8;
  --sp-text-body: #b0bfc4;
  --sp-text-muted: #8a9aa0;
  --sp-title-color: #f0f6f8;
  --newses-accent: #22a7c0;
}

body.palette-graphite { /* Graphite (Gray + Black) */
  --sp-accent: #8ab4f0;
  --sp-accent-rgb: 138,180,240;
  --sp-accent-2: #6f96c7;
  --sp-hover: #c8dcf9;
  --sp-dark: #0f1113;
  --sp-dropdown: #1d2126;
  --sp-dark2: #14171a;
  --sp-tint: rgba(138,180,240,.14);
  --sp-body-bg: #232629;
  --sp-content-bg: #101214;
  --sp-muted-bg: #1a1d20;
  --sp-border: #2c2f33;
  --sp-on-accent: #202631;
  --sp-text-strong: #f5f6f8;
  --sp-text-body: #b3b8bd;
  --sp-text-muted: #8d9297;
  --sp-title-color: #f5f6f8;
  --newses-accent: #8ab4f0;
}

body.palette-dark-violet { /* Amethyst Dark */
  --sp-accent: #a78bfa;
  --sp-accent-rgb: 167,139,250;
  --sp-accent-2: #8668f0;
  --sp-hover: #d3c4fb;
  --sp-dark: #121016;
  --sp-dropdown: #1f1c29;
  --sp-dark2: #161420;
  --sp-tint: rgba(167,139,250,.14);
  --sp-body-bg: #26242b;
  --sp-content-bg: #111015;
  --sp-muted-bg: #18161d;
  --sp-border: #322e37;
  --sp-on-accent: #242032;
  --sp-text-strong: #f5f3fa;
  --sp-text-body: #b4aec4;
  --sp-text-muted: #8f89a2;
  --sp-title-color: #f5f3fa;
  --newses-accent: #a78bfa;
}


/* ----------------------------------------------------------------------
 4. SPORTY - team-inspired looks, ALL LIGHT (the user wants no dark page
    backgrounds in this family). Popular light-color background combos:
    cream+gold, ivory+orange, ice blue+sky, blush+coral, lavender+violet,
    mint+green, rose+red, lilac+purple, powder+navy, sage+turf.
---------------------------------------------------------------------- */

body.palette-varsity-navy { /* Varsity Navy */
  --sp-accent: #223a8f;
  --sp-accent-rgb: 34,58,143;
  --sp-accent-2: #17255f;
  --sp-hover: #17255f;
  --sp-dark: #101b40;
  --sp-dropdown: #1b2a5c;
  --sp-dark2: #16224e;
  --sp-tint: rgba(34,58,143,.08);
  --sp-body-bg: #e9ebf5;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e4e7f1;
  --sp-border: #d6dbee;
  --sp-on-accent: #ffffff;
  --newses-accent: #223a8f;
}

body.palette-turf-green { /* Turf Green */
  --sp-accent: #279a56;
  --sp-accent-rgb: 39,154,86;
  --sp-accent-2: #1b6e3d;
  --sp-hover: #1b6e3d;
  --sp-dark: #12291a;
  --sp-dropdown: #1d3b29;
  --sp-dark2: #183222;
  --sp-tint: rgba(39,154,86,.08);
  --sp-body-bg: #e9f4ec;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e2efe7;
  --sp-border: #d3e6da;
  --sp-on-accent: #ffffff;
  --newses-accent: #279a56;
}

body.palette-stadium-night { /* Stadium Green */
  --sp-accent: #0da678;
  --sp-accent-rgb: 13,166,120;
  --sp-accent-2: #0a8760;
  --sp-hover: #0a8760;
  --sp-dark: #0e2a1e;
  --sp-dropdown: #143d2b;
  --sp-dark2: #123526;
  --sp-tint: rgba(13,166,120,.08);
  --sp-body-bg: #e7f6ee;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #dff0e6;
  --sp-border: #cde7d9;
  --sp-on-accent: #ffffff;
  --newses-accent: #0da678;
}

body.palette-racing-red { /* Racing Red */
  --sp-accent: #d6202c;
  --sp-accent-rgb: 214,32,44;
  --sp-accent-2: #a3111c;
  --sp-hover: #a3111c;
  --sp-dark: #2a0f12;
  --sp-dropdown: #3d171c;
  --sp-dark2: #361418;
  --sp-tint: rgba(214,32,44,.08);
  --sp-body-bg: #fbeaea;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f5dcdc;
  --sp-border: #ebcfcf;
  --sp-on-accent: #ffffff;
  --newses-accent: #d6202c;
}

body.palette-court-purple { /* Court Purple */
  --sp-accent: #6d28d9;
  --sp-accent-rgb: 109,40,217;
  --sp-accent-2: #5b21b6;
  --sp-hover: #5b21b6;
  --sp-dark: #1e1436;
  --sp-dropdown: #2c1f52;
  --sp-dark2: #271b47;
  --sp-tint: rgba(109,40,217,.08);
  --sp-body-bg: #f0ebfb;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e9e1f7;
  --sp-border: #d9cdf0;
  --sp-on-accent: #ffffff;
  --newses-accent: #6d28d9;
}

body.palette-sporty-gold { /* Sporty Gold */
  --sp-accent: #b8860b;
  --sp-accent-rgb: 184,134,11;
  --sp-accent-2: #8a6a08;
  --sp-hover: #8a6a08;
  --sp-dark: #1e1808;
  --sp-dropdown: #2e250d;
  --sp-dark2: #28200b;
  --sp-tint: rgba(184,134,11,.08);
  --sp-body-bg: #faf5e4;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f4ecd2;
  --sp-border: #e9dfb8;
  --sp-on-accent: #ffffff;
  --newses-accent: #b8860b;
}

body.palette-sporty-orange { /* Sporty Orange */
  --sp-accent: #e8590c;
  --sp-accent-rgb: 232,89,12;
  --sp-accent-2: #b2430a;
  --sp-hover: #b2430a;
  --sp-dark: #231408;
  --sp-dropdown: #36210c;
  --sp-dark2: #2f1c0a;
  --sp-tint: rgba(232,89,12,.08);
  --sp-body-bg: #fff1e5;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #ffe4ce;
  --sp-border: #f5d8bc;
  --sp-on-accent: #ffffff;
  --newses-accent: #e8590c;
}

body.palette-sky-sport { /* Sky Sport */
  --sp-accent: #0284c7;
  --sp-accent-rgb: 2,132,199;
  --sp-accent-2: #0369a1;
  --sp-hover: #0369a1;
  --sp-dark: #0b1d2a;
  --sp-dropdown: #132d3f;
  --sp-dark2: #102736;
  --sp-tint: rgba(2,132,199,.08);
  --sp-body-bg: #e8f4fb;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #ddeef8;
  --sp-border: #c8e2f0;
  --sp-on-accent: #ffffff;
  --newses-accent: #0284c7;
}

body.palette-coral-blush { /* Coral Blush */
  --sp-accent: #d9455c;
  --sp-accent-rgb: 217,69,92;
  --sp-accent-2: #a83448;
  --sp-hover: #a83448;
  --sp-dark: #24101a;
  --sp-dropdown: #361a28;
  --sp-dark2: #2f1622;
  --sp-tint: rgba(217,69,92,.08);
  --sp-body-bg: #fdeff1;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f8e0e3;
  --sp-border: #f2cdd2;
  --sp-on-accent: #ffffff;
  --newses-accent: #d9455c;
}

body.palette-lavender-court { /* Lavender Court */
  --sp-accent: #6d4fc4;
  --sp-accent-rgb: 109,79,196;
  --sp-accent-2: #573ea0;
  --sp-hover: #573ea0;
  --sp-dark: #1a1433;
  --sp-dropdown: #28204f;
  --sp-dark2: #231c44;
  --sp-tint: rgba(109,79,196,.08);
  --sp-body-bg: #f1edfa;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #e9e2f5;
  --sp-border: #d8cdec;
  --sp-on-accent: #ffffff;
  --newses-accent: #6d4fc4;
}


/* ----------------------------------------------------------------------
 5. CUSTOM PALETTE BASE (classic values until the user saves colors)
    The Customizer prints the SAVED 11 colors inline AFTER this sheet,
    overriding this block for body.palette-custom.
---------------------------------------------------------------------- */
body.palette-custom { /* Custom (Your Colors) - classic fallback set */
  --sp-accent: #C70909;
  --sp-accent-rgb: 199,9,9;
  --sp-accent-2: #002954;
  --sp-hover: #002954;
  --sp-dark: #121026;
  --sp-dropdown: #1f2024;
  --sp-dark2: #1b1932;
  --sp-tint: rgba(199,9,9,.07);
  --sp-body-bg: #eaeaea;
  --sp-content-bg: #ffffff;
  --sp-muted-bg: #f3eeee;
  --sp-border: #eef3fb;
  --sp-on-accent: #ffffff;
  --newses-accent: #C70909;
}

/* ----------------------------------------------------------------------
 6. VARIABLE-IZED CLASSIC SURFACES + TEXT
    Same selectors as the classic file (loaded later = wins the cascade).
    EVERY fallback is the exact classic value, so the Classic Default
    renders identically - but Dark Variants / Custom flip cards, text,
    borders and chips through the variables.
---------------------------------------------------------------------- */

/* --- navbar / header borders + brand --- */
.mg-headwidget .navbar-wp {
        border-color: var(--sp-border, #d4d4d4);
}
.mg-headwidget .navbar-header .navbar-brand {
        color: var(--sp-text-strong, #222);
}
.header-widget .mg-header-box .mg-social li span.icon-soci a {
        color: var(--sp-text-muted, #999);
}

/* --- body & global --- */
.mg-heading h3, .mg-heading h3 a {
        color: var(--sp-text-strong, #212121);
}
input:not([type]), input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"], textarea {
        color: var(--sp-text-strong, #333);
        border-color: var(--sp-border, #eef3fb);
}
blockquote {
        background: var(--sp-muted-bg, #f5f5f5);
}
.grey-bg {
        background: var(--sp-muted-bg, #f4f7fc);
}
.wp-block-search__input {
        border-color: var(--sp-border, #eef3fb);
}

/* --- section & module --- */
.mg-tpt-txnlst ul li a {
        background: var(--sp-muted-bg, #f3eeee);
}
.recentarea {
        background: var(--sp-content-bg, #fff);
}
.recentarea .content a {
        color: var(--sp-text-strong, #000);
}
.top-right-area .nav-tabs > li > a {
        border-color: var(--sp-border, #eee);
        color: var(--sp-text-strong, #212121);
        background: var(--sp-content-bg, #fff);
}
.title_small_post h5 a {
        color: var(--sp-text-strong, #212121);
}
.mg-featured-slider {
        background-color: var(--sp-content-bg, #FFF);
}
.mg-sec-title {
        border-color: var(--sp-border, #c8c8cd);
}
.mg-sec-title h4 {
        color: var(--sp-title-color, var(--sp-dark));
}
.mg-posts-sec-inner .small-list-post li {
        background: var(--sp-content-bg, #fff);
}
.small-list-post h5.title, .small-list-post h5.title a {
        color: var(--sp-text-strong, #212121);
}
.mg-posts-modul-6 .mg-sec-top-post .title a {
        color: var(--sp-text-strong, #000);
}
.gridslider .mg-blog-post .title a, .gridslider .small-list-post .mg-blog-post .title a {
        color: var(--sp-text-strong, #212121);
}
.mg-subscriber .overlay {
        background: var(--sp-muted-bg, #f3f3f3);
}
.mg-breadcrumb-section .overlay {
        background: var(--sp-content-bg, #fff);
}

/* --- post --- */
.mg-blog-post-box .small {
        color: var(--sp-text-body, #666);
}
.mg-blog-post-box h4.title, .mg-blog-post-box h4.title a {
        color: var(--sp-text-strong, #212121);
}
.mg-header h1.title a {
        color: var(--sp-text-strong, #212121);
}
.mg-blog-meta {
        color: var(--sp-text-strong, #333);
}
.mg-blog-meta a {
        color: var(--sp-text-strong, #333);
}
.mg-blog-meta i {
        color: var(--sp-text-strong, #333);
}
.mg-blog-date {
        color: var(--sp-text-strong, #333);
}
.mg-comments h4 {
        color: var(--sp-text-strong, #212121);
}
.mg-blog-author {
        background: var(--sp-muted-bg, #e8e8e8);
}
.mg-header, .mg-header .mg-info-author-block {
        background: var(--sp-content-bg, #fff);
}
.mg-info-author-block {
        background: var(--sp-content-bg, #fff);
        border-color: var(--sp-border, #f5f6f7);
        color: var(--sp-text-strong, #222);
}
.mg-info-author-block a {
        color: var(--sp-text-strong, #212121);
}
.mg-info-author-block h4 {
        color: var(--sp-text-strong, #333);
}
.mg-info-author-block h4 span {
        color: var(--sp-text-muted, #999999);
}
.comment_section .comment-reply-link {
        background: var(--sp-muted-bg, #f0f0f0);
        color: var(--sp-text-body, #666);
        border-color: var(--sp-muted-bg, #f0f0f0);
}
.mg-comments a {
        color: var(--sp-text-muted, #777);
}
.mg-comments h4 span {
        color: var(--sp-text-muted, #999999);
}
.mg-comments .comment .media-body > p:last-child {
        border-color: var(--sp-border, #f0f0f0);
}
.mg-comments li .media-body > .small {
        color: var(--sp-text-muted, #999);
}
.mg-comments li .media-body > p {
        border-color: var(--sp-border, #f0f0f0);
        color: var(--sp-text-muted, #999);
}
.mg-comments .comment-list li {
        background: var(--sp-content-bg, #fff);
        border-color: var(--sp-border, #eee);
}

/* --- sidebar --- */
.mg-widget {
        border-color: var(--sp-border, #eee);
}
.mg-sidebar .mg-widget {
        border-color: var(--sp-border, #eee);
}
.mg-sidebar .mg-widget h6 {
        color: var(--sp-title-color, var(--sp-dark));
}
.mg-sidebar .mg-widget ul li {
        border-color: var(--sp-border, #eee);
}
.mg-sidebar .mg-widget ul li a {
        color: var(--sp-text-strong, #222);
}
.mg-sidebar .mg-widget .mg-widget-blog-post h5.title a {
        color: var(--sp-text-strong, #212121);
}
.mg-sidebar .mg-widget .mg-widget-tags a, .mg-sidebar .mg-widget .tagcloud a {
        background: var(--sp-muted-bg, #f3eeee);
        border-color: var(--sp-muted-bg, #f3eeee);
}
.mg-sidebar .mg-left-menu-widget ul li a {
        color: var(--sp-text-strong, #212121);
}

/* --- general --- */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
        color: var(--sp-text-strong, #212121);
}
.btn-theme-three {
        color: var(--sp-text-strong, #3b3e79);
        border-color: var(--sp-border, #e9f3ed);
}

/* --- pagination --- */
.navigation.pagination .nav-links .page-numbers, .navigation.pagination .nav-links a {
        background: var(--sp-content-bg, #fff);
        color: var(--sp-text-muted, #999);
}
.pagination > .page-item .page-link {
        color: var(--sp-title-color, var(--sp-dark));
}
.single-nav-links a, .single-nav-links span {
        background: var(--sp-content-bg, #fff);
        color: var(--sp-text-muted, #999);
}
.nav-next a, .nav-previous a {
        color: var(--sp-text-strong, #000);
}

/* --- typo / breadcrumb --- */
.mg-breadcrumb-title h1 {
        color: var(--sp-text-strong, #222);
}
.mg-page-breadcrumb > li a {
        color: var(--sp-text-strong, #222);
}
.mg-page-breadcrumb > li + li:before {
        color: var(--sp-text-strong, #222);
}
.mg-page-breadcrumb > li + li::after {
        color: var(--sp-text-strong, #222);
}
.mg-heading-bor-bt h5 {
        color: var(--sp-text-strong, #212121);
}

/* --- footer tag chips (chips take the card surface) --- */
.mg-footer-widget-area .wp-block-tag-cloud a {
        background: var(--sp-muted-bg, #f3eeee);
        border-color: var(--sp-muted-bg, #f3eeee);
}
footer .mg-widget .mg-widget-tags a, footer .mg-widget .tagcloud a {
        background: var(--sp-content-bg, #fff);
        border-color: var(--sp-content-bg, #fff);
}

/* --- forms --- */
.form-group label {
        color: var(--sp-text-strong, #515151);
}
.form-control {
        border-color: var(--sp-border, #eef3fb);
}

/* --- cards / widgets (classic #fff surfaces) --- */
.wd-back {
        background-color: var(--sp-content-bg, #fff);
}
.mg-sidebar .mg-widget {
        background: var(--sp-content-bg, #fff);
}

/* --- woocommerce (main readable surfaces) --- */
.woocommerce-page .products h3,
.woocommerce div.product .woocommerce-tabs .panel h2,
.related.products h2,
.woocommerce form .form-row label {
        color: var(--sp-text-strong, #333);
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav .woocommerce-pagination ul li span {
        border-color: var(--sp-border, #ddd);
        background: var(--sp-muted-bg, #ebe9eb);
        color: var(--sp-text-muted, #999);
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
        border-color: var(--sp-border, #ccc);
        color: var(--sp-text-muted, #999);
}
.woocommerce-page .products a .price,
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
        color: var(--sp-text-strong, #000);
}

/* ----------------------------------------------------------------------
 7. v1.2 SECONDARY-ACCENT + TINT TAIL (v1.3 behavior, restored)
    Richer two-color look: secondary accent on hovers and alternate badges.
---------------------------------------------------------------------- */
.mg-blog-category a.newses-categories:hover,
.mg-blog-category a.newses-categories:focus {
        background: var(--sp-accent-2, #2E3A8C);
        color: #fff;
}

.sp-item-cat a:hover,
.sp-item-cat a:focus {
        background: var(--sp-accent-2, #2E3A8C);
}

.newses-slide-info-banner .newses-slide-cat a:last-child {
        background: var(--sp-accent-2, #2E3A8C);
}

.mg-sec-title.st3 span.bg {
        background: linear-gradient(100deg, var(--sp-accent) 0%, var(--sp-accent-2, #2E3A8C) 210%);
}

.sp-block-cats .sp-cat-item:hover {
        background: var(--sp-tint, rgba(199,9,9,.07));
}

.sp-block-cats .sp-cat-item .sp-cat-count {
        background: var(--sp-tint, rgba(199,9,9,.08));
}

.mg-latest-news .mg-latest-news-slider a:hover {
        /* v1.7: classic ticker - hover keeps readable letters (accent on
         * accent would be invisible) */
        color: var(--sp-on-accent, #fff);
        text-decoration: underline;
}

/* ----------------------------------------------------------------------
 8. v1.7 CLASSIC TICKER + ON-ACCENT SURFACES
    The breaking-news ticker is the full ACCENT bar with readable letters
    (white on dark accents, near-black on bright accents such as gold) -
    exactly the classic default look, in every palette.
---------------------------------------------------------------------- */
.mg-latest-news {
        background: var(--sp-accent, #c70909);
}
.mg-latest-news .bn_title {
        background-color: var(--sp-accent, #c70909);
}
.mg-latest-news .bn_title h2.title,
.mg-latest-news .bn_title h2.title span {
        color: var(--sp-on-accent, #fff);
}
.mg-latest-news .bn_title h2.title .fa-spinner {
        color: var(--sp-on-accent, #fff);
}
.mg-latest-news .mg-latest-news-slider {
        background: transparent;
}
.mg-latest-news .mg-latest-news-slider a,
.mg-latest-news .mg-latest-news-slider a::before {
        color: var(--sp-on-accent, #fff);
}

/* classic trending top bar: readable label on the accent surface */
.mg-tpt-txnlst strong {
        color: var(--sp-on-accent, #fff);
}

/* dark palettes: keep readable badge contrast on the second accent */
body.sp-dark-palette .newses-slide-info-banner .newses-slide-cat a:last-child,
body.sp-dark-palette .mg-blog-category a.newses-categories:hover {
        color: #fff;
}

/* ----------------------------------------------------------------------
 9. v1.8 DARK SURFACE GUARANTEE
    The user reported the slideshow RIGHT column + BOTTOM row still
    rendering WHITE cards with white text on dark palettes, although the
    v1.7 cascade (modern.css .mg-blog-post-box -> var(--sp-content-bg))
    is verified correct in a real browser for all 8 Dark Variants. The
    symptom matches a STALE cached modern.css layer (v1.6 hard-coded
    background:#fff). This final block makes the dark rendering
    self-contained in THIS sheet (the last one loaded): body.sp-dark-palette
    (printed by the theme for every dark palette incl. Studio + Custom)
    force-flips every card surface + its text, so even an older cached
    earlier layer cannot show white-on-white cards again.
---------------------------------------------------------------------- */
body.sp-dark-palette .mg-blog-post-box,
body.sp-dark-palette .mg-posts-sec-post,
body.sp-dark-palette .wd-back,
body.sp-dark-palette .recentarea,
body.sp-dark-palette .mg-featured-slider,
body.sp-dark-palette .sp-block-cats,
body.sp-dark-palette .sp-block-html,
body.sp-dark-palette .sp-block-posts,
body.sp-dark-palette .sp-block-search,
body.sp-dark-palette .mg-header,
body.sp-dark-palette .mg-info-author-block {
        background: var(--sp-content-bg, #101214) !important;
}

/* white text on those surfaces (titles + body text + meta) */
body.sp-dark-palette .mg-blog-post-box h4.title,
body.sp-dark-palette .mg-blog-post-box h4.title a,
body.sp-dark-palette .mg-blog-post-box .small,
body.sp-dark-palette .mg-posts-sec-post .title a,
body.sp-dark-palette .recentarea .content a,
body.sp-dark-palette .recentarea .inner h5,
body.sp-dark-palette .recentarea .inner h5 a,
body.sp-dark-palette .small-list-post h5.title,
body.sp-dark-palette .small-list-post h5.title a,
body.sp-dark-palette .mg-posts-modul-6 .mg-sec-top-post .title a {
        color: var(--sp-text-strong, #f5f6f8) !important;
}
body.sp-dark-palette .mg-blog-post-box .small,
body.sp-dark-palette .mg-blog-meta,
body.sp-dark-palette .mg-blog-meta a,
body.sp-dark-palette .mg-blog-date {
        color: var(--sp-text-body, #b3b8bd) !important;
}

/* borders follow the palette (no bright classic #eee frames on dark) */
body.sp-dark-palette .mg-blog-post-box.shd,
body.sp-dark-palette .sp-block-cats,
body.sp-dark-palette .sp-block-html,
body.sp-dark-palette .sp-block-posts,
body.sp-dark-palette .sp-block-search,
body.sp-dark-palette .sp-block-image,
body.sp-dark-palette .mg-sec-title {
        border-color: var(--sp-border, #2c2f33) !important;
}

/* ----------------------------------------------------------------------
 9b. v1.9 DARK GUARANTEE - explicit slideshow-area selectors.
     The user reported white cards with white text AGAIN in the
     slideshow RIGHT column, BOTTOM row and the You Missed section.
     Section 9 above already flips .mg-blog-post-box everywhere, but
     these EXPLICIT selectors (higher specificity, still !important)
     make the four slideshow areas + You Missed impossible to miss,
     even if an old cached layer or a plugin injects a white surface.
---------------------------------------------------------------------- */
body.sp-dark-palette .sp-slide-right .mg-blog-post-box,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box,
body.sp-dark-palette .missed-inner .mg-blog-post-box,
body.sp-dark-palette .missed-inner.wd-back,
body.sp-dark-palette .small-list-post .mg-blog-post-box {
        background: var(--sp-content-bg, #101214) !important;
}
/* v1.9.2 THE WHITE-ARTICLE FIX: the classic style.css rule
 * ".mg-blog-post-box .small { background:#fff }" painted the article
 * area inside every card white, ON TOP of the darkened card box - that
 * is why the RIGHT column, BOTTOM row and You Missed showed white cards
 * while the LEFT column (its own .inner markup) stayed dark. The
 * article area now flips with the palette too. */
body.sp-dark-palette .sp-slide-right .mg-blog-post-box article.small,
body.sp-dark-palette .sp-slide-right .mg-blog-post-box .small,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box article.small,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box .small,
body.sp-dark-palette .missed-inner .mg-blog-post-box article.small,
body.sp-dark-palette .missed-inner .mg-blog-post-box .small,
body.sp-dark-palette .small-list-post .mg-blog-post-box .small,
body.sp-dark-palette .mg-blog-post-box .small {
        background: var(--sp-content-bg, #101214) !important;
}
/* classic sidebar widgets follow the palette as well (the Sidebar
 * Builder blocks were already covered by section 9) */
body.sp-dark-palette .mg-sidebar .mg-widget {
        background: var(--sp-content-bg, #101214) !important;
}
body.sp-dark-palette .sp-slide-right .mg-blog-post-box h4.title,
body.sp-dark-palette .sp-slide-right .mg-blog-post-box h4.title a,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box h4.title,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box h4.title a,
body.sp-dark-palette .missed-inner .mg-blog-post-box h4.title,
body.sp-dark-palette .missed-inner .mg-blog-post-box h4.title a,
body.sp-dark-palette .sp-slide-left .recentarea .content .inner h5,
body.sp-dark-palette .sp-slide-left .recentarea .content .inner h5 a {
        color: var(--sp-text-strong, #f5f6f8) !important;
}
/* meta text + card body text in those areas */
body.sp-dark-palette .sp-slide-right .mg-blog-post-box .small,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box .small,
body.sp-dark-palette .missed-inner .mg-blog-post-box .small,
body.sp-dark-palette .sp-slide-right .mg-blog-meta,
body.sp-dark-palette .sp-slide-bottom .mg-blog-meta,
body.sp-dark-palette .missed-inner .mg-blog-meta,
body.sp-dark-palette .sp-slide-right .mg-blog-meta a,
body.sp-dark-palette .sp-slide-bottom .mg-blog-meta a,
body.sp-dark-palette .missed-inner .mg-blog-meta a {
        color: var(--sp-text-body, #b3b8bd) !important;
}
/* borders of those cards follow the palette */
body.sp-dark-palette .sp-slide-right .mg-blog-post-box.shd,
body.sp-dark-palette .sp-slide-bottom .mg-blog-post-box.shd,
body.sp-dark-palette .missed-inner .mg-blog-post-box.shd {
        border-color: var(--sp-border, #2c2f33) !important;
}

/* ----------------------------------------------------------------------
 10. v1.9.15 THE CURATED 13 CATEGORY COLOR LABELS (bright tones, WHITE
     letters - user spec: "smaller list, bright colors, white letter
     labels, include Gold, Red, Green, Blue, Purple, Orange, Black, Grey
     and others; disregard colors that are too similar").
     THE 13 KEYS: 1 accent | 7 Red #e02424 | 2 Orange #f97316 |
     32 Gold #d4a017 | 4 Green #16a34a | 5 Teal #0d9488 | 6 Blue #2563eb |
     14 Navy #1e3a8a | 3 Purple #7c3aed | 8 Pink #ec4899 |
     12 Brown #8b4513 | 28 Black #1c1c1e | 11 Grey #6b7280.
     Every curated chip now renders WHITE letters - Orange included
     (the old dark-letter exception for color-2 is gone).
 v1.9.3: THE ONE COLOR PER CATEGORY EVERYWHERE.
     (a) These rules load AFTER palettes.css, so the tones below WIN over
         the classic 1-4 chips ("I select Orange and it shows Gold" was
         the original bug - the classic #feb236 read as gold on screen).
     (b) Every badge CONTEXT understands the classes, not just the article
         cards: the slideshow CENTER banner, the LEFT / RIGHT / BOTTOM
         section labels (.sp-item-cat) - previously those always painted
         the palette ACCENT, so "Orange" showed RED on the slideshow while
         the cards below showed the term color.
     (c) v1.9.15: retired chips (9,10,13,15-27,29-31,33-45) are never
         emitted anymore - PHP maps saved legacy picks to their curated
         family (sportypress_legacy_category_color_map). Their rules
         below stay only so hand-written markup keeps painting something.
---------------------------------------------------------------------- */
a.newses-categories.category-color-1,
.sp-item-cat a.category-color-1,
.newses-slide-info-banner .newses-slide-cat a.category-color-1 { background: var(--sp-accent, #c70909); } /* palette accent */
a.newses-categories.category-color-2,
.sp-item-cat a.category-color-2,
.newses-slide-info-banner .newses-slide-cat a.category-color-2 { background: #f97316; } /* ORANGE (v1.9.15 bright, white letters) */
a.newses-categories.category-color-3,
.sp-item-cat a.category-color-3,
.newses-slide-info-banner .newses-slide-cat a.category-color-3 { background: #7c3aed; } /* PURPLE (v1.9.15 bright) */
a.newses-categories.category-color-4,
.sp-item-cat a.category-color-4,
.newses-slide-info-banner .newses-slide-cat a.category-color-4 { background: #16a34a; } /* GREEN (v1.9.15 bright) */
a.newses-categories.category-color-5,
.sp-item-cat a.category-color-5,
.newses-slide-info-banner .newses-slide-cat a.category-color-5 { background: #0d9488; } /* TEAL (v1.9.15 bright) */
a.newses-categories.category-color-6,
.sp-item-cat a.category-color-6,
.newses-slide-info-banner .newses-slide-cat a.category-color-6 { background: #2563eb; } /* BLUE (v1.9.15 bright) */
a.newses-categories.category-color-7,
.sp-item-cat a.category-color-7,
.newses-slide-info-banner .newses-slide-cat a.category-color-7 { background: #e02424; } /* RED (was crimson #b02a37) */
a.newses-categories.category-color-8,
.sp-item-cat a.category-color-8,
.newses-slide-info-banner .newses-slide-cat a.category-color-8 { background: #ec4899; } /* PINK (v1.9.15 bright) */
a.newses-categories.category-color-9,
.sp-item-cat a.category-color-9,
.newses-slide-info-banner .newses-slide-cat a.category-color-9 { background: #4338ca; } /* indigo */
a.newses-categories.category-color-10,
.sp-item-cat a.category-color-10,
.newses-slide-info-banner .newses-slide-cat a.category-color-10 { background: #b45309; } /* amber */
a.newses-categories.category-color-11,
.sp-item-cat a.category-color-11,
.newses-slide-info-banner .newses-slide-cat a.category-color-11 { background: #6b7280; } /* GREY (was slate gray) */
a.newses-categories.category-color-12,
.sp-item-cat a.category-color-12,
.newses-slide-info-banner .newses-slide-cat a.category-color-12 { background: #8b4513; } /* BROWN (was dark brown #6d4c41) */

/* ----------------------------------------------------------------------
 10b. v1.9.6 CATEGORY COLOR LABELS 13-30 (more diversity).
     The per-category palette grows from 12 to 30 chips. Same three badge
     contexts as 1-12 (article cards, slideshow side labels, center
     banner). All tones are WCAG-safe with WHITE letters - the dark-text
     rule below (orange / amber only) does not apply to these.
---------------------------------------------------------------------- */
a.newses-categories.category-color-13,
.sp-item-cat a.category-color-13,
.newses-slide-info-banner .newses-slide-cat a.category-color-13 { background: #0369a1; } /* sky blue */
a.newses-categories.category-color-14,
.sp-item-cat a.category-color-14,
.newses-slide-info-banner .newses-slide-cat a.category-color-14 { background: #1e3a8a; } /* NAVY (curated, unchanged) */
a.newses-categories.category-color-15,
.sp-item-cat a.category-color-15,
.newses-slide-info-banner .newses-slide-cat a.category-color-15 { background: #0b7fa4; } /* cyan */
a.newses-categories.category-color-16,
.sp-item-cat a.category-color-16,
.newses-slide-info-banner .newses-slide-cat a.category-color-16 { background: #047857; } /* mint green */
a.newses-categories.category-color-17,
.sp-item-cat a.category-color-17,
.newses-slide-info-banner .newses-slide-cat a.category-color-17 { background: #14532d; } /* forest green */
a.newses-categories.category-color-18,
.sp-item-cat a.category-color-18,
.newses-slide-info-banner .newses-slide-cat a.category-color-18 { background: #4d7c0f; } /* lime */
a.newses-categories.category-color-19,
.sp-item-cat a.category-color-19,
.newses-slide-info-banner .newses-slide-cat a.category-color-19 { background: #3f6212; } /* moss */
a.newses-categories.category-color-20,
.sp-item-cat a.category-color-20,
.newses-slide-info-banner .newses-slide-cat a.category-color-20 { background: #c026d3; } /* magenta */
a.newses-categories.category-color-21,
.sp-item-cat a.category-color-21,
.newses-slide-info-banner .newses-slide-cat a.category-color-21 { background: #86198f; } /* fuchsia */
a.newses-categories.category-color-22,
.sp-item-cat a.category-color-22,
.newses-slide-info-banner .newses-slide-cat a.category-color-22 { background: #881337; } /* berry */
a.newses-categories.category-color-23,
.sp-item-cat a.category-color-23,
.newses-slide-info-banner .newses-slide-cat a.category-color-23 { background: #7f1d1d; } /* maroon */
a.newses-categories.category-color-24,
.sp-item-cat a.category-color-24,
.newses-slide-info-banner .newses-slide-cat a.category-color-24 { background: #5b21b6; } /* violet */
a.newses-categories.category-color-25,
.sp-item-cat a.category-color-25,
.newses-slide-info-banner .newses-slide-cat a.category-color-25 { background: #334155; } /* steel gray */
a.newses-categories.category-color-26,
.sp-item-cat a.category-color-26,
.newses-slide-info-banner .newses-slide-cat a.category-color-26 { background: #9c4221; } /* terracotta */
a.newses-categories.category-color-27,
.sp-item-cat a.category-color-27,
.newses-slide-info-banner .newses-slide-cat a.category-color-27 { background: #4d6e46; } /* sage green */
a.newses-categories.category-color-28,
.sp-item-cat a.category-color-28,
.newses-slide-info-banner .newses-slide-cat a.category-color-28 { background: #1c1c1e; } /* BLACK (was charcoal #1f2937) */
a.newses-categories.category-color-29,
.sp-item-cat a.category-color-29,
.newses-slide-info-banner .newses-slide-cat a.category-color-29 { background: #581c87; } /* aubergine */
a.newses-categories.category-color-30,
.sp-item-cat a.category-color-30,
.newses-slide-info-banner .newses-slide-cat a.category-color-30 { background: #4e342e; } /* coffee brown */

/* ----------------------------------------------------------------------
 10c. v1.9.7 CATEGORY COLOR LABELS 31-45 (bright & cheerful light tones).
     User request: "add yellow, gold and other bright colors, cheerful
     light colors". These chips are LIGHT tones and render DARK letters
     (#12100d, WCAG-safe) - the dark-text rule below covers all three
     badge contexts, plus their hover states keep the same letters.
---------------------------------------------------------------------- */
a.newses-categories.category-color-31,
.sp-item-cat a.category-color-31,
.newses-slide-info-banner .newses-slide-cat a.category-color-31 { background: #facc15; } /* yellow */
a.newses-categories.category-color-32,
.sp-item-cat a.category-color-32,
.newses-slide-info-banner .newses-slide-cat a.category-color-32 { background: #d4a017; } /* GOLD (v1.9.15 curated, white letters) */
a.newses-categories.category-color-33,
.sp-item-cat a.category-color-33,
.newses-slide-info-banner .newses-slide-cat a.category-color-33 { background: #fde047; } /* canary */
a.newses-categories.category-color-34,
.sp-item-cat a.category-color-34,
.newses-slide-info-banner .newses-slide-cat a.category-color-34 { background: #ffb26b; } /* peach */
a.newses-categories.category-color-35,
.sp-item-cat a.category-color-35,
.newses-slide-info-banner .newses-slide-cat a.category-color-35 { background: #ff6f61; } /* coral */
a.newses-categories.category-color-36,
.sp-item-cat a.category-color-36,
.newses-slide-info-banner .newses-slide-cat a.category-color-36 { background: #fa8072; } /* salmon */
a.newses-categories.category-color-37,
.sp-item-cat a.category-color-37,
.newses-slide-info-banner .newses-slide-cat a.category-color-37 { background: #f472b6; } /* rose pink */
a.newses-categories.category-color-38,
.sp-item-cat a.category-color-38,
.newses-slide-info-banner .newses-slide-cat a.category-color-38 { background: #f9a8d4; } /* light pink */
a.newses-categories.category-color-39,
.sp-item-cat a.category-color-39,
.newses-slide-info-banner .newses-slide-cat a.category-color-39 { background: #93c5fd; } /* baby blue */
a.newses-categories.category-color-40,
.sp-item-cat a.category-color-40,
.newses-slide-info-banner .newses-slide-cat a.category-color-40 { background: #7dd3fc; } /* light sky */
a.newses-categories.category-color-41,
.sp-item-cat a.category-color-41,
.newses-slide-info-banner .newses-slide-cat a.category-color-41 { background: #2dd4bf; } /* turquoise */
a.newses-categories.category-color-42,
.sp-item-cat a.category-color-42,
.newses-slide-info-banner .newses-slide-cat a.category-color-42 { background: #6ee7b7; } /* light mint */
a.newses-categories.category-color-43,
.sp-item-cat a.category-color-43,
.newses-slide-info-banner .newses-slide-cat a.category-color-43 { background: #a3e635; } /* light lime */
a.newses-categories.category-color-44,
.sp-item-cat a.category-color-44,
.newses-slide-info-banner .newses-slide-cat a.category-color-44 { background: #c4b5fd; } /* lavender */
a.newses-categories.category-color-45,
.sp-item-cat a.category-color-45,
.newses-slide-info-banner .newses-slide-cat a.category-color-45 { background: #d8b4fe; } /* lilac */

/* v1.9.15: dark letters stay ONLY on the RETIRED light chips (amber 10 +
   the bright 31-45 set). They are never emitted anymore - PHP maps saved
   legacy picks to the curated 13, which all render WHITE letters (Orange
   included). Kept purely so hand-written legacy markup keeps painting
   readable letters. */
a.newses-categories.category-color-10,
.sp-item-cat a.category-color-10,
.newses-slide-info-banner .newses-slide-cat a.category-color-10,
a.newses-categories.category-color-31, a.newses-categories.category-color-33,
a.newses-categories.category-color-34, a.newses-categories.category-color-35,
a.newses-categories.category-color-36, a.newses-categories.category-color-37,
a.newses-categories.category-color-38, a.newses-categories.category-color-39,
a.newses-categories.category-color-40, a.newses-categories.category-color-41,
a.newses-categories.category-color-42, a.newses-categories.category-color-43,
a.newses-categories.category-color-44, a.newses-categories.category-color-45,
.sp-item-cat a.category-color-31, .sp-item-cat a.category-color-33,
.sp-item-cat a.category-color-34, .sp-item-cat a.category-color-35,
.sp-item-cat a.category-color-36, .sp-item-cat a.category-color-37,
.sp-item-cat a.category-color-38, .sp-item-cat a.category-color-39,
.sp-item-cat a.category-color-40, .sp-item-cat a.category-color-41,
.sp-item-cat a.category-color-42, .sp-item-cat a.category-color-43,
.sp-item-cat a.category-color-44, .sp-item-cat a.category-color-45,
.newses-slide-info-banner .newses-slide-cat a.category-color-31,
.newses-slide-info-banner .newses-slide-cat a.category-color-33,
.newses-slide-info-banner .newses-slide-cat a.category-color-34,
.newses-slide-info-banner .newses-slide-cat a.category-color-35,
.newses-slide-info-banner .newses-slide-cat a.category-color-36,
.newses-slide-info-banner .newses-slide-cat a.category-color-37,
.newses-slide-info-banner .newses-slide-cat a.category-color-38,
.newses-slide-info-banner .newses-slide-cat a.category-color-39,
.newses-slide-info-banner .newses-slide-cat a.category-color-40,
.newses-slide-info-banner .newses-slide-cat a.category-color-41,
.newses-slide-info-banner .newses-slide-cat a.category-color-42,
.newses-slide-info-banner .newses-slide-cat a.category-color-43,
.newses-slide-info-banner .newses-slide-cat a.category-color-44,
.newses-slide-info-banner .newses-slide-cat a.category-color-45 {
        color: #12100d !important;
}
.sp-item-cat a.category-color-10:hover,
.sp-item-cat a.category-color-10:focus,
.newses-slide-info-banner .newses-slide-cat a.category-color-10:hover {
        color: #12100d !important;
}