/*
 * Global Color Variables
 *
 * All color values used across the Kusava Employee Portal.
 * To update a color project-wide, change only the value here.
 *
 * Usage: color: var(--primary-color);
 */

:root {
    /* === Semantic / Brand Colors ===
       These are the primary design tokens. Change here to re-theme the app. */
    /* Primary brand blue */
    --primary-color: #012169;
    /* Primary blue ~69% opacity (#0253F1b0) */
    --primary-color-70: rgba(2, 83, 241, 0.69);
    /* Primary blue ~8% opacity (#0253F114) */
    --primary-color-8: rgba(2, 83, 241, 0.08);
    /* Secondary dark navy */
    --secondary-color: #c41230;
    /* Secondary navy ~7% opacity (#002E6312) */
    --secondary-color-12: rgba(0, 46, 99, 0.07);
    /* Tertiary amber gold */
    --tertiary-color: #F2C43A;
    /* Alias: --color-primary mirrors --primary-color for framework compatibility */
    --color-primary: #0253F1;
    /* === Base Colors === */
    --white: #FFFFFF;
    --black: #000000;
    /* Black with opacity variants */
    --color-gray-00-a12: rgba(0, 0, 0, 0.122); /* #0000001f */
    --color-gray-00-a14: rgba(0, 0, 0, 0.141); /* #00000024 */
    --color-gray-00-a32: rgba(0, 0, 0, 0.322); /* #00000052 */
    --color-gray-00-a47: rgba(0, 0, 0, 0.471); /* #00000078 */
    --color-gray-00-a57: rgba(0, 0, 0, 0.565); /* #00000091 */
    --color-gray-00-a64: rgba(0, 0, 0, 0.639); /* #000000a3 */
    --color-gray-00-a70: rgba(0, 0, 0, 0.7); /* #000000b3 */
    --color-gray-00-a85: rgba(0, 0, 0, 0.851); /* #000000d9 */
    /* === Semantic Status / UI Colors === */
    --color-error: #DB3536; /* Error / validation red */
    --color-danger: #DC3545; /* Bootstrap danger red */
    --color-red-vivid: #F1462F; /* Vivid action red */
    --color-success-green: #008000; /* Success green */
    --color-teal-green: #0ABB87; /* Teal success indicator */
    --color-tomato: #FF6347; /* Tomato red-orange */
    /* === Dark UI Backgrounds === */
    --color-dark-sidebar: #1E1E2D; /* Sidebar / nav background */
    --color-dark-bg: #1A1A27; /* Deep dark background */
    --color-dark-card: #282A3C; /* Dark card / panel */
    --color-text-dark: #212529; /* Dark body text (Bootstrap dark) */
    /* BLUE family */
    --color-blue-002e62: #002E62;
    --color-blue-006492: #006492;
    --color-blue-0091ff: #0091FF;
    --color-blue-031861: #031861;
    --color-blue-074765: #074765;
    --color-blue-09173c-a5: rgba(9, 23, 60, 0.051);
    --color-blue-0c5bf1: #0C5BF1;
    --color-blue-1212d7-a5: rgba(18, 18, 215, 0.051);
    --color-blue-1212d7-a8: rgba(18, 18, 215, 0.0784);
    --color-blue-1f2937: #1F2937;
    --color-blue-1f3394: #1F3394;
    --color-blue-282a3c-a10: rgba(40, 42, 60, 0.102);
    --color-blue-288bff: #288BFF;
    --color-blue-288eff: #288EFF;
    --color-blue-3498db: #3498DB;
    --color-blue-378df2: #378DF2;
    --color-blue-3877f2: #3877F2;
    --color-blue-495057: #495057;
    --color-blue-4b9dea: #4B9DEA;
    --color-blue-4f4fff: #4F4FFF;
    --color-blue-55679c: #55679C;
    --color-blue-595d6e: #595D6E;
    --color-blue-6147ff: #6147FF;
    --color-blue-646c9a: #646C9A;
    --color-blue-6d7278: #6D7278;
    --color-blue-767778: #767778;
    --color-blue-7c8fb4: #7C8FB4;
    --color-blue-80808f: #80808F;
    --color-blue-90999a: #90999A;
    --color-blue-9384f7: #9384F7;
    --color-blue-96a4c1-a21: rgba(150, 164, 193, 0.2118);
    --color-blue-96e1e8: #96E1E8;
    --color-blue-9aabff: #9AABFF;
    --color-blue-9da1a4: #9DA1A4;
    --color-blue-a0c2f5: #A0C2F5;
    --color-blue-a0c2f5-a57: rgba(160, 194, 245, 0.5686);
    --color-blue-a69cef: #A69CEF;
    --color-blue-a6b4cf: #A6B4CF;
    --color-blue-aad9ff: #AAD9FF;
    --color-blue-abe7ed: #ABE7ED;
    --color-blue-add6ef: #ADD6EF;
    --color-blue-add8e6: #ADD8E6;
    --color-blue-b0bec5: #B0BEC5;
    --color-blue-b3e5fc: #B3E5FC;
    --color-blue-b8b8dd: #B8B8DD;
    --color-blue-b9d1ff: #B9D1FF;
    --color-blue-c0d9f5: #C0D9F5;
    --color-blue-c6dbfc: #C6DBFC;
    --color-blue-c7daff: #C7DAFF;
    --color-blue-c7daff-a21: rgba(199, 218, 255, 0.2118);
    --color-blue-caddf4: #CADDF4;
    --color-blue-cdc6fb: #CDC6FB;
    --color-blue-cfddf1: #CFDDF1;
    --color-blue-d1d9e5: #D1D9E5;
    --color-blue-d1def8: #D1DEF8;
    --color-blue-d3e3fd: #D3E3FD;
    --color-blue-d6e1f5: #D6E1F5;
    --color-blue-d7e2f9: #D7E2F9;
    --color-blue-d8ecf6: #D8ECF6;
    --color-blue-dae6f0: #DAE6F0;
    --color-blue-daeafb: #DAEAFB;
    --color-blue-dcf4ff: #DCF4FF;
    --color-blue-ddedff: #DDEDFF;
    --color-blue-dee2e6: #DEE2E6;
    --color-blue-dee5ec: #DEE5EC;
    --color-blue-dee9fe: #DEE9FE;
    --color-blue-dfe3f7: #DFE3F7;
    --color-blue-e0e8f8: #E0E8F8;
    --color-blue-e0ebf9: #E0EBF9;
    --color-blue-e0ebfd: #E0EBFD;
    --color-blue-e1e1ef: #E1E1EF;
    --color-blue-e1e9f8: #E1E9F8;
    --color-blue-e2e5ec: #E2E5EC;
    --color-blue-e2ebfe: #E2EBFE;
    --color-blue-e2ecfe: #E2ECFE;
    --color-blue-e3f8ff: #E3F8FF;
    --color-blue-e4eaec: #E4EAEC;
    --color-blue-e5e7ef: #E5E7EF;
    --color-blue-e6e6fa: #E6E6FA;
    --color-blue-e7ecf1: #E7ECF1;
    --color-blue-e7f7fe: #E7F7FE;
    --color-blue-e8ecf2: #E8ECF2;
    --color-blue-e8f0ff: #E8F0FF;
    --color-blue-e9f3fd: #E9F3FD;
    --color-blue-eaecf5: #EAECF5;
    --color-blue-eaf1fd: #EAF1FD;
    --color-blue-eaf5ff: #EAF5FF;
    --color-blue-eaf6ff-a47: rgba(234, 246, 255, 0.4706);
    --color-blue-ebedf2: #EBEDF2;
    --color-blue-ecedf8: #ECEDF8;
    --color-blue-ecf0f3: #ECF0F3;
    --color-blue-edeaff: #EDEAFF;
    --color-blue-edf3ff: #EDF3FF;
    --color-blue-eef1f5: #EEF1F5;
    --color-blue-f0f2fc: #F0F2FC;
    --color-blue-f0f4f9: #F0F4F9;
    --color-blue-f0f5ff: #F0F5FF;
    --color-blue-f0f6f8: #F0F6F8;
    --color-blue-f1f2f7: #F1F2F7;
    --color-blue-f2f3f5: #F2F3F5;
    --color-blue-f2f3f8: #F2F3F8;
    --color-blue-f4f6fa: #F4F6FA;
    --color-blue-f4f7fa: #F4F7FA;
    --color-blue-f5fafd: #F5FAFD;
    --color-blue-f5faff: #F5FAFF;
    --color-blue-f6f7fb: #F6F7FB;
    --color-blue-f6f8fb: #F6F8FB;
    --color-blue-f6f8fc: #F6F8FC;
    --color-blue-f6f9ff: #F6F9FF;
    --color-blue-f7f8fa: #F7F8FA;
    --color-blue-f7fdff: #F7FDFF;
    --color-blue-f8f8f9: #F8F8F9;
    --color-blue-f8f9fa: #F8F9FA;
    --color-blue-f8fafb: #F8FAFB;
    --color-blue-fafbfd: #FAFBFD;
    --color-blue-fbfcfd: #FBFCFD;
    --color-blue-mist: #EAF1FB;
    /* BRIGHT family */
    --color-bright-blue: #008CFF;
    /* FFF0 family */
    --color-fff0: #fff0;
    /* FFFF family */
    --color-ffff: #ffff;
    /* GRAY family */
    --color-gray-33: #333333;
    --color-gray-4a: #4A4A4A;
    --color-gray-55: #555555;
    --color-gray-59: #595959;
    --color-gray-66: #666666;
    --color-gray-69: #696969;
    --color-gray-6b: #6B6B6B;
    --color-gray-70: #707070;
    --color-gray-73: #737373;
    --color-gray-75: #757575;
    --color-gray-77: #777777;
    --color-gray-79: #797979;
    --color-gray-7d: #7D7D7D;
    --color-gray-80-a36: rgba(128, 128, 128, 0.3608);
    --color-gray-80-a77: rgba(128, 128, 128, 0.7686);
    --color-gray-86: #868686;
    --color-gray-87: #878787;
    --color-gray-95: #959595;
    --color-gray-97: #979797;
    --color-gray-99: #999999;
    --color-gray-9b: #9B9B9B;
    --color-gray-9e: #9E9E9E;
    --color-gray-a0: #A0A0A0;
    --color-gray-a8: #A8A8A8;
    --color-gray-aa: #AAAAAA;
    --color-gray-b2: #B2B2B2;
    --color-gray-b5: #B5B5B5;
    --color-gray-ba: #BABABA;
    --color-gray-bb: #BBBBBB;
    --color-gray-c4: #C4C4C4;
    --color-gray-cc: #CCCCCC;
    --color-gray-d0: #D0D0D0;
    --color-gray-d3: #D3D3D3;
    --color-gray-d6-a25: rgba(214, 214, 214, 0.251);
    --color-gray-d8: #D8D8D8;
    --color-gray-dd: #DDDDDD;
    --color-gray-dd-a37: rgba(221, 221, 221, 0.3686);
    --color-gray-dd-a70: rgba(221, 221, 221, 0.702);
    --color-gray-df: #DFDFDF;
    --color-gray-e0: #E0E0E0;
    --color-gray-e5: #E5E5E5;
    --color-gray-e7: #E7E7E7;
    --color-gray-ea: #EAEAEA;
    --color-gray-eb: #EBEBEB;
    --color-gray-ec: #ECECEC;
    --color-gray-ed: #EDEDED;
    --color-gray-ee: #EEEEEE;
    --color-gray-f0: #F0F0F0;
    --color-gray-f1: #F1F1F1;
    --color-gray-f2: #F2F2F2;
    --color-gray-f2-a40: rgba(242, 242, 242, 0.4);
    --color-gray-f4: #F4F4F4;
    --color-gray-f5: #F5F5F5;
    --color-gray-f7-a50: rgba(247, 247, 247, 0.502);
    --color-gray-f8: #F8F8F8;
    --color-gray-f9: #F9F9F9;
    /* GREEN family */
    --color-green-00e900: #00E900;
    --color-green-1f3801: #1F3801;
    --color-green-498533: #498533;
    --color-green-4bc81e: #4BC81E;
    --color-green-55b776: #55B776;
    --color-green-66a818: #66A818;
    --color-green-83a584: #83A584;
    --color-green-9bd458: #9BD458;
    --color-green-a0c6a2: #A0C6A2;
    --color-green-aed581: #AED581;
    --color-green-c5e1a5: #C5E1A5;
    --color-green-c7f0d8: #C7F0D8;
    --color-green-cfecac: #CFECAC;
    --color-green-dcedc8: #DCEDC8;
    --color-green-ecfed7: #ECFED7;
    /* LIME family */
    --color-lime: #A0D660;
    /* MEDIUM family */
    --color-medium-blue: #1674DF;
    /* ORANGE family */
    --color-orange: #FF9900;
    --color-orange-543a0b: #543A0B;
    --color-orange-895509: #895509;
    --color-orange-8b572a: #8B572A;
    --color-orange-bcaaa4: #BCAAA4;
    --color-orange-cf8100: #CF8100;
    --color-orange-ec860f: #EC860F;
    --color-orange-f0c674: #F0C674;
    --color-orange-f17531: #F17531;
    --color-orange-f8a31d: #F8A31D;
    --color-orange-fdeace: #FDEACE;
    --color-orange-fdf5e6: #FDF5E6;
    --color-orange-fef8f4: #FEF8F4;
    --color-orange-ff8c00: #FF8C00;
    --color-orange-ff9505: #FF9505;
    --color-orange-ff9800: #FF9800;
    --color-orange-ffcc80: #FFCC80;
    --color-orange-ffe0b2: #FFE0B2;
    --color-orange-fff2e0: #FFF2E0;
    --color-orange-fff5e2: #FFF5E2;
    --color-orange-fff8ed: #FFF8ED;
    --color-orange-fffaf2-a50: rgba(255, 250, 242, 0.502);
    --color-orange-fffcf8: #FFFCF8;
    /* PEACH family */
    --color-peach-orange: #FFAB45;
    /* RED family */
    --color-red-8a6b76-a8: rgba(138, 107, 118, 0.0784);
    --color-red-9f0404: #9F0404;
    --color-red-a19f9f: #A19F9F;
    --color-red-b91802: #B91802;
    --color-red-cecacc: #CECACC;
    --color-red-e1dada: #E1DADA;
    --color-red-e30000: #E30000;
    --color-red-e3dada: #E3DADA;
    --color-red-e85252: #E85252;
    --color-red-eb2026: #EB2026;
    --color-red-eb6c5d: #EB6C5D;
    --color-red-ef5f5f: #EF5F5F;
    --color-red-f48fb1: #F48FB1;
    --color-red-f54c4c: #F54C4C;
    --color-red-f5515f: #F5515F;
    --color-red-f6c5c5: #F6C5C5;
    --color-red-f8cace: #F8CACE;
    --color-red-fbe1e3: #FBE1E3;
    --color-red-fe8f8f: #FE8F8F;
    --color-red-fed7dc: #FED7DC;
    --color-red-ff0000: #FF0000;
    --color-red-ff5733: #FF5733;
    --color-red-ff5a6f: #FF5A6F;
    --color-red-ff9e80: #FF9E80;
    --color-red-ffc4c2: #FFC4C2;
    --color-red-ffe7e7: #FFE7E7;
    /* STEEL family */
    --color-steel-blue: #0A85BD;
    /* TEAL family */
    --color-teal-1bc5bd: #1BC5BD;
    --color-teal-249995: #249995;
    --color-teal-444746: #444746;
    --color-teal-6ea6ab: #6EA6AB;
    --color-teal-8dc8cc: #8DC8CC;
    /* VIOLET family */
    --color-violet-d8b4f8: #D8B4F8;
    /* VIVID family */
    --color-vivid-blue: #012169;
    /* YELLOW family */
    --color-yellow-999900: #999900;
    --color-yellow-b4b4b3: #B4B4B3;
    --color-yellow-b6985a: #B6985A;
    --color-yellow-cfa730: #CFA730;
    --color-yellow-f7de79: #F7DE79;
    --color-yellow-f9e491: #F9E491;
    --color-yellow-ffab00: #FFAB00;
    --color-yellow-ffcc00: #FFCC00;
    --color-yellow-fffaf0: #FFFAF0;
}