/* +++++++++++++++++ REBRANDED COLORS (2025) +++++++++++++++++ */
:root {
    /* USAGE GUIDELINES:
     * - Use semantic names (--primary-color-*) in components
     * - Use literal names (--blue-*) only for one-off cases or when color is specifically blue
     */

    /* Primary: Blue */
    --butter-blue-090: hsl(240deg 98% 17%);
    --butter-blue-080: hsl(240deg 100% 24%);
    --butter-blue-070: hsl(240deg 100% 31%);
    --butter-blue-060: hsl(240deg 100% 39%);
    --butter-blue-050: hsl(240deg 96% 46%);
    --butter-blue-040: hsl(240deg 100% 66%);
    --butter-blue-030: hsl(220deg 100% 82%);
    --butter-blue-020: hsl(222deg 97% 89%);
    --butter-blue-010: hsl(202deg 100% 98%);

    --butter-primary-color-090: var(--butter-blue-090);
    --butter-primary-color-080: var(--butter-blue-080);
    --butter-primary-color-070: var(--butter-blue-070);
    --butter-primary-color-060: var(--butter-blue-060);
    --butter-primary-color-050: var(--butter-blue-050);
    --butter-primary-color-040: var(--butter-blue-040);
    --butter-primary-color-030: var(--butter-blue-030);
    --butter-primary-color-020: var(--butter-blue-020);
    --butter-primary-color-010: var(--butter-blue-010);

    /* Secondary: Sky Blue */
    --butter-sky-blue-090: hsl(202deg 100% 17%);
    --butter-sky-blue-080: hsl(196deg 100% 26%);
    --butter-sky-blue-070: hsl(193deg 100% 28%);
    --butter-sky-blue-060: hsl(193deg 100% 31%);
    --butter-sky-blue-050: hsl(196deg 100% 50%);
    --butter-sky-blue-040: hsl(193deg 100% 70%);
    --butter-sky-blue-030: hsl(196deg 100% 84%);
    --butter-sky-blue-020: hsl(196deg 100% 88%);
    --butter-sky-blue-010: hsl(192deg 100% 97%);

    --butter-secondary-color-090: var(--butter-sky-blue-090);
    --butter-secondary-color-080: var(--butter-sky-blue-080);
    --butter-secondary-color-070: var(--butter-sky-blue-070);
    --butter-secondary-color-060: var(--butter-sky-blue-060);
    --butter-secondary-color-050: var(--butter-sky-blue-050);
    --butter-secondary-color-040: var(--butter-sky-blue-040);
    --butter-secondary-color-030: var(--butter-sky-blue-030);
    --butter-secondary-color-020: var(--butter-sky-blue-020);
    --butter-secondary-color-010: var(--butter-sky-blue-010);


    /* Tetiary: Yellow */
    --butter-yellow-090: hsl(43deg 100% 18%);
    --butter-yellow-080: hsl(43deg 100% 26%);
    --butter-yellow-070: hsl(43deg 94% 44%);
    --butter-yellow-060: hsl(55deg 94% 48%);
    --butter-yellow-050: hsl(55deg 100% 49%);
    --butter-yellow-040: hsl(55deg 100% 69%);
    --butter-yellow-030: hsl(55deg 100% 83%);
    --butter-yellow-020: hsl(55deg 100% 88%);
    --butter-yellow-010: hsl(55deg 100% 94%);

    --butter-tertiary-color-090: var(--butter-yellow-090);
    --butter-tertiary-color-080: var(--butter-yellow-080);
    --butter-tertiary-color-070: var(--butter-yellow-070);
    --butter-tertiary-color-060: var(--butter-yellow-060);
    --butter-tertiary-color-050: var(--butter-yellow-050);
    --butter-tertiary-color-040: var(--butter-yellow-040);
    --butter-tertiary-color-030: var(--butter-yellow-030);
    --butter-tertiary-color-020: var(--butter-yellow-020);
    --butter-tertiary-color-010: var(--butter-yellow-010);

    /* Quadrary: Ultra Violet */
    --butter-ultra-violet-090: hsl(285deg 100% 25%);
    --butter-ultra-violet-080: hsl(283deg 100% 31%);
    --butter-ultra-violet-070: hsl(282deg 98% 38%);
    --butter-ultra-violet-060: hsl(282deg 71% 59%);
    --butter-ultra-violet-050: hsl(285deg 100% 69%);
    --butter-ultra-violet-040: hsl(285deg 100% 81%);
    --butter-ultra-violet-030: hsl(282deg 100% 89%);
    --butter-ultra-violet-020: hsl(285deg 100% 93%);
    --butter-ultra-violet-010: hsl(287deg 100% 98%);

    --butter-quadrary-color-090: var(--butter-ultra-violet-090);
    --butter-quadrary-color-080: var(--butter-ultra-violet-080);
    --butter-quadrary-color-070: var(--butter-ultra-violet-070);
    --butter-quadrary-color-060: var(--butter-ultra-violet-060);
    --butter-quadrary-color-050: var(--butter-ultra-violet-050);
    --butter-quadrary-color-040: var(--butter-ultra-violet-040);
    --butter-quadrary-color-030: var(--butter-ultra-violet-030);
    --butter-quadrary-color-020: var(--butter-ultra-violet-020);
    --butter-quadrary-color-010: var(--butter-ultra-violet-010);

    /* Neutral */
    --butter-neutral-090: #302C32;
    --butter-neutral-080: #443F46;
    --butter-neutral-070: #59545C;
    --butter-neutral-060: #706D71;
    --butter-neutral-050: #817D82;
    --butter-neutral-040: #CDCACE;
    --butter-neutral-030: #E6E5E6;
    --butter-neutral-020: #F2F2F3;
    --butter-neutral-010: hsl(0deg 0% 100%);
}
