/**
 * CodeSignal Design System Colors
 * Generated from Figma Design System
 * Semantic names reference numbered scale variables for single source of truth
 */

 :root {
  /* ===== NUMBERED COLOR SCALES ===== */
  /* These are the base definitions - all other colors reference these */

  /* Primary Numbered Scale */
  --Colors-Base-Primary-20: #ECF2FF;
  --Colors-Base-Primary-50: #E2ECFF;
  --Colors-Base-Primary-100: #D2E2FF;
  --Colors-Base-Primary-150: #C1D7FF;
  --Colors-Base-Primary-200: #B2CDFF;
  --Colors-Base-Primary-250: #A0C1FF;
  --Colors-Base-Primary-300: #90B7FF;
  --Colors-Base-Primary-350: #81ADFF;
  --Colors-Base-Primary-400: #72A3FF;
  --Colors-Base-Primary-450: #679CFF;
  --Colors-Base-Primary-500: #5C94FF;
  --Colors-Base-Primary-550: #4888FF;
  --Colors-Base-Primary-600: #377DFF;
  --Colors-Base-Primary-650: #2470FF;
  --Colors-Base-Primary-700: #1062FB;
  --Colors-Base-Primary-750: #0959EE;
  --Colors-Base-Primary-800: #0B53DA;
  --Colors-Base-Primary-850: #0A4CC8;
  --Colors-Base-Primary-900: #0945B5;
  --Colors-Base-Primary-950: #083EA3;
  --Colors-Base-Primary-1000: #063690;
  --Colors-Base-Primary-1050: #102E7E;
  --Colors-Base-Primary-1100: #063690;
  --Colors-Base-Primary-1150: #102E7E;
  --Colors-Base-Primary-1200: #071B48;
  --Colors-Base-Primary-1250: #051436;
  --Colors-Base-Primary-1300: #030D23;
  --Colors-Base-Primary-1350: #010712;
  --Colors-Base-Primary-1400: #000000;

  /* Neutral Numbered Scale */
  --Colors-Base-Neutral-00: #FFFFFF;
  --Colors-Base-Neutral-20: #F4F5F9;
  --Colors-Base-Neutral-50: #F4F5F9;
  --Colors-Base-Neutral-100: #EDEFF5;
  --Colors-Base-Neutral-150: #E7EAF2;
  --Colors-Base-Neutral-200: #E2E5EE;
  --Colors-Base-Neutral-250: #DDE0EA;
  --Colors-Base-Neutral-300: #D7DAE6;
  --Colors-Base-Neutral-350: #CED2DF;
  --Colors-Base-Neutral-400: #C8CDDB;
  --Colors-Base-Neutral-450: #C1C7D7;
  --Colors-Base-Neutral-500: #BBC1D1;
  --Colors-Base-Neutral-550: #B4BBCD;
  --Colors-Base-Neutral-600: #ACB4C7;
  --Colors-Base-Neutral-650: #A3ABBE;
  --Colors-Base-Neutral-700: #979FB4;
  --Colors-Base-Neutral-750: #8B94AB;
  --Colors-Base-Neutral-800: #808AA5;
  --Colors-Base-Neutral-850: #75809E;
  --Colors-Base-Neutral-900: #66718F;
  --Colors-Base-Neutral-950: #5B6684;
  --Colors-Base-Neutral-1000: #515C7A;
  --Colors-Base-Neutral-1050: #495573;
  --Colors-Base-Neutral-1100: #414D6B;
  --Colors-Base-Neutral-1150: #394563;  
  --Colors-Base-Neutral-1200: #2D3855;
  --Colors-Base-Neutral-1250: #26314C;  
  --Colors-Base-Neutral-1300: #1D2740;  
  --Colors-Base-Neutral-1350: #182139;
  --Colors-Base-Neutral-1400: #11192E;  
  --Colors-Base-Neutral-1450: #0A1122;
  --Colors-Base-Neutral-1500: #060C1C;
  --Colors-Base-Neutral-1600: #040813;

  /* Neutrals with Alpha */
  --Colors-Base-Neutral-Alphas-1000-25: rgba(82, 93, 123, 0.25);
  --Colors-Base-Neutral-Alphas-1000-50: rgba(82, 93, 123, 0.50);
  --Colors-Base-Neutral-Alphas-1050-25: rgba(73, 85, 115, 0.25);
  --Colors-Base-Neutral-Alphas-1050-50: rgba(73, 85, 115, 0.50);
  --Colors-Base-Neutral-Alphas-1100-25: rgba(65, 77, 103, 0.25);
  --Colors-Base-Neutral-Alphas-1100-50: rgba(65, 77, 103, 0.50);
  --Colors-Base-Neutral-Alphas-1150-25: rgba(57, 69, 99, 0.25);
  --Colors-Base-Neutral-Alphas-1150-50: rgba(57, 69, 99, 0.50);
  --Colors-Base-Neutral-Alphas-1200-25: rgba(45, 56, 85, 0.25);
  --Colors-Base-Neutral-Alphas-1200-50: rgba(45, 56, 85, 0.50);
  --Colors-Base-Neutral-Alphas-1250-25: rgba(38, 49, 76, 0.25);
  --Colors-Base-Neutral-Alphas-1250-50: rgba(38, 49, 76, 0.50);
  --Colors-Base-Neutral-Alphas-1300-25: rgba(30, 41, 67, 0.25);
  --Colors-Base-Neutral-Alphas-1300-50: rgba(30, 41, 67, 0.50);
  --Colors-Base-Neutral-Alphas-1350-25: rgba(24, 33, 57, 0.25);
  --Colors-Base-Neutral-Alphas-1350-50: rgba(24, 33, 57, 0.50);
  --Colors-Base-Neutral-Alphas-1400-25: rgba(17, 25, 46, 0.25);
  --Colors-Base-Neutral-Alphas-1400-50: rgba(17, 25, 46, 0.50);
  --Colors-Base-Neutral-Alphas-1450-25: rgba(10, 17, 34, 0.25);
  --Colors-Base-Neutral-Alphas-1450-50: rgba(10, 17, 34, 0.50);

  /* Success (Green) Numbered Scale */
  --Colors-Base-Accent-Green-20: #E5F8F0;
  --Colors-Base-Accent-Green-50: #D3F5E6;
  --Colors-Base-Accent-Green-100: #A6ECCD;
  --Colors-Base-Accent-Green-200: #7AE2B4;
  --Colors-Base-Accent-Green-300: #4DD99B;
  --Colors-Base-Accent-Green-400: #21CF82;
  --Colors-Base-Accent-Green-500: #1EC173;
  --Colors-Base-Accent-Green-600: #1BB267;
  --Colors-Base-Accent-Green-700: #199E59;
  --Colors-Base-Accent-Green-800: #168242;
  --Colors-Base-Accent-Green-900: #267345;
  --Colors-Base-Accent-Green-1000: #0E562B;

  /* Info (Blue) Numbered Scale */
  --Colors-Base-Accent-Sky-Blue-20: #ECFAFF;
  --Colors-Base-Accent-Sky-Blue-50: #D8F4FF;
  --Colors-Base-Accent-Sky-Blue-100: #C1EDFF;
  --Colors-Base-Accent-Sky-Blue-200: #A2E5FF;
  --Colors-Base-Accent-Sky-Blue-300: #83DCFF;
  --Colors-Base-Accent-Sky-Blue-400: #64D3FF;
  --Colors-Base-Accent-Sky-Blue-500: #3EC8FF;
  --Colors-Base-Accent-Sky-Blue-600: #0EB6F9;
  --Colors-Base-Accent-Sky-Blue-700: #00A1E9;
  --Colors-Base-Accent-Sky-Blue-800: #0090D1;
  --Colors-Base-Accent-Sky-Blue-900: #006D9E;
  --Colors-Base-Accent-Sky-Blue-1000: #005276;
  --Colors-Base-Accent-Sky-Blue-1100: #00435F;
  --Colors-Base-Accent-Sky-Blue-1200: #00364D;


  /* Accent Midnight Blue Numbered Scale */
  --Colors-Base-Accent-Midnight-Blue-20: #E4EAFF;
  --Colors-Base-Accent-Midnight-Blue-50: #D6DEFF;
  --Colors-Base-Accent-Midnight-Blue-100: #C7D0FF;
  --Colors-Base-Accent-Midnight-Blue-200: #B9C3FE;
  --Colors-Base-Accent-Midnight-Blue-300: #AAB5F9;
  --Colors-Base-Accent-Midnight-Blue-400: #9BA7F3;
  --Colors-Base-Accent-Midnight-Blue-500: #8E9AEC;
  --Colors-Base-Accent-Midnight-Blue-600: #7E8CE7;
  --Colors-Base-Accent-Midnight-Blue-700: #6E7DDE;
  --Colors-Base-Accent-Midnight-Blue-800: #606FD2;
  --Colors-Base-Accent-Midnight-Blue-900: #515FC8;
  --Colors-Base-Accent-Midnight-Blue-1000: #4652B9;
  --Colors-Base-Accent-Midnight-Blue-1100: #3E49A8;
  --Colors-Base-Accent-Midnight-Blue-1200: #374095;

  /* Warning (Yellow) Numbered Scale */
  --Colors-Base-Accent-Yellow-20: #FDF8E8;
  --Colors-Base-Accent-Yellow-50: #FFF3CC;
  --Colors-Base-Accent-Yellow-100: #FFE899;
  --Colors-Base-Accent-Yellow-200: #FFDC66;
  --Colors-Base-Accent-Yellow-300: #FFD133;
  --Colors-Base-Accent-Yellow-400: #FFC500;
  --Colors-Base-Accent-Yellow-500: #FFB600;
  --Colors-Base-Accent-Yellow-600: #FFAA00;
  --Colors-Base-Accent-Yellow-700: #F99300;
  --Colors-Base-Accent-Yellow-800: #F37D00;
  --Colors-Base-Accent-Yellow-900: #B85F00;
  --Colors-Base-Accent-Yellow-1000: #804104;

  /* Warning (Orange) Numbered Scale */
  --Colors-Base-Accent-Orange-20: #FFEEE6;
  --Colors-Base-Accent-Orange-50: #FFD9C7;
  --Colors-Base-Accent-Orange-100: #FFC7AD;
  --Colors-Base-Accent-Orange-200: #FFAA84;
  --Colors-Base-Accent-Orange-300: #FF8E5B;
  --Colors-Base-Accent-Orange-400: #FF7232;
  --Colors-Base-Accent-Orange-500: #F9560E;
  --Colors-Base-Accent-Orange-600: #ED4A0A;
  --Colors-Base-Accent-Orange-700: #E53600;
  --Colors-Base-Accent-Orange-800: #D32D00;
  --Colors-Base-Accent-Orange-900: #C02900;
  --Colors-Base-Accent-Orange-1000: #A72400;

  /* Error (Red) Numbered Scale */
  --Colors-Base-Accent-Red-20: #FFE9EC;
  --Colors-Base-Accent-Red-50: #FFD8DD;
  --Colors-Base-Accent-Red-100: #FFA9B4;
  --Colors-Base-Accent-Red-200: #FF5F78;
  --Colors-Base-Accent-Red-300: #FF3254;
  --Colors-Base-Accent-Red-400: #E6193F;
  --Colors-Base-Accent-Red-500: #D8133E;
  --Colors-Base-Accent-Red-600: #C6093A;
  --Colors-Base-Accent-Red-700: #B8062C;
  --Colors-Base-Accent-Red-800: #8C0020;
  --Colors-Base-Accent-Red-900: #7C001C;
  --Colors-Base-Accent-Red-1000: #610016;


  /* ===== SEMANTIC COLOR NAMES ===== */
  /* These reference the numbered scales above */

  /* Primary Colors - Semantic Names */
  --Colors-Primary-Default: var(--Colors-Base-Primary-700);
  --Colors-Primary-Lightest: var(--Colors-Base-Primary-100);
  --Colors-Primary-Lighter: var(--Colors-Base-Primary-200);
  --Colors-Primary-Light: var(--Colors-Base-Primary-350);
  --Colors-Primary-Medium-Light: var(--Colors-Base-Primary-500);
  --Colors-Primary-Medium: var(--Colors-Base-Primary-600);
  --Colors-Primary-Medium-Dark: var(--Colors-Base-Primary-800);
  --Colors-Primary-Dark: var(--Colors-Base-Primary-900);
  --Colors-Primary-Darker: var(--Colors-Base-Primary-1000);
  --Colors-Primary-Darkest: var(--Colors-Base-Primary-1150);

  /* Background Colors */
  --Colors-Backgrounds-Main-Default: var(--Colors-Base-Neutral-50);
  --Colors-Backgrounds-Main-Light: var(--Colors-Base-Neutral-100);
  --Colors-Backgrounds-Main-Medium: var(--Colors-Base-Neutral-150);
  --Colors-Backgrounds-Main-Strong: var(--Colors-Base-Neutral-200);
  --Colors-Backgrounds-Main-Dark: var(--Colors-Base-Neutral-1000);
  --Colors-Backgrounds-Main-Darker: var(--Colors-Base-Neutral-1100);
  --Colors-Backgrounds-Main-Top: var(--Colors-Base-Neutral-00);
  --Colors-Backgrounds-Main-Black: var(--Colors-Base-Primary-1400);

  /* Text Colors */
  --Colors-Text-Body-White: var(--Colors-Base-Neutral-00);
  --Colors-Text-Body-Default: var(--Colors-Base-Neutral-1200);
  --Colors-Text-Body-Medium: var(--Colors-Base-Neutral-1050);
  --Colors-Text-Body-Light: var(--Colors-Base-Neutral-900);
  --Colors-Text-Body-Lighter: var(--Colors-Base-Neutral-800);
  --Colors-Text-Body-Strong: var(--Colors-Base-Neutral-1350);
  --Colors-Text-Body-Strongest: var(--Colors-Base-Neutral-1450); 

  /* Icon Colors - Semantic Names */  
  --Colors-Icon-Default: var(--Colors-Base-Neutral-600);
  --Colors-Icon-Medium: var(--Colors-Base-Neutral-850);
  --Colors-Icon-Strong: var(--Colors-Base-Neutral-1300);
  --Colors-Icon-Primary: var(--Colors-Base-Primary-600);
    
  /* Stroke Colors */
  --Colors-Stroke-Default: var(--Colors-Base-Neutral-200);
  --Colors-Stroke-Lighter: var(--Colors-Base-Neutral-100);
  --Colors-Stroke-Light: var(--Colors-Base-Neutral-150);
  --Colors-Stroke-Medium: var(--Colors-Base-Neutral-300);
  --Colors-Stroke-Strong: var(--Colors-Base-Neutral-400);
  --Colors-Stroke-Stronger: var(--Colors-Base-Neutral-550);
  --Colors-Stroke-Primary: var(--Colors-Base-Primary-600);
  --Colors-Stroke-Primary-Light: var(--Colors-Base-Primary-350);
  --Colors-Stroke-Primary-Medium: var(--Colors-Base-Primary-500);
  --Colors-Stroke-Primary-Dark: var(--Colors-Base-Primary-800);
  --Colors-Stroke-Background: var(--Colors-Base-Neutral-20);

  /* Success (Green) Colors - Semantic Names */
  --Colors-Alert-Success-Default: var(--Colors-Base-Accent-Green-600);
  --Colors-Alert-Success-Lighter: var(--Colors-Base-Accent-Green-50);
  --Colors-Alert-Success-Light: var(--Colors-Base-Accent-Green-100);
  --Colors-Alert-Success-Medium: var(--Colors-Base-Accent-Green-300);
  --Colors-Alert-Success-Medium-Dark: var(--Colors-Base-Accent-Green-700);
  --Colors-Alert-Success-Dark: var(--Colors-Base-Accent-Green-900);

  /* Error/Danger Colors - Semantic Names */
  --Colors-Alert-Error-Default: var(--Colors-Base-Accent-Red-600);
  --Colors-Alert-Error-Lighter: var(--Colors-Base-Accent-Red-50);
  --Colors-Alert-Error-Light: var(--Colors-Base-Accent-Red-100);
  --Colors-Alert-Error-Medium: var(--Colors-Base-Accent-Red-300);
  --Colors-Alert-Error-Medium-Dark: var(--Colors-Base-Accent-Red-700);
  --Colors-Alert-Error-Dark: var(--Colors-Base-Accent-Red-900);

  /* Warning Colors - Semantic Names */
  --Colors-Alert-Warning-Default: var(--Colors-Base-Accent-Orange-600);
  --Colors-Alert-Warning-Lighter: var(--Colors-Base-Accent-Orange-50);
  --Colors-Alert-Warning-Light: var(--Colors-Base-Accent-Orange-100);
  --Colors-Alert-Warning-Medium: var(--Colors-Base-Accent-Orange-300);
  --Colors-Alert-Warning-Medium-Dark: var(--Colors-Base-Accent-Orange-700);
  --Colors-Alert-Warning-Dark: var(--Colors-Base-Accent-Orange-900);

  /* Info Colors - Semantic Names */
  --Colors-Alert-Info-Default: var(--Colors-Base-Accent-Sky-Blue-600);
  --Colors-Alert-Info-Lighter: var(--Colors-Base-Accent-Sky-Blue-50);
  --Colors-Alert-Info-Light: var(--Colors-Base-Accent-Sky-Blue-100);
  --Colors-Alert-Info-Medium: var(--Colors-Base-Accent-Sky-Blue-300);
  --Colors-Alert-Info-Medium-Dark: var(--Colors-Base-Accent-Sky-Blue-700);
  --Colors-Alert-Info-Dark: var(--Colors-Base-Accent-Sky-Blue-900);
}

