/************************************************
*   COLORS
*************************************************/

[data-scheme="bdo"] {
    /* Backgrounds */
    --h: 223;
    --s: 78%;
    --l: 5%;
    --new-main-bg: hsl(223, 78%, 5%);
    --new-header-bg: hsl(223, 78%, 19%);
    --new-menu-bg: hsl(223, 78%, 23%);
    --new-header-active-bg: var(--new-menu-bg);
    --new-card-bg: var(--new-main-bg);
    --new-card-header-bg: transparent /*var(--new-main-bg)*/;
    --new-card-body-bg: var(--new-main-bg);
    --new-footable-header-bg: transparent /*var(--new-main-bg)*/;

    /* Text colors */
    --new-main-text-color: hsl(0, 0%, 100%);
    --new-card-header-text-color: var(--new-main-text-color);
    --new-card-body-text-color: hsl(0, 0%, 80%);
    --new-header-active-text-color: #f5deb3;
    --new-card-header-btn-color: var(--new-card-body-text-color);
    --new-placeholder: #d9d9d9;
    --new-footable-paging-color: var(--new-placeholder);
    --new-footable-main-color: var(--new-main-text-color);

    /* Borders, outlines */
    --new-header-border: hsl(223, 78%, 28%);
    --new-card-border: var(--new-header-border);
    --new-card-header-divider: var(--new-card-border);
    --new-outline: hsl(223, 78%, 32%);
    --new-footable-btn-border: var(--new-outline);
    --new-footable-paging-border: var(--new-outline);

    /* Box shadows */
    --new-card-box-shadow-color: #d9d9d960;
    --new-header-button-shadow: var(--new-placeholder);
    --main-box-shadow: 3px 1px 4px var(--new-card-box-shadow-color);

    /* Inactives */
    --new-inactive: hsl(0, 0%, 50%);
    --new-inactive-btn: var(--new-inactive);
    --disabled-color: #888888;
    --disabled-text-color: #c0c0c0;

    /* Main colors */
    --new-main-color: hsl(223, 65%, 37%);
    --new-error-color: hsl(8, 81%, 22%);
    --ssm-main-color: #95bc0d;

    /* Inputs */
    --new-input-bg: var(--new-header-bg);
    --new-input-border: var(--new-outline);
    --new-input-focus-border: var(--new-main-btn);
    --new-input-border-radius: 5px;
    --new-input-inactive-bg: hsl(0, 0%, 30%);

    --chosen-border-radius: var(--new-input-border-radius);

    /* Buttons */
    --new-main-btn: hsl(223, 65%, 55%);
    --new-footable-btn-bg: var(--new-header-bg);
    --new-footable-active-btn-bg: var(--new-outline);

    --all-btn-border-size: 1px;
    --all-btn-border-type: solid;
    --all-btn-border-color: transparent;
    --all-btn-border-radius: 5px;

    --btn-type-main-bg: var(--new-outline);
    --btn-type-main-hover-bg: var(--new-main-btn);
    --btn-type-main-border: var(--new-outline);
    --btn-type-main-hover-border: var(--new-main-btn);
    --btn-type-main-color: var(--new-main-text-color);
    --btn-type-main-hover-color: var(--new-main-text-color);

    --btn-type1-bg: #d7b29a;
    --btn-type1-hover-bg: #be886e;
    --btn-type1-border: var(--new-main-bg);
    --btn-type1-hover-border: var(--btn-type1-border);
    --btn-type1-color: var(--new-main-bg);
    --btn-type1-hover-color: var(--btn-type1-color);

    --btn-type2-bg: #968c6a;
    --btn-type2-hover-bg: #7e7148;
    --btn-type2-border: var(--new-main-bg);
    --btn-type2-hover-border: var(--btn-type2-border);
    --btn-type2-color: var(--new-main-bg);
    --btn-type2-hover-color: #fff;

    --btn-type3-bg: #bda255;
    --btn-type3-hover-bg: #7f743e;
    --btn-type3-border: var(--new-main-bg);
    --btn-type3-hover-border: var(--btn-type3-border);
    --btn-type3-color: var(--new-main-bg);
    --btn-type3-hover-color: #fff;

    --btn-type4-bg: #9c7836;
    --btn-type4-hover-bg: #9e6f18;
    --btn-type4-border: var(--new-main-bg);
    --btn-type4-hover-border: var(--btn-type4-border);
    --btn-type4-color: #fff;
    --btn-type4-hover-color: #fff;

    --btn-type5-bg: #67180b;
    --btn-type5-hover-bg: #804a23;
    --btn-type5-border: var(--new-main-bg);
    --btn-type5-hover-border: var(--btn-type5-border);
    --btn-type5-color: #fff;
    --btn-type5-hover-color: #fff;

    --btn-type6-bg: #9b5747;
    --btn-type6-hover-bg: #a46249;
    --btn-type6-border: var(--new-main-bg);
    --btn-type6-hover-border: var(--btn-type6-border);
    --btn-type6-color: #fff;
    --btn-type6-hover-color: #fff;

    --btn-back-bg: #fff;
    --btn-back-hover-bg: #55595c;
    --btn-back-border: var(--new-main-bg);
    --btn-back-hover-border: #55595c;
    --btn-back-color: var(--new-main-bg);
    --btn-back-hover-color: #fff;

    /* ------------------------------------------ */
    /* -- 				ICON COLORS			   -- */
    /* ------------------------------------------ */
    --icon-1: var(--btn-type1-bg);
    --icon-2: var(--btn-type2-bg);
    --icon-3: var(--btn-type3-bg);
    --icon-4: var(--btn-type4-bg);
    --icon-5: var(--btn-type5-bg);
    --icon-6: var(--btn-type6-bg);

    /* ------------------------------------------ */
    /* -- 			SEMANTIC COLORS 		   -- */
    /* ------------------------------------------ */
    --success-color: hsl(154, 100%, 30%);
    --warning-color: hsl(45, 100%, 50%);
    --error-color: hsl(0, 100%, 30%);
    --info-color: hsl(211, 100%, 50%);

    /* ------------------------------------------ */
    /* -- 				HEIGHTS 			   -- */
    /* ------------------------------------------ */

    --header-height: 50px;
    --side-menu-width: 50px;

    --header-font-size: 22px;

    /* ------------------------------------------ */
    /* -- 				FONTAWESOME			   -- */
    /* ------------------------------------------ */

    --fa-display: flex;
}