:root {
    --green-default: #76bc43;
    --green-hover: #5b9133;
    --green-disabled: #c8f0aa;
    --green-link-hover: #749b00;
    --turquoise-default: #07afaa;
    --turquoise-hover: #059c97;
    --orange-default: #EB7924;
    --orange-hover: #D16C1F;
    --cyan-default: #0dc79f;
    --cyan-hover: #0bb08c;
    --blue-default: #002856;
    --blue-text: #204876;
    --blue-hover: #012247;
    --blue-darker-text: #06475f;
    --grey-text: #818181;
    --red-default: #f44336;
    --red-hover: #c1342a;
    --datatable-row-hover: #8bc34a;
    --datatable-row-text-hover: #ffffff;
    --datatable-row-warning: #ffeb3b;
    --datatable-row-warning-hover: #ccbc2f;
    --datatable-row-conflict: #ff9800;
    --datatable-row-conflict-hover: #cc7900;
    --navbar-bg-dark: #343a40;
    --dark: #282828;
    --dark-hover: #505050;
    --green-checkbox-default: #76bc43;
    --red-checkbox-default: #f44336;
    --hero: #22ABAB;
    --hero-hover: #147878;
    --cp-main: #C7212F;
    --cp-main-text: #FFFFFF;
    --cp-secondary: #FDFCFB;
    --cp-secondary-text: #0E161D;
    --cp-action: #C7212F;
    --cp-action-text: #FFFFFF;
    --cp-header: #181F26;
    --cp-header-text: #FDFCFB;
    --cp-background: #EDEDED;
    --cp-main-hover: color-mix(in srgb, var(--cp-main) 80%, black);
    --cp-action-hover: color-mix(in srgb, var(--cp-action) 80%, black);
    --cp-secondary-hover: color-mix(in srgb, var(--cp-secondary) 80%, black);
    --cp-chevron-up: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M241 130.5l194.3 194.3c9.4 9.4 9.4 24.6 0 33.9l-22.7 22.7c-9.4 9.4-24.5 9.4-33.9 0L224 227.5 69.3 381.5c-9.4 9.3-24.5 9.3-33.9 0l-22.7-22.7c-9.4-9.4-9.4-24.6 0-33.9L207 130.5c9.4-9.4 24.6-9.4 33.9 0z"/></svg>');
}

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    height: 100%;
}

.page {
    height: 100%;
    margin: 0;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.builderText {
    text-shadow: 1px 1px 5px rgba(31, 31, 31, 0.2);
}

.builderpage-header {
    margin-bottom: 24px;
}

.customer-page-container {
    max-width: 1200px;
    margin: 30px auto;
    padding: 20px;
    background-color: var(--cp-secondary);
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.page-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 10px 20px 10px;
}

    .page-header h2 {
        font-size: 1.75rem;
        font-weight: 700;
    }

#tile-container {
    margin-top: 10px;
    max-width: 1720px;
}

    #tile-container h2 {
        margin: 22px 0px 17px 0px;
    }

    #tile-container a,
    #tile-container a:visited,
    #tile-container a:link {
        text-decoration: none;
        color: white;
    }

    #tile-container .tile {
        display: block;
        height: 200px;
        color: #fff;
        position: relative;
        padding: 25px;
        margin: 0px auto 10px auto;
        border-radius: 8px;
        box-shadow: 0px 5px 5px 2px lightgrey;
        background-color: var(--green-default);
    }

        #tile-container .tile .dashtile-top {
            height: 50%;
            padding: 5px 15px;
            padding-left: 0px;
        }

            #tile-container .tile .dashtile-top .dash-icon {
                font-size: 42px;
                max-width: 140px;
            }

            #tile-container .tile .dashtile-top .count {
                font-size: 48px;
                display: inline-block;
                float: right;
            }

        #tile-container .tile:hover {
            transform: translateY(3px);
            box-shadow: 0px 2px 3px 2px lightgrey;
        }

        #tile-container .tile.turquoise {
            background-color: var(--turquoise-default);
        }

            #tile-container .tile.turquoise:hover {
                background-color: var(--turquoise-hover);
            }

        #tile-container .tile.green {
            background-color: var(--green-default);
        }

            #tile-container .tile.green:hover {
                background-color: var(--green-hover);
            }

        #tile-container .tile.blue {
            background-color: var(--blue-default);
        }

            #tile-container .tile.blue:hover {
                background-color: var(--blue-hover);
            }

        #tile-container .tile.red {
            background-color: var(--red-default);
        }

            #tile-container .tile.red:hover {
                background-color: var(--red-hover);
            }

        #tile-container .tile.orange {
            background-color: var(--orange-default);
        }

            #tile-container .tile.orange:hover {
                background-color: var(--orange-hover);
            }

        #tile-container .tile.cyan {
            background-color: var(--cyan-default);
        }

            #tile-container .tile.cyan:hover {
                background-color: var(--cyan-hover);
            }

        #tile-container .tile.black {
            background-color: #061922;
        }

            #tile-container .tile.black:hover {
                background-color: #749B00;
            }

