.smox-brand-logo {
    display: block;
    height: 34px;
    object-fit: contain;
    width: auto;
}

:root {
    --smox-blue: #ffffff;
    --smox-gray: #414141;
    --smox-link-blue: #005099;
}

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"],
[data-menu-theme="light"],
[data-menu-theme="dark"] {
    --tblr-primary: var(--smox-link-blue);
    --tblr-primary-rgb: 0, 80, 153;
    --tblr-link-color: var(--smox-link-blue);
    --tblr-link-color-rgb: 0, 80, 153;
    --tblr-link-hover-color: #003f78;
    --tblr-link-hover-color-rgb: 0, 63, 120;
    --tblr-tabler: var(--smox-link-blue);
    --tblr-tabler-rgb: 0, 80, 153;
}

.btn-primary,
.btn-outline-primary,
.btn-check:checked + .btn-primary,
.btn-check:active + .btn-primary,
.btn-primary:disabled,
.btn-primary.disabled,
.show > .btn-primary.dropdown-toggle {
    --bs-btn-active-bg: var(--smox-gray);
    --bs-btn-active-border-color: var(--smox-gray);
    --bs-btn-active-color: var(--smox-blue);
    --bs-btn-bg: var(--smox-gray);
    --bs-btn-border-color: var(--smox-gray);
    --bs-btn-color: var(--smox-blue);
    --bs-btn-disabled-bg: var(--smox-gray);
    --bs-btn-disabled-border-color: var(--smox-gray);
    --bs-btn-disabled-color: var(--smox-blue);
    --bs-btn-hover-bg: var(--smox-gray);
    --bs-btn-hover-border-color: var(--smox-gray);
    --bs-btn-hover-color: var(--smox-blue);
    --tblr-btn-active-bg: var(--smox-gray);
    --tblr-btn-active-border-color: var(--smox-gray);
    --tblr-btn-active-color: var(--smox-blue);
    --tblr-btn-bg: var(--smox-gray);
    --tblr-btn-border-color: var(--smox-gray);
    --tblr-btn-color: var(--smox-blue);
    --tblr-btn-disabled-bg: var(--smox-gray);
    --tblr-btn-disabled-border-color: var(--smox-gray);
    --tblr-btn-disabled-color: var(--smox-blue);
    --tblr-btn-hover-bg: var(--smox-gray);
    --tblr-btn-hover-border-color: var(--smox-gray);
    --tblr-btn-hover-color: var(--smox-blue);
    background-color: var(--smox-gray) !important;
    background-image: none !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: var(--smox-blue) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.show > .btn-outline-primary.dropdown-toggle {
    background-color: var(--smox-gray) !important;
    background-image: none !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: var(--smox-blue) !important;
    filter: none !important;
}

.btn-primary .la,
.btn-primary .las,
.btn-primary .lar,
.btn-primary .lab,
.btn-outline-primary .la,
.btn-outline-primary .las,
.btn-outline-primary .lar,
.btn-outline-primary .lab {
    color: inherit !important;
}

[bp-button="create"].btn-primary,
[bp-button="create"].btn-outline-primary {
    background-color: var(--smox-gray) !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

[bp-button="create"].btn-primary:hover,
[bp-button="create"].btn-primary:focus,
[bp-button="create"].btn-primary:active,
[bp-button="create"].btn-outline-primary:hover,
[bp-button="create"].btn-outline-primary:focus,
[bp-button="create"].btn-outline-primary:active {
    background-color: var(--smox-link-blue) !important;
    border-color: var(--smox-link-blue) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

.crud-table a:not(.btn),
.crud-table a.text-primary,
.crud-table .text-primary:not(.btn),
.crud-table .scheduler-compact-link,
.crud-table .scheduler-run-link,
.crud-table .run-pipeline-link,
.crud-table .llm-backend-pipeline-link,
.crud-table .pipeline-index-link,
.crud-table .pipeline-prompt-link {
    color: var(--smox-link-blue) !important;
}

.crud-table a:not(.btn):hover,
.crud-table a.text-primary:hover,
.crud-table .scheduler-compact-link:hover,
.crud-table .scheduler-run-link:hover,
.crud-table .run-pipeline-link:hover,
.crud-table .llm-backend-pipeline-link:hover,
.crud-table .pipeline-index-link:hover,
.crud-table .pipeline-prompt-link:hover {
    color: var(--smox-link-blue) !important;
}

.crud-table [bp-button="update"],
.crud-table [bp-button="update"] i,
.crud-table .friendly-row-edit-button,
.crud-table .friendly-row-edit-button i,
.crud-table [data-scheduler-edit-modal-trigger],
.crud-table [data-scheduler-edit-modal-trigger] i,
.crud-table [data-run-edit-modal-trigger],
.crud-table [data-run-edit-modal-trigger] i,
.crud-table [data-llm-backend-edit-modal-trigger],
.crud-table [data-llm-backend-edit-modal-trigger] i,
.crud-table [data-data-pool-edit-modal-trigger],
.crud-table [data-data-pool-edit-modal-trigger] i,
.crud-table [data-api-key-edit-modal-trigger],
.crud-table [data-api-key-edit-modal-trigger] i,
.crud-table [data-prompt-edit-modal-trigger],
.crud-table [data-prompt-edit-modal-trigger] i,
.crud-table [data-pipeline-edit-modal-trigger],
.crud-table [data-pipeline-edit-modal-trigger] i,
.crud-table [data-index-edit-modal-trigger],
.crud-table [data-index-edit-modal-trigger] i,
.crud-table [data-chat-edit-modal-trigger],
.crud-table [data-chat-edit-modal-trigger] i,
.crud-table [data-space-edit-modal-trigger],
.crud-table [data-space-edit-modal-trigger] i,
.crud-table [data-source-type-edit-modal-trigger],
.crud-table [data-source-type-edit-modal-trigger] i,
.crud-table [data-source-edit-modal-trigger],
.crud-table [data-source-edit-modal-trigger] i,
.crud-table [data-role-edit-modal-trigger],
.crud-table [data-role-edit-modal-trigger] i,
.crud-table [data-permission-edit-modal-trigger],
.crud-table [data-permission-edit-modal-trigger] i,
.crud-table td:last-child a[href$="/edit"] .la-edit,
.crud-table td:last-child a[href*="/edit?"] .la-edit,
.llm-config-modal .llm-config-edit-action,
.llm-config-modal .llm-config-edit-action i {
    color: var(--smox-link-blue) !important;
}

.pagination .page-link,
.dataTables_paginate .pagination .page-link,
.dt-paging .dt-paging-button {
    color: var(--smox-gray) !important;
}

.pagination .page-item.active .page-link,
.pagination .active > .page-link,
.dataTables_paginate .pagination .page-item.active .page-link,
.dt-paging .dt-paging-button.current,
.dt-paging .dt-paging-button.current:hover {
    --bs-pagination-active-bg: var(--smox-gray);
    --bs-pagination-active-border-color: var(--smox-gray);
    --bs-pagination-active-color: #ffffff;
    --tblr-pagination-active-bg: var(--smox-gray);
    --tblr-pagination-active-border-color: var(--smox-gray);
    --tblr-pagination-active-color: #ffffff;
    background-color: var(--smox-gray) !important;
    background-image: none !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

.navbar-vertical .navbar-nav .nav-link.active,
.navbar-vertical .navbar-nav .nav-item.active > .nav-link,
.navbar-vertical .navbar-nav .dropdown-item.nav-link.active,
aside.navbar-vertical a.nav-link.active,
aside.navbar-vertical a.nav-link.active:hover {
    background-color: var(--smox-gray) !important;
    background-image: none !important;
    border-left: 0 !important;
    border-left-color: var(--smox-link-blue) !important;
    border-inline-start: 0 !important;
    box-shadow: inset 3px 0 0 var(--smox-link-blue) !important;
    color: #ffffff !important;
    filter: none !important;
    font-weight: 600;
    opacity: 1 !important;
    overflow: hidden;
    position: relative;
}

.navbar-vertical .navbar-nav .nav-link.active::before,
.navbar-vertical .navbar-nav .nav-item.active > .nav-link::before,
.navbar-vertical .navbar-nav .dropdown-item.nav-link.active::before,
aside.navbar-vertical a.nav-link.active::before {
    background-color: var(--smox-link-blue) !important;
    border-color: var(--smox-link-blue) !important;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    width: 3px;
}

.navbar-vertical .navbar-nav .nav-link.active .nav-icon,
.navbar-vertical .navbar-nav .nav-item.active > .nav-link .nav-icon,
.navbar-vertical .navbar-nav .dropdown-item.nav-link.active .nav-icon {
    color: inherit !important;
}

[data-bs-theme="dark"] .navbar-vertical .navbar-nav .nav-link,
[data-bs-theme="dark"] .navbar-vertical .navbar-nav .dropdown-item.nav-link,
[data-menu-theme="dark"] .navbar-nav .nav-link,
[data-menu-theme="dark"] .navbar-nav .dropdown-item.nav-link {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .navbar-vertical .navbar-nav .nav-link .nav-icon,
[data-bs-theme="dark"] .navbar-vertical .navbar-nav .dropdown-item.nav-link .nav-icon,
[data-menu-theme="dark"] .navbar-nav .nav-link .nav-icon,
[data-menu-theme="dark"] .navbar-nav .dropdown-item.nav-link .nav-icon {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .crud-table thead th,
[data-bs-theme="dark"] .crud-table thead th *,
[data-bs-theme="dark"] .crud-table tfoot th,
[data-bs-theme="dark"] .crud-table tfoot th *,
[data-bs-theme="dark"] table.dataTable thead th,
[data-bs-theme="dark"] table.dataTable thead th *,
[data-bs-theme="dark"] table.dataTable tfoot th,
[data-bs-theme="dark"] table.dataTable tfoot th * {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .navbar-filters,
[data-bs-theme="dark"] .navbar-filters .nav-link,
[data-bs-theme="dark"] .navbar-filters .dropdown-toggle,
[data-bs-theme="dark"] .navbar-filters .dropdown-item,
[data-bs-theme="dark"] .navbar-filters .remove_filters_button,
[data-bs-theme="dark"] .navbar-filters .la,
[data-bs-theme="dark"] .navbar-filters .select2-selection__rendered,
[data-bs-theme="dark"] .navbar-filters .select2-selection__placeholder,
[data-bs-theme="dark"] .dataTables_filter,
[data-bs-theme="dark"] .dataTables_filter label,
[data-bs-theme="dark"] .dataTables_filter input,
[data-bs-theme="dark"] .dt-search,
[data-bs-theme="dark"] .dt-search label,
[data-bs-theme="dark"] .dt-search input {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .dataTables_filter input::placeholder,
[data-bs-theme="dark"] .dt-search input::placeholder,
[data-bs-theme="dark"] .navbar-filters input::placeholder {
    color: #ffffff !important;
    opacity: 1;
}

.modal .modal-footer .btn-primary:hover,
.modal .modal-footer .btn-primary:focus,
.modal .modal-footer .btn-primary:active {
    background-color: var(--smox-link-blue) !important;
    border-color: var(--smox-link-blue) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

.modal .modal-footer .btn {
    align-items: center !important;
    display: inline-flex !important;
    gap: 7px !important;
    justify-content: center !important;
}

.modal .modal-footer .btn-primary:hover .la,
.modal .modal-footer .btn-primary:focus .la,
.modal .modal-footer .btn-primary:active .la,
.modal .modal-footer .btn-primary:hover .las,
.modal .modal-footer .btn-primary:focus .las,
.modal .modal-footer .btn-primary:active .las {
    color: #ffffff !important;
}

.modal .modal-footer .btn-outline-secondary:hover,
.modal .modal-footer .btn-outline-secondary:focus,
.modal .modal-footer .btn-secondary:hover,
.modal .modal-footer .btn-secondary:focus {
    background-color: #ffffff !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: var(--smox-gray) !important;
}

.modal .modal-footer .btn-outline-secondary:hover .la,
.modal .modal-footer .btn-outline-secondary:focus .la,
.modal .modal-footer .btn-secondary:hover .la,
.modal .modal-footer .btn-secondary:focus .la,
.modal .modal-footer .btn-outline-secondary:hover .las,
.modal .modal-footer .btn-outline-secondary:focus .las,
.modal .modal-footer .btn-secondary:hover .las,
.modal .modal-footer .btn-secondary:focus .las {
    color: var(--smox-gray) !important;
}

[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:hover,
[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:focus,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:hover,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:focus {
    background-color: var(--smox-gray) !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:hover .la,
[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:focus .la,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:hover .la,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:focus .la,
[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:hover .las,
[data-bs-theme="dark"] .modal .modal-footer .btn-outline-secondary:focus .las,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:hover .las,
[data-bs-theme="dark"] .modal .modal-footer .btn-secondary:focus .las {
    color: #ffffff !important;
}

.swal-button--cancel,
.swal-button--cancel.bg-secondary,
.swal-button.bg-secondary.swal-button--cancel {
    background-color: var(--smox-gray) !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

.swal-button--cancel:hover,
.swal-button--cancel:focus,
.swal-button--cancel:active,
.swal-button--cancel.bg-secondary:hover,
.swal-button--cancel.bg-secondary:focus,
.swal-button--cancel.bg-secondary:active,
.swal-button.bg-secondary.swal-button--cancel:hover,
.swal-button.bg-secondary.swal-button--cancel:focus,
.swal-button.bg-secondary.swal-button--cancel:active {
    background-color: var(--smox-gray) !important;
    border-color: var(--smox-gray) !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .smox-brand-logo {
    content: url("/images/smox-logo-dark.png");
}

@media (prefers-color-scheme: dark) {
    [data-bs-theme="system"] .smox-brand-logo {
        content: url("/images/smox-logo-dark.png");
    }
}
