/* palette.css */

:root {
    --color-black: #000000;
    --color-black-light: #3b4037;
    --color-cyan-bluish-gray: #abb8c3;
    --color-white: #ffffff;
    --color-pale-pink: #f78da7;
    --color-vivid-red: #cf2e2e;
    --color-luminous-vivid-orange: #ff6900;
    --color-luminous-vivid-amber: #fcb900;
    --color-light-green-cyan: #7bdcb5;
    --color-vivid-green-cyan: #00d084;
    --color-pale-cyan-blue: #8ed1fc;
    --color-vivid-cyan-blue: #0693e3;
    --color-vivid-purple: #9b51e0;
    --color-purple: #6b3267;
    --color-purple-light: #cbb9ca;
    --color-blue: #99bcc4;
    --color-red: #c01f1c;
    --color-red-light: #ffd4d3;
    --color-greyfirst: #f1f3f3;
    --color-greysecond: #f6f7f8;
    --color-green-dark: #2e7d32;
    --color-green-light: #b7d7b8;
    --color-orange-light: #efb799;
    /* Brand */
    --color-primary: #e30613;
    --color-primary-dark: #b7050f;
    --color-primary-light: #ff4d57;
    --color-brand-orange: #E05C16;
    /* Controls */
    --color-ctl-border-highlight: #80bdff;
    --color-ctl-border: #ced4da;
    /* Neutrals */
    --color-black: #111111;
    --color-charcoal: #2d2d2d;
    --color-dark-grey: #555555;
    --color-medium-grey: #8a8a8a;
    --color-light-grey: #e5e5e5;
    --color-off-white: #f7f7f7;
    --color-white: #ffffff;
    /* Supporting colours */
    --color-success: #2e7d32;
    --color-warning: #f9a825;
    --color-error: #c62828;
    --color-info: var(--color-purple);
    --color-info-light: var(--color-purple-light);    
    /*
    --color-info: #104683;
    --color-info-light: #b3c3d5;
    */
    /* Text */
    --color-text-label: #6f6f6f;
    --color-text-secondary: var(--color-dark-grey);
    --color-text-inverse: var(--color-white);
    /* Backgrounds */
    --color-background: var(--color-white);
    --color-surface: var(--color-off-white);
    --color-border: var(--color-light-grey);
    /* Links */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dark);
    /* Buttons */
    --button-primary-bg: var(--color-primary);
    --button-primary-text: var(--color-white);
    --button-primary-hover: var(--color-primary-dark);
}