/* theme-blue.css
   Combined theme: import the original Black Dashboard CSS then apply blue overrides
   This file intentionally imports the base theme so the override rules below become the final
   authoritative rules without editing the original compiled theme file.
*/

@import url("black-dashboard.mine209.css?v=1.3.0");


:root{
    /* Main brand colors for the new theme */
    --brand-1: #5c58a7; /* primary */
    --brand-2: #6c69b0; /* darker */
    --brand-3: #7d79b9; /* darkest */
    --brand-contrast: #ffffff;

    /* Override theme variables from the base dashboard to remove leftover blues */
    --blue: #5c58a7;
    --indigo: #6c69b0;
    --purple: #7d79b9;
    --pink: #5c58a7;
    --primary: #5c58a7;
    --default: #7d79b9;
    --info: #6c69b0;
}

/* Navbar overrides to use brand colors (ensure visibility on white-content) */
.white-content .navbar.navbar-transparent .navbar-brand{
    color: var(--brand-1) !important;
}
.white-content .navbar.navbar-transparent .navbar-toggler-bar{
    background: var(--brand-1) !important;
}
.white-content .navbar.navbar-transparent .navbar-minimize button i,
.white-content .navbar.navbar-transparent .navbar-nav li a:not(.dropdown-item),
.white-content .navbar.navbar-transparent .navbar-nav li a:not(.dropdown-item) i,
.white-content .navbar.navbar-transparent .search-bar.input-group i{
    color: var(--brand-1) !important;
}
.white-content .navbar.navbar-transparent .search-bar.input-group .form-control{
    color: var(--brand-2) !important;
}


.off-canvas-sidebar, .sidebar{
    background: linear-gradient(180deg, var(--brand-2), var(--brand-1)) !important;
    background-color: var(--brand-1) !important;
    box-shadow: 0 0 45px 0 rgba(0,0,0,.45) !important;
}

.sidebar .nav li a, .sidebar .nav li a p, .sidebar .sidebar-wrapper .user .info, .sidebar .nav i{
    color: var(--brand-contrast) !important;
}

.btn-primary, .btn.btn-primary, button.btn-primary{
    background-image: linear-gradient(to bottom left, var(--brand-1), var(--brand-2), var(--brand-1)) !important;
    background-size:210% 210% !important;
    background-position:100% 0 !important;
    background-color: var(--brand-1) !important;
    border-color: var(--brand-1) !important;
    color: var(--brand-contrast) !important;
    box-shadow: none !important;
}

.btn-primary.animation-on-hover:hover, .btn-primary:hover, .btn-primary:focus{
    background-position:0 100% !important;
    background-image: linear-gradient(to bottom left, var(--brand-2), var(--brand-3), var(--brand-2)) !important;
    color: var(--brand-contrast) !important;
}

.btn-primary.active, .btn-primary:active, .btn-primary:active:focus, .btn-primary.active:focus{
    background-color: var(--brand-3) !important;
    background-image: linear-gradient(to bottom left, var(--brand-3), var(--brand-2)) !important;
}

.btn-primary.btn-simple, .btn-primary.btn-link{
    color: var(--brand-1) !important;
    border-color: var(--brand-1) !important;
}

.progress-bar, .progress-bar-animated{
    background-color: var(--brand-1) !important;
    background-image: linear-gradient(to bottom left, var(--brand-1), var(--brand-2)) !important;
}

.badge.bg-danger, .alert-danger, .fixed-plugin .badge, .active-color .badge{
    background-color: var(--brand-1) !important;
    color: var(--brand-contrast) !important;
}

a, a:hover, a:focus{
    color: var(--brand-2) !important;
}

.table>thead>tr>th, .table>tfoot>tr>th{
    color: #525f7f !important;
}

.btn.btn-primary[style], .sidebar[style]{
    background-image: none !important;
}

.pagination .page-item.active .page-link,
.page-item.active .page-link,
.pagination .page-item .page-link:focus,
.pagination .page-item .page-link:active{
    background: var(--brand-1) !important;
    border-color: var(--brand-1) !important;
    color: var(--brand-contrast) !important;
    box-shadow: none !important;
}

.pagination .page-link{
    color: var(--brand-2) !important;
    border-color: #e9ecef !important;
    background: #fff !important;
}
.pagination .page-link:hover{
    /* pagination hover: use brand tint (converted from #5c58a7) */
    background: rgba(255,80,93,0.08) !important;
}

.btn-default, .btn-dark, .btn-secondary{
    background-image: linear-gradient(to bottom left, var(--brand-1), var(--brand-2)) !important;
    background-color: var(--brand-1) !important;
    border-color: var(--brand-2) !important;
    color: var(--brand-contrast) !important;
    box-shadow: none !important;
}
.btn-default:hover, .btn-dark:hover, .btn-secondary:hover{
    background-image: linear-gradient(to bottom left, var(--brand-2), var(--brand-3)) !important;
    background-color: var(--brand-2) !important;
}

.btn-simple, .btn.btn-simple, .btn.btn-outline, .btn.btn-outline-primary{
    /* color: var(--brand-1) !important; */
    border-color: transparent !important;
    /* background: transparent !important; */
}

.login-brand{
    text-align: center;
    color: var(--brand-2);
    margin-bottom: 12px;
    font-weight: 600;
}

.container.margin-set-center{
    padding-top: 36px;
    padding-bottom: 36px;
}

.container.margin-set-center .card{
    border: none !important;
    border-radius: 10px !important;
    /* card shadow using brand-3 tint */
    box-shadow: 0 8px 30px rgba(255,138,112,0.08) !important;
}

.container.margin-set-center .card .card-body{
    padding: 2rem !important;
}

.input-group-prepend.p-3.set-design-border{
    /* input prepend background using brand-1 tint */
    background: rgba(255,80,93,0.06) !important;
    color: var(--brand-2) !important;
    border-top-left-radius: 6px !important;
    border-bottom-left-radius: 6px !important;
}

.container.margin-set-center .form-control{
    color: #1f2d3d !important;
}

.container.margin-set-center .btn.btn-primary.w-100{
    padding: 12px 16px !important;
    font-weight: 600 !important;
}

/* END overrides */



/* Specific: if labels (like .label-warning/.label-info) set gradients or colors, ensure the inner text remains white */
.label.invoice-action-button,
.invoice-action-button.label-warning,
.invoice-action-button.label-info,
.invoice-action-button.label-default {
    color: #ffffff !important;
}

/* === Global override: force white text for all buttons/labels across the site === */
/* This makes button/link/label text white (and forces icon/SVG fills) to match the theme */
button,
.btn,
a.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
.label,
.badge,
.btn-link,
.btn-flat,
.btn-sm {
    color: #ffffff !important;
    fill: #ffffff !important;
    text-decoration: none !important;
}

/* Ensure nested elements (icons, spans) also appear white */
button *,
.btn *,
a.btn *,
input[type="button"] *,
input[type="submit"] *,
input[type="reset"] *,
.label *,
.badge * {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Keep white text on hover/focus/active states */
button:hover,
.btn:hover,
a.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.label:hover,
.badge:hover,
.btn:focus,
.btn:active {
    color: #ffffff !important;
}
