/****************************************************************************
*****************************************************************************
03 Base Styling (BSE)
*****************************************************************************
****************************************************************************/

/*---------------------------------------------------------------------------
03-00 Colors (BS0) FRAMEWORK 2024-07-19
---------------------------------------------------------------------------*/

/* Text Colors
-----------------------------------------------*/

/* Color 1 */
.clr-1, .has-clr-1-color { color: var(--clr-1) !important; }

/* Color 2 */
.clr-2, .has-clr-2-color { color: var(--clr-2) !important; }

/* Color 3 */
.clr-3, .has-clr-3-color { color: var(--clr-3) !important; }

/* Color 4 */
.clr-4, .has-clr-4-color { color: var(--clr-4) !important; }

/* Color Black */
.clr-white, .has-white-color { color: var(--clr-white) !important; }

/* Color White */
.clr-black, .has-black-color { color: var(--clr-black) !important; }

/* Background Colors
-----------------------------------------------*/
/* Color 1 */
.bkg-1, .has-clr-1-background-color { background-color: var(--clr-1) !important; }

    /* Color 1 Opacity */
    .bkg-1-op, .has-clr-1-op-background-color { background-color: var(--clr-1-op) !important; }

    /* Color 1 Gradient */
    .bkg-1-grad{ background: linear-gradient( 90deg, var(--clr-1-light), var(--clr-1-dark) ); }

    /* Color 1 Gradient Opacity */
    .bkg-1-grad-op{ background: linear-gradient( 90deg, var(--clr-1-light-op), var(--clr-1-dark-op) ); }

/* Color 2 */
.bkg-2, .has-clr-2-background-color { background-color: var(--clr-2) !important; }

    /* Color 2 Opacity */
    .bkg-2-op, .has-clr-2-op-background-color { background-color: var(--clr-2-op) !important; }

    /* Color 2 Gradient */
    .bkg-2-grad{ background: linear-gradient( 90deg, var(--clr-2-light), var(--clr-2-dark) ); }

    /* Color 2 Gradient Opacity */
    .bkg-2-grad-op{ background: linear-gradient( 90deg, var(--clr-2-light-op), var(--clr-2-dark-op) ); }

/* Color 3 */
.bkg-3, .has-clr-3-background-color { background-color: var(--clr-3) !important; }

    /* Color 3 Opacity */
    .bkg-3-op, .has-clr-3-op-background-color { background-color: var(--clr-3-op) !important; }

    /* Color 3 Gradient */
    .bkg-3-grad{ background: linear-gradient( 90deg, var(--clr-3-light), var(--clr-3-dark) ); }

    /* Color 3 Gradient Opacity */
    .bkg-3-grad-op{ background: linear-gradient( 90deg, var(--clr-3-light-op), var(--clr-3-dark-op) ); }

/* Color 3 Dark */
.bkg-3-dark, .has-clr-3-dark-background-color { background-color: var(--clr-3-dark) !important; }

/* Color 4 */
.bkg-4, .has-clr-4-background-color { background-color: var(--clr-4) !important; }

    /* Color 4 Opacity */
    .bkg-4-op, .has-clr-4-op-background-color { background-color: var(--clr-4-op) !important; }

    /* Color 4 Gradient */
    .bkg-4-grad{ background: linear-gradient( 90deg, var(--clr-4-light), var(--clr-4-dark) ); }

    /* Color 4 Gradient Opacity */
    .bkg-4-grad-op{ background: linear-gradient( 90deg, var(--clr-4-light-op), var(--clr-4-dark-op) ); }


/* Color Black */
.bkg-black, .has-clr-black-background-color{ background-color: var(--clr-black) !important; }

/* Color White */
.bkg-white, .has-clr-white-background-color  { background-color: var(--clr-white) !important; }
.bkg-white-child > :first-child { background-color: var(--clr-white) !important; }