/* The macros must match the values generated by WebSkin::parseSkinXml(...) */
:root
{
    /* LIGHT MODE */
    --main-bg-color-light: #FBFBFB;

    --header-bg-color-first-light:  #4285F4;
    --header-bg-color-second-light: #367CDE;
    --header-text-transform:        none;

    --navbar-brand-text-color-light: #FFFFFF;
    --navbar-brand-text-transform:   none;

    --navbar-nav-nav-link-text-color-light:             #FFFFFF;
    --navbar-nav-nav-link-text-color-hover-light:       #FFFFFF;
    --navbar-nav-nav-link-background-color-hover-light: #2F7EE7;

    --navbar-nav-dropdown-menu-background-color-light: #FFFFFF;

    --navbar-nav-dropdown-menu-item-text-color-light:             #000000;
    --navbar-nav-dropdown-menu-item-text-color-hover-light:       #000000;
    --navbar-nav-dropdown-menu-item-background-color-hover-light: #F5F5F5;

    --navbar-nav-nav-link-active-text-color-light:        #FFFFFF;
    --navbar-nav-nav-link-active-background-color-light:  #357CF3;

    --custom-btn-primary-text-color-light:             #FFFFFF;
    --custom-btn-primary-background-color-light:       #337AB7;
    --custom-btn-primary-border-color-light:           #337AB7;
    --custom-btn-primary-background-color-hover-light: #286090;

    --custom-archive-panel-background-color-light:        #222222;
    --custom-archive-panel-button-text-color-light:       #FFFFFF;
    --custom-archive-panel-button-background-color-light: #337AB7;
    --custom-archive-panel-button-border-color-light:     #337AB7;


    /* DARK MODE */
    --main-bg-color-dark: #181818;

    --header-bg-color-first-dark:  #202020;
    --header-bg-color-second-dark: #202020;

    --navbar-brand-text-color-dark: #FFFFFF;

    --navbar-nav-nav-link-text-color-dark:             #FFFFFF;
    --navbar-nav-nav-link-text-color-hover-dark:       #FFFFFF;
    --navbar-nav-nav-link-background-color-hover-dark: var(--fs-spec-black-200);

    --navbar-nav-dropdown-menu-background-color-dark: var(--fs-spec-black-800);

    --navbar-nav-dropdown-menu-item-text-color-dark:             var(--fs-spec-white-pure);
    --navbar-nav-dropdown-menu-item-text-color-hover-dark:       var(--fs-spec-white-pure);
    --navbar-nav-dropdown-menu-item-background-color-hover-dark: var(--fs-spec-grey-900);

    --navbar-nav-nav-link-active-text-color-dark:        #FFFFFF;
    --navbar-nav-nav-link-active-background-color-dark:  #181818;

    --custom-btn-primary-text-color-dark:             #FFFFFF;
    --custom-btn-primary-background-color-dark:       #337AB7;
    --custom-btn-primary-border-color-dark:           #337AB7;
    --custom-btn-primary-background-color-hover-dark: #286090;

    --custom-archive-panel-background-color-dark:        #222222;
    --custom-archive-panel-button-text-color-dark:       #FFFFFF;
    --custom-archive-panel-button-background-color-dark: #337AB7;
    --custom-archive-panel-button-border-color-dark:     #337AB7;
}