/*
|--------------------------------------------------------------------------
| Speezu Theme Palette
|--------------------------------------------------------------------------
| Update the custom properties below to change the global color scheme.
| Any component that references these variables will update automatically.
*/
:root {
    /* Base brand colors */
    --speezu-blue: #01035e;
    --speezu-blue-rgb: 1, 3, 94;
    --speezu-blue-hover: #272876;
    --speezu-blue-active: #000844;

    --speezu-green: #98cc33;
    --speezu-green-rgb: 152, 204, 51;
    --speezu-green-hover: #7fb228;
    --speezu-green-active: #6a9a22;

    --speezu-pink: #f9349b;
    --speezu-pink-rgb: 249, 52, 155;
    --speezu-pink-hover: #e0208e;
    --speezu-pink-active: #c9187a;

    /* Semantic theme roles */
    --speezu-primary: var(--speezu-blue);
    --speezu-primary-rgb: var(--speezu-blue-rgb);
    --speezu-primary-hover: var(--speezu-blue-hover);
    --speezu-primary-active: var(--speezu-blue-active);

    --speezu-secondary: var(--speezu-green);
    --speezu-secondary-rgb: var(--speezu-green-rgb);
    --speezu-secondary-hover: var(--speezu-green-hover);
    --speezu-secondary-active: var(--speezu-green-active);

    --speezu-accent: var(--speezu-pink);
    --speezu-accent-rgb: var(--speezu-pink-rgb);
    --speezu-accent-hover: var(--speezu-pink-hover);
    --speezu-accent-active: var(--speezu-pink-active);

    /* Button palette */
    --speezu-button-bg: var(--speezu-green);
    --speezu-button-hover: var(--speezu-green-hover);
    --speezu-button-active: var(--speezu-green-active);

    /* Bootstrap overrides */
    --bs-primary: var(--speezu-primary);
    --bs-primary-rgb: var(--speezu-primary-rgb);
    --bs-secondary: var(--speezu-secondary);
    --bs-secondary-rgb: var(--speezu-secondary-rgb);
    --bs-success: var(--speezu-secondary);
    --bs-success-rgb: var(--speezu-secondary-rgb);
    --bs-info: var(--speezu-accent);
    --bs-info-rgb: var(--speezu-accent-rgb);
    --bs-link-color: var(--speezu-primary);
    --bs-link-hover-color: var(--speezu-accent);
    --bs-gradient: none;
}

a,
.btn-link {
    color: var(--speezu-primary);
}

a:hover,
.btn-link:hover {
    color: var(--speezu-accent);
}

.text-primary {
    color: var(--speezu-primary) !important;
}

.text-secondary {
    color: var(--speezu-secondary) !important;
}

.text-info {
    color: var(--speezu-accent) !important;
}

.text-success {
    color: var(--speezu-secondary) !important;
}

.bg-primary {
    background-color: var(--speezu-primary) !important;
}

.bg-secondary {
    background-color: var(--speezu-secondary) !important;
}

.bg-info {
    background-color: var(--speezu-accent) !important;
}

.bg-success {
    background-color: var(--speezu-secondary) !important;
}

.border-primary {
    border-color: var(--speezu-primary) !important;
}

.border-secondary {
    border-color: var(--speezu-secondary) !important;
}

.border-info {
    border-color: var(--speezu-accent) !important;
}

.border-success {
    border-color: var(--speezu-secondary) !important;
}

.btn:not(.btn-link) {
    color: #fff !important;
    background-color: var(--speezu-button-bg);
    border-color: var(--speezu-button-bg);
}

.btn:not(.btn-link):hover,
.btn:not(.btn-link):focus {
    color: #fff !important;
    background-color: var(--speezu-button-hover);
    border-color: var(--speezu-button-hover);
}

.btn:not(.btn-link):active,
.btn:not(.btn-link).active,
.show > .btn.dropdown-toggle {
    color: #fff !important;
    background-color: var(--speezu-button-active);
    border-color: var(--speezu-button-active);
}

.btn:not(.btn-link).disabled,
.btn:not(.btn-link):disabled {
    color: rgba(255, 255, 255, 0.75);
    background-color: rgba(var(--speezu-secondary-rgb), 0.65);
    border-color: rgba(var(--speezu-secondary-rgb), 0.65);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-dark,
.btn-outline-light {
    color: var(--speezu-button-bg) !important;
    border-color: var(--speezu-button-bg) !important;
    background-color: transparent;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-info:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover,
.btn-outline-dark:hover,
.btn-outline-light:hover {
    color: #fff !important;
    background-color: var(--speezu-button-bg) !important;
    border-color: var(--speezu-button-bg) !important;
}

.bg-gradient-primary,
.badge.bg-gradient-primary,
.btn.bg-gradient-primary,
.card.bg-gradient-primary {
    background-image: none !important;
    background-color: var(--speezu-primary) !important;
}

.bg-gradient-success,
.badge.bg-gradient-success,
.btn.bg-gradient-success,
.card.bg-gradient-success {
    background-image: none !important;
    background-color: var(--speezu-secondary) !important;
}

.bg-gradient-info,
.bg-gradient-secondary,
.badge.bg-gradient-info,
.badge.bg-gradient-secondary,
.btn.bg-gradient-info,
.btn.bg-gradient-secondary,
.card.bg-gradient-info,
.card.bg-gradient-secondary {
    background-image: none !important;
    background-color: var(--speezu-accent) !important;
}

.sidenav[data-color="primary"] .navbar-nav > .nav-item > .nav-link.active {
    background-color: var(--speezu-primary) !important;
}

.sidenav[data-color="success"] .navbar-nav > .nav-item > .nav-link.active {
    background-color: var(--speezu-secondary) !important;
}

.sidenav[data-color="info"] .navbar-nav > .nav-item > .nav-link.active,
.sidenav[data-color="secondary"] .navbar-nav > .nav-item > .nav-link.active {
    background-color: var(--speezu-accent) !important;
}

.form-check-input:checked {
    background-color: var(--speezu-button-bg);
    border-color: var(--speezu-button-bg);
}

.page-item.active .page-link {
    color: #fff;
    background-color: var(--speezu-button-bg);
    border-color: var(--speezu-button-bg);
}

.nav-pills .nav-link.active {
    background-image: none !important;
    background-color: var(--speezu-primary) !important;
    color: #fff !important;
}

.progress-bar.bg-primary {
    background-color: var(--speezu-primary) !important;
}

.progress-bar.bg-success {
    background-color: var(--speezu-secondary) !important;
}

.progress-bar.bg-info {
    background-color: var(--speezu-accent) !important;
}

.progress-bar.bg-secondary {
    background-color: var(--speezu-secondary) !important;
}

table thead th,
.table thead th {
    color: var(--speezu-primary) !important;
}
