@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

/* Bootstrap 5 CSS variables shim.
   The site runs Bootstrap 4 (Bootswatch Yeti), but the DevExpress 26.x
   'bootstrap-external.bs5' theme resolves its colors from these variables —
   without them, grid headers/footers etc. render transparent.
   Values mirror the Yeti palette. */
:root {
    --bs-white: #fff;
    --bs-black: #000;
    --bs-body-bg: #fff;
    --bs-body-color: #222;
    --bs-body-color-rgb: 34, 34, 34;
    --bs-border-color: #dee2e6;
    --bs-primary: #005895;
    --bs-primary-rgb: 0, 88, 149;
    --bs-secondary: #eee;
    --bs-secondary-rgb: 238, 238, 238;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-color-rgb: 34, 34, 34;
    --bs-tertiary-bg: #f8f9fa;
    --bs-success: #43ac6a;
    --bs-success-rgb: 67, 172, 106;
    --bs-info: #5bc0de;
    --bs-info-rgb: 91, 192, 222;
    --bs-warning: #E99002;
    --bs-warning-rgb: 233, 144, 2;
    --bs-danger: #F04124;
    --bs-danger-rgb: 240, 65, 36;
    --bs-light: #eee;
    --bs-light-rgb: 238, 238, 238;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark: #222;
    --bs-dark-rgb: 34, 34, 34;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #888;
    --bs-gray-700: #495057;
    --bs-gray-800: #333;
    --bs-gray-900: #222;
}

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

/* ---- iOS Safari compatibility fallbacks ----
   The DevExpress theme paints grid headers with color-mix(), which Safari < 16.2
   discards entirely, leaving the header transparent. site.css loads BEFORE the theme,
   so on modern browsers the theme's rule overrides these; on older Safari the theme's
   invalid declaration is dropped and these solid colors apply instead. */
.dxbl-grid .dxbl-grid-table > thead .dxbl-grid-header-row > th:not(.dxbl-grid-empty-cell) {
    background-color: #f2f3f5;
}

/* Summary footers are 'unset' (transparent) in the theme; sticky scrolling lets rows
   show through them. Give them an opaque background everywhere. */
.dxbl-grid .dxbl-grid-footer,
.dxbl-grid .dxbl-grid-group-footer {
    background-color: var(--bs-body-bg, #fff);
}

/* Mobile menu bar: pin readable colors instead of relying on theme internals. */
.mobile-bar {
    --dxbl-menu-bg: #fff;
    --dxbl-menu-color: #222;
}

/* DevExpress tabs render each caption twice (a hidden bold copy reserves width so the
   active tab doesn't jump). The theme hides it with rigid child-combinator chains that
   miss some mobile DOM arrangements, showing "Report Report". Catch-all fix. */
.dxbl-tabs .dxbl-tabs-space-reservation {
    display: none !important;
}

html, body {
    height: 100%;
    overflow: hidden;
    /* Shown briefly while the Blazor circuit connects; matches the login gradient
       so the connect moment doesn't flash white. App pages fully cover it. */
    background: #005696;
    background: linear-gradient(180deg, rgba(2,51,88,1) 0%, rgba(0,86,150,1) 100%);
}

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

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.mobile-bar {
    background-color: #113953;
    color: black;
    font-weight: bold;
}

/* Used by report empty-state cards; was referenced but never defined, so their vertical centering did nothing */
.min-vh-35 {
    min-height: 35vh;
}

/**Icons**/
.icon {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 24px;
    width: 24px;
}

.icon-save {
    -webkit-mask-image: url("../images/icons/save-floppy-disk.svg");
    mask-image: url("../images/icons/save-floppy-disk.svg");
}

.icon-document {
    -webkit-mask-image: url("../images/icons/page.svg");
    mask-image: url("../images/icons/page.svg");
}

.icon-return {
    -webkit-mask-image: url("../images/icons/arrow-left-circled.svg");
    mask-image: url("../images/icons/arrow-left-circled.svg");
}

.icon-cancel {
    -webkit-mask-image: url("../images/icons/cancel.svg");
    mask-image: url("../images/icons/cancel.svg");
}

.icon-search {
    -webkit-mask-image: url("../images/icons/search.svg");
    mask-image: url("../images/icons/search.svg");
}

.icon-logout {
    -webkit-mask-image: url("../images/icons/log-out.svg");
    mask-image: url("../images/icons/log-out.svg");
}

.icon-refresh {
    -webkit-mask-image: url("../images/icons/refresh-double.svg");
    mask-image: url("../images/icons/refresh-double.svg");
}

.icon-user {
    -webkit-mask-image: url("../images/icons/user-circle-alt.svg");
    mask-image: url("../images/icons/user-circle-alt.svg");
}

.user-profile .logo-container {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.user-profile .log-off-btn {
    padding-top: 0.815rem;
    padding-bottom: 0.815rem;
    border-top: 1px solid #e5e5e5;
}

.user-profile .menu-icon-user-profile {
    opacity: 0.25;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}