/************   Light   **************/
.light {

    /* brand */
    --color-primary: #0EADD7;

    /* background layer */
    --color-bg-primary: #F5F7FA;
    --color-bg-secondary: #FFFFFF;
    --color-bg-tertiary: #F8F8F8;

    /* border */
    --color-default-border: #EDEDED;
    --color-active-border: #4E4E4E;
    --color-separator: #E8E8E8;

    /* text */
    --color-title: #353535;
    --color-subtitle: #818181;
    --color-disabled-text: #BDBEBF;
    --color-text-on-primary-button: #FFFFFF;
    --color-blue-text: #0EADD7;

    /* Button states */
    --color-active-button: var(--color-primary);
    --color-deactivate: #EBEBEB;
    --color-hover-selected-pressing-button: #0086B4;
    --color-hover-selected-pressing-button-opacity: rgba(77, 162, 255, 0.08);
    --color-loading-button: var(--color-primary);

    /* shadow */
    --color-shadow-100: #000000;

    /* layout */
    --color-layout: rgba(0, 0, 0, 0.48);

    /* color icon */
    --color-icon: var(--color-title);

    /* status */
    --color-success: #2FB350;
    --color-info: #2D9CCF;
    --color-warning: #E5B800;
    --color-danger: #E6352B;

    --color-success-08: #EBF9EE;
    --color-blue-08: #E7F7FB;
    --color-warning-08: #FFFAE6;
    --color-danger-08: #FFEBEA;

}