/* PLEX */
/*:root {
    --font-reading: 'IBM Plex Sans', sans-serif;
    --font-narrow: 'IBM Plex Sans Condensed', sans-serif;
    --font-mono: 'IBM Plex Mono', monospace;
    --font-serif: 'IBM Plex Serif', serif;
}*/

/* NOTO */
/*:root {
    --font-reading: 'Noto Sans', sans-serif;
    --font-narrow: 'Noto Sans Condensed', sans-serif;
    --font-mono: 'Noto Sans Mono', monospace;
    --font-serif: 'Noto Serif', serif;
}*/

/* CUSTOM */
:root {
    --font-reading: 'Mona Sans', sans-serif;
    --font-narrow: 'Mona Sans', sans-serif;
    --font-narrow-stretch: 92%;
    --font-mono: 'Chivo Mono', monospace;
    --font-serif: 'Noto Serif', serif;
    --font-size-small: 14px !important;
    --font-size-base: 16px !important;
    --font-size-large: 22px !important;
    --font-size-grid: 15px !important;
}

/* Syncfusion toolbar: make selected-count item look like informational text (not a button) */
.e-toolbar .e-toolbar-item.text-toolbar-item,
.e-toolbar .e-toolbar-item.text-toolbar-item .e-tbar-btn,
.e-toolbar .e-toolbar-item.text-toolbar-item .e-tbar-btn:hover,
.e-toolbar .e-toolbar-item.text-toolbar-item .e-tbar-btn:focus,
.e-toolbar .e-toolbar-item.text-toolbar-item .e-tbar-btn:active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

    .e-toolbar .e-toolbar-item.text-toolbar-item,
    .e-toolbar .e-toolbar-item.text-toolbar-item * {
        cursor: default;
    }

        .e-toolbar .e-toolbar-item.text-toolbar-item .selected-count-text {
            user-select: none;
            min-width: 135px;
        }

/* PT (ParaType) */
/*:root {
    --font-reading: 'PT Sans', sans-serif;
    --font-narrow: 'PT Sans Narrow', sans-serif;
    --font-mono: 'PT Mono', monospace;
    --font-serif: 'PT Serif', serif;
}*/

/* Conductor Combo */
/*:root {
    --font-reading: 'Inter', sans-serif;
    --font-narrow: 'Roboto Condensed', 'Arial Narrow', sans-serif;
    --font-mono: 'JetBrains Mono', 'Consolas', monospace;
    --font-serif: 'Lora', serif;
}*/

html.measure-layout {
    scrollbar-gutter: stable; /*only apply this on MeasureLayout.razor pages*/
}

body {
    font-family: var(--font-reading);
    font-size: var(--font-size-base);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
/* Apply IBM Plex Serif to your titles and Syncfusion dialog headers */
h1, h2, h3, h4, h5, h6,
.e-dialog .e-dlg-header {
    font-family: var(--font-serif) !important;
    /*font-weight: 600 !important;*/
}

    h1:focus, h2:focus, h3:focus, h4:focus, h5:focus, h6:focus {
        outline: none;
    }

[data-bs-theme="dark"] body {
    background-color: #1c1d26;
}

/* Dark mode variant for table-primary */
[data-bs-theme="dark"] .table-primary {
    --bs-table-bg: #0a3666; /* Darker primary shade */
    --bs-table-color: #e6f2ff;
    --bs-table-border-color: #144983;
}

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

.navbar-brand {
    font-family: var(--font-serif) !important;
}

.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: 0;
}

.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;
}

.dropdown-menu {
    font-size: 15px !important;
}

.font-size-small {
    font-size: var(--font-size-small);
}

.font-size-base {
    font-size: var(--font-size-base);
}

.font-size-grid {
    font-size: var(--font-size-grid);
}

.font-size-large {
    font-size: var(--font-size-large);
}

.measure-title {
    font-family: var(--font-serif);
    font-size: var(--font-size-large);
    font-weight: 600;
}

.e-control,
.e-popup,
.e-input-group,
.e-input-group .e-input,
.e-list-item {
    font-family: var(--font-reading) !important;
    /*font-stretch: var(--font-narrow-stretch);*/
    /*font-size: 16px !important;*/
}

.e-control, .e-css, .e-error {
    font-size: var(--font-size-grid);
}

.e-grid .e-headercelldiv {
    font-size: var(--font-size-base);
    font-weight: 600 !important;
}

.e-grid .e-headercell, .e-grid .e-detailheadercell {
    font-size: 18px !important;
    font-weight: 600 !important;
}

