.btn-secondary {
    --bs-btn-active-bg: #3F328C;
    --bs-btn-background: #7D6FE8;
}

.accordion {
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2336b3ac'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/*Style overrides for theme*/
.pagination .page-item.active .page-link {
    background-color: var(--tog-primary-color) !important;
}

.form-switch .form-check-input:checked {
    background-color: var(--tog-primary-color) !important;
    border-color: var(--tog-primary-color) !important;
}

.pagination .page-item .page-link:hover, .pagination .page-item .page-link:focus, .pagination .page-item .page-link:active {
    color: var(--tog-primary-color) !important;
}

select.form-select option:checked, select.form-select option:focus, select.form-select option:active {
    background: var(--tog-primary-color) !important;
}

.form-check-input:checked {
    background-color: var(--tog-primary-color) !important;
    border-color: var(--tog-primary-color) !important;
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: var(--tog-primary-color) !important;
    border-color: var(--tog-primary-color) !important;
}

.step-active .step-circle {
    background-color: var(--tog-primary-color);
    border-color: var(--tog-primary-color);
}

.step-active .step-text {
    color: var(--tog-primary-color);
}

.step-active .step-circle::before {
    color: var(--tog-primary-color);
}

.dropdown-item.active, .dropdown-item:active {
    color: white;
    background-color: var(--tog-primary-color);
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: white;
    background-color: var(--tog-primary-color);
}

.list-group-item.active {
    z-index: 2;
    color: black;
    background-color: #c0fffb;
    border-color: var(--tog-primary-color);
}

.lpx-footbar-container .lpx-footbar .lpx-footbar-copyright a:hover {
    color: var(--tog-primary-color);
}

.lpx-mobile-hamburger {
    background: var(--tog-primary-color);
}

.lpx-mobile-nav-tab a:hover i {
    color: var(--tog-primary-color);
}

.lpx-mobile-menu {
    bottom: 80px;
    height: calc(100vh - 80px);
}

@media (max-width: 767px) {
    .nav-tabs .nav-item {
        width: 100%;
    }

    .page-item > .form-select {
        display: none;
    }
}

.b-table.table tbody th, .b-table.table tbody td {
    padding: 0.25rem !important;
    vertical-align: middle;
}

.b-table.table thead th, .b-table.table thead td {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.btn {
    font-size: 0.875em !important;
    padding: 0.375rem 0.5rem !important;
}

.table-responsive .dropdown-menu {
    position: static !important;
}

.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--tog-primary-color);
    border-color: var(--tog-primary-color);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
}

div#lpx-sidebar {
    overflow: hidden !important;
}

nav.lpx-nav {
    overflow: auto !important;
}

.ps {
    overflow: initial !important;
}

.ps__rail-y {
    display: none !important;
}

.radar-spinner .circle-inner {
    border-left-color: var(--tog-primary-color);
    border-right-color: var(--tog-primary-color);
}

.loading-container {
    z-index: 5000;
    width: 100vw;
    height: 100%;
}

.loading-container i {
    color: white;
}

.loading-overlay .radar-spinner {
    position: fixed;
    top: 30%;
    height: 120px;
    width: 120px;
}

.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1030;
    width: 100%;
    height: 100%;
}

.rz-multiselect .rz-placeholder, .rz-dropdown .rz-placeholder {
    color: initial !important;
}

.rz-multiselect-trigger .rzi-chevron-down:before, .rz-dropdown-trigger .rzi-chevron-down:before {
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 20'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.25rem center;
    background-size: 16px 12px;
}

.rz-multiselect, .rz-dropdown {
    background-color: #f5f5f7;
    border-radius: 0.5rem;
    transition: background-color 0.2s, border-color 0.4s;
    border-color: #e7e9ec;
    color: #161616;
    display: block;
}

.is-invalid:not(.form-check-input) {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23c00d49'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23c00d49' stroke='none'/%3e%3c/svg%3e") !important;
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(1.75em + 1.675rem) calc(1.75em + 1.675rem);
    border-color: #c00d49 !important;
}

.profile-card {
    display: flex;
    justify-content: center;
    align-items: center;
    border: solid 1px rgba(173, 216, 230, 0.5);
}

.profile-image {
    height: 210px;
}

.is-valid:not(.form-check-input) {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%234fbf67' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(0.75em + 0.675rem) calc(0.75em + 0.675rem);
    border-color: #4fbf67 !important;
}

/* Radzen Validation Classes */
.rz-dropdown.is-invalid {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23c00d49'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23c00d49' stroke='none'/%3e%3c/svg%3e");
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(1.75em + 1.675rem) calc(1.75em + 1.675rem);
    border-color: #c00d49 !important;
}

.rz-multiselect.is-invalid {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23c00d49'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23c00d49' stroke='none'/%3e%3c/svg%3e");
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(1.75em + 1.675rem) calc(1.75em + 1.675rem);
    border-color: #c00d49 !important;
}

.rz-multiselect.is-valid {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%234fbf67' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(0.75em + 0.675rem) calc(0.75em + 0.675rem);
    border-color: #4fbf67 !important;
}

