/* ---------- Color Module Styles ----------- */
body {   
    color: var(--body_text);
    background-color: var(--body_bg); }

header {
    background: var(--header_bg);;
}

a {
    color: var(--link); }
a:hover {
    color: var(--link_hover); }

.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .active > .nav-link {
    color: var(--nav_link);
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-item.dropdown.show .nav-link {
    background-color: var(--nav_link_hover_bg);
    color: var(--nav_link_hover);
}

.dropdown-menu {
    background-color: var(--nav_link_hover_bg);
}
.dropdown-menu .dropdown-item:hover {
    background-color: var(--nav_link_drop_item_hover_bg);
}
      

.btn-primary {
    color: var(--button_text);
    background-color: var(--button_bg);
    border-color: var(--button_bg); }
.btn-primary:hover, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: var(--button_hover_text);
    background-color: var(--button_hover_bg);
    border-color: var(--button_hover_border); }

.btn-outline-primary {
    color: var(--button_bg);
    border-color: var(--button_bg); }
.btn-outline-primary:hover {
    color: var(--button_hover_text);
    background-color: var(--button_hover_bg);
    border-color: var(--button_hover_border); }

.btn-secondary {
    color: var(--sec_button_text);
    background-color: var(--sec_button_bg);
    border-color: var(--sec_button_bg); }
.btn-secondary:hover, .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    color: var(--sec_button_hover_text);
    background-color: var(--sec_button_hover_bg);
    border-color: var(--sec_button_hover_border); }

/** Footer */
footer{
    color: var(--footer);
}
footer.footer-bg {
    background: var(--footer_bg);
    color: var(--footer);
}

footer h3{
    border-color: var(--footer);
}

footer a, footer .nav a{
    color: var(--footer_link);
}
footer a:hover, footer .nav a:hover{
    color: var(--footer_link_hover);
}

/* ---------- Color Form ----------- */

[dir="rtl"] .color-form .color-palette {
    margin-left: 0;
    margin-right: 20px;
}

[dir="rtl"] .color-form .form-item label {
    float: right;
}

[dir="rtl"] .color-form .color-palette .lock {
    right: -20px;
    left: 0;
}