/* ============================================================
   BidLogiQ — Color tokens
   SOURCE OF TRUTH: Figma "BidLogiQ" file → Design-system page →
   "Colour Tokens" board (node 974:13806). Names below are the
   designers' own token names, transcribed exactly.

   NOTE: primary is the Identity Manual blue #265D80 (per product
   direction). The Figma token board's "Primary Main" reads #355C7D;
   it is kept below as --primary-figma for reference. Everything
   else is transcribed from the Figma token board verbatim.
   ============================================================ */
:root {
  /* ---- Primary ---- */
  --primary-main:      #265D80;  /* BRAND PRIMARY (Identity Manual) */
  --primary-figma:     #355C7D;  /* Figma board "Primary Main" — reference */
  --primary-low-light: #E1E7EC;  /* "Primary low light" */
  --disable:           #CCCCCC;  /* "Disable" */

  /* ---- Surfaces ---- */
  --background:         #F9FAFB;  /* "Background" */
  --section-background: #FFFFFF;  /* "Section background" */

  /* ---- Text ---- */
  --text-primary:      #212B36;  /* "Text Primary" */
  --text-black:        #000000;  /* "Text Black" */
  --text-secondary:    #637381;  /* "Text Secondary" */
  --text-secondary-2:  #6B7888;  /* "Text Secondary 2" */
  --icon:              #666666;  /* "Icon" */

  /* ---- Strokes & indicators ---- */
  --input-stroke:      #E9ECEE;  /* "Input stroke" */
  --input-stroke-2:    #D1D5DB;  /* "Input stroke" (2nd) */
  --indicator-grey:    #CFD6DC;  /* "Indicator grey" */

  /* ---- Green ---- */
  --dark-green:        #166534;
  --med-green:         #34C759;
  --soft-green:        #94E9B8;
  --light-green:       #BBF7D0;
  --extralight-green:  #D3F3DF;

  /* ---- Blue ---- */
  --dark-blue:         #1C4ED8;
  --med-blue:          #0A7AFF;
  --soft-blue:         #92BFFF;
  --cyan-blue:         #AEC7ED;
  --light-blue:        #D2DCF7;
  --extralight-blue:   #EFF6FF;

  /* ---- Red ---- */
  --med-red:           #FF5630;
  --soft-red:          #EF4444;
  --light-red:         #F8D4D4;
  /* "Dark red" is labelled #1C4ED8 in Figma — an apparent authoring
     error (that is Dark Blue). Using the soft-red ramp's dark end
     until the designers confirm. */
  --dark-red:          #991B1B;

  /* ---- Orange / Yellow ---- */
  --dark-orange:       #92400D;
  --med-orange:        #F59E0C;
  --med-yellow:        #FFD11A;
  --light-yellow:      #FFF8DA;
  --extralight-yellow: #FFFBEB;

  /* ---- Violet ---- */
  --violet:            #6F51F9;

  /* ---- Additional colors used in components but not on the token board ---- */
  --text-placeholder:  #919EAB;  /* TextField placeholder / disabled value */
  --text-step-idle:    #ABB7C2;  /* Stepper: not-yet-reached step label */
  --status-red-text:   #D63928;  /* Status chip text (Rejected) */
  --status-red-bg:     rgba(220, 38, 38, 0.2);  /* Status chip fill */

  /* ============================================================
     Semantic aliases — prefer these in components
     ============================================================ */
  --color-primary:        var(--primary-main);
  --color-primary-hover:  #1F4D6B;   /* primary-main darkened one step */
  --color-primary-active: #1A4059;
  --color-primary-subtle: var(--primary-low-light);
  --color-on-primary:     #FFFFFF;

  --surface-page:    var(--background);
  --surface-card:    var(--section-background);
  --surface-sunken:  var(--background);
  --surface-hover:   var(--primary-low-light);
  --surface-inverse: var(--primary-main);

  --text-strong:   var(--text-primary);
  --text-body:     var(--text-secondary);
  --text-muted:    var(--text-secondary-2);
  --text-on-dark:  #FFFFFF;
  --text-link:     var(--med-blue);

  --border-subtle:  var(--input-stroke);
  --border-default: var(--input-stroke-2);
  --border-strong:  var(--indicator-grey);
  --border-focus:   var(--primary-main);

  --status-success:        var(--med-green);
  --status-success-strong: var(--dark-green);
  --status-success-subtle: var(--extralight-green);
  --status-warning:        var(--med-orange);
  --status-warning-strong: var(--dark-orange);
  --status-warning-subtle: var(--extralight-yellow);
  --status-danger:         var(--soft-red);
  --status-danger-strong:  var(--dark-red);
  --status-danger-subtle:  var(--light-red);
  --status-info:           var(--med-blue);
  --status-info-strong:    var(--dark-blue);
  --status-info-subtle:    var(--extralight-blue);

  --ring: 0 0 0 3px rgba(38, 93, 128, 0.24);
}