.rz-dropdown.is-valid {
    padding-right: 6.975rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%234fbf67' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-position: right 2.85rem center, center right 3.75rem;
    background-repeat: no-repeat;
    background-size: 22px 90px, calc(0.75em + 0.675rem) calc(0.75em + 0.675rem);
    border-color: #4fbf67 !important;
}

/* END Radzen Validation Classes */

.background-sync-container {
    position: relative;
    display: flex;
    height: 15px;
    width: 15px;
}

.background-sync-ping {
    animation: ping 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    position: absolute;
    display: inline-flex;
    height: 100%;
    width: 100%;
    border-radius: 9999px;
    background-color: var(--tog-primary-color);
    opacity: 0.75;
}

.background-sync-static {
    position: relative;
    display: inline-flex;
    border-radius: 9999px;
    height: 15px;
    width: 15px;
    background-color: var(--tog-primary-color);
}

.animate-ping {
    animation: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
}

@keyframes ping {
    75%, 100% {
        transform: scale(2);
        opacity: 0;
    }
}

.monaco-editor-container {
    height: 500px;
    border: 1px solid gray;
}

.lpx-theme-dark .form-check-input {
    border-color: var(--lpx-navbar-text-color) !important;
}

.tree-view-selected-item-background {
    background: rgba(0, 0, 255, 0.25) !important;
}

.select-none {
    user-select: none !important;
}

.pl-2 {
    padding-left: 0.75rem;
}

.form-data-import-radio-option {
    display: flex;
}

.form-data-import-radio-option > div {
    border: 1px solid var(--bs-light);
    border-radius: var(--bs-border-radius);
    padding: 3px 5px 3px 2rem;
}

.form-check.form-check-inline > input[type="radio"] {
    align-self: center;
}

.form-check.form-check-inline > label[class="form-check-label"] {
    align-self: center;
    padding-left: 0.25rem;
}

.accordion-button:not(.collapsed) {
    color: var(--tog-primary-color) !important;
}

.table-responsive .form-select {
    min-width: 300px;
}

.table-responsive .form-control {
    min-width: 300px;
}

.pwa-updater {
    --pwa-updater-font-size: 13px;
    --pwa-updater-font-family: sans-serif;
    --pwa-updater-bar-height: auto;
    --pwa-updater-bar-color: white;
    --pwa-updater-bar-backcolor: forestgreen;
    --pwa-updater-bar-z-index: 9999;
}

.pwa-updater {
    background-color: var(--pwa-updater-bar-backcolor);
    color: var(--pwa-updater-bar-color);
    padding: 0 12px;
    position: fixed;
    left: 0;
    right: 0;
    z-index: var(--pwa-updater-bar-z-index);
    overflow: hidden;
    height: var(--pwa-updater-bar-height);
    line-height: var(--pwa-updater-bar-height);
    font-size: var(--pwa-updater-font-size);
    font-family: var(--pwa-updater-font-family);
    transition: top linear 0.5s, bottom linear 0.5s;
    display: flex;
    align-items: center;
}

.pwa-updater.align-top {
    top: calc(-1 * var(--pwa-updater-bar-height) - 1px);
}

.pwa-updater.align-bottom {
    bottom: calc(-1 * var(--pwa-updater-bar-height) - 1px);
}

.pwa-updater.align-top.visible {
    top: 0;
}

.pwa-updater.align-bottom.visible {
    bottom: 0;
}

.pwa-updater-updatenow-button {
    font-size: calc(var(--pwa-updater-font-size)* 0.9);
    font-family: var(--pwa-updater-font-family);
    background-color: transparent;
    color: var(--pwa-updater-bar-color);
    border: solid 2px #ffffff80;
    border-radius: 4px;
    height: calc(var(--pwa-updater-bar-height) - 4px);
    line-height: calc(var(--pwa-updater-bar-height) - 4px - 2px);
    padding: 0 8px;
    transition: background-color linear 0.2s;
    margin: 0 0 0 8px;
}

.pwa-updater-updatenow-button:hover {
    background-color: #ffffff40;
}

.pwa-updater-close-button {
    cursor: pointer;
    color: #ffffff80;
    transition: all linear 0.2s;
}

.pwa-updater-close-button:hover {
    color: #ffffff;
}

.page-item select {
    padding: .25rem .5rem; /* Adjust padding */
    font-size: .875rem; /* Adjust font size to small */
    min-width: 4rem;
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .b-table.table.table-mobile tbody th,
    .b-table.table.table-mobile tbody td {
        padding: 1.5rem !important; /* Adjust padding for mobile */
        vertical-align: top; /* Adjust vertical alignment for mobile */
    }
}

.cursor-grab {
    cursor: grab;
}

.step-drag-over .step-circle {
    background-color: var(--bs-blue);
    border-color: var(--bs-blue);
    color: white;
}

.step-drag-over .step-text {
    color: var(--bs-blue);
}

.dropdown > div.dropdown-menu {
    z-index: 9999;
}

.lpx-content {
    padding-bottom: 66px !important;
}

.table.table-ellipsis tbody td {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.lpx-mobile-hamburger {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50px !important;
    top: 0 !important;
}

.lpx-mobile-hamburger .hamburger-icon {
    width: 40px !important;
    height: 23px !important;
    margin: 8px auto !important;
}