.nav-section {
    border-style: solid;
    border-radius: 8px;
    border-color: rgba(255, 255, 255, 0.3);
    border-width: 1px;
    margin: 6px 5px 5px 4px;
}

.nav-icon {
    margin-right: 8px;
}

.portalmenu-container {
    left: unset !important;
}

.searchbar {
    float: right;
    margin: 10px 0px;
}

.col-header-content {
    background-color: #434d4e;
    padding: 10px 5px;
}

.col-title-text {
    color: white;
}

.quickgrid tr {
    height: 45px;
    padding: 5px;
}

.quickgrid tbody tr:nth-child(odd) {
    background-color: #edebeb;
}

.cp-bg {
    max-width: 100%;
    background-color: var(--cp-background) !important;
}

.cp-bg-main {
    background-color: var(--cp-main) !important;
}

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

.cp-bg-action {
    background-color: var(--cp-action) !important;
}

.cp-bg-header {
    background-color: var(--cp-header) !important;
}

.cp-text-main {
    color: var(--cp-main-text);
}

.cp-text-secondary {
    color: var(--cp-secondary-text);
}

.cp-text-action {
    color: var(--cp-action-text);
}

.cp-text-header {
    color: var(--cp-header-text)
}

.cp-main {
    background-color: var(--cp-main);
    color: var(--cp-main-text);
}

.cp-secondary {
    background-color: var(--cp-secondary);
    color: var(--cp-secondary-text);
}

.cp-action {
    background-color: var(--cp-action);
    color: var(--cp-action-text);
}

.cp-header {
    background-color: var(--cp-header);
    color: var(--cp-header-text);
}

.progress-bar {
    background-color: var(--cp-main-text) !important;
}

.far.fa-circle, .fas.fa-circle {
    color: var(--cp-main);
}

.home-list-widget h4 {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1.5rem;
    color: #000;
    border-bottom: 2px solid var(--cp-main);
    display: inline-block;
    padding-bottom: 5px;
}

ul.cp-list-group > li.list-group-item {
    border-color: var(--cp-main);
}

.cp-list-group .list-group-item {
    background-color: var(--cp-secondary) !important;
    border: none;
}

    .cp-list-group .list-group-item a {
        color: var(--cp-main);
    }

.upcoming-activities-widget,
.project-gallery-widget,
.home-list-widget {
    background-color: var(--cp-secondary) !important;
    color: var(--cp-secondary-text) !important;
    margin-bottom: 16px;
}

.tile-title {
    color: var(--cp-secondary-text) !important;
}

.home-list-widget,
.home-list-widget .list-group-item,
.home-list-widget .list-group-item div,
.home-list-widget .list-group-item span,
.home-list-widget .list-group-item a {
    color: var(--cp-secondary-text) !important;
}

.cp-action-icon {
    color: var(--cp-action) !important;
}

.cp-action-btn {
    background-color: var(--cp-action) !important;
    color: var(--cp-action-text) !important;
    border: none;
    text-decoration: none;
}

.dropdown-item.active {
    background-color: var(--cp-action) !important;
    color: var(--cp-action-text) !important;
}

.cp-table thead {
    background-color: var(--cp-primary);
    color: var(--cp-primary-text) !important;
}

    .cp-table thead th,
    .cp-table thead .col-title-text,
    .cp-table thead .col-title {
        color: var(--cp-primary-text) !important;
    }

.modern-quickgrid thead {
    background-color: var(--cp-primary) !important;
    color: var(--cp-primary-text) !important;
}

    .modern-quickgrid thead .col-title-text,
    .modern-quickgrid thead .col-title,
    .modern-quickgrid thead th {
        color: var(--cp-primary-text) !important;
    }

table.cp-table tr:has(td:first-child:empty) {
    display: none;
}

table.cp-table td {
    vertical-align: middle;
}

table.cp-table th {
    background-color: var(--cp-main) !important;
}

    table.cp-table th .col-title {
        padding-left: unset !important;
    }

    table.cp-table th div.col-header-content,
    table.cp-table th:has(button.col-title:hover),
    table.cp-table th button.col-title:hover {
        background-color: var(--cp-main) !important;
        color: var(--cp-main-text) !important;
    }

    table.cp-table th div.col-header-content {
        padding-left: unset;
        padding-right: unset;
    }

    table.cp-table th button.col-title div.sort-indicator {
        margin-left: auto;
    }

    table.cp-table th.col-sort-asc button.col-title div.sort-indicator,
    table.cp-table th.col-sort-desc button.col-title div.sort-indicator {
        background-image: var(--cp-chevron-up);
    }

.dropdown-caret-none:after {
    content: none !important;
}