.e-input-group input.e-input, .e-input-group.e-control-wrapper input.e-input, .e-input-group textarea.e-input, .e-input-group.e-control-wrapper textarea.e-input, .e-input-group.e-small .e-input, .e-input-group.e-small.e-control-wrapper .e-input, .e-small .e-input-group .e-input, .e-small .e-input-group.e-control-wrapper .e-input {
    font-size: var(--font-size-base);
}

.e-headercell {
    font-stretch: 85%;
    font-size: 120% !important;
}

.e-btn, .e-css.e-btn, .btn {
    font-size: var(--font-size-small);
    font-weight: 400;
}

.e-grid {
    font-family: var(--font-narrow) !important;
    font-stretch: var(--font-narrow-stretch);
    font-size: var(--font-size-grid);
}

    .e-grid .e-rowcell {
        font-size: var(--font-size-grid);
    }

        .tabular-data,
        .e-grid .e-rowcell.tabular-data {
            font-variant-numeric: tabular-nums;
        }

/* global slim padding for inputs so they don't jump up in size when being edited */
.e-input-group,
.e-input-group.e-control-wrapper {
    min-height: 24px !important; /* default was big, like 30-35px */
    margin-bottom: 0 !important;
}
    /*force small height form inputs*/
    .e-input-group .e-input {
        height: 28px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    /*button not for textarea*/
    .e-input-group textarea.e-input {
        height: auto !important;
    }

    .e-input-group.header .e-input {
        height: 32px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
/* global slim dropdown items */
.e-dropdownbase .e-list-item {
    line-height: 24px !important;
    min-height: 24px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}
/* Grid Specific Tightening 
   Grids need specific row-height overrides because they calculate math */
.e-grid .e-rowcell,
.e-grid .e-headercell {
    /*font-family: var(--font-narrow) !important;*/
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    line-height: 28px !important;
}
    /* 1. The Container (The Blue Badge) */
    .e-grid .e-headercell .e-filtermenudiv.e-filtered {
        background-color: #0d6efd !important; /* Bootstrap Primary Blue */
        border-radius: 3px;
        /* Optional: centering fixes if the icon looks off-center */
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px; /* Force a consistent badge size */
        height: 18px;
    }
        /* 2. The Icon Itself (The White Funnel) - Target ::before directly */
        .e-grid .e-headercell .e-filtermenudiv.e-filtered::before {
            color: white !important;
        }
        /* 3. Optional: Hover state for the badge */
        .e-grid .e-headercell .e-filtermenudiv.e-filtered:hover {
            background-color: #0b5ed7 !important; /* Darker blue */
        }


.e-dialog .e-dlg-header {
    font-size: 22px;
}

.e-dialog .e-dlg-content {
    /*color: #CCC;*/
}

#EditUserDialog {
    height: 90vh !important;
    max-height: unset !important;
}

.e-toast-container .e-toast {
    width: 500px !important;
    max-width: 90vw;
    /* subtle dark border */
    border: 1px solid #d7d7d7 !important;
    /* add drop shadow */
    box-shadow: 0 20px 30px rgba(0,0,0,.43), 0 6px 6px rgba(0,0,0,0.53) !important;
    opacity: 1 !important;
}

.e-toast-message {
    word-break: keep-all; /* Prevents breaking words/emails in the middle */
}

/* grid toolbar button stuff */
.e-toolbar-item {
    margin-right: 5px;
}
/* add extra space after the "Delete" button so the save/cancel get pushed out a bit*/
.e-grid .e-toolbar-item button[aria-label="Delete"] {
    margin-right: 2em !important;
}

.e-toolbar-item.admin-grid-button button.e-tbar-btn .e-tbar-btn-text {
    font-size: 17px;
}

.e-toolbar-item.admin-grid-button button.e-tbar-btn .e-btn-icon {
    font-size: 17px;
    margin-bottom: 2px;
}
/*SAVE button*/
/* when the save changes button is active we want to show a border */
.e-toolbar .e-toolbar-item.admin-grid-button-update button {
    border: 2px solid transparent !important;
}
/*when e-overlay is not present, it's active*/
.e-toolbar .e-toolbar-item.admin-grid-button-update:not(.e-overlay) button {
    border-color: var(--color-sf-primary-bg-color) !important;
}
/*when e-overlay is present, we need a transparent border */
.e-toolbar .e-toolbar-item.admin-grid-button-update.e-overlay button {
    border-color: transparent !important;
    color: var(--color-sf-icon-color-disabled) !important;
}
/*CANCEL button*/
/* when the save changed button is active we want to show a border */
.e-toolbar .e-toolbar-item.admin-grid-button-cancel button {
    border: 2px transparent !important;
}
/*when e-overlay is not present, it's active*/
.e-toolbar .e-toolbar-item.admin-grid-button-cancel:not(.e-overlay) button {
    border-color: var(--color-sf-primary-bg-color) !important;
}
/*when e-overlay is present, we need a transparent border */
.e-toolbar .e-toolbar-item.admin-grid-button-cancel.e-overlay button {
    border-color: transparent !important;
    color: var(--color-sf-icon-color-disabled) !important;
}
/* force FontAwesome properties when used inside Syncfusion components */
.e-btn-icon.fa-solid,
.e-btn-icon.fa-regular,
.e-btn-icon.fa-light,
.e-btn-icon.fa-thin,
.e-btn-icon.fa-duotone,
.e-btn-icon.fa-brands,
.e-btn-icon.fa-sharp {
    /* force the correct font family */
    font-family: var(--fa-style-family, "Font Awesome 7 Sharp") !important;
    /* reset the content if Syncfusion tries to inject its own unicode */
    font-weight: 900 !important; /* Solid/Sharp usually needs 900 */
}
/* optional: fix vertical alignment compared to text */
/*.e-toolbar-item .e-btn-icon.fa-solid {
    line-height: inherit;
    vertical-align: middle;
}*/
/* --- FIX: make grid "display" checkboxes look active, not disabled --- */
/* reset opacity */
.e-grid .e-rowcell .e-checkbox-wrapper.e-checkbox-disabled .e-frame {
    opacity: 1 !important;
    cursor: pointer;
}
    /* force the "Checked" state to use the Theme Primary Color (Blue) */
    /* instead of the default "Disabled Gray" */
    .e-grid .e-rowcell .e-checkbox-wrapper.e-checkbox-disabled .e-frame.e-check {
        background-color: var(--color-sf-primary) !important;
        border-color: var(--color-sf-primary) !important;
        color: #fff !important;
    }
    /* ensure the "Unchecked" state has a visible border in Dark Mode */
    .e-grid .e-rowcell .e-checkbox-wrapper.e-checkbox-disabled .e-frame.e-uncheck {
        background-color: transparent !important;
        border-color: var(--color-sf-border) !important; /*Standard border grey */
    }
/* remove offset focus ring from grid cells */
/*.e-grid .e-rowcell:focus,
.e-grid .e-rowcell:focus-visible,
.e-grid .e-groupcaption:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}*/
/* border color change instead of using an outline/shadow */
/*.e-grid .e-rowcell.e-focused {*/
/* Use your theme primary color, or transparent if you want NO indicator */
/*box-shadow: inset 0 0 0 1px var(--color-sf-primary) !important;
}*/


.e-checkbox-wrapper:focus, .e-checkbox-wrapper.e-focus, .e-css.e-checkbox-wrapper:focus, .e-css.e-checkbox-wrapper.e-focus {
    box-shadow: none;
}

.e-grid .e-dialog.e-ccdlg {
    border: 1px solid #8888;
    width: 320px !important;
    top: 50px !important;
    left: calc(100vw - 380px) !important;
}

    .e-grid .e-dialog.e-ccdlg .e-cclist {
        padding: 0;
        line-height: 0;
    }

.e-dialog .e-dlg-header-content {
    padding: 10px;
}

.custom-grid-spinner.e-spinner-pane.e-spin-show {
    background-color: rgba(0, 0, 0, 0.3) !important;
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .custom-grid-spinner.e-spinner-pane.e-spin-show .e-spinner-inner .e-spin-label {
        font-size: 22px;
        font-weight: 600;
        color: #EEE;
    }

.e-btn .e-btn-icon, .e-css.e-btn .e-btn-icon {
    font-size: 15px !important;
    margin-top: 1px;
    width: 1.6em !important;
}

.e-toolbar .e-toolbar-item .e-tbar-btn .e-tbar-btn-text {
    font-size: 15px !important;
    padding-left: 0;
}

.measure-grid-container {
    height: 100%;
    /*height: calc(100vh - 140px);*/
    overflow: hidden;
}

    .measure-grid-container .flag-onhold {
    }

    .measure-grid-container .flag-onhold {
    }

    /* Force the native spinner to break out of the rows and cover the ENTIRE grid */
    .measure-grid-container .e-grid .e-spinner-pane {
        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: auto !important; /* override Syncfusion's inline math */
        width: auto !important;
        z-index: 9999 !important; /* Crucial: Keeps it above the headers/rows */

        background-image: linear-gradient(rgba(45, 85, 18, 0.05), rgba(255, 255, 255, 0.7)), url('assets-general/EEITreesTransparent.png') !important;
        /*background-color: rgb(45, 85, 18, 0.01) !important;*/
        background-repeat: repeat !important;
        background-position: top left, top left !important;
    }

        /* Scale up the actual spinning circle so it's impossible to miss */
        .measure-grid-container .e-grid .e-spinner-pane .e-spinner-inner {
            transform: scale(3) !important;
        }

    .measure-grid-container.suppress-native-grid-spinner .e-grid .e-spinner-pane {
        display: none !important;
    }

.admin-grid-container {
    height: calc(100vh - 115px) !important;
    overflow: hidden;
}

.e-filterbar .e-input {
    font-size: 14px !important;
    padding: 0 !important;
}

.e-grid .e-headercell {
    background-color: gainsboro !important;
    height: 16px !important;
}

[data-bs-theme="dark"] .e-grid .e-headercell {
    background-color: #000;
}

.e-headercelldiv {
    font-weight: 700 !important;
}

.container-fluid .row .btn {
    font-weight: 400 !important;
}
/* IS ON HOLD toggle button column in MeasureGrid.razor */
.hold-toggle {
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 2px;
    transition: background-color 0.15s ease, transform 0.1s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
}

    .hold-toggle:hover {
        background-color: rgba(0, 0, 0, 0.08);
        transform: scale(1.1);
    }

    .hold-toggle.is-on-hold {
        color: #c48c28;
    }

        .hold-toggle.is-on-hold:hover {
            background-color: #c48c2833;
        }
/* Dark mode support for IsOnHold*/
@media (prefers-color-scheme: dark) {
    .hold-toggle:hover {
        background-color: rgb(122, 115, 216, 0.20);
    }

    .hold-toggle.is-on-hold:hover {
        background-color: rgb(122, 115, 216, 0.20);
    }
}
/* Measure ID link column in MeasureGrid.razor */
.grid-link {
    color: var(--bs-link-color, #0d6efd);
    text-decoration: none;
    cursor: pointer;
    font-weight: 500;
}

    .grid-link:hover {
        color: var(--bs-link-hover-color, #0a58ca);
        text-decoration: underline;
    }


[data-bs-theme="dark"] .e-grid .e-headercell {
    background-color: #112 !important;
    font-weight: 400;
}

/* Measure Details Enhanced Styles */
.measure-details-container {
    max-height: 100%;
    outline: none;
    background-color: gainsboro;
    /*max-width: 1000px;*/
}

    .measure-details-container .e-label {
        font-size: 110%;
    }

    .measure-details-container:focus {
        outline: none;
    }

    .measure-details-container .e-accordion .e-acrdn-item {
        margin-top: .25rem;
    }

        .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-header {
            background-color: #92b1d9 !important;
        }

        .measure-details-container .e-accordion .e-acrdn-item.e-selected .e-acrdn-header {
            background-color: #92b1d9 !important;
        }

        .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel {
        }

            .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content {
                padding: 0;
            }

                .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content .col {
                }

        .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content {
            font-size: 1rem !important;
            font-weight: 400;
        }

    .measure-details-container .form-control-plaintext {
        padding-top: 0;
        /*font-weight: 600;*/
        /*font-size: 120% !important;*/
    }

    .measure-details-container .form-label {
        white-space: nowrap;
        font-size: 1rem !important;
        margin-bottom: 0 !important;
    }

/* Measure Details Enhanced Styles */
[data-bs-theme="dark"] .measure-details-container {
    max-height: 100%;
    outline: none;
    background-color: #222;
    /*max-width: 1000px;*/
}

    [data-bs-theme="dark"] .measure-details-container .e-label {
        font-size: 110%;
    }

    [data-bs-theme="dark"] .measure-details-container:focus {
        outline: none;
    }

    [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item {
        margin-top: .25rem;
    }

        [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-header {
            background-color: #4a6589 !important;
        }

        [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item.e-selected .e-acrdn-header {
            background-color: #4a6589 !important;
        }

        [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel {
        }

            [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content {
                padding: 0;
            }

                [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content .col {
                }

        [data-bs-theme="dark"] .measure-details-container .e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content {
            font-size: 1rem !important;
            font-weight: 400;
        }

    [data-bs-theme="dark"] .measure-details-container .form-control-plaintext {
        padding-top: 0;
        /*font-weight: 600;*/
        /*font-size: 120% !important;*/
    }

    [data-bs-theme="dark"] .measure-details-container .form-label {
        white-space: nowrap;
        font-size: 1rem !important;
        margin-bottom: 0 !important;
    }




.measure-header {
    z-index: 100;
}

.measure-footer {
    z-index: 100;
}

.measure-form-content {
    scrollbar-width: thin;
    padding-top: 0;
}


.calculation-messages {
    font-family: var(--font-mono);
    line-height: 1.2;
}

[data-bs-theme="dark"] .calculation-messages {
    background-color: #000 !important;
}

/* dirty field indicator */
.field-dirty {
    border-left: 3px solid var(--bs-primary) !important;
}
/* Clickable elements */
.clickable {
    cursor: pointer;
    transition: opacity 0.2s;
}

    .clickable:hover {
        opacity: 0.8;
    }
/* Comparison bar */
.comparison-bar {
    /*background-color: #bbb;*/
    color: #444;
    visibility: hidden;
    margin: 0 !important;
    padding: 0 !important;
}

    .comparison-bar.has-changes {
        visibility: visible;
        font-style: italic;
        animation: fadeIn 0.3s ease-out;
        /*background-color: #FFF;*/
        color: var(--color-sf-primary-bg-color);
        margin: 0 !important;
        padding: 0 !important;
    }

.totals-bar {
    animation: fadeIn 0.9s ease-out;
    background-color: cadetblue;
    border: 2px solid red;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Timeline for history */
.timeline-item {
    position: relative;
    border-color: var(--bs-primary) !important;
}

    .timeline-item::before {
        content: '';
        position: absolute;
        left: -9px;
        top: 0;
        width: 12px;
        height: 12px;
        background: var(--bs-primary);
        border-radius: 50%;
    }
/* Keyboard hints */
kbd {
    padding: 2px 6px;
    font-size: 0.75rem;
    background-color: var(--bs-gray-500);
    border-radius: 3px;
}
/* Print styles */
@media print {
    .measure-header,
    .measure-footer {
        position: static !important;
    }

    .e-btn,
    .e-dropdown-btn {
        display: none !important;
    }
}

textarea {
    height: auto !important;
    min-height: unset !important; /* or initial */
}

.key-value-pair {
    /*margin-top: 0;*/
}


.table-iqsection td {
    background-color: #edeecb;
}

[data-bs-theme="dark"] .table-iqsection td {
    color: black;
}


.table-sm > :not(caption) > * > * {
    padding: .1rem;
    border: 1px solid #999;
}

.message-info {
    color: midnightblue;
}

.message-warning {
    color: darkgoldenrod;
}

.message-override {
    color: orangered;
}

.message-error {
    color: darkred;
}

.message-muted {
    color: darkslategrey;
}


.filemanager .e-btn.e-icon-btn {
    padding: 4px;
}

.filemanager .e-grid .e-rowcell {
    padding: 0;
    padding-left: 4px;
}
/*FILE MANAGER*/




.readonly-form .e-input-group,
.readonly-form .e-ddl,
.readonly-form .e-checkbox-wrapper {
    opacity: 0.8;
    pointer-events: none;
}

    .readonly-form .e-input-group input,
    .readonly-form .e-ddl input {
        background-color: var(--bs-secondary-bg) !important;
    }



.measure-form-content .e-accordion .e-acrdn-item.e-overlay .e-acrdn-header .e-icons, .e-accordion .e-acrdn-item.e-overlay .e-acrdn-header .e-acrdn-header-content {
    color: #000;
}


.e-summarycell {
    font-weight: 700 !important;
    font-size: 16px !important;
    padding: 8px !important;
}

.e-gridfooter .e-summarycell {
    font-size: 18px !important;
}

.e-grid .e-groupcaption {
    padding: 6px !important;
    font-weight: 700;
}

.files-grid {
    border: none;
}

.bg-budget {
    background-color: #EED !important;
}

[data-bs-theme="dark"] .bg-budget {
    background-color: #443 !important;
}


[data-bs-theme="dark"] .bg-local-dev {
    background: #2c6715 !important;
    border-top: 3px solid #22FF44;
}

.bg-local-dev {
    background: #2c6715 !important;
    border-top: 3px solid #22FF44;
}


/* Footer Styles */
.app-footer {
    background-color: transparent;
    /*border-top: 1px solid #e0e0e0;*/ /* Very subtle border to separate from main content */
}

.footer-links {
    font-size: 0.85rem; /* Very small but legible */
    color: #6c757d; /* Dark gray */
}

    .footer-links a {
        color: #6c757d;
        text-decoration: none;
        transition: color 0.2s ease-in-out;
    }

        .footer-links a:hover {
            color: #0d6efd; /* Lightens to standard Bootstrap blue */
            text-decoration: none;
        }

    .footer-links .separator {
        margin: 0 0.5rem;
        opacity: 0.5;
    }