﻿/**** Override theme colors *****/
:root,
[data-bs-theme=light] {
    --bs-app-header-primary-base-bg-color: #1a428a;
    --bs-primary: #1a428a;
    --bs-primary-active: #0e234a;
    --bs-primary-light: #E9F3FF;
    --bs-text-primary: #1a428a;
    --bs-secondary: #facd31;
    --bs-secondary-active: #f2bd06;
    --bs-secondary-inverse: var(--bs-gray-800);
    --bs-tertiary: #d71920;
    --bs-tertiary-active: #a91419;
    --bs-tertiary-inverse: #ffffff;
    --bs-success: #17C653;
    --bs-success-rgb: 23, 198, 83;
    --bs-success-light: #DFFFEA;
    --bs-success-active: #04B440;
    --bs-success-light: #DFFFEA;
    --bs-text-warning: #8A6C00;
    --bs-gray: #6c757d;
    --bs-gray-active: #565e64;
    --bs-gray-inverse: #fff;
    --bs-link-color: #1a428a;
    --bs-link-color-rgb: 26, 66, 138;
    --bs-link-hover-color: #0d6efd;
    --bs-link-hover-color-rgb: 13, 110, 253;
    --bs-menu-link-color-hover: var(--bs-link-hover-color);
    --bs-text-primary: #1361ED;
    --bs-btn-disabled-bg: #c9cdd0;
}

#app-logo .bi,
#app-logo i[class^=fonticon-],
#app-logo i[class*=" fonticon-"],
#app-logo i[class^=fa-],
#app-logo i[class*=" fa-"],
#app-logo i[class^=la-], i[class*=" la-"] {
    color: inherit; /* inherit style from parent #app-logo element */
}

.badge-gray {
    background: var(--bs-gray);
}

.form-check-input:not(.disabled) {
    border-color:darkgrey;
}

.form-check-input:disabled {
    border-color: lightgrey;
}

.alert-warning {
    color: #8A6C00;
} 

/* Override header heights */
@media (max-width: 991.98px) {
    [data-kt-app-header-primary-enabled=true] {
        --bs-app-header-primary-height: 50px;
    }
}

@media (min-width: 992px) {
    [data-kt-app-header-primary-enabled=true] {
        --bs-app-header-primary-height: 60px;
    }

    [data-kt-app-header-secondary-enabled=true] {
        --bs-app-header-secondary-height: 50px;
    }

    [data-kt-app-header-secondary-enabled=false] {
        --bs-app-header-secondary-height: 0;
    }
}

/* Override page container widths */
@media (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 97% !important;
    }
}


/* Header menu */

#app-logo {
    color: var(--bs-primary);
    font-family: Inter, Helvetica, sans-serif;
    font-weight: 900;
    font-size: 20px;
}

@media (min-width: 992px) {

     #app-logo {
         text-wrap: nowrap;
    }

    .app-header-secondary .header-menu .menu > .menu-item > .menu-link {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* stops the the menu-links from growing to the full length of the header menu */
    .header-menu .menu > .menu-item {
        flex-grow: 0 !important;
        flex-basis: auto !important;
    }


    .header-menu .menu > .menu-item .menu-link {
        padding-inline: 0; /* get rid of extra padding */
            border-right: 0; /* get rid of borders */
    }

    .header-menu .menu > .menu-item > .menu-link .menu-title {
        padding-right: 2.3rem; /* add padding to menu links */
    }

    .header-menu .menu > .menu-item:first-child > .menu-link .menu-title {
        padding-left: 2.3rem !important; /* re-add left padding that was removed from first child menu-link */
    }
    
    /* color of active menu link */
    .header-menu .menu > .menu-item.here > .menu-link .menu-text {
        color: var(--bs-gray-800)
    }

    /* line underneath active menu link */
    .header-menu .menu > .menu-item.here > .menu-link:after, .header-menu .menu > .menu-item > .menu-link.active:after {
        background-color: var(--bs-secondary);
    }
}

.scroll-y,
.hover-scroll-y,
.hover-scroll-overlay-y {
    overflow-y: auto; /* only show the scrollbar when it is needed */
}

/* Button Styles */

.swal2-popup .swal2-actions .btn {
    margin-top: 0;
}

.btn.btn-icon.btn-xs, .btn-group-xs > .btn.btn-icon {
    height: calc(1.5em + 1.1rem + 2px);
    width: calc(1.5em + 1.1rem + 2px);
}

.btn-xs, .btn-group-xs > .btn {
    --bs-btn-padding-y: 0.55rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 0.95rem;
    --bs-btn-border-radius: 0.425rem;
}

.btn:not(.btn-outline):not(.btn-dashed):not(.btn-bordered):not(.border-hover):not(.border-active):not(.btn-flush):not(.btn-icon):not(.btn-hover-outline).btn-xs,
.btn-group-xs > .btn:not(.btn-outline):not(.btn-dashed):not(.btn-bordered):not(.border-hover):not(.border-active):not(.btn-flush):not(.btn-icon):not(.btn-hover-outline) {
    padding: calc(.4rem + 1px) calc(.6rem + 1px);
}

.btn.btn-link {
    text-decoration: underline;
}

.btn.btn-gray {
    background-color: var(--bs-gray);
    color: #fff;
}

.btn-check:checked + .btn.btn-gray, .btn-check:active + .btn.btn-gray, .btn.btn-gray:focus:not(.btn-active), .btn.btn-gray:hover:not(.btn-active), .btn.btn-gray:active:not(.btn-active), .btn.btn-gray.active, .btn.btn-gray.show, .show > .btn.btn-gray {
    color: var(--bs-gray-inverse);
    border-color: var(--bs-gray-active);
    background-color: var(--bs-gray-active) !important;
}

.cc-btn-link.btn.btn-link {
    display: inline-block;
    padding-top: var(--bs-btn-padding-y);
    padding-bottom: var(--bs-btn-padding-y);
    padding-left: var(--bs-btn-padding-x) !important;
    padding-right: var(--bs-btn-padding-x) !important;
    text-decoration: none;
}

    .cc-btn-link.btn.btn-link:hover, .cc-btn-link.btn.btn-link:focus {
        text-decoration: underline;
        color: var(--bs-danger) !important;
    }

/* Trash icon hover - red */
.fa-trash-can:hover, a:hover .fa-trash-can, button:hover .fa-trash-can {
    color: var(--bs-danger) !important;
}

/* Pencil icon hover - primary blue */
.fa-pencil:hover, a:hover .fa-pencil, button:hover .fa-pencil {
    color: var(--bs-primary) !important;
}

.btn-check:checked + .btn.btn-outline.btn-outline-primary, .btn-check:active + .btn.btn-outline.btn-outline-primary, .btn.btn-outline.btn-outline-primary:focus:not(.btn-active),  .btn.btn-outline.btn-outline-primary:active:not(.btn-active), .btn.btn-outline.btn-outline-primary.active, .btn.btn-outline.btn-outline-primary.show, .show > .btn.btn-outline.btn-outline-primary {
    background-color: var(--bs-primary) !important;
    color: #fff;
}

.header-changelog-btn {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

.header-changelog-btn:hover,
.header-changelog-btn:focus,
.header-changelog-btn:active,
.header-changelog-btn.active,
.show > .header-changelog-btn {
    background-color: #313045 !important;
    border-color: #313045 !important;
    color: #fff !important;
}
