:root{
    /**Common*/
    --white: #ffffff;
    --catalyst-dark:#272931;
    --low-opacity-scrim-layer:#333333B2;

    /**dark Theme Primary*/
    --light-default-blue:#4570e1;
    --light-hover-blue:#1240BD;
    --light-active-blue:#0D3092;

    /**Light Theme Content*/
    --light-medium-priority:#4C5060;
    --light-low-priority: #70768E;
    --light-non-text-contrast-dark:#B7B7B7;
    --light-non-text-contrast-light:#D3D3D3;

    /**Light Theme Surfaces*/
    --light-surface-one:#F5F5F5;
    --light-surface-two:#F0F0F0;
    --light-surface-three:#EBEBEB;
    --light-surface-disabled:#C9CACD;

    /**Light Theme Feedback Colors*/

    --light-positive-feedback:#51A800;
    --light-high-priority-warning-feedback:#EE0000;
    --light-warning-feedback:#E57300;

    /**Light Theme Low-Opacity*/
    --light-low-opacity-hover:#4570E11A;
    --light-low-opacity-active:#4570E133;
    --light-low-opacity-translucent-surface:#EBEBEBCC;
    --light-low-opacity-alternate-hover:#BA5DD126;
    --light-low-opacity-alternate-active:#4570E10D;

    /**Dark Theme Primary*/
    --dark-default-blue:#C2FCFF;
    --dark-hover-blue:#D4FDFF;
    --dark-active-blue:#E5FFFF;

    /**Dark Theme Content*/
    --dark-medium-priority:#CCCCCC;
    --dark-low-priority: #BABABA;
    --dark-non-text-contrast-light:#5E6786;
    --dark-non-text-contrast-dark:#4D556F;

    /**Dark Theme Surfaces*/
    --dark-surface-one-dp:#2E313A;
    --dark-surface-two-dp:#323640;
    --dark-surface-four-dp:#373C47;
    --dark-surface-eight-dp:#3D434F;
    --dark-surface-sixteen-dp:#414855;
    --dark-surface-disabled:#55565F;

    /**Dark Theme Feedback Colors*/

    --dark-positive-feedback:#B4FFC5;
    --dark-high-priority-warning-feedback:#FFA1A1;
    --dark-warning-feedback:#FFB770;

    /**Dark Theme Low-Opacity*/
    --dark-low-opacity-hover:#A6B7FF26;
    --dark-low-opacity-active:#A6B7FF66;
    --dark-low-opacity-translucent-surface:#414855CC;
    --dark-low-opacity-alternate-hover:#C3FAFF1A;
    --dark-low-opacity-alternate-active:#C3FAFF33;
}