/*
* COLOURS
* - All project SCSS variables use the $acc-* prefix.
* - Key tokens: $acc-brand (purple), $acc-charcoal (primary actions),
*   $acc-slate-* (blue-tinted grays — NOT neutral), $acc-gray-* (neutral grays).
*/

// Brand (Accelerate purple — used for links, toggles, brand accents)
$acc-brand: #9332FF;                    // was $c-altis-400
$acc-brand-hover: hsl(268, 70%, 68%);   // was $c-altis-300
$acc-brand-light: hsl(268, 70%, 95%);   // was $c-altis-50
$acc-brand-lighter: hsl(268, 70%, 97%); // was $c-altis-25

// Charcoal (primary actions — aligned with Tailwind --color-primary)
$acc-charcoal: #1d2327;                 // NEW (was hardcoded / $c-space-400)
$acc-charcoal-hover: #2c3338;           // NEW (was hardcoded)

// Slate (blue-tinted grays for editor UI — intentionally HSL 218°)
$acc-slate-10: hsl(218, 58%, 98%);      // was $c-space-10
$acc-slate-25: hsl(218, 58%, 97%);      // was $c-space-25
$acc-slate-50: hsl(218, 58%, 95%);      // was $c-space-50
$acc-slate-75: hsl(218, 58%, 93%);      // was $c-space-75
$acc-slate-200: hsl(218, 58%, 70%);     // was $c-space-200
$acc-slate-300: hsl(218, 58%, 30%);     // was $c-space-300 — DARK NAVY, not neutral!

// Gray (neutral — 0° hue, 0% saturation)
$acc-gray-50: hsl(0, 0%, 97%);          // was $c-grey-50
$acc-gray-100: hsl(0, 0%, 95%);         // was $c-grey-100
$acc-gray-150: hsl(0, 0%, 90%);         // was $c-grey-150
$acc-gray-200: hsl(0, 0%, 80%);         // was $c-grey-200
$acc-gray-400: hsl(0, 0%, 50%);         // was $c-grey-400
$acc-gray-600: hsl(0, 0%, 30%);         // was $c-grey-600

// Semantic
$acc-positive: hsl(150, 60%, 50%);      // was $c-positive-400
$acc-positive-light: hsl(150, 60%, 95%);// was $c-positive-100
$acc-negative: hsl(347, 60%, 60%);      // was $c-negative-400
$acc-negative-light: hsl(347, 60%, 95%);// was $c-negative-100

// White
$acc-white: #fff;                       // was $c-white

/**
 * WordPress Gutenberg Colors
 * https://github.com/WordPress/gutenberg/blob/trunk/packages/base-styles/_colors.scss
 */

// WordPress grays.
$black: #000;			// Use only when you truly need pure black. For UI, use $gray-900.
$gray-900: #1e1e1e;
$gray-800: #2f2f2f;
$gray-700: #757575;		// Meets 4.6:1 text contrast against white.
$gray-600: #949494;		// Meets 3:1 UI or large text contrast against white.
$gray-400: #ccc;
$gray-300: #ddd;		// Used for most borders.
$gray-200: #e0e0e0;		// Used sparingly for light borders.
$gray-100: #f0f0f0;		// Used for light gray backgrounds.
$white: #fff;

// Opacities & additional colors.
$dark-theme-focus: $white;	// Focus color when the theme is dark.
$dark-gray-placeholder: rgba($gray-900, 0.62);
$medium-gray-placeholder: rgba($gray-900, 0.55);
$light-gray-placeholder: rgba($white, 0.65);

// Alert colors.
$alert-yellow: #f0b849;
$alert-red: #cc1818;
$alert-green: #4ab866;

/*
* SHADOWS
*/

$sh-black-05: rgba(0, 0, 0, 0.05);

/*
* LAYOUT SIGNATURES
*
*/

$sidebar-padding: 5%;

/*
* ANIMATIONS
*/