div.cp-accordion .accordion-button {
    background-color: var(--cp-main);
    color: var(--cp-main-text);
    box-shadow: none;
    border: 1px solid var(--cp-main-border, #ddd);
}

    div.cp-accordion .accordion-button:not(.collapsed) {
        background-color: var(--cp-main);
        color: var(--cp-main-text);
    }

    div.cp-accordion .accordion-button:focus {
        box-shadow: none;
    }

    div.cp-accordion .accordion-button::after {
        filter: invert(0.5);
    }

div.cp-accordion .accordion-body {
    background-color: #fff;
    color: #000;
    border-top: 1px solid var(--cp-main-border, #ddd);
}

button.cp-btn {
    background-color: var(--cp-action);
    color: var(--cp-action-text);
}

    button.cp-btn:hover {
        background-color: var(--cp-action-hover);
        color: var(--cp-action-text);
    }

    button.cp-btn:focus {
        box-shadow: 0 0 0 0.1rem var(--cp-background), 0 0 0 0.25rem var(--cp-action-hover)
    }

button.cp-btn-outline {
    color: var(--cp-action);
    border-color: var(--cp-action);
}

    button.cp-btn-outline:hover {
        background-color: var(--cp-action);
        color: var(--cp-action-text);
    }

    button.cp-btn-outline:focus {
        box-shadow: 0 0 0 0.1rem var(--cp-background), 0 0 0 0.25rem var(--cp-action-hover)
    }

button.cp-btn-secondary {
    background-color: var(--cp-secondary);
    color: var(--cp-secondary-text);
}

    button.cp-btn-secondary:hover {
        background-color: var(--cp-secondary-hover);
        color: var(--cp-secondary-text);
    }

    button.cp-btn-secondary:focus {
        box-shadow: 0 0 0 0.1rem var(--cp-background), 0 0 0 0.25rem var(--cp-secondary-hover)
    }

button.cp-btn-secondary-outline {
    color: var(--cp-secondary);
    border-color: var(--cp-secondary);
}

    button.cp-btn-secondary-outline:hover {
        background-color: var(--cp-secondary);
        color: var(--cp-secondary-text);
    }

div.cp-card {
    border-radius: 8px !important;
    overflow: hidden;
    border: 1px solid #e6eedc;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    margin-bottom: 1.5rem;
}

    div.cp-card .card-header {
        background-color: var(--cp-main) !important;
        border-bottom: none;
        padding: 1.25rem;
    }

        div.cp-card .card-header h4 {
            color: var(--cp-main-text);
            font-weight: 600;
            margin-bottom: 0;
        }

    div.cp-card .card-body {
        padding: 1.5rem !important;
        background-color: #fff;
    }

ul.cp-nav .nav-item .nav-link {
    color: var(--cp-action);
    border: none;
    padding: 0.75rem 1.5rem;
    font-weight: 500;
    transition: all 0.2s;
}

    ul.cp-nav .nav-item .nav-link:hover {
        color: var(--cp-action-hover);
        border: none;
    }

    ul.cp-nav .nav-item .nav-link.active {
        color: var(--cp-action-hover);
        background-color: transparent;
        border: none;
        border-bottom: 3px solid var(--cp-action-hover);
        font-weight: 600;
    }

ul.cp-nav-secondary .nav-item .nav-link {
    color: var(--cp-secondary);
    border: 1px solid var(--cp-secondary);
    margin-right: .25em;
}

    ul.cp-nav-secondary .nav-item .nav-link:hover {
        color: var(--cp-secondary-text);
        background-color: var(--cp-secondary-hover);
        border: 1px solid var(--cp-secondary-hover);
    }

    ul.cp-nav-secondary .nav-item .nav-link.active {
        color: var(--cp-secondary-text);
        background-color: var(--cp-secondary);
    }

@media(min-width: 1600px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1440px !important;
    }
}

@media(min-width: 1800px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1550px !important;
    }
}

@media(min-width: 2000px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1620px !important;
    }
}

@media(min-width: 2200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1720px !important;
    }
}

@media(min-width: 2400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1820px !important;
    }
}

@media(min-width: 2500px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1920px !important;
    }
}

@media(min-width: 2700px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 2120px !important;
    }
}

.blazored-toast-container {
    z-index: 1100 !important;
    position: fixed !important;
}

    .blazored-toast-container.blazored-toast-top-right {
        top: 80px !important;
        right: 15px !important;
    }

    .blazored-toast-container.blazored-toast-top-left {
        top: 80px !important;
        left: 15px !important;
    }

    .blazored-toast-container.blazored-toast-top-center {
        top: 80px !important;
    }

.blazored-toast {
    z-index: 1101 !important;
}

@media (max-width: 1199px) {
    .blazored-toast-container {
        z-index: 1100 !important;
        position: fixed !important;
    }

    .blazored-toast {
        z-index: 1101 !important;
    }
}

.accordion-button:not(.collapsed) {
    color: var(--cp-main-text) !important;
    background-color: var(--cp-main) !important;
}