/* ===== DARK MODE ===== */
@media (prefers-color-scheme: dark) {
  :root {
    /* Primary Colors - Semantic Names (ElevatedDark Mode) */
    --Colors-Primary-Default: var(--Colors-Base-Primary-700);
    --Colors-Primary-Lightest: var(--Colors-Base-Primary-400);   
    --Colors-Primary-Lighter: var(--Colors-Base-Primary-450);    
    --Colors-Primary-Light: var(--Colors-Base-Primary-450);      
    --Colors-Primary-Medium-Light: var(--Colors-Base-Primary-500);
    --Colors-Primary-Medium: var(--Colors-Base-Primary-600);
    --Colors-Primary-Medium-Dark: var(--Colors-Base-Primary-800);
    --Colors-Primary-Dark: var(--Colors-Base-Primary-900);
    --Colors-Primary-Darker: var(--Colors-Base-Primary-1000);
    --Colors-Primary-Darkest: var(--Colors-Base-Primary-1050);

    /* Background Colors - Semantic Names (Elevated Dark Mode) */
    --Colors-Backgrounds-Main-Default: var(--Colors-Base-Neutral-1300);
    --Colors-Backgrounds-Main-Light: var(--Colors-Base-Neutral-1250);      
    --Colors-Backgrounds-Main-Medium: var(--Colors-Base-Neutral-1200);     
    --Colors-Backgrounds-Main-Strong: var(--Colors-Base-Neutral-1150);     
    --Colors-Backgrounds-Main-Dark: var(--Colors-Base-Neutral-1350);       
    --Colors-Backgrounds-Main-Darker: var(--Colors-Base-Neutral-1400);     
    --Colors-Backgrounds-Main-Top: var(--Colors-Base-Neutral-1300);
    --Colors-Backgrounds-Main-Black: var(--Colors-Base-Neutral-200);

    /* Text Colors - Semantic Names (Elevated Dark Mode) */
    --Colors-Text-Body-Default: var(--Colors-Base-Neutral-450);
    --Colors-Text-Body-Medium: var(--Colors-Base-Neutral-650);
    --Colors-Text-Body-Light: var(--Colors-Base-Neutral-750);
    --Colors-Text-Body-Lighter: var(--Colors-Base-Neutral-900);
    --Colors-Text-Body-Strong: var(--Colors-Base-Neutral-00);
    --Colors-Text-Body-Strongest: var(--Colors-Base-Neutral-00);
    
    /* Icon Colors - Semantic Names (Elevated Dark Mode) */  
    --Colors-Icon-Default: var(--Colors-Base-Neutral-850);
    --Colors-Icon-Medium: var(--Colors-Base-Neutral-750);
    --Colors-Icon-Strong: var(--Colors-Base-Neutral-00);
    --Colors-Icon-Primary: var(--Colors-Base-Primary-700);

    /* Stroke Colors */
    --Colors-Stroke-Default: var(--Colors-Base-Neutral-200);
    --Colors-Stroke-Lighter: var(--Colors-Base-Neutral-100);
    --Colors-Stroke-Light: var(--Colors-Base-Neutral-150);
    --Colors-Stroke-Medium: var(--Colors-Base-Neutral-300);
    --Colors-Stroke-Strong: var(--Colors-Base-Neutral-400);
    --Colors-Stroke-Stronger: var(--Colors-Base-Neutral-550);
    --Colors-Stroke-Primary: var(--Colors-Base-Primary-600);
    --Colors-Stroke-Primary-Light: var(--Colors-Base-Primary-350);
    --Colors-Stroke-Primary-Medium: var(--Colors-Base-Primary-500);
    --Colors-Stroke-Primary-Dark: var(--Colors-Base-Primary-800);
    --Colors-Stroke-Background: var(--Colors-Base-Neutral-20);
  }
}
