@use "sass:color";

// Colour
//
// Values are the VARStreet listing-page specification. Names and the
// $text- / $background- / $border- pattern are unchanged.
//
// The spec's neutral ramp is cool (blue-tinted) where the previous one was
// flat grey, so the greys are restructured as a set rather than individually —
// mixing the two ramps is what makes a half-rebranded screen look dirty:
//
//   #f7f7f7 → #f7f9fc   #f4f4f4 → #f8fafc   #e3e3e3 → #e9edf2
//   #d9d9d9 → #d9e0e7   #808080 → #7b8492   #595959 → #667085
//   #464646 → #273142   #333333 → #111827
//
// A value marked (derived) has no literal in the spec and is interpolated to
// keep its group complete; everything else is taken from the spec verbatim.

// ---------- Text ----------
$text-primary: #1261e8 !default;
$text-secondary: #667085 !default;
$text-success: #49a51a !default;
$text-warning: #ef8a00 !default;
$text-danger: #ef4444 !default;
$text-info: #164ea3 !default;
$text-default: #7b8492 !default;
$text-dark: #273142 !default;
// One step below $text-dark, for dialog and section headings.
$text-darker: #111827 !default;
$text-light: #ffffff !default;
$text-tertiary: #ed5085 !default;
$text-placeholder: #8a94a6 !default;

// Badge / status text. The spec's listing page distinguishes a user tier
// (lite) and a role origin (system, custom); each pairs with the matching
// -soft background below.
$text-lite: #3f8f18 !default;
$text-system: #7a35d8 !default;
$text-custom: #0867c9 !default;

$text-primary-hover: #0d4fc4 !default;
$text-danger-hover: #dc2626 !default; // (derived) darker step of $text-danger

// ---------- Background ----------
$background-primary: #1261e8 !default;
$background-secondary: #f8fafc !default;
$background-success: #49a51a !default;
$background-warning: #ef8a00 !default;
$background-danger: #ef4444 !default;
$background-info: #164ea3 !default;
$background-default: #ffffff !default;
$background-medium: #29466e !default;
$background-dark: #0f233d !default;
$background-dark-a: #0f233d33 !default;
$background-light: #f7f9fc !default;
$background-tertiary: #ed5085 !default;
$background-lime: #f3de1d !default;
$background-transparent: color.change(#000000, $alpha: 0.1) !default;

$background-disabled: #d9e0e7 !default;

// Interaction surfaces
$background-hover: #f8fbff !default; // table row hover
$background-header: #fbfcfe !default; // grid header row

// ---------- Soft / tint backgrounds ----------
// Pale fills for badges, banners and icon chips. Each is the low-saturation
// partner of the solid of the same name.
$background-primary-soft: #e8f0ff !default;
$background-success-soft: #ddf2cf !default;
$background-warning-soft: #fff2df !default;
$background-danger-soft: #fdecec !default; // (derived) tint of $background-danger
$background-info-soft: #edf4ff !default;
$background-lite-soft: #e6f6da !default;
$background-system-soft: #f0e5ff !default;
$background-custom-soft: #e3f2ff !default;

// ---------- Border ----------
$border-primary: #1261e8 !default;
$border-secondary: #c3ccd6 !default; // (derived) cool equivalent of #c6c6c6
$border-success: #49a51a !default;
$border-warning: #ef8a00 !default;
$border-danger: #ef4444 !default;
$border-info: #164ea3 !default;
$border-light: #e9edf2 !default;
$border-dark: #0f233d !default;
$border-default: #d9e0e7 !default;
$border-primary-soft: #d8e5ff !default;

// ---------- Elevation & focus ----------
// The spec's shadow is a single cool-neutral hue at low alpha. `sm` is the
// spec value verbatim; the heavier steps are (derived) on the same hue, with
// alpha and blur rising together so the set reads as one light source.
$shadow-color: #101828 !default;
$shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05) !default;
$shadow-md: 0 4px 8px rgba(16, 24, 40, 0.08) !default;
$shadow-lg: 0 8px 16px rgba(16, 24, 40, 0.1) !default;
$shadow-xl: 0 12px 24px rgba(16, 24, 40, 0.12) !default;

// Retained as the shadow *colour* token the box-shadow utilities were built
// on, so anything referencing it keeps working.
$boxshadow-primary: rgba(16, 24, 40, 0.05) !default;

// Focus ring — 3px halo in $background-primary at 16%. The stack had no focus
// token at all before; several screens hand-rolled one.
$focus-ring: 0 0 0 3px rgba(18, 97, 232, 0.16) !default;