/* Lighter and darker variants */
.paletted, .paletted {
    --palette-1-slightly-darker:   color-mix(in srgb, var(--palette-1), black 15%);
    --palette-2-slightly-darker:   color-mix(in srgb, var(--palette-2), black 15%);
    --palette-3-slightly-darker:   color-mix(in srgb, var(--palette-3), black 15%);
    --palette-4-slightly-darker:   color-mix(in srgb, var(--palette-4), black 15%);
    --palette-1-darker:            color-mix(in srgb, var(--palette-1), black 20%);
    --palette-2-darker:            color-mix(in srgb, var(--palette-2), black 20%);
    --palette-3-darker:            color-mix(in srgb, var(--palette-3), black 20%);
    --palette-4-darker:            color-mix(in srgb, var(--palette-4), black 20%);
    --palette-1-darkest:           color-mix(in srgb, var(--palette-1), black 30%);
    --palette-2-darkest:           color-mix(in srgb, var(--palette-2), black 30%);
    --palette-3-darkest:           color-mix(in srgb, var(--palette-3), black 30%);
    --palette-4-darkest:           color-mix(in srgb, var(--palette-4), black 30%);
    --palette-1-slightly-lighter:  color-mix(in srgb, var(--palette-1), white 15%);
    --palette-2-slightly-lighter:  color-mix(in srgb, var(--palette-2), white 15%);
    --palette-3-slightly-lighter:  color-mix(in srgb, var(--palette-3), white 15%);
    --palette-4-slightly-lighter:  color-mix(in srgb, var(--palette-4), white 15%);
    --palette-1-lighter:           color-mix(in srgb, var(--palette-1), white 20%);
    --palette-2-lighter:           color-mix(in srgb, var(--palette-2), white 20%);
    --palette-3-lighter:           color-mix(in srgb, var(--palette-3), white 20%);
    --palette-4-lighter:           color-mix(in srgb, var(--palette-4), white 20%);
    --palette-1-lightest:          color-mix(in srgb, var(--palette-1), white 30%);
    --palette-2-lightest:          color-mix(in srgb, var(--palette-2), white 30%);
    --palette-3-lightest:          color-mix(in srgb, var(--palette-3), white 30%);
    --palette-4-lightest:          color-mix(in srgb, var(--palette-4), white 30%);
}

/* Palette cycling boilerplate */
.paletted, .paletted {
    --palette-1: var(--palette-cycled-1);
    --palette-2: var(--palette-cycled-2);
    --palette-3: var(--palette-cycled-3);
    --palette-4: var(--palette-cycled-4);
}
.paleted.palette-cycle-0, .palleted.palette-cycle-0 {
    --palette-1: var(--palette-cycled-1);
    --palette-2: var(--palette-cycled-2);
    --palette-3: var(--palette-cycled-3);
    --palette-4: var(--palette-cycled-4);
}
.paleted.palette-cycle-1, .palleted.palette-cycle-1 {
    --palette-2: var(--palette-cycled-1);
    --palette-3: var(--palette-cycled-2);
    --palette-4: var(--palette-cycled-3);
    --palette-1: var(--palette-cycled-4);
}
.paleted.palette-cycle-2, .palleted.palette-cycle-2 {
    --palette-3: var(--palette-cycled-1);
    --palette-4: var(--palette-cycled-2);
    --palette-1: var(--palette-cycled-3);
    --palette-2: var(--palette-cycled-4);
}
.paleted.palette-cycle-3, .palleted.palette-cycle-3 {
    --palette-4: var(--palette-cycled-1);
    --palette-1: var(--palette-cycled-2);
    --palette-2: var(--palette-cycled-3);
    --palette-3: var(--palette-cycled-4);
}

/* Palette selection boilerplate */
.paletted, .paletted.palette-pastel { /* default to pastel palette via .paletted selector */
    --palette-cycled-1: var(--pastel-1);
    --palette-cycled-2: var(--pastel-2);
    --palette-cycled-3: var(--pastel-3);
    --palette-cycled-4: var(--pastel-4);
}
.paletted.palette-sunlight {
    --palette-cycled-1: var(--sunlight-1);
    --palette-cycled-2: var(--sunlight-2);
    --palette-cycled-3: var(--sunlight-3);
    --palette-cycled-4: var(--sunlight-4);
}
.paletted.palette-daylight {
    --palette-cycled-1: var(--daylight-1);
    --palette-cycled-2: var(--daylight-2);
    --palette-cycled-3: var(--daylight-3);
    --palette-cycled-4: var(--daylight-4);
}
.paletted.palette-firelight {
    --palette-cycled-1: var(--daylight-1);
    --palette-cycled-2: var(--daylight-2);
    --palette-cycled-3: var(--daylight-3);
    --palette-cycled-4: var(--daylight-4);
}
.paletted.palette-lenience {
    --palette-cycled-1: var(--lenience-1);
    --palette-cycled-2: var(--lenience-2);
    --palette-cycled-3: var(--lenience-3);
    --palette-cycled-4: var(--lenience-4);
}
.paletted.palette-electric {
    --palette-cycled-1: var(--electric-1);
    --palette-cycled-2: var(--electric-2);
    --palette-cycled-3: var(--electric-3);
    --palette-cycled-4: var(--electric-4);
}
.paletted.palette-sunset {
    --palette-cycled-1: var(--sunset-1);
    --palette-cycled-2: var(--sunset-2);
    --palette-cycled-3: var(--sunset-3);
    --palette-cycled-4: var(--sunset-4);
}
.paletted.palette-rolodex {
    --palette-cycled-1: var(--rolodex-1);
    --palette-cycled-2: var(--rolodex-2);
    --palette-cycled-3: var(--rolodex-3);
    --palette-cycled-4: var(--rolodex-4);
}

/* Define palettes */
:root {
    /* --------------------------------------------------------------------------------- */
    /* https://palettes.shecodes.io                                                      */
    /* --------------------------------------------------------------------------------- */

    /* pastel ------------------------------------*/
    --pastel-1:                           #42B883; 
    --pastel-2:                           #347474; 
    --pastel-3:                           #35495E; 
    --pastel-4:                           #FF7E67; 

    /* sunlight ----------------------------------*/
    --sunlight-1:                         #155263; 
    --sunlight-2:                         #FF6F3C; 
    --sunlight-3:                         #FF9A3C; 
    --sunlight-4:                         #FFC93C; 

    /* daylight ----------------------------------*/
    --daylight-1:                         #ECECEC; 
    --daylight-2:                         #9FD3C7; 
    --daylight-3:                         #385170; 
    --daylight-4:                         #142D4C; 

    /* firelight ---------------------------------*/
    --firelight-1:                        #57385C; 
    --firelight-2:                        #A75265; 
    --firelight-3:                        #EC7263; 
    --firelight-4:                        #FEBE7E; 

    /* lenience ----------------------------------*/
    --lenience-1:                         #394A51; 
    --lenience-2:                         #7FA99B; 
    --lenience-3:                         #FBF2D5; 
    --lenience-4:                         #FDC57B; 

    /* electric ----------------------------------*/
    --electric-1:                         #90F6D7; 
    --electric-2:                         #35BCBF; 
    --electric-3:                         #41506B; 
    --electric-4:                         #263849; 

    /* sunset ------------------------------------*/
    --sunset-1:                           #0E2431; 
    --sunset-2:                           #FC3A52; 
    --sunset-3:                           #F9B248; 
    --sunset-4:                           #E8D5B7; 

    /* rolodex -----------------------------------*/
    --rolodex-1:                          #3C4245; 
    --rolodex-2:                          #5F6769; 
    --rolodex-3:                          #719192; 
    --rolodex-4:                          #DFCDC3; 

    /* --------------------------------------------------------------------------------- */
    /* https://flatuicolors.com                                                          */
    /* --------------------------------------------------------------------------------- */

    /* flat UI v1 --------------------------------*/
    --fl-alizarin:                        #E74C3C;
    --fl-amethyst:                        #9B59B6;
    --fl-asbestos:                        #7F8C8D;
    --fl-belize-hole:                     #2980B9;
    --fl-carrot:                          #E67E22;
    --fl-clouds:                          #ECF0F1;
    --fl-concrete:                        #95A5A6;
    --fl-emerald:                         #2ECC71;
    --fl-green-sea:                       #16A085;
    --fl-midnight-blue:                   #2C3E50;
    --fl-nephritis:                       #27AE60;
    --fl-orange:                          #F39C12;
    --fl-peter-river:                     #3498DB;
    --fl-pomegranate:                     #C0392B;
    --fl-pumpkin:                         #D35400;
    --fl-silver:                          #BDC3C7;
    --fl-sun-flower:                      #F1C40F;
    --fl-turquoise:                       #1ABC9C;
    --fl-wet-asphalt:                     #34495E;
    --fl-wisteria:                        #8E44AD;

    /* gruvbox -----------------------------------*/
    --gb-dark0-hard:                      #1D2021;
    --gb-dark0:                           #282828;
    --gb-dark0-soft:                      #32302F;
    --gb-dark1:                           #3C3836;
    --gb-dark2:                           #504945;
    --gb-dark3:                           #665C54;
    --gb-dark4:                           #7C6F64;
    --gb-dark4-256:                       #7C6F64;
    --gb-gray-245:                        #928374;
    --gb-gray-244:                        #928374;
    --gb-light0-hard:                     #F9F5D7;
    --gb-light0:                          #FBF1C7;
    --gb-light0-soft:                     #F2E5BC;
    --gb-light1:                          #EBDBB2;
    --gb-light2:                          #D5C4A1;
    --gb-light3:                          #BDAE93;
    --gb-light4:                          #A89984;
    --gb-light4-256:                      #A89984;
    --gb-bright-red:                      #FB4934;
    --gb-bright-green:                    #B8BB26;
    --gb-bright-yellow:                   #FABD2F;
    --gb-bright-blue:                     #83A598;
    --gb-bright-purple:                   #D3869B;
    --gb-bright-aqua:                     #8EC07C;
    --gb-bright-orange:                   #FE8019;
    --gb-neutral-red:                     #CC241D;
    --gb-neutral-green:                   #98971A;
    --gb-neutral-yellow:                  #D79921;
    --gb-neutral-blue:                    #458588;
    --gb-neutral-purple:                  #B16286;
    --gb-neutral-aqua:                    #689D6A;
    --gb-neutral-orange:                  #D65D0E;
    --gb-faded-red:                       #9D0006;
    --gb-faded-green:                     #79740E;
    --gb-faded-yellow:                    #B57614;
    --gb-faded-blue:                      #076678;
    --gb-faded-purple:                    #8F3F71;
    --gb-faded-aqua:                      #427B58;
    --gb-faded-orange:                    #AF3A03;

    /* american palette --------------------------*/
    --us-american-river:                  #636E72;
    --us-bright-yarrow:                   #FDCB6E;
    --us-chi-gong:                        #D63031;
    --us-city-lights:                     #DFE6E9;
    --us-dracula-orchid:                  #2D3436;
    --us-electron-blue:                   #0984E3;
    --us-exodus-fruit:                    #6C5CE7;
    --us-faded-poster:                    #81ECEC;
    --us-first-date:                      #FAB1A0;
    --us-green-darner-tail:               #74B9FF;
    --us-light-greenish-blue:             #55EFC4;
    --us-mint-leaf:                       #00B894;
    --us-orangeville:                     #E17055;
    --us-pico-8-pink:                     #FD79A8;
    --us-pink-glamour:                    #FF7675;
    --us-prunus-avium:                    #E84393;
    --us-robins-egg-blue:                 #00CEC9;
    --us-shy-moment:                      #A29BFE;
    --us-soothing-breeze:                 #B2BEC3;
    --us-sour-lemon:                      #FFEAA7;

    /* canadian palette --------------------------*/
    --ca-amour:                           #EE5253;
    --ca-aqua-velvet:                     #01A3A4;
    --ca-bleu-de-france:                  #2E86DE;
    --ca-bluebell:                        #341F97;
    --ca-casandora-yellow:                #FECA57;
    --ca-cyanite:                         #0ABDE3;
    --ca-dark-mountain-meadow:            #10AC84;
    --ca-double-dragon-skin:              #FF9F43;
    --ca-fuel-town:                       #576574;
    --ca-imperial-primer:                 #222F3E;
    --ca-jade-dust:                       #00D2D3;
    --ca-jigglypuff:                      #FF9FF3;
    --ca-joust-blue:                      #54A0FF;
    --ca-light-blue-ballerina:            #C8D6E5;
    --ca-lian-hong-lotus-pink:            #F368E0;
    --ca-megaman:                         #48DBFB;
    --ca-nasu-purple:                     #5F27CD;
    --ca-pastel-red:                      #FF6B6B;
    --ca-storm-petrel:                    #8395A7;
    --ca-wild-caribbean-green:            #1DD1A1;

    /* indian palette ----------------------------*/
    --in-bluebell:                        #3B3B98;
    --in-bright-ube:                      #D6A2E8;
    --in-clear-chill:                     #1B9CFC;
    --in-ending-navy-blue:                #182C61;
    --in-falling-star:                    #CAD3C8;
    --in-fiery-fuchsia:                   #B33771;
    --in-georgia-peach:                   #FD7272;
    --in-highlighter-lavender:            #82589F;
    --in-honey-glow:                      #EAB543;
    --in-keppel:                          #58B19F;
    --in-magenta-purple:                  #6D214F;
    --in-oasis-stream:                    #9AECDB;
    --in-orchid-orange:                   #FEA47F;
    --in-pine-glade:                      #BDC581;
    --in-rich-gardenia:                   #F97F51;
    --in-sarawak-white-pepper:            #F8EFBA;
    --in-sasquatch-socks:                 #FC427B;
    --in-ships-officer:                   #2C3A47;
    --in-spiro-disco-ball:                #25CCF7;
    --in-sweet-garden:                    #55E6C1;

    /* german palette ----------------------------*/
    --de-algal-fuel:                      #20BF6B;
    --de-beniukon-bronze:                 #FA8231;
    --de-blue-grey:                       #778CA3;
    --de-blue-horizon:                    #4B6584;
    --de-boyzone:                         #2D98DA;
    --de-c64-ntsc:                        #4B7BEC;
    --de-desire:                          #EB3B5A;
    --de-flirtatious:                     #FED330;
    --de-fusion-red:                      #FC5C65;
    --de-gloomy-purple:                   #8854D0;
    --de-high-blue:                       #45AAF2;
    --de-innuendo:                        #A5B1C2;
    --de-lighter-purple:                  #A55EEA;
    --de-maximum-blue-green:              #2BCBBA;
    --de-nyc-taxi:                        #F7B731;
    --de-orange-hibiscus:                 #FD9644;
    --de-reptile-green:                   #26DE81;
    --de-royal-blue:                      #3867D6;
    --de-turquoise-topaz:                 #0FB9B1;
    --de-twinkle-blue:                    #D1D8E0;

    /* russian palette ---------------------------*/
    --ru-apple-valley:                    #EA8685;
    --ru-biscay:                          #303952;
    --ru-blue-curacao:                    #3DC1D3;
    --ru-brewed-mustard:                  #E77F67;
    --ru-cornflower:                      #546DE5;
    --ru-creamy-peach:                    #F3A683;
    --ru-deep-rose:                       #C44569;
    --ru-flamingo-pink:                   #F78FB3;
    --ru-old-geranium:                    #CF6A87;
    --ru-pencil-lead:                     #596275;
    --ru-porcelain-rose:                  #E66767;
    --ru-purple-corallite:                #574B90;
    --ru-purple-mountain-majesty:         #786FA6;
    --ru-rogue-pink:                      #F8A5C2;
    --ru-rosy-highlight:                  #F7D794;
    --ru-sawtooth-aak:                    #F19066;
    --ru-soft-blue:                       #778BEB;
    --ru-squeaky:                         #63CDDA;
    --ru-summertime:                      #F5CD79;
    --ru-tigerlily:                       #E15F41;

    /* spanish palette ---------------------------*/
    --es-alameda-ochre:                   #CC8E35;
    --es-c64-purple:                      #706FD3;
    --es-celestial-green:                 #33D9B2;
    --es-chilean-fire:                    #CD6133;
    --es-crocodile-tooth:                 #D1CCC0;
    --es-desert:                          #CCAE62;
    --es-devil-blue:                      #227093;
    --es-eye-of-newt:                     #B33939;
    --es-fluorescent-red:                 #FF5252;
    --es-grey-porcelain:                  #84817A;
    --es-hot-stone:                       #AAA69D;
    --es-jacksons-purple:                 #40407A;
    --es-liberty:                         #474787;
    --es-lucky-point:                     #2C2C54;
    --es-mandarin-sorbet:                 #FFB142;
    --es-palm-springs-splash:             #218C74;
    --es-spiced-butternut:                #FFDA79;
    --es-summer-sky:                      #34ACE0;
    --es-swan-white:                      #F7F1E3;
    --es-synthetic-pumpkin:               #FF793F;

    /* french palette ----------------------------*/
    --fr-aurora-green:                    #78E08F;
    --fr-azraq-blue:                      #4A69BD;
    --fr-carrot-orange:                   #E58E26;
    --fr-dark-sapphire:                   #0C2461;
    --fr-dupain:                          #60A3BC;
    --fr-flat-flesh:                      #FAD390;
    --fr-forest-blues:                    #0A3D62;
    --fr-good-samaritan:                  #3C6382;
    --fr-iceland-poppy:                   #FA983A;
    --fr-jalapeno-red:                    #B71540;
    --fr-livid:                           #6A89CC;
    --fr-mandarin-red:                    #E55039;
    --fr-melon-melody:                    #F8C291;
    --fr-paradise-green:                  #B8E994;
    --fr-reef-encounter:                  #079992;
    --fr-spray:                           #82CCDD;
    --fr-squash-blossom:                  #F6B93B;
    --fr-tomato-red:                      #EB2F06;
    --fr-waterfall:                       #38ADA9;
    --fr-yue-guang-lan-blue:              #1E3799;

    /* aussie palette ---------------------------*/
    --au-beekeeper:                       #F6E58D;
    --au-blurple:                         #4834D4;
    --au-carmine-pink:                    #EB4D4B;
    --au-coastal-breeze:                  #DFF9FB;
    --au-deep-cove:                       #130F40;
    --au-deep-koamaru:                    #30336B;
    --au-exodus-fruit:                    #686DE0;
    --au-greenland-green:                 #22A6B3;
    --au-heliotrope:                      #E056FD;
    --au-hint-of-ice-pack:                #C7ECEE;
    --au-june-bud:                        #BADC58;
    --au-middle-blue:                     #7ED6DF;
    --au-pink-glamour:                    #FF7979;
    --au-pure-apple:                      #6AB04C;
    --au-quince-jelly:                    #F0932B;
    --au-soaring-eagle:                   #95AFC0;
    --au-spiced-nectarine:                #FFBE76;
    --au-steel-pink:                      #BE2EDD;
    --au-turbo:                           #F9CA24;
    --au-wizard-grey:                     #535C68;

    /* british palette ---------------------------*/
    --uk-blue-nights:                     #353B48;
    --uk-blueberry-soda:                  #7F8FA6;
    --uk-chain-gang-grey:                 #718093;
    --uk-download-progress:               #4CD137;
    --uk-electromagnetic:                 #2F3640;
    --uk-harley-davidson-orange:          #C23616;
    --uk-hint-of-pensive:                 #DCDDE1;
    --uk-lynx-white:                      #F5F6FA;
    --uk-matt-purple:                     #8C7AE6;
    --uk-mazarine-blue:                   #273C75;
    --uk-nanohanacha-gold:                #E1B12C;
    --uk-nasturcian-flower:               #E84118;
    --uk-naval:                           #40739E;
    --uk-periwinkle:                      #9C88FF;
    --uk-pico-void:                       #192A56;
    --uk-protoss-pylon:                   #00A8FF;
    --uk-rise-n-shine:                    #FBC531;
    --uk-seabrook:                        #487EB0;
    --uk-skirret-green:                   #44BD32;
    --uk-vanadyl-blue:                    #0097E6;

    /* chinese palette ---------------------------*/
    --cn-anti-flash-white:                #F1F2F6;
    --cn-bay-wharf:                       #747D8C;
    --cn-bright-greek:                    #3742FA;
    --cn-bruschetta-tomato:               #FF6348;
    --cn-city-lights:                     #DFE4EA;
    --cn-clear-chill:                     #1E90FF;
    --cn-coral:                           #FF7F50;
    --cn-french-sky-blue:                 #70A1FF;
    --cn-golden-sand:                     #ECCC68;
    --cn-grisaille:                       #57606F;
    --cn-lime-soap:                       #7BED9F;
    --cn-orange:                          #FFA502;
    --cn-peace:                           #A4B0BE;
    --cn-prestige-blue:                   #2F3542;
    --cn-saturated-sky:                   #5352ED;
    --cn-twinkle-blue:                    #CED6E0;
    --cn-ufo-green:                       #2ED573;
    --cn-watermelon:                      #FF4757;
    --cn-white:                           #FFFFFF;
    --cn-wild-watermelon:                 #FF6B81;

    /* dutch palette -----------------------------*/
    --nl-20000-leagues-under-the-sea:     #1B1464;
    --nl-android-green:                   #A3CB38;
    --nl-bara-red:                        #ED4C67;
    --nl-blue-martina:                    #12CBC4;
    --nl-circumorbital-ring:              #5758BB;
    --nl-energos:                         #C4E538;
    --nl-forgotten-purple:                #9980FA;
    --nl-hollyhock:                       #833471;
    --nl-lavender-rose:                   #FDA7DF;
    --nl-lavender-tea:                    #D980FA;
    --nl-magenta-purple:                  #6F1E51;
    --nl-mediterranean-sea:               #1289A7;
    --nl-merchant-marine-blue:            #0652DD;
    --nl-pixelated-grass:                 #009432;
    --nl-puffins-bill:                    #EE5A24;
    --nl-radiant-yellow:                  #F79F1F;
    --nl-red-pigment:                     #EA2027;
    --nl-sunflower:                       #FFC312;
    --nl-turkish-aqua:                    #006266;
    --nl-very-berry:                      #B53471;

    /* swedish palette ---------------------------*/
    --se-black-pearl:                     #1E272E;
    --se-chrome-yellow:                   #FFA801;
    --se-dark-periwinkle:                 #575FCF;
    --se-free-speech-blue:                #3C40C6;
    --se-fresh-turquoise:                 #34E7E4;
    --se-good-night:                      #485460;
    --se-green-teal:                      #05C46B;
    --se-highlighter-pink:                #EF5777;
    --se-hint-of-elusive-blue:            #D2DAE2;
    --se-jade-dust:                       #00D8D6;
    --se-london-square:                   #808E9B;
    --se-megaman:                         #4BCFFA;
    --se-minty-green:                     #0BE881;
    --se-narenji-orange:                  #FFC048;
    --se-red-orange:                      #FF3F34;
    --se-sizzling-red:                    #F53B57;
    --se-spiro-disco-ball:                #0FBCF9;
    --se-sunset-orange:                   #FF5E57;
    --se-vibrant-yellow:                  #FFD32A;
    --se-yriel-yellow:                    #FFDD59;

    /* turkish palette ---------------------------*/
    --tr-baltic-sea:                      #3D3D3D;
    --tr-bright-lilac:                    #CD84F1;
    --tr-dorn-yellow:                     #FFF200;
    --tr-electric-blue:                   #7EFFF5;
    --tr-hammam-blue:                     #67E6DC;
    --tr-light-indigo:                    #7158E2;
    --tr-light-purple:                    #C56CF0;
    --tr-light-red:                       #FF4D4D;
    --tr-light-slate-blue:                #7D5FFF;
    --tr-mandarin-sorbet:                 #FFAF40;
    --tr-neon-blue:                       #18DCFF;
    --tr-pretty-please:                   #FFCCCC;
    --tr-radiant-yellow:                  #FF9F1A;
    --tr-red-orange:                      #FF3838;
    --tr-shadowed-steel:                  #4B4B4B;
    --tr-spiro-disco-ball:                #17C0EB;
    --tr-unmellow-yellow:                 #FFFA65;
    --tr-weird-green:                     #3AE374;
    --tr-wintergreen:                     #32FF7E;
    --tr-young-salmon:                    #FFB8B8;
}