/* =========================================================================
 * CORE.CSS - Shared Application Chrome and Component Styles
 * =========================================================================
 * 
 * This file owns the base app chrome, layout, and component styling used
 * across the shared Core.Master and other master pages. It defines:
 * 
 * - Global utility classes and resets
 * - Content container layout and page structure
 * - Form panel styling and card/section definitions
 * - Input control styling (select, date, spinner, lookup, etc.)
 * - Button variants and action button groups
 * - Dropdown/context menu styling
 * - Lookup control input-group styling
 * - Validation indicators and error display
 * - Modal and dialog chrome
 * - Tab and accordion patterns
 * - Alert and notification styling
 * - Wizard navigation button styling
 * 
 * Does NOT own:
 * - Token definitions (see Base.css)
 * - Bootstrap theme overrides (see ThirdParty/Bootstrap.css)
 * - Opt-in adaptive-form layout (see modern.css)
 * - Plugin-specific styling (see ThirdParty/*.css)
 * - Page/feature-specific styles (see Other/*.css and MasterPages/*.css)
 */

/***********************************************************************************************************************************************************/
/* General Utility styles */
/***********************************************************************************************************************************************************/

.pointer-events-none {
    cursor: default;
    pointer-events: none;
    color: var(--bs-text-disabled) !important;
}

    .pointer-events-none i.fa {
        cursor: default;
        pointer-events: none;
        color: var(--bs-text-disabled) !important;
    }

.overflow-y-scroll {
    overflow-y: scroll !important;
}

.overflow-y-auto {
    overflow-y: auto !important;
}

.fa-75 {
    font-size: .75em;
}

.fa-1x50 {
    font-size: 1.5em;
}

.fa-2x50 {
    font-size: 2.5em;
}

.cursor-pointer {
    cursor: pointer !important;
}

.cursor-default {
    cursor: default !important;
}

.dfc-email-validating-icon {
    color: var(--modern-accent-emphasis);
}

.separator {
    margin: 0px .7ex 0px .7ex;
}

.loading-spinner {
    width: 32px;
    height: 32px;
    border: 4px solid var(--modern-border-muted);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    border-color: color-mix(in srgb, var(--modern-border) 85%, white);
    border-top-color: var(--modern-btn-primary-bg);
}

.ui-resizable-handle {
    opacity: 0;
}

/***********************************************************************************************************************************************************/
/* Header & Footer Styles */
/***********************************************************************************************************************************************************/

#mainContentContainer {
    min-height: 80px;
    --page-chrome-inset: 24px;
}

.header-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.header-title {
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    padding-left: var(--page-chrome-inset);
    text-align: center;
    font-size: 17px;
    font-weight: bold;
    min-height: 80px;
}

.site-header-logo {
    display: block;
    width: 138px;
    max-width: 138px;
    height: auto;
    margin-left: 0;
    border: 2px solid transparent;
    filter: saturate(0.90) brightness(1.04) contrast(0.98);
    transform: translateY(2px);
}

.master-nav-container {
    margin: 0 auto;
    padding-left: 60px;
}

.sm-default-body {
    background-image: none;
}


.profile-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: var(--page-chrome-inset);
    padding-top: 28px;
    padding-bottom: 0;
    color: var(--bs-gray) !important;
    height: 80px;
    text-transform: uppercase;
    font-size: .9em;
}

    .profile-container > a {
        letter-spacing: 1px;
        text-decoration: underline;
    }

    .profile-container .separator {
        display: inline-flex;
        align-items: center;
        height: 28px;
        padding: 0px 5px 0px 5px;
        line-height: 1;
        color: color-mix(in srgb, var(--theme-accent-primary) 55%, white);
    }

    .profile-container > [id$="OemsAssistantLink"] > .separator {
        display: none;
    }

    .profile-container > [id$="OemsAssistantLink"] {
        margin-left: 8px;
    }

    .profile-container > div {
        display: inline-flex;
        align-items: center;
    }

/* Work queue notification badge -----------------------------------------------
   Anchored to the always-visible user icon (not the collapsible username text)
   so it stays correctly positioned on both desktop and mobile, and never
   collides with the adjacent LOGOUT separator. */
.profile-icon {
    display: inline-flex;
    align-items: center;
}

.work-queue-badge {
    position: absolute;
    top: -6px;
    left: auto;
    right: -9px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    font-size: 11px;
    font-weight: 700;
    /* line-height matches the box height so the digit centers on its own font
       metrics rather than on a short line box (which renders it visually high).
       Works for any count length. */
    line-height: 18px;
    letter-spacing: 0;
    text-align: center;
    text-transform: none;
    color: #fff !important;
    background-color: var(--bs-danger, #dc3545) !important;
    box-shadow: 0 0 0 2px var(--modern-white);
    pointer-events: auto;
    transform-origin: center;
    /* Keep the badge on its own compositing layer at all times so the number's
       sub-pixel rendering stays identical whether or not an animation/transform
       is active. Without this, dropping the animation layer re-snaps the text to
       the pixel grid and nudges the "1" off-center. */
    transform: translateZ(0);
    will-change: transform;
    backface-visibility: hidden;
    transition: transform .18s ease, box-shadow .18s ease;
}

/* Safety net: never render an empty red circle. Even if the d-none class is
   momentarily absent before the count is set, an empty badge stays hidden. */
.work-queue-badge:empty {
    display: none !important;
}

/* Entrance: a small bounce, applied by JS only AFTER the count text is set, so
   the number is present and full-size the entire time (starts at scale .85,
   never invisible). Removed via animationend so hover scaling stays clean. */
.work-queue-badge.work-queue-badge-enter {
    animation: work-queue-badge-pop .4s cubic-bezier(.34, 1.56, .64, 1);
}

@keyframes work-queue-badge-pop {
    0% {
        transform: translateZ(0) scale(.85);
    }
    55% {
        transform: translateZ(0) scale(1.22);
    }
    100% {
        transform: translateZ(0) scale(1);
    }
}

/* Hover: expand the badge slightly alongside the rising icon. */
.profile-link:hover .work-queue-badge,
.profile-link:focus-visible .work-queue-badge {
    transform: translateZ(0) scale(1.2);
    color: #fff !important;
    background-color: var(--bs-danger, #dc3545) !important;
}

/* Standout second line inside combined/dirty-state tooltips. Rendered as a
   small rounded pill so the hint clearly separates from the base tooltip text.
   Shared by the work-queue notification tooltip and the "Unsaved changes
   detected" save-button tooltip. */
.tooltip-standout-note {
    display: inline-block;
    margin-top: 5px;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--bs-warning-border-subtle, #ffe69c);
    font-weight: 600;
    font-size: .85em;
    line-height: 1.3;
    color: var(--bs-warning-text-emphasis, #664d03);
    background-color: var(--bs-warning-bg-subtle, #fff3cd);
    /* Subtle dark halo so the light chip's edge stays visible when it overlaps
       the darker tooltip background. */
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .35), 0 1px 2px rgba(0, 0, 0, .25);
}

/* Structured layout for shared page-title/detail tooltip content. */
.solution-title-tooltip {
    text-align: left;
    min-width: 250px;
    max-width: 440px;
    position: relative;
    padding-right: 2px;
    padding-left: 8px;
}

    .solution-title-tooltip::before {
        content: "";
        position: absolute;
        left: -3px;
        top: 0;
        bottom: 0;
        width: 3px;
        border-radius: 999px;
        background-color: var(--bs-warning-bg-subtle, #fff3cd);
        box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bs-warning-border-subtle, #ffe69c) 92%, var(--modern-white));
    }

.solution-title-tooltip-row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 10px;
    align-items: baseline;
    line-height: 1.4;
}

    .solution-title-tooltip-row + .solution-title-tooltip-row {
        margin-top: 4px;
        padding-top: 4px;
        border-top: 1px solid color-mix(in srgb, var(--modern-tooltip-color) 9%, transparent);
    }

.solution-title-tooltip-label {
    font-weight: 600;
    font-size: .82em;
    letter-spacing: .45px;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--modern-tooltip-color) 52%, var(--modern-white));
}

.solution-title-tooltip-value {
    color: var(--modern-white);
    overflow-wrap: anywhere;
    font-weight: 600;
}

.solution-title-tooltip-flag {
    margin-top: 0;
    padding: 1px 7px;
}

.module-mobile-profile-context {
    display: none;
}

.module-mobile-profile-context > span {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-link {
    position: relative;
    cursor: pointer;
    letter-spacing: 1px;
    text-decoration: none;
    color: var(--theme-accent-primary);
    transition: color .25s ease;
}

    .profile-link i {
        font-size: 15px;
        width: 18px;
        text-align: center;
        line-height: 1;
        vertical-align: middle;
        transition: transform .25s ease;
        -webkit-text-stroke-width: 0;
    }

    .profile-link::after {
        content: '';
        position: absolute;
        left: 50%;
        bottom: -7px;
        width: 0;
        height: 2px;
        border-radius: 2px;
        transform: translateX(-50%);
        transition: width .25s ease, height .25s ease;
        background-color: var(--modern-accent-emphasis);
    }

    .profile-link:hover {
        color: var(--modern-accent-focus) !important;
        text-decoration: none !important;
        text-decoration-thickness: initial !important;
        text-shadow: none !important;
    }

        .profile-link:hover i,
        .profile-link:hover .dropdown-toggle::after {
            transform: translateY(-2px) scale(1.15);
            -webkit-text-stroke-width: .125px;
        }

        .profile-link:hover::after {
            width: 100%;
            height: 2px;
        }

        .profile-link:hover span:not(.dropdown-toggle) {
            text-shadow: 0 0 1px var(--theme-accent-primary);
        }

    .profile-link .dropdown-toggle::after,
    .profile-link .dropdown-toggle[aria-expanded="true"]::after {
        transition: transform .25s ease;
        transform-origin: center;
    }

    .profile-link .dropdown-toggle[aria-expanded="true"]::after {
        transform: rotate(180deg) scale(1.18);
        margin-bottom: 2px;
        -webkit-text-stroke-width: .125px;
        color: var(--modern-accent-emphasis);
    }

    .profile-link[aria-expanded="true"] i {
        transform: translateY(-2px) scale(1.15);
        color: var(--modern-accent-focus);
    }

    .profile-link span {
        padding-left: 5px;
        padding-right: 5px;
    }

.sitemap-link::after {
    margin-bottom: 3px;
}

#sitemapOptions > .dropdown-toggle {
    padding-left: 0;
    padding-right: 0;
}

#sitemapOptions > .dropdown-toggle > i.fa-sitemap,
#sitemapOptions > .dropdown-toggle > span {
    vertical-align: bottom;
}

#sitemapOptions .dropdown-toggle::after {
    display: none;
}

.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link,
.profile-container > [id$="UserSitemap"] .dropdown-toggle {
    display: inline-flex;
    align-items: baseline;
    gap: 0.3rem;
    transition: color .25s ease, transform .18s ease;
}

.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link:hover,
.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link:focus-visible,
.profile-container > [id$="UserSitemap"] .profile-link:hover .dropdown-toggle {
    transform: translateY(-1px);
    color: var(--modern-accent-focus) !important;
    text-decoration: none !important;
    text-shadow: none !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link:hover i,
.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link:focus-visible i,
.profile-container > [id$="UserSitemap"] .profile-link:hover .dropdown-toggle::after {
    transform: none;
}

.profile-container > :is([id$="UserHomeLink"], [id$="UserSitemap"], [id$="UserProfileLink"], [id$="UserLogoutLink"]) .profile-link:focus-visible::after {
    width: 100%;
    height: 2px;
    background-color: var(--modern-accent-emphasis);
}

.profile-container > :is([id$="WalkMeGuideLink"], [id$="OemsAssistantLink"], [id$="UserSiteInfoLink"]) .profile-link {
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.profile-container > :is([id$="WalkMeGuideLink"], [id$="OemsAssistantLink"], [id$="UserSiteInfoLink"]) .profile-link:hover {
    transform: translateY(-1px);
}

.profile-container > :is([id$="WalkMeGuideLink"], [id$="OemsAssistantLink"], [id$="UserSiteInfoLink"]) .profile-link:hover i {
    transform: none;
}

.walkme-guide-me-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    line-height: 1;
}

    .walkme-guide-me-link i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

.walkme-guide-me-link {
    border: 1px solid var(--modern-accent-primary-25);
    border-radius: 5px;
    padding: 5px;
    text-decoration: none !important;
    background-color: var(--modern-white);
    color: var(--modern-accent-interactive) !important;
    padding-left: 10px;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

    .walkme-guide-me-link:hover {
        background-color: var(--modern-accent-primary-12);
        border-color: var(--theme-accent-primary);
        color: var(--modern-accent-emphasis) !important;
    }

    .walkme-guide-me-link:focus-visible {
        background-color: var(--modern-white);
        border-color: var(--modern-accent-focus);
        color: var(--modern-accent-emphasis) !important;
        box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--modern-accent-focus) 22%, transparent) !important;
    }

    .walkme-guide-me-link::after {
        content: none !important;
    }

.oems-assistant-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    line-height: 1;
    border: var(--theme-accent-primary) solid 1px;
    border-radius: 5px;
    padding: 5px;
    text-decoration: none !important;
    background-color: var(--modern-btn-primary-bg);
    color: var(--modern-white) !important;
    padding-left: 10px;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

    .oems-assistant-link i,
    .oems-assistant-link span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: inherit !important;
        text-shadow: none !important;
    }

    .oems-assistant-link .fa {
        margin-right: 6px;
    }

.ask-genie-list {
    max-height: min(calc(100vh - 8rem), 700px) !important;
    border: 1px solid var(--modern-border) !important;
    border-radius: 8px;
    box-shadow: 0 4px 16px var(--modern-shadow-black-10);
    padding: 0 0 4px;
}

    .ask-genie-list .dropdown-item {
        white-space: normal;
        border: 1px solid transparent;
        border-left-width: 3px;
        border-right-width: 3px;
        border-radius: 0;
        padding: 7px 14px;
        margin: 0;
        color: var(--modern-text);
        font-size: 1rem;
        transition: background-color 0.15s, border-color 0.15s, color 0.15s;
        min-width: 325px;
    }

    .ask-genie-list .dropdown-header {
        padding: 8px 14px 4px;
    }

    .ask-genie-list .dropdown-divider {
        margin: 4px 14px;
    }

    .ask-genie-list .dropdown-item:hover,
    .ask-genie-list .dropdown-item:focus {
        background-color: var(--modern-accent-primary-12);
        border-left-color: var(--modern-accent-interactive);
        color: var(--modern-accent-emphasis);
        outline: 0;
    }

.oems-assistant-link:hover {
    background-color: var(--modern-btn-primary-hover);
    border-color: var(--modern-btn-primary-hover);
    color: var(--modern-white) !important;
    box-shadow: 0 2px 8px var(--modern-shadow-black-10);
}

.oems-assistant-link:focus-visible {
    background-color: var(--modern-btn-primary-bg);
    border-color: var(--modern-accent-focus);
    color: var(--modern-white) !important;
    box-shadow: 0 0 0 2px var(--modern-white), 0 0 0 4px color-mix(in srgb, var(--modern-accent-focus) 72%, white) !important;
}

    .oems-assistant-link:focus-visible i,
    .oems-assistant-link:focus-visible span,
    .oems-assistant-link:focus-visible::after {
        color: var(--modern-white) !important;
        text-shadow: none !important;
    }

.oems-assistant-link:hover i,
.oems-assistant-link:hover span,
.oems-assistant-link:hover::after {
    color: var(--modern-white) !important;
}

.oems-assistant-link::after {
    content: none !important;
}

.oems-assistant-link.show {
    background-color: var(--modern-btn-primary-hover);
    border-color: var(--modern-btn-primary-hover);
    color: var(--modern-white) !important;
    box-shadow: 0 2px 8px var(--modern-shadow-black-10);
    text-shadow: none;
}

    .oems-assistant-link.show i,
    .oems-assistant-link.show span,
    .oems-assistant-link.show::after,
    .oems-assistant-link.show:hover i,
    .oems-assistant-link.show:hover span,
    .oems-assistant-link.show:hover::after,
    .oems-assistant-link[aria-expanded="true"] i,
    .oems-assistant-link[aria-expanded="true"] span,
    .oems-assistant-link[aria-expanded="true"]::after,
    .oems-assistant-link[aria-expanded="true"]:hover i,
    .oems-assistant-link[aria-expanded="true"]:hover span,
    .oems-assistant-link[aria-expanded="true"]:hover::after {
        color: var(--modern-white) !important;
        text-shadow: none !important;
    }

.ask-genie-list .dropdown-item:hover:not(:has(a.pointer-events-none)),
.ask-genie-list .dropdown-item:focus-within:not(:has(a.pointer-events-none)) {
    background-color: var(--modern-accent-primary-12) !important;
    border-color: var(--modern-hover-edge) !important;
    border-left: 3px solid var(--modern-btn-primary-bg) !important;
    border-right: 3px solid var(--modern-btn-primary-bg) !important;
    border-radius: 6px;
    color: var(--modern-btn-primary-bg);
}

.ask-genie-list .dropdown-divider {
    border-color: var(--modern-border);
    margin: 4px 14px;
}

.ask-genie-list .dropdown-item.oems-assistant-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--modern-accent-emphasis);
}

.ask-genie-list .dropdown-item.oems-assistant-menu-item i.fa {
    padding-right: 0;
    font-size: 0.95rem;
    color: var(--modern-accent-interactive);
}

.ask-genie-list::-webkit-scrollbar {
    width: 14px !important;
}

.ask-genie-list::-webkit-scrollbar-track {
    background: var(--bs-white) !important;
}

.ask-genie-list::-webkit-scrollbar-thumb {
    background: var(--modern-btn-primary-bg) !important;
    border: 3px solid var(--bs-white) !important;
    border-radius: 7px !important;
}

    .ask-genie-list::-webkit-scrollbar-thumb:hover {
        background: var(--modern-btn-primary-hover) !important;
    }

.site-info-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    line-height: 1;
    border: 1px solid var(--modern-accent-primary-25);
    border-radius: 5px;
    padding: 5px;
    text-decoration: none !important;
    background-color: var(--modern-white);
    color: var(--modern-accent-interactive) !important;
    cursor: pointer;
    padding-left: 10px;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

    .site-info-link:hover {
        background-color: var(--modern-accent-primary-12);
        border-color: var(--theme-accent-primary);
        color: var(--modern-accent-emphasis) !important;
    }

    .site-info-link:focus-visible {
        background-color: var(--modern-white);
        border-color: var(--modern-accent-focus);
        color: var(--modern-accent-emphasis) !important;
        box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--modern-accent-focus) 22%, transparent) !important;
    }

    .site-info-link.error {
        animation: pulse-glow-danger 1.5s ease-in-out 0s 2;
        border-color: var(--modern-danger-btn-bg);
        color: var(--modern-danger-btn-bg) !important;
    }

        .site-info-link.error:hover {
            background-color: var(--bs-danger);
            color: var(--bs-white) !important;
            animation: none;
        }

    .site-info-link::after {
        content: none !important;
    }

    .site-info-link i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .site-info-link.error i {
        color: var(--modern-danger-btn-bg) !important;
        -webkit-text-stroke-width: 0;
    }

    .site-info-link.error:hover,
    .site-info-link.error:focus-visible {
        background-color: var(--modern-danger-btn-bg);
        border-color: var(--modern-danger-btn-bg);
        color: var(--modern-white) !important;
        text-shadow: none;
    }

        .site-info-link.error:hover i,
        .site-info-link.error:focus-visible i {
            color: var(--modern-white) !important;
        }

        .site-info-link.error:hover span,
        .site-info-link.error:focus-visible span,
        .site-info-link.error:hover .fa,
        .site-info-link.error:focus-visible .fa {
            color: var(--modern-white) !important;
        }

.profile-link:not(.oems-assistant-link):hover,
.profile-link:not(.oems-assistant-link):hover span:not(.dropdown-toggle):not(.work-queue-badge) {
    color: var(--modern-accent-emphasis) !important;
    text-shadow: none;
}

.profile-link.oems-assistant-link:hover,
.profile-link.oems-assistant-link.show,
.profile-link.oems-assistant-link[aria-expanded="true"],
.profile-link.oems-assistant-link:hover span:not(.dropdown-toggle),
.profile-link.oems-assistant-link.show span:not(.dropdown-toggle),
.profile-link.oems-assistant-link[aria-expanded="true"] span:not(.dropdown-toggle) {
    color: var(--modern-white) !important;
    text-shadow: none !important;
}

a.profile-link.site-info-link.error:hover,
a.profile-link.site-info-link.error:focus-visible,
a.profile-link.site-info-link.error:hover span:not(.dropdown-toggle),
a.profile-link.site-info-link.error:focus-visible span:not(.dropdown-toggle) {
    color: var(--modern-white) !important;
    text-shadow: none !important;
}

.sitemap-list {
    width: 336px;
    max-height: 600px !important;
    overflow-y: auto;
    text-transform: none;
    border: 1px solid var(--modern-border) !important;
    border-radius: 8px;
    box-shadow: 0 4px 16px var(--modern-shadow-black-10);
    padding: 8px 0;
}

.profile-container:has(.dropdown-menu.show) {
    z-index: 1055;
}

.profile-container .dropdown-menu.show {
    z-index: 1056;
}

    .sitemap-list > li.dropdown-item > a {
        display: block;
        color: var(--modern-text);
        font-size: 1rem;
        transition: color 0.15s;
    }

    .sitemap-list::-webkit-scrollbar {
        width: 14px !important;
    }

    .sitemap-list::-webkit-scrollbar-track {
        background: var(--bs-white) !important;
    }

    .sitemap-list::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg) !important;
        border: 3px solid var(--bs-white) !important;
        border-radius: 7px !important;
    }

    .sitemap-list > li.dropdown-item {
        border: 1px solid transparent;
        border-left-width: 3px;
        border-right-width: 3px;
        border-radius: 6px;
        padding: 7px 14px;
        margin: 0;
        transition: background-color 0.15s, border-color 0.15s;
    }

        .sitemap-list > li.dropdown-item:hover:not(:has(a.pointer-events-none)),
        .sitemap-list > li.dropdown-item:focus-within:not(:has(a.pointer-events-none)) {
            background-color: var(--modern-row-selected) !important;
            border-color: var(--modern-hover-edge) !important;
            border-left: 3px solid var(--modern-btn-primary-bg) !important;
            border-right: 3px solid var(--modern-btn-primary-bg) !important;
            border-radius: 6px;
        }

        .sitemap-list > li.dropdown-item:hover > a,
        .sitemap-list > li.dropdown-item:focus-within > a {
            color: var(--modern-btn-primary-bg);
            text-decoration: none;
        }

    .sitemap-list::-webkit-scrollbar-thumb:hover {
        background: var(--modern-btn-primary-hover) !important;
    }

#sitemapOptions .dropdown-menu .dropdown-item a > .fa:hover {
    color: var(--modern-accent-emphasis);
    -webkit-text-stroke-width: 0;
}

.sitemap-link .dropdown-toggle[aria-expanded="true"] i.fa-sitemap,
#sitemapOptions .dropdown-toggle[aria-expanded="true"] i.fa-sitemap {
    color: var(--modern-accent-emphasis);
}

.release-notification-badge {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.45rem;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
    color: var(--modern-white) !important;
    background-color: var(--bs-danger) !important;
    box-shadow: 0 0 0 2px var(--modern-white), 0 2px 7px color-mix(in srgb, var(--bs-danger) 55%, transparent);
    transform: translateZ(0);
    transform-origin: center;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.release-notification-badge-anchor {
    position: absolute;
    top: -0.85rem;
    left: 50%;
    z-index: 1;
    line-height: 1;
    pointer-events: none;
    transform: translateX(-50%);
}

.release-notification-badge-mobile {
    display: none !important;
}

.release-notification-badge.release-notification-badge-enter {
    animation: work-queue-badge-pop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.release-version-label,
.footer-link-label {
    text-decoration: underline;
}

/* Shared inline link style (matches site footer links) for use in dialogs, alerts and body content. */
.link-standard {
    color: var(--modern-btn-primary-bg);
    text-decoration: underline;
    cursor: pointer;
}

    .link-standard:hover,
    .link-standard:focus,
    .link-standard:focus-visible {
        color: var(--modern-accent-emphasis);
        text-decoration-thickness: 2px;
        text-underline-offset: 2px;
    }

#PageFooterVersionNumber:hover .release-version-label,
#PageFooterVersionNumber:focus .release-version-label,
#PageFooterVersionNumber:focus-visible .release-version-label,
#PageFooterSiteAlert:hover .footer-link-label,
#PageFooterSiteAlert:focus .footer-link-label,
#PageFooterSiteAlert:focus-visible .footer-link-label,
#PageFooterCorporateSite:hover .footer-link-label,
#PageFooterCorporateSite:focus .footer-link-label,
#PageFooterCorporateSite:focus-visible .footer-link-label {
    text-decoration-thickness: 2px !important;
    text-underline-offset: 2px;
}

#PageFooterVersionNumber:hover .release-notification-badge,
#PageFooterVersionNumber:focus-visible .release-notification-badge {
    color: var(--modern-white) !important;
    background-color: var(--bs-danger) !important;
    box-shadow: 0 0 0 2px var(--modern-white), 0 3px 10px color-mix(in srgb, var(--bs-danger) 70%, transparent);
    transform: translateZ(0) scale(1.12);
}

#PageFooterEnvironment.warning {
    font-weight: bold;
    color: white;
    background-color: var(--bs-warning);
    padding: 0px 10px 0px 12px;
    border-radius: 5px;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 3px;
}

footer ul {
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    list-style: none;
    padding: 0px;
}

    footer ul > li > a, footer #PageFooterVersionNumber, footer #PageFooterCorporateSite, footer #PageFooterSiteAlert {
        color: var(--bs-light);
        text-decoration: underline;
    }

        footer ul > li > a:hover, footer #PageFooterVersionNumber:hover, footer #PageFooterCorporateSite:hover, footer #PageFooterSiteAlert:hover {
            text-decoration: none;
            text-shadow: 0px 0px 1px var(--bs-white);
            cursor: pointer;
            color: var(--modern-btn-primary-hover) !important;
        }

    footer ul > li + li::before {
        content: "\2022";
        margin: 0px 8px;
        color: var(--modern-text-muted);
    }

.fine-print {
    font-size: 12px;
}

footer {
    clear: both;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-left: 10px;
    font-size: 15px;
    text-align: center;
    background-color: var(--bs-white);
    color: var(--modern-text);
    border-top: 1px solid color-mix(in srgb, var(--modern-border) 88%, var(--modern-text-muted));
    box-shadow: inset 0 1px 0 var(--modern-white-45);
    height: auto;
    min-height: 62px;
    padding-top: 8px;
    padding-bottom: 6px;
}

    footer a:focus,
    footer a:focus-visible,
    footer button:focus,
    footer button:focus-visible {
        text-decoration: underline !important;
        text-decoration-thickness: 2px;
        color: var(--modern-btn-primary-hover) !important;
        text-shadow: none;
        outline: 0;
        box-shadow: none;
    }

    footer ul > li,
    footer .fine-print,
    footer ul > li > strong {
        color: var(--modern-text);
    }

    footer .fine-print {
        font-size: 13px;
        font-weight: 500;
        letter-spacing: 0.35px;
    }

    footer a,
    footer #PageFooterVersionNumber,
    footer #PageFooterCorporateSite,
    footer #PageFooterSiteAlert {
        display: inline-block;
        margin: -2px -4px;
        padding: 2px 4px;
        border: 0;
        border-radius: 3px;
        color: var(--modern-btn-primary-bg);
        background-color: transparent;
        font: inherit;
        letter-spacing: inherit;
        text-transform: inherit;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.15s ease;
    }

        footer a:hover,
        footer a:focus,
        footer a:focus-visible,
        footer #PageFooterVersionNumber:hover,
        footer #PageFooterVersionNumber:focus,
        footer #PageFooterVersionNumber:focus-visible,
        footer #PageFooterCorporateSite:hover,
        footer #PageFooterCorporateSite:focus,
        footer #PageFooterCorporateSite:focus-visible,
        footer #PageFooterSiteAlert:hover,
        footer #PageFooterSiteAlert:focus,
        footer #PageFooterSiteAlert:focus-visible {
            color: var(--modern-accent-emphasis) !important;
            font-weight: 600;
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-underline-offset: 2px;
            text-shadow: none;
        }

    footer #PageFooterEnvironment {
        box-shadow: none;
    }

        footer #PageFooterEnvironment.warning {
            background-color: var(--modern-warning-btn-bg);
            color: var(--modern-white);
        }

.footerButtons {
    width: 100px;
    background-color: transparent;
}

/***********************************************************************************************************************************************************/
/* Module Header Styles */
/***********************************************************************************************************************************************************/

.module-action-btns {
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    position: relative;
    padding-right: var(--page-chrome-inset);
    margin-left: auto;
    margin-right: 0;
    order: 2;
    justify-content: flex-end;
    background-color: var(--bs-white);
    max-height: 48px;
    border-top-left-radius: 6px;
}

    .module-action-btns:has(.dropdown-menu.show) {
        z-index: 1055;
    }

        .module-action-btns:has(.dropdown-menu.show)::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 1px;
            background-color: var(--page-accent-primary);
            pointer-events: none;
            z-index: 2;
        }

    .module-action-btns .dropdown-menu.show {
        z-index: 1056;
    }

    .module-action-btns.is-normalizing .action-separator {
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease;
    }

    .module-action-btns .action-separator {
        border-color: var(--modern-border-faint) !important;
        opacity: 0.9;
    }

    .module-action-btns a.btn {
        margin-top: 1px;
        color: color-mix(in srgb, var(--theme-nav-secondary) 70%, var(--modern-text-muted));
        border: 1px solid transparent;
        border-bottom: 0;
        padding-left: 13px;
        padding-right: 13px;
        padding-top: 6px;
        padding-bottom: 3px;
        border-radius: 6px 6px 0 0;
        transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    }

        .module-action-btns a.btn span {
            text-transform: uppercase;
            color: color-mix(in srgb, var(--theme-nav-secondary) 70%, var(--modern-text-muted));
            transition: color 0.15s ease;
        }

        .module-action-btns a.btn:active {
            outline: 0;
            -webkit-box-shadow: none;
            box-shadow: none;
            border-color: transparent !important;
        }

    .module-action-btns i, .module-action-btns div.loading-icon {
        background-color: transparent;
        display: inline-block;
        font-size: 1.25em;
        color: color-mix(in srgb, var(--theme-nav-secondary) 70%, var(--modern-text-muted));
        transform-origin: center center;
        -webkit-text-stroke-width: 0;
        -webkit-text-stroke-color: transparent;
        transition: color 0.15s ease, transform 0.15s ease;
    }

    .module-action-btns a.btn:hover {
        background-color: var(--modern-accent-primary-12);
        border-color: var(--modern-border-soft);
    }

        .module-action-btns a.btn:hover i {
            transition: transform 0.15s ease;
            color: var(--modern-accent-emphasis);
            -webkit-text-stroke-width: 0;
            animation: none;
            transform: scale(1.2);
        }

        .module-action-btns a.btn:hover span {
            color: var(--modern-accent-emphasis);
            text-shadow: none;
        }

    .module-action-btns a.btn:focus-visible {
        outline: 0 !important;
        background-color: var(--modern-accent-primary-12);
        border-color: var(--modern-border-soft);
    }

        .module-action-btns a.btn:focus-visible i.fa {
            color: var(--theme-accent-primary) !important;
            -webkit-text-stroke-width: 0;
        }

    .module-action-btns a.dirty i.fa,
    .module-action-btns a.dirty span {
        color: var(--modern-warning-btn-hover) !important;
        transform: scale(1.1);
    }

    .module-action-btns a.dirty {
        background-color: color-mix(in srgb, var(--modern-warning-header-bg) 58%, var(--modern-white));
        border-color: color-mix(in srgb, var(--modern-warning-btn-bg) 62%, var(--modern-white));
        animation: pulse-glow-warning-tight 1.5s infinite;
    }

        .module-action-btns a.dirty:hover,
        .module-action-btns a.dirty:focus-visible {
            background-color: color-mix(in srgb, var(--modern-warning-header-bg) 78%, var(--modern-white));
            border-color: var(--modern-warning-btn-bg);
        }

        .module-action-btns a.dirty:hover,
        .module-action-btns a.dirty:focus-visible {
            animation: none;
        }

        .module-action-btns a.dirty i.fa {
            animation: pulse-warning-icon 1.5s infinite;
        }

        .module-action-btns a.dirty:hover i.fa,
        .module-action-btns a.dirty:focus-visible i.fa {
            animation: none;
            transform: scale(1.3);
        }

.module-action-overflow.collapse {
    display: none;
}

.module-action-overflow > button {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: auto;
    height: auto;
    margin-top: 0;
    padding-left: 13px;
    padding-right: 13px;
    padding-top: 6px;
    padding-bottom: 2px;
    border: 1px solid transparent;
    border-bottom: 0 !important;
    border-radius: 6px 6px 0 0;
    color: color-mix(in srgb, var(--theme-nav-secondary) 70%, var(--modern-text-muted));
    background-color: transparent;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

    .module-action-overflow > button:hover,
    .module-action-overflow > button:focus-visible,
    .module-action-overflow > button[aria-expanded="true"] {
        color: var(--modern-accent-emphasis);
        background-color: var(--modern-accent-primary-12);
        border-color: var(--modern-border-soft);
        box-shadow: inset 0 -1px 0 var(--page-accent-primary) !important;
        outline: 0;
        text-decoration: none;
    }

    .module-action-overflow > button:focus,
    .module-action-overflow > button:active {
        outline: 0;
    }

    .module-action-overflow > button > i.fa-ellipsis-v {
        font-size: 1.2em;
        line-height: 1;
        transform: none;
    }

    .module-action-overflow > button > span.fa-75 {
        margin-top: 1px;
        text-transform: uppercase;
        color: inherit;
        line-height: 1.5;
    }

    .module-action-overflow > button:hover > i.fa-ellipsis-v,
    .module-action-overflow > button:focus-visible > i.fa-ellipsis-v,
    .module-action-overflow > button[aria-expanded="true"] > i.fa-ellipsis-v {
        color: var(--modern-accent-emphasis);
        transform: scale(1.2);
    }

.module-action-overflow .dropdown-menu {
    padding: 0;
}

    .module-action-overflow .dropdown-menu > a.btn {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100%;
        margin: 0 !important;
        border: 1px solid transparent;
        border-left-width: 3px;
        border-right-width: 3px;
        border-radius: 6px;
        padding: 7px 14px !important;
        text-align: left !important;
        gap: 0.45rem;
    }

        .module-action-overflow .dropdown-menu > a.btn:hover,
        .module-action-overflow .dropdown-menu > a.btn:focus-visible {
            background-color: var(--modern-row-selected) !important;
            border-color: var(--modern-hover-edge) !important;
            border-left-color: var(--modern-btn-primary-bg) !important;
            border-right-color: var(--modern-btn-primary-bg) !important;
            border-radius: 6px;
            color: var(--modern-btn-primary-bg);
            outline: 0;
            text-decoration: none;
        }

        .module-action-overflow .dropdown-menu > a.btn > i.fa,
        .module-action-overflow .dropdown-menu > a.btn > i.fas,
        .module-action-overflow .dropdown-menu > a.btn > i.far,
        .module-action-overflow .dropdown-menu > a.btn > div.loading-icon {
            margin: 0 !important;
            font-size: 1rem;
            width: 1.05rem;
            text-align: left;
            color: inherit;
        }

        .module-action-overflow .dropdown-menu > a.btn > span.fa-75 {
            margin-top: 0;
            margin-left: 0 !important;
            text-align: left;
            display: inline !important;
        }

.module-header-container {
    height: 50px;
    min-height: 50px;
    display: flex;
}

    .module-header-container.module-header-contextless {
        height: 50px;
        min-height: 50px;
        border-bottom: solid 1px var(--page-accent-primary) !important;
    }

    .module-header-container:not(.module-header-contextless) .module-title > .module-title-text,
    .module-header-container:not(.module-header-contextless) .module-search-bar,
    .module-header-container:not(.module-header-contextless) .module-action-btns {
        transform: translateY(-1px);
    }

    .module-header-container.module-header-contextless .module-title:not(.sb-validation-alert) {
        box-shadow: none;
    }

    .module-header-container.module-header-contextless .module-title.sb-validation-alert {
        box-shadow: inset 5px 0 0 var(--modern-danger-btn-bg);
    }

.module-search-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-right: 0px;
    border-bottom: none !important;
    background-color: var(--bs-white);
    border-top: 1px solid var(--theme-nav-primary);
}

    .module-search-container.empty {
        background-color: var(--bs-white) !important;
        border-bottom: none !important;
    }

.module-title {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    flex-basis: inherit;
    flex-grow: inherit;
    flex-shrink: 0;
    border-bottom: none;
    border-right: none;
    vertical-align: middle;
    float: left;
    text-align: left;
    font-size: 1rem;
    text-shadow: none;
    width: var(--sidebar-width);
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-top: 0;
    line-height: 1.2;
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 10px;
    background-color: var(--bs-white) !important;
    color: var(--modern-accent-emphasis);
    border-top: 1px solid var(--theme-nav-primary);
    box-shadow: inset 5px 0 0 var(--theme-nav-primary), inset 6px 0 0 var(--bs-white), inset 7px 0 0 color-mix(in srgb, var(--theme-logo-green) 75%, var(--modern-white)), inset 0 -1px 0 var(--page-accent-primary);
    /* Match the card's .px-4 (24px) left inset so the RETURNS (RMA) text lines
       up with the alert and form card when the sidebar is unpinned. */
    padding-left: 24px;
}

.module-title-text {
    position: relative;
    display: inline-block;
    letter-spacing: 0.75px;
    padding-bottom: 4px;
}

.module-title-text::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: var(--modern-accent-emphasis);
    border-radius: 2px;
    transform: translateX(-50%);
    transition: width .25s ease, height .25s ease;
}

.module-title.sb-validation-alert .module-title-text::after {
    background-color: var(--modern-danger-text);
}

.module-title.module-title-linkable:hover .module-title-text::after,
.module-title.module-title-linkable:focus-within .module-title-text::after {
    width: 100%;
}

.page-loaded .module-title.sb-validation-alert {
    text-overflow: revert-layer;
    color: var(--modern-danger-text) !important;
    background-color: var(--modern-danger-header-bg) !important;
    border-top: 1px solid var(--modern-danger-btn-bg);
    /* Keep wide border red for validation, restore thin green navigation hint */
    box-shadow: inset 5px 0 0 var(--modern-danger-btn-bg), inset 6px 0 0 var(--modern-danger-header-bg), inset 7px 0 0 color-mix(in srgb, var(--theme-logo-green) 75%, var(--modern-white)), inset 0 -1px 0 var(--page-accent-primary);
}

.module-title a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: inherit;
}

    .module-title a:hover, .module-title a:focus-visible {
        outline: 0;
        color: inherit;
        text-decoration: none;
    }

.module-title.sb-validation-alert a:hover, .module-title.sb-validation-alert a:focus-visible {
    text-decoration: none;
}

.module-title.sb-validation-alert,
.module-search-container.sb-validation-alert {
    border-top-color: var(--modern-danger-btn-bg) !important;
}

.module-title.sb-validation-alert {
    background-color: var(--modern-danger-header-bg) !important;
    color: var(--modern-danger-text) !important;
    box-shadow: inset 5px 0 0 var(--modern-danger-btn-bg), inset 0 -1px 0 var(--modern-danger-border);
}

.module-title a,
.module-title a:hover,
.module-title a:focus-visible {
    color: inherit !important;
    text-decoration: none !important;
    text-decoration-color: currentColor !important;
}

.module-subheader-container {
    height: 45px;
    min-height: 45px;
    display: flex;
    margin-top: -1px;
    box-shadow: inset 0 1px 0 var(--page-accent-primary), inset 0 -1px 0 color-mix(in srgb, var(--theme-nav-primary) 18%, transparent);
}

.module-sidebar-nav-title {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: inherit;
    height: 45px !important;
    padding: 8px 0px;
    position: relative;
    flex-basis: inherit;
    flex-grow: inherit;
    flex-shrink: 0;
    float: left;
    width: var(--sidebar-width);
    text-align: left;
    background-color: var(--theme-nav-secondary);
}

.module-subheader-overflow-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    padding-right: 0px;
    border-bottom: none !important;
    background-color: var(--theme-nav-secondary);
    position: relative;
    transition: padding-right 0.3s ease;
}

    .module-subheader-overflow-container::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: 1px 0 0 0;
        background-color: var(--modern-row-selected);
        pointer-events: none;
        border-bottom: 1px solid var(--modern-border);
    }

    .module-subheader-overflow-container > .module-subheader-page-title {
        position: relative;
        color: var(--modern-text-hover);
        background-color: transparent;
        font-weight: 700;
        font-size: 16px;
        text-align: center;
        min-height: 100%;
        overflow: hidden;
    }

/* Left-align pill with search box when a sidebar exists and is unpinned; center and reserve
   space when pinned. Requiring .sitenav-sidebar-selected to be present means pages with no
   sidebar at all (Default master HideSidebar) fall through to the default centered state. */
.module-subheader-container:has(.sitenav-sidebar-selected):not(:has(.sitenav-sidebar-selected.pinned)) > .module-subheader-overflow-container > .module-subheader-page-title {
    text-align: left;
}

.module-subheader-overflow-container > .module-subheader-page-title > span {
    background-color: var(--modern-white);
    padding: 6px 18px;
    border: 1px solid color-mix(in srgb, var(--theme-logo-green) 35%, var(--modern-white));
    border-radius: 6px;
    font-size: 15px;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 1px 2px var(--modern-shadow-black-08), 0 2px 6px var(--modern-shadow-black-08);
    color: var(--modern-text);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: calc(100% - 50px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-loaded .module-subheader-overflow-container > .module-subheader-page-title > span {
    transition: left 0.3s ease, transform 0.3s ease;
}

.module-subheader-container:has(.sitenav-sidebar-selected):not(:has(.sitenav-sidebar-selected.pinned)) > .module-subheader-overflow-container > .module-subheader-page-title > span {
    left: 25px;
    transform: translateY(-50%);
    max-width: calc(100% - 50px);
}

.module-subheader-overflow-container > .module-subheader-page-title > span:empty {
    visibility: hidden;
}

.module-subheader-page-title {
    flex-grow: 2;
    padding-left: 10px;
    padding-right: 11px;
    color: var(--bs-white);
    text-align: center;
    text-transform: uppercase;
}

.module-search-bar {
    flex-grow: 2;
    padding-left: 25px;
    padding-right: 11px;
    position: relative;
}

    .module-search-bar:has(.dropdown-menu.show) {
        z-index: 1055;
    }

    .module-search-bar .dropdown-menu.show {
        z-index: 1056;
    }

    .module-search-bar .fa {
        display: inline-block;
        transition: transform 0.15s ease;
        transform-origin: center center;
        color: var(--modern-text-muted);
    }


    .module-search-bar button.input-group-text:not(:disabled):hover .fa,
    .module-search-bar button.input-group-text:focus-visible .fa,
    .module-search-bar button:hover .fa {
        transform: scale(1.1);
    }


    .module-search-bar .dropdown-toggle:after {
        margin-left: 0em;
    }



    .module-search-bar button:hover {
        color: var(--modern-accent-emphasis);
    }

    .module-search-bar button.input-group-text:focus-visible {
        color: var(--modern-accent-emphasis) !important;
    }

    .module-search-bar button:hover .fa,
    .module-search-bar button:focus-visible .fa,
    .module-search-bar .input-group.dropdown-open button[aria-expanded="true"] .fa {
        color: var(--modern-accent-emphasis);
        transform: scale(1.1);
    }

    .module-search-bar .dropdown-toggle::after {
        border-top-color: var(--modern-text-muted);
        transform-origin: center center;
        transition: border-color 0.15s ease, transform 0.15s ease;
    }

    .module-search-bar .dropdown-toggle:hover::after,
    .module-search-bar .dropdown-toggle:focus-visible::after,
    .module-search-bar .dropdown-toggle[aria-expanded="true"]::after {
        border-top-color: var(--modern-accent-emphasis);
        transform: scale(1.1);
    }

    .module-search-bar .input-group:has(#txtFindSolution:focus) > .input-group-text,
    .module-search-bar .input-group:has(input.search-control:focus) > .input-group-text {
        border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white);
    }

    .module-search-bar .input-group:has(#txtFindSolution:focus) > .dropdown-toggle,
    .module-search-bar .input-group:has(input.search-control:focus) > .dropdown-toggle {
        border-left-color: transparent;
        border-right-color: transparent;
    }

    .module-search-bar .input-group:has(#txtFindSolution:focus) > #txtFindSolution,
    .module-search-bar .input-group:has(input.search-control:focus) > input.search-control {
        border-right-color: transparent !important;
    }

    .module-search-bar .input-group:has(#txtFindSolution:focus) > .dropdown-toggle ~ .input-group-text,
    .module-search-bar .input-group:has(input.search-control:focus) > .dropdown-toggle ~ .input-group-text {
        border-left-color: transparent;
    }

    .module-search-bar .input-group > .input-group-text {
        border-left-color: transparent;
        border-right-color: transparent;
    }

        .module-search-bar .input-group > .input-group-text:first-child {
            border-left-color: var(--modern-border);
        }

    .module-search-bar .input-group > #txtFindSolution,
    .module-search-bar .input-group > input[id$="_txtFindSolution"],
    .module-search-bar .input-group > input.search-control,
    .module-search-bar .input-group > select.search-control,
    .module-search-bar .input-group > input.filter-control {
        border-right-width: 0 !important;
    }

    .module-search-bar .input-group > .dropdown-toggle {
        border-left-width: 0 !important;
    }

    .module-search-bar .input-group > .dropdown > .dropdown-toggle,
    .module-search-bar .input-group > .dropdown > .input-group-text {
        border-width: 0 !important;
        box-shadow: none !important;
    }

    .module-search-bar .input-group > .dropdown-toggle:has(~ .input-group-text:not([disabled]):not(.d-none):not([style*="display: none"]):not([style*="display:none"])) {
        border-right-width: 0 !important;
    }

    .module-search-bar .input-group > .dropdown-toggle ~ .input-group-text {
        border-left-width: 0 !important;
    }

    .module-search-bar .input-group > :first-child {
        border-left-width: 1px !important;
    }

    .module-search-bar .input-group > :last-child {
        border-right-width: 1px !important;
        border-right-color: var(--modern-border);
    }

    /* Make header search input-group a single bordered shell with no internal seams. */
    .module-search-bar .input-group {
        border: 1px solid var(--modern-border);
        border-radius: var(--bs-border-radius);
        flex-wrap: nowrap;
        min-height: 38px;
        overflow: visible;
    }

        .module-search-bar .input-group > input,
        .module-search-bar .input-group > select {
            min-width: 0;
        }

        .module-search-bar .input-group > :not(:first-child) {
            margin-left: 0 !important;
        }

        .module-search-bar .input-group > .input-group-text,
        .module-search-bar .input-group > #txtFindSolution,
        .module-search-bar .input-group > input[id$="_txtFindSolution"],
        .module-search-bar .input-group > input.search-control,
        .module-search-bar .input-group > select.search-control,
        .module-search-bar .input-group > input.filter-control {
            border-width: 0 !important;
            box-shadow: none !important;
        }

        .module-search-bar .input-group:has(#txtFindSolution:focus),
        .module-search-bar .input-group:has(input.search-control:focus) {
            border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white);
        }

/***********************************************************************************************************************************************************/
/* Site Top Menu Styles */
/***********************************************************************************************************************************************************/

.oe_sitemenu {
    height: 40px;
    z-index: 1000;
}

ul.oe_sitemenu {
    background-color: var(--theme-nav-primary);
    list-style: none;
    text-align: center;
    color: var(--bs-white);
    padding-top: 8px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

    .module-top-header-container .module-mobile-profile-context.sb-validation-alert {
        color: var(--modern-danger-text);
        background-color: var(--modern-danger-header-bg);
        border-top-color: var(--modern-danger-btn-bg);
        border-bottom-color: var(--modern-danger-btn-bg);
    }

    ul.oe_sitemenu > li {
        position: relative;
    }

        ul.oe_sitemenu > li > div {
            position: absolute;
            top: 100%;
            left: 0;
            display: none;
            pointer-events: auto !important;
            visibility: visible !important;
            background-color: var(--modern-white);
            border: 1px solid var(--modern-border);
            border-top: none;
            border-bottom-left-radius: 8px;
            border-bottom-right-radius: 8px;
            box-shadow: 0 4px 12px var(--modern-shadow-black-10);
            padding: 6px 0;
        }

        ul.oe_sitemenu > li > span {
            user-select: none;
        }

        ul.oe_sitemenu > li:focus-within {
            background-color: transparent !important;
            box-shadow: none;
        }

            ul.oe_sitemenu > li:focus-within > span,
            ul.oe_sitemenu > li:focus-within > a {
                background-color: var(--modern-white-25) !important;
                color: var(--bs-white) !important;
                text-decoration: none !important;
                text-shadow: none !important;
            }

        ul.oe_sitemenu > li > a {
            display: table-cell;
            background-color: var(--theme-nav-primary);
            color: var(--bs-white) !important;
            text-shadow: none;
            text-decoration: none;
            font-weight: normal;
            font-size: 1rem;
            width: 110px;
            height: 98px;
            margin: 0px;
            text-align: center;
            vertical-align: middle;
        }

            ul.oe_sitemenu > li > a:focus-visible {
                outline: 0;
                background-color: var(--modern-white-25) !important;
                color: var(--bs-white) !important;
                text-decoration: none !important;
                text-shadow: none !important;
                box-shadow: none;
            }

        ul.oe_sitemenu > li:hover {
            color: var(--bs-white) !important;
        }

        ul.oe_sitemenu > li > a:hover,
        ul.oe_sitemenu > li.selected > a {
            background-color: var(--modern-accent-focus) !important;
            color: var(--bs-white) !important;
        }

    ul.oe_sitemenu div {
        left: 1px;
        background-color: var(--theme-nav-primary);
        width: auto;
        height: auto;
        padding: 5px 0px 0px 10px;
        display: none;
        width: 100%;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

        ul.oe_sitemenu div ul {
            padding-left: 0px;
            text-transform: initial !important;
        }

            ul.oe_sitemenu div ul li a {
                text-decoration: none;
                display: block;
                font-weight: normal;
                text-shadow: none;
                text-align: left;
                color: var(--modern-text) !important;
                font-size: 1rem;
                padding: 0 !important;
                margin: 0 !important;
            }

            ul.oe_sitemenu div ul li {
                cursor: pointer;
                margin-top: 3px;
                margin-bottom: 2px;
                margin-left: -9px;
                padding-top: 3px;
                padding-bottom: 3px;
                padding-left: 10px;
                border-left: solid 5px;
                border-left-color: var(--theme-nav-primary);
                border-right: solid 1px var(--theme-nav-primary);
                border-bottom-left-radius: 0.5rem;
                border-bottom-right-radius: 0.5rem;
                border: 1px solid transparent;
                border-left-width: 3px;
                border-right-width: 3px;
                border-radius: 6px;
                margin: 0 !important;
                padding: 7px 14px !important;
                transition: background-color 0.15s, border-color 0.15s;
            }

                ul.oe_sitemenu div ul li.divider hr.dropdown-divider {
                    margin: .15rem 0;
                    border-bottom: 1px solid var(--modern-white-20);
                    color: var(--modern-border);
                    border-bottom-color: var(--modern-border);
                }

                ul.oe_sitemenu div ul li:not(.divider):hover {
                    cursor: pointer;
                    border-bottom-left-radius: 0.5rem;
                    border-bottom-right-radius: 0.5rem;
                    background-color: var(--modern-row-selected) !important;
                    border-color: var(--modern-hover-edge) !important;
                    border-left: 3px solid var(--modern-btn-primary-bg) !important;
                    border-right: 3px solid var(--modern-btn-primary-bg) !important;
                    border-radius: 6px;
                }

                ul.oe_sitemenu div ul li:not(.divider):focus-within {
                    background-color: var(--modern-row-selected) !important;
                    border-color: var(--modern-hover-edge) !important;
                    border-left: 3px solid var(--modern-btn-primary-bg) !important;
                    border-right: 3px solid var(--modern-btn-primary-bg) !important;
                    border-radius: 6px;
                    box-shadow: 0 0 0 0.16rem color-mix(in srgb, var(--modern-accent-focus) 18%, transparent);
                }

                ul.oe_sitemenu div ul li:hover a {
                    color: var(--theme-nav-primary) !important;
                    background: var(--bs-white);
                    text-decoration: none !important;
                    text-decoration-thickness: initial !important;
                    text-shadow: none !important;
                }

                ul.oe_sitemenu div ul li a:focus-visible {
                    outline: 0;
                    color: var(--theme-nav-primary) !important;
                    text-decoration: none !important;
                    text-shadow: none !important;
                }

                ul.oe_sitemenu div ul li a:hover {
                    background: var(--bs-white);
                    color: var(--bs-gray);
                    text-decoration: none !important;
                    text-decoration-thickness: initial !important;
                    text-shadow: none !important;
                }

    ul.oe_sitemenu li ul {
        list-style: none;
        float: left;
        width: 200px;
        margin-right: 10px;
        width: 100%;
    }

.oe_sitemenu ul li div ul li a i.fa {
    margin-top: 4px;
    color: var(--modern-text-muted);
}

.oe_sitemenu ul li div ul li:hover a .fa:hover {
    vertical-align: middle;
    color: var(--modern-accent-emphasis);
}


.oe_sitemenu li > span:focus-visible {
    outline: 0;
    color: var(--bs-white) !important;
}


ul.oe_sitemenu div ul li:hover a,
ul.oe_sitemenu div ul li a:hover {
    color: var(--modern-btn-primary-bg) !important;
    background: transparent !important;
}

.oe_sitemenu ul li div ul li:hover a i.fa {
    color: var(--modern-btn-primary-bg);
}

ul.oe_sitemenu > li > a:hover,
ul.oe_sitemenu > li.selected > a,
ul.oe_sitemenu > li:hover > span,
ul.oe_sitemenu > li:hover > a {
    background-color: var(--modern-white-25) !important;
    color: var(--bs-white) !important;
}

/***********************************************************************************************************************************************************/
/* Sidebar Menu */
/***********************************************************************************************************************************************************/

.sitenav-sidebar-options-container {
    width: var(--sidebar-width);
    color: white;
    background-color: var(--modern-row-selected);
    box-shadow: 1px 0 0 color-mix(in srgb, var(--theme-nav-primary) 16%, transparent), 2px 0 6px var(--modern-shadow-black-08);
    z-index: 1;
}

.sitenav-sidebar-options::-webkit-scrollbar {
    width: 14px !important;
}

.sitenav-sidebar-options::-webkit-scrollbar-track {
    background: var(--bs-white) !important;
    border-left: 1px solid var(--modern-border) !important;
    border-bottom-right-radius: 10px;
}

.sitenav-sidebar-options::-webkit-scrollbar-thumb {
    background: var(--modern-btn-primary-bg) !important;
    background-clip: padding-box !important;
    border: 4px solid transparent !important;
    border-radius: 999px !important;
}

    .sitenav-sidebar-options::-webkit-scrollbar-thumb:hover {
        background-color: var(--modern-btn-primary-hover) !important;
    }

.sitenav-sidebar {
    top: inherit !important;
    position: relative !important;
    margin-top: -8px;
    font-size: inherit;
    height: 45px !important;
    font-weight: 500;
    cursor: pointer;
    color: var(--bs-white);
    width: var(--sidebar-width);
    text-align: left;
    left: 0;
}

.sitenav-sidebar-selected {
    position: absolute;
    display: flex;
    align-items: center;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 11px 14px 11px 20px;
    -moz-transition: all 0.1s ease-in;
    -o-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
    text-transform: uppercase;
    /* Match selected menu color (title color set on .sitenav-sidebar-selected-title; validation-error overrides to red). */
    background-color: var(--modern-row-active) !important;
    color: var(--modern-text);
    /* Match the subheader hairlines where the selected item covers the row. */
    box-shadow: inset 0 1px 0 var(--page-accent-primary), inset 0 -1px 0 color-mix(in srgb, var(--theme-nav-primary) 18%, transparent);
    /* State accent lives in a 5px left border (blue normal / red invalid / gold
       missing-info), matching the menu items below. The title/caret/pin stay a
       neutral dark primary in every state; only this border changes by state. */
    border-left: 5px solid var(--modern-nav-selected);
    /* Match the card's .px-4 (24px) left inset so the PRIMARY INFORMATION text
       lines up with the alert and form card when the sidebar is unpinned. The
       5px border above is subtracted here so the text x-position is unchanged. */
    padding-left: 19px;
}

    .sitenav-sidebar-selected.disabled {
        cursor: default;
    }

.sitenav-sidebar-selected-title {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: .95rem;
    letter-spacing: .2px;
    font-weight: 400;
}

.sitenav-sidebar-title-stack {
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    max-width: calc(var(--sidebar-width) - 92px);
    margin-right: 12px;
}

    .sitenav-sidebar-title-stack .sitenav-sidebar-selected-title {
        flex: 0 1 auto;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
    }

.module-mobile-context-title {
    display: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.sitenav-sidebar-selected-actions {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 6px;
    padding-left: 8px;
    border-left: 1px solid color-mix(in srgb, var(--theme-nav-primary) 18%, transparent);
    color: var(--theme-nav-primary);
}


.sitenav-sidebar-step-stack {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: 20px;
    height: 30px;
}

    .sitenav-sidebar-step-stack.collapse {
        display: none;
    }

.sitenav-sidebar-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 13px;
    padding: 0 !important;
    border: 0;
    color: var(--theme-nav-primary);
    text-decoration: none !important;
    line-height: 1;
    transition: color 0.15s ease, transform 0.15s ease;
}

    .sitenav-sidebar-step:hover,
    .sitenav-sidebar-step:focus-visible {
        color: var(--modern-accent-focus);
        text-decoration: none !important;
        transform: scale(1.15);
    }

    .sitenav-sidebar-step:active,
    .sitenav-sidebar-step:focus {
        border: 0;
        box-shadow: none;
        text-decoration: none !important;
    }

    .sitenav-sidebar-step i {
        font-size: 14px;
        line-height: 1;
    }

.sitenav-sidebar-selected.disabled .sitenav-sidebar-selected-actions {
    display: none;
}

.sitenav-sidebar-selected-pin {
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 24px;
    margin-top: 1px;
    margin-left: 2px;
    opacity: .5;
    transition: transform 0.15s ease;
    color: var(--theme-nav-primary);
}

.sitenav-sidebar-selected-pin:not(.selected):hover {
    opacity: 1;
    animation: pulse-glow-danger 1.5s ease-in-out 0s 5;
    animation: nudge 0.3s ease;
}

.sitenav-sidebar-selected-pin.selected {
    opacity: 1;
    transform: rotate(90deg);
    color: var(--theme-nav-primary);
}

.sitenav-sidebar-selected.sb-validation-alert {
    background-color: var(--modern-row-active) !important;
}

    .sitenav-sidebar-selected.sb-validation-alert:hover,
    .sitenav-sidebar-selected.sb-validation-alert.expanded:not(.pinned) {
        /* Hover to the same light-blue preview as every other selected header.
           !important is required to beat the resting --modern-row-active !important
           above; previously this tried to go bright red without !important, so the
           resting rule won and the header showed no hover at all. */
        background-color: var(--modern-row-hover) !important;
    }

.sitenav-sidebar-selected:not(.sb-validation-alert):hover {
    background-color: var(--modern-accent-focus);
}

/* Missing-info selected section: gold left border only, on the standard selected
   surface. Title/caret/pin stay neutral; no gold background and no special hover
   so it shares the normal selected-header hover (light-blue). */
.sitenav-sidebar-selected.warning {
    border-left-color: var(--modern-warning-icon) !important;
}

.sitenav-sidebar-selected:not(.sb-validation-alert):hover,
.sitenav-sidebar-selected:not(.sb-validation-alert).expanded:not(.pinned),
.sitenav-sidebar-selected:not(.sb-validation-alert).pinned {
    background-color: var(--modern-row-hover) !important;
}

.sitenav-sidebar-options {
    display: inline-block !important;
    overflow-y: auto !important;
    width: var(--sidebar-width);
    top: inherit !important;
    background-color: var(--bs-white);
    position: absolute;
    right: 0;
    left: 0;
    z-index: 999;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 400px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-right: 1px solid var(--modern-border);
    border-bottom: 1px solid var(--modern-border);
}

    .sitenav-sidebar-options.pinned {
        display: inherit !important;
        position: relative !important;
        top: inherit !important;
        border: none;
        border-bottom-left-radius: 0px !important;
        border-bottom-right-radius: 0px !important;
        border-left: 0;
        max-height: 100%;
    }

        /* Keep pinned side-nav selected row on the same surface as the selected state.
           Also override legacy Core.css white background for selected validation rows. */
        .sitenav-sidebar-options.pinned li.selected,
        .sitenav-sidebar-options.pinned li.sb-validation-alert.selected {
            background-color: var(--modern-row-active) !important;
        }

    .sitenav-sidebar-options a:not(:empty) {
        text-decoration: inherit;
    }

    .sitenav-sidebar-options li {
        letter-spacing: 1px;
        padding: 10px 5px 10px 5px;
        border-left: solid 5px var(--theme-nav-secondary);
        cursor: pointer;
        margin: 0;
        -moz-transition: all 0.1s ease-in;
        -o-transition: all 0.1s ease-in;
        -webkit-transition: all 0.1s ease-in;
        transition: all 0.1s ease-in;
        border-right: 0;
        background-color: var(--modern-row-selected);
        border-left-color: var(--modern-row-selected);
        border-bottom: 1px solid var(--modern-nav-secondary-35);
        box-shadow: inset 0 1px 0 var(--modern-white-70);
        margin-bottom: 0;
        /* Nudge nav text from 20px (5px border + 5px pad + 10px indent) to 24px so
       it aligns with the PRIMARY INFORMATION title and the form card edge. */
        text-indent: 14px;
    }

        .sitenav-sidebar-options li:not(.sb-validation-alert).selected {
            border-left: 5px solid var(--modern-nav-selected);
        }

        .sitenav-sidebar-options li.sb-validation-alert {
            border-right: 0 !important;
            color: var(--bs-dark);
            border-left: 5px solid var(--bs-red) !important;
            position: relative;
            padding-left: 1.25em;
            /* Soft danger surface, matching the INFO error tooltip
               (--modern-danger-header-bg). The .selected rule below overrides this
               with the standard blue selected surface, same pattern as missing-info. */
            background-color: var(--modern-danger-header-bg) !important;
            border-left-color: var(--modern-danger-btn-bg) !important;
        }

            .sitenav-sidebar-options li.sb-validation-alert.selected {
                background-color: var(--modern-row-active) !important;
            }

        .sitenav-sidebar-options li.sidebar-missing-info {
            border-right: 0 !important;
        }

        /* Truncate long section labels to a single line with an ellipsis, matching
       the header title behavior, so labels like "Universal Traffic Generator"
       no longer wrap. Validation icon is a ::before on the li, so it is unaffected. */
        .sitenav-sidebar-options li a {
            display: block;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            padding-right: 10px;
            text-decoration: none;
        }

        .sitenav-sidebar-options li:not(.selected) a {
            color: var(--modern-text);
        }

        .sitenav-sidebar-options li a:focus-visible {
            outline: 0;
            color: inherit;
            text-underline-offset: 5px !important;
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-decoration-color: inherit;
        }

        .sitenav-sidebar-options li.selected a:focus-visible {
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-decoration-color: var(--theme-nav-secondary) !important;
        }

        .sitenav-sidebar-options li.sidebar-missing-info a:focus-visible {
            text-decoration-color: var(--bs-warning) !important;
        }

        .sitenav-sidebar-options li.sb-validation-alert a:focus-visible {
            text-decoration-color: var(--bs-danger) !important;
        }

        .sitenav-sidebar-options li:not(.selected):hover {
            background-color: var(--modern-row-hover);
            border-left: 5px solid var(--theme-nav-secondary);
        }

        .sitenav-sidebar-options li.selected {
            color: var(--theme-nav-primary);
            border-left: 5px solid transparent;
            background-color: var(--modern-row-active);
        }

            .sitenav-sidebar-options li.selected a {
                text-decoration: none;
                color: var(--modern-nav-selected);
                font-weight: 600;
            }

        .sitenav-sidebar-options li:not(.selected):hover a {
            text-decoration: inherit;
            color: var(--modern-text);
        }

        .sitenav-sidebar-options li a:hover {
            color: inherit !important;
            text-decoration: inherit !important;
            text-decoration-thickness: inherit !important;
            text-shadow: none !important;
        }

        .sitenav-sidebar-options li:not(.selected):hover a {
            color: var(--modern-text) !important;
        }

        .sitenav-sidebar-options li.selected:hover a {
            color: var(--modern-nav-selected) !important;
            text-decoration: none !important;
        }

        .sitenav-sidebar-options li.sb-validation-alert::before {
            content: "\f071";
            font-family: "Font Awesome 6 Free";
            font-weight: 900;
            color: var(--modern-danger-text);
            position: absolute;
            left: 5px;
            top: calc(50% - .5em);
            line-height: 1;
        }

        .sitenav-sidebar-options li.sb-validation-alert:not(.selected):hover::before {
            animation: nudge 0.3s ease-in-out 1;
        }

        .sitenav-sidebar-options li.sb-validation-alert a {
            padding-left: 8px;
        }

        .sitenav-sidebar-options li.sb-validation-alert:not(.selected) a {
            padding-left: 8px;
        }

        .sitenav-sidebar-options li.sb-validation-alert:not(.selected):hover {
            background-color: var(--modern-row-hover) !important;
        }

        .sitenav-sidebar-options li.sb-validation-alert::before {
            color: var(--modern-danger-text) !important;
        }

        /* Warning/error state is carried by the icon, left border, and subtle surface;
   keep labels neutral so adorned rows do not compete with the selected item. */
        .sitenav-sidebar-options li.sidebar-missing-info:not(.selected) a,
        .sitenav-sidebar-options li.sb-validation-alert:not(.selected) a,
        .sitenav-sidebar-options li.sidebar-missing-info:not(.selected) a:focus-visible,
        .sitenav-sidebar-options li.sb-validation-alert:not(.selected) a:focus-visible {
            color: var(--modern-text) !important;
            text-decoration-color: var(--modern-text) !important;
        }

/* Invalid selected section: the danger signal moves to the left border only;
   title/caret/pin stay the neutral dark primary like every other state. */
.sitenav-sidebar-selected.sb-validation-alert {
    border-left-color: var(--modern-danger-btn-bg) !important;
}

.ml-sidebar {
    margin-left: var(--sidebar-width);
}

.sidebar-missing-info {
    background-color: var(--modern-warning-surface) !important;
    /* Match the warning alert's gold (var(--modern-warning-icon)) for the accent border + icon. */
    border-left: 5px solid var(--modern-warning-icon) !important;
    position: relative;
    padding-left: 1.25em !important;
}

    /* When this item is the active section it adopts the standard selected
       surface + text (blue), but keeps a darker warning left border and icon so
       the "missing information" warning identity persists. */
    .sidebar-missing-info.selected {
        background-color: var(--modern-row-active) !important;
        border-left-color: var(--modern-warning-icon) !important;
    }

    /* Hover toward the same light-blue preview every other nav item uses, instead
       of staying flat cream. The !important resting background otherwise beats the
       generic li:hover rule, so this restores a consistent hover for this item. */
    .sidebar-missing-info:not(.selected):hover {
        background-color: var(--modern-row-hover) !important;
    }

    .sidebar-missing-info::before {
        content: "\f071"; /* Unicode for FontAwesome's triangle-exclamation */
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        color: var(--modern-warning-icon);
        position: absolute;
        left: 5px;
        top: calc(50% - .5em);
        line-height: 1;
    }

    .sidebar-missing-info:not(.selected):hover::before {
        animation: nudge 0.3s ease-in-out 1;
    }

    /* Use the darker warning icon on selected/hovered surfaces so it remains visible. */
    .sidebar-missing-info.selected::before {
        color: var(--modern-warning-icon);
    }

    .sidebar-missing-info:hover::before {
        color: var(--modern-warning-icon);
    }

    .sidebar-missing-info a {
        /* No color override here: let the standard
           .sitenav-sidebar-options li(:not(.selected)|.selected) a rules drive
           the text color so this item reads --modern-text by default and the
           standard selected color when selected, like every other menu item. */
        padding-left: 8px;
    }

/***********************************************************************************************************************************************************/
/* Content Container Loading  */
/***********************************************************************************************************************************************************/

/* Hide search container until page is fully loaded. */
html:not(.page-loaded) .module-search-container > * {
    visibility: hidden;
}

/* Modern form: main content scrollbar */
.main-content-container-scroll::-webkit-scrollbar {
    width: 14px;
}

.main-content-container-scroll::-webkit-scrollbar-track {
    background: var(--bs-white);
}

.main-content-container-scroll::-webkit-scrollbar-thumb {
    background: var(--modern-btn-primary-bg);
    border: 3px solid var(--bs-white);
    border-radius: 7px;
}

    .main-content-container-scroll::-webkit-scrollbar-thumb:hover {
        background: var(--modern-btn-primary-hover);
    }

.contentContainer {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

    .contentContainer .loading-placeholder {
        display: none;
    }

    .contentContainer.loading .loading-placeholder {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 9999;
    }

    .contentContainer > .loading-placeholder {
        flex-shrink: 0;
    }

/* Fixed, top-center notice shown by the startup gate when page load exceeds the
   slow threshold. Colors come from the themed .alert-warning; this only handles
   placement and stacking. */
.startup-slow-notice {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 1rem;
    max-width: min(92vw, 640px);
    /* Above the full-viewport content-loading overlay (.loading-placeholder,
       z-index: 9999 above), which is otherwise transparent and would intercept
       clicks on the Reload button. */
    z-index: 10000;
}

/* Match the reference themed warning action button (deeper mustard + white text)
   instead of the bright default .btn-warning amber. */
.startup-slow-notice .btn-warning {
    background-color: var(--modern-warning-btn-bg) !important;
    border-color: var(--modern-warning-btn-bg) !important;
    color: var(--modern-white) !important;
}

.startup-slow-notice .btn-warning:hover,
.startup-slow-notice .btn-warning:focus,
.startup-slow-notice .btn-warning:focus-visible {
    background-color: var(--modern-warning-btn-hover) !important;
    border-color: var(--modern-warning-btn-hover) !important;
    color: var(--modern-white) !important;
}

/***********************************************************************************************************************************************************/
/* Form Body styles */
/***********************************************************************************************************************************************************/
body {
    --theme-nav-primary: var(--modern-btn-primary-hover);
    --bs-focus-shadow-accent: 0 0 0 0.2rem color-mix(in srgb, var(--modern-accent-focus) 28%, transparent), 0 1px 0 0 color-mix(in srgb, var(--modern-accent-focus) 65%, transparent);
    --bs-focus-shadow-danger: 0 0 0 0.2rem color-mix(in srgb, var(--bs-danger) 28%, transparent), 0 1px 0 0 color-mix(in srgb, var(--bs-danger) 65%, transparent);
}

/* Modern card section styling */
.formPanel .card,
.modal-body .card {
    border: 1px solid var(--modern-card-border);
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px var(--modern-shadow-black-07);
}

.formPanel .card-header,
.modal-body .card-header {
    background-color: transparent;
    border-bottom: 1px solid var(--modern-card-header-border);
    font-size: 1.02rem;
    font-weight: 450;
    letter-spacing: 0.06em;
    color: color-mix(in srgb, var(--theme-nav-primary) 72%, var(--modern-text));
    text-transform: uppercase;
    padding: 0.85rem 1.25rem;
}

.modal-footer button.btn-ok.dirty {
    animation: pulse-glow-info 1.5s infinite;
}

.card-header-subtitle {
    font-size: 0.84rem;
    font-weight: 400;
    color: var(--modern-text-slate-muted);
    margin-top: 0.2rem;
    letter-spacing: normal;
    line-height: 1.35;
    text-transform: none;
}

.card-header-metadata-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    border: 1px solid color-mix(in srgb, var(--modern-accent-focus) 42%, var(--modern-border));
    border-radius: 0.375rem;
    background-color: color-mix(in srgb, var(--modern-accent-focus) 14%, var(--modern-white));
    color: color-mix(in srgb, var(--theme-nav-primary) 88%, var(--modern-text));
}

.card-header-audit-metadata {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 0;
    row-gap: 0.45rem;
    color: var(--modern-text-slate-muted);
    font-size: 0.82rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.35;
    margin-top: 0.7rem;
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
    border-top: 1px solid color-mix(in srgb, var(--modern-border) 65%, transparent);
    text-transform: none;
}

.activity-card-header {
    align-items: center !important;
}

    .activity-card-header:has(.card-header-audit-metadata:not(.collapse)) {
        padding-bottom: 0;
    }

.card-header-audit-metadata.collapse {
    display: none;
}

.card-header-audit-metadata-item {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    min-width: 0;
}

.card-header-audit-metadata-separator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    color: color-mix(in srgb, var(--modern-accent-focus) 58%, var(--modern-text-slate-muted));
    font-size: 0.5rem;
    line-height: 1;
    transform: translateY(-1px);
}

.card-header-audit-metadata-label {
    color: color-mix(in srgb, var(--modern-text-slate-muted) 86%, var(--modern-text));
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.card-header-audit-metadata-value {
    color: var(--modern-text);
}

    .card-header-audit-metadata-value strong {
        display: inline-block;
        max-width: 40ch;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
        color: var(--modern-text-strong);
        font-weight: 600;
    }

    .dropdown-stack-on-wrap.is-stacked {
        width: 100%;
    }

    .dropdown-stack-on-wrap.is-stacked > .btn-group {
        display: flex;
        width: 100%;
        max-width: 100%;
    }

    .dropdown-stack-on-wrap.is-stacked > .btn-group + .btn-group {
        margin-top: 0.4rem;
    }

    .dropdown-stack-on-wrap.btn-group.is-stacked > .btn-group > .btn:first-child {
        border-top-left-radius: var(--bs-border-radius);
        border-bottom-left-radius: var(--bs-border-radius);
    }

    .dropdown-stack-on-wrap.btn-group.is-stacked > .btn-group > .dropdown-list-mode {
        border-top-right-radius: var(--bs-border-radius);
        border-bottom-right-radius: var(--bs-border-radius);
    }

    @media (max-width: 767px) {
    .activity-card-header-top {
        flex-wrap: wrap;
        align-items: flex-start !important;
        gap: 0.75rem;
    }

    .activity-card-header-title-block {
        min-width: 0;
        flex: 1 1 100%;
    }

    .activity-card-header-controls {
        width: 100%;
        margin-left: 0 !important;
    }

        .activity-card-header-controls > .btn-group {
            display: flex;
            width: 100%;
        }

            .activity-card-header-controls > .btn-group > .btn-info.btn-autosize:first-child {
                flex: 0 0 auto;
            }

            .activity-card-header-controls > .btn-group > .btn-info.btn-autosize:not(:first-child) {
                flex: 1 1 auto;
                min-width: 0;
            }

            .activity-card-header-controls > .btn-group > .dropdown-list-mode {
                flex: 0 0 auto;
            }

    .activity-card-header .card-header-audit-metadata {
        row-gap: 0.3rem;
    }

    .activity-card-header .card-header-audit-metadata-item {
        width: 100%;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 0.35rem;
    }

    .activity-card-header .card-header-audit-metadata-label {
        flex: 0 0 5.75rem;
        max-width: 5.75rem;
    }

    .activity-card-header .card-header-audit-metadata-value {
        flex: 1 1 auto;
        min-width: 0;
    }

    .activity-card-header .card-header-audit-metadata-separator {
        display: none;
    }
}

/* Highlight section card tied to selected summary-panel item (absent when nothing selected). */
.card.page-summary-active-card {
    border-color: color-mix(in srgb, var(--modern-accent-focus) 25%, white);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--modern-accent-focus) 15%, transparent), 0 2px 10px var(--modern-shadow-black-08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Flag cards with invalid fields via softened danger border (placed after selection rule so invalid overrides selected). */
.card.card-validation-alert {
    border-color: color-mix(in srgb, var(--modern-danger-btn-bg) 25%, white);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--modern-danger-btn-bg) 15%, transparent), 0 2px 10px var(--modern-shadow-black-08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.formPanel .card-body,
.modal-body .card-body {
    padding: 1.5rem 1.25rem;
}

    /* Increase row spacing inside cards for less dense forms */
    .formPanel .card-body > .row,
    .modal-body .card-body > .row,
    .formPanel .card-body > div > .row,
    .modal-body .card-body > div > .row {
        margin-bottom: 0.85rem !important;
    }

        .formPanel .card-body > .row:last-child,
        .modal-body .card-body > .row:last-child {
            margin-bottom: 0 !important;
        }

.feedback-attachments {
    background-color: transparent;
}

#feedback-attachments-card .card-body {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.feedback-attachments-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    padding: 0 0 0.25rem 0;
}

.feedback-attachments-count {
    font-size: 0.84rem;
    color: var(--modern-text-slate-muted);
}

.feedback-attachments-list {
    background-color: transparent;
}

.feedback-attachments-empty {
    padding: 0;
    color: var(--modern-text-slate-muted);
    font-style: italic;
}

.feedback-attachment-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.2rem 0;
}

.feedback-attachment-icon {
    color: var(--modern-info-btn-bg);
}

.feedback-attachment-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--modern-text);
}

.btn.btn-link.feedback-attachment-remove {
    flex-shrink: 0;
    padding: 0;
    color: var(--theme-accent-primary) !important;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

    .btn.btn-link.feedback-attachment-remove:hover,
    .btn.btn-link.feedback-attachment-remove:focus,
    .btn.btn-link.feedback-attachment-remove:focus-visible {
        color: var(--modern-accent-emphasis) !important;
        font-weight: 600;
        text-decoration: underline;
        text-decoration-thickness: 2px;
        text-underline-offset: 2px;
        text-shadow: none;
        outline: 0;
        box-shadow: none;
    }

.sectionHeading {
    font-size: 1rem;
    border-bottom: solid 1px var(--bs-dark);
    margin-top: .6em;
    letter-spacing: 1px;
    line-height: 1.8em;
    text-transform: uppercase;
}

.module-subheader-page-title-truncated {
    display: inline-block;
    max-width: 100%;
    vertical-align: bottom;
}

.modal-body .sectionHeading {
    font-size: 1rem;
    margin-top: .6em;
}

    .modal-body .sectionHeading .alert {
        font-size: 1rem;
        margin-top: .6em;
    }

.formPanel {
    background-color: var(--bs-white);
    flex-basis: auto;
    flex-grow: 1;
    flex: 1;
    min-height: 100%;
    align-self: stretch;
}

    .formPanel > :is(#alertInfoPanel, .alertInfoPanel) {
        margin-top: 0;
    }

        .formPanel > :is(#alertInfoPanel, .alertInfoPanel) > div.alert {
            border-radius: 0 !important;
        }

    .formPanel .btn-group .btn:not(.dropdown-toggle),
    .popupFormPanel .btn-group .btn:not(.dropdown-toggle) {
        min-width: var(--btn-min-width);
    }

#aspnetForm .form-control-feedback {
    pointer-events: auto;
}

    #aspnetForm .form-control-feedback:hover {
        cursor: pointer;
    }


.action-exception-details {
    width: 100%;
    height: 250px;
    overflow: scroll;
    border: var(--form-control-border);
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 20px;
}

    .action-exception-details::-webkit-scrollbar,
    .action-validation-details::-webkit-scrollbar,
    .page-debug-details::-webkit-scrollbar {
        width: 14px;
        height: 14px;
    }

    .action-exception-details::-webkit-scrollbar-track,
    .action-validation-details::-webkit-scrollbar-track,
    .page-debug-details::-webkit-scrollbar-track {
        background: transparent;
        border-left: 1px solid color-mix(in srgb, var(--form-control-border-color) 55%, transparent);
        border-top: 1px solid color-mix(in srgb, var(--form-control-border-color) 55%, transparent);
    }

    .action-exception-details::-webkit-scrollbar-thumb,
    .action-validation-details::-webkit-scrollbar-thumb,
    .page-debug-details::-webkit-scrollbar-thumb {
        background-color: var(--modern-accent-interactive);
        background-clip: padding-box;
        border: 2px solid transparent;
        border-left-width: 4px;
        border-right-width: 3px;
        border-radius: 999px;
    }

        .action-exception-details::-webkit-scrollbar-thumb:hover,
        .action-validation-details::-webkit-scrollbar-thumb:hover,
        .page-debug-details::-webkit-scrollbar-thumb:hover {
            background-color: var(--modern-accent-emphasis);
        }

    .action-exception-details::-webkit-scrollbar-corner,
    .action-validation-details::-webkit-scrollbar-corner,
    .page-debug-details::-webkit-scrollbar-corner {
        background: transparent;
    }

.action-validation-details {
    width: 100%;
    max-height: 500px;
    overflow: auto;
    padding: 10px;
    margin: 20px 0px 10px 0px;
}

.page-debug-details {
    width: 100%;
    overflow: visible;
}

.page-debug-details,
.page-debug-details .row > [class*="col-"] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.page-debug-details .accordion-button::after {
    width: 1.1rem;
    height: 1.1rem;
    background-color: var(--modern-btn-primary-bg);
    background-image: none;
    -webkit-mask-image: var(--bs-accordion-btn-icon);
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 1.1rem;
    mask-image: var(--bs-accordion-btn-icon);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 1.1rem;
    transition: transform 0.2s ease-in-out, background-color 0.15s ease-in-out;
}

.page-debug-details .accordion-button.collapsed:hover::after {
    background-color: var(--modern-accent-emphasis);
    transform: scale(1.2);
}

.page-debug-details .accordion-button:not(.collapsed):hover::after {
    background-color: var(--modern-accent-emphasis);
    transform: rotate(-180deg) scale(1.2);
}

.page-debug-details .site-info-section {
    overflow: hidden;
    margin-bottom: 1rem;
    border: 1px solid var(--modern-border);
    border-radius: var(--bs-border-radius);
}

.page-debug-details .page-debug-tab-search .input-group {
    border: 1px solid var(--modern-border);
    border-radius: var(--bs-border-radius);
    flex-wrap: nowrap;
    min-height: 38px;
    overflow: visible;
}

.page-debug-details .page-debug-tab-search .input-group > :not(:first-child) {
    margin-left: 0 !important;
}

.page-debug-details .page-debug-tab-search .input-group > .input-group-text,
.page-debug-details .page-debug-tab-search .input-group > input.search-control {
    border-width: 0 !important;
    box-shadow: none !important;
}

.page-debug-details .page-debug-tab-search .input-group > .input-group-text {
    color: var(--modern-text-muted);
}

.page-debug-details .page-debug-tab-search .input-group > .input-group-text:first-child {
    padding-left: 0.75rem;
}

.page-debug-details .page-debug-tab-search .input-group > input.search-control {
    border-right-width: 0 !important;
    -webkit-appearance: none;
    appearance: none;
}

.page-debug-details .page-debug-tab-search .input-group > input.search-control::-webkit-search-cancel-button,
.page-debug-details .page-debug-tab-search .input-group > input.search-control::-webkit-search-decoration,
.page-debug-details .page-debug-tab-search .input-group > input.search-control::-webkit-search-results-button,
.page-debug-details .page-debug-tab-search .input-group > input.search-control::-webkit-search-results-decoration {
    display: none;
    -webkit-appearance: none;
}

.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn {
    border-left-width: 0 !important;
    border-right-width: 1px !important;
    border-right-color: var(--modern-border);
    color: var(--modern-text-muted);
}

.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn .fa {
    transform-origin: center center;
    transition: transform 0.15s ease;
}

.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn:hover,
.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn:focus-visible {
    color: var(--modern-accent-emphasis);
    background-color: transparent;
}

.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn:hover .fa,
.page-debug-details .page-debug-tab-search .input-group > .page-debug-search-clear-btn:focus-visible .fa {
    transform: scale(1.2);
}

.page-debug-details .page-debug-tab-search .input-group:has(> input.search-control:focus) {
    border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white);
}

.page-debug-details mark.page-debug-search-highlight {
    padding: 0 0.1em;
    border-radius: 0.2rem;
    color: inherit;
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 30%, var(--modern-white));
}

.page-debug-details .site-info-section:last-child {
    margin-bottom: 0;
}

.page-debug-details .site-info-section-header {
    display: flex;
    align-items: stretch;
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 7%, var(--modern-white));
}

.page-debug-details .site-info-section-heading {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    font-size: inherit;
}

.page-debug-details .site-info-section-toggle,
.page-debug-details .site-info-section-title {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    min-width: 0;
    gap: 0.5rem;
    padding: 0.65rem 0.75rem;
    color: var(--modern-accent-emphasis);
    background-color: transparent;
    border: 0;
    font-size: 0.95rem;
    font-weight: 600;
    text-align: left;
}

.page-debug-details .site-info-section-title {
    cursor: default;
}

.page-debug-details .site-info-section-toggle:hover {
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 12%, var(--modern-white));
}

.page-debug-details .site-info-section-action:hover {
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 16%, var(--modern-white));
}

.page-debug-details .site-info-section-toggle:focus:not(:focus-visible),
.page-debug-details .site-info-section-action:focus:not(:focus-visible) {
    outline: 0;
    box-shadow: none;
}

.page-debug-details .site-info-section-toggle:focus-visible {
    position: relative;
    z-index: 1;
    outline: 0;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--modern-accent-emphasis), inset 0 0 0 0.2rem var(--modern-focus-button-30);
}

.page-debug-details .site-info-section-action:focus-visible {
    position: relative;
    z-index: 1;
    outline: 0;
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 16%, var(--modern-white));
    box-shadow: inset 0 0 0 1px var(--modern-accent-emphasis), inset 0 0 0 0.14rem var(--modern-focus-secondary-30);
}

.page-debug-details .site-info-section-action {
    flex: 0 0 auto;
    padding: 0.65rem 0.75rem;
    color: var(--bs-danger);
    background-color: transparent;
    border: 0;
    border-left: 1px solid var(--modern-border);
    border-top-right-radius: calc(var(--bs-border-radius) - 1px);
    border-bottom-right-radius: calc(var(--bs-border-radius) - 1px);
    font-weight: 600;
}

.page-debug-details .site-info-item-action {
    padding: 0.125rem 0.25rem 0.125rem 0;
    white-space: nowrap;
    border-radius: var(--bs-border-radius-sm);
    color: var(--bs-danger);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.page-debug-details .btn.btn-link.site-info-item-action:hover {
    color: var(--modern-danger-btn-hover) !important;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.page-debug-details .btn.btn-link.site-info-item-action:focus-visible {
    outline: 0;
    color: var(--bs-danger) !important;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--modern-accent-emphasis), 0 0 0 2px var(--modern-focus-button-30);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.page-debug-details .site-info-section-chevron {
    margin-left: auto;
    transition: transform 0.2s ease-in-out;
}

.page-debug-details .site-info-section-toggle[aria-expanded="true"] .site-info-section-chevron {
    transform: rotate(-180deg);
}

.page-debug-details .site-info-section-count {
    color: var(--modern-white);
    background-color: var(--modern-btn-primary-bg);
    font-size: 0.7rem;
}

.page-debug-details .site-info-section-body {
    padding: 0.75rem;
    border-top: 1px solid var(--modern-border);
}

.page-debug-details .site-info-definition-list {
    margin-bottom: 0;
}

.page-debug-details .site-info-definition-list dt {
    color: var(--bs-secondary-color);
    font-weight: 600;
}

.page-debug-details .site-info-definition-list dd {
    margin-bottom: 0;
    overflow-wrap: anywhere;
}

.page-debug-details .site-info-table {
    margin-bottom: 0;
    table-layout: fixed;
}

.page-debug-details .site-info-table > :not(caption) > * > * {
    padding: 0.5rem 0.65rem;
    overflow-wrap: anywhere;
}

.page-debug-details .site-info-table thead th {
    color: var(--modern-accent-emphasis);
    background-color: color-mix(in srgb, var(--modern-btn-primary-bg) 7%, var(--modern-white));
    border-bottom-color: var(--modern-border);
    font-weight: 600;
}

.page-debug-details .site-info-section .site-info-section {
    margin-bottom: 0.75rem;
}

.page-debug-details .site-info-detail-accordion .accordion-button {
    padding: 0.6rem 0.75rem;
}

.page-debug-details .site-info-error-heading {
    min-width: 0;
}

.page-debug-details .site-info-error-heading-summary {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-debug-details .site-info-detail-accordion .accordion-body {
    padding: 0.75rem;
}

#release-history-accordion .release-current-badge {
    color: var(--modern-white);
    background-color: var(--modern-btn-primary-bg);
}

#release-history-accordion .release-category-section {
    margin-bottom: 0.75rem;
}

/* The traceability section is always the last element in a release item, so the nested
   section margin would stack with the item's own bottom padding and border. */
#release-history-accordion .release-traceability-section {
    margin-bottom: 0;
}

#release-history-accordion .release-ticket-link {
    color: var(--modern-btn-primary-bg);
    background-color: var(--modern-white);
    border: 1px solid color-mix(in srgb, var(--modern-btn-primary-bg) 38%, var(--modern-border));
    text-decoration: none;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

#release-history-accordion .release-ticket-link:hover,
#release-history-accordion .release-ticket-link:focus-visible {
    color: var(--modern-white);
    background-color: var(--modern-btn-primary-bg);
    border-color: var(--modern-btn-primary-bg);
    box-shadow: 0 2px 5px color-mix(in srgb, var(--modern-btn-primary-bg) 35%, transparent);
    transform: translateY(-1px);
}

.missingInfo {
    display: block;
    line-height: 1.55rem;
    color: var(--bs-body-color);
}

.section-metadata-note {
    color: var(--bs-body-color);
}

    .section-metadata-note > .alert {
        position: relative;
        min-height: 44px;
        padding: 0.55rem 2.5rem 0.55rem 0.9rem !important;
        border: 1px solid var(--bs-border-color);
        border-left: 6px solid var(--bs-info-200);
        border-radius: 0.3rem;
        box-shadow: 0 1px 3px var(--modern-shadow-black-rgb-10);
        background: var(--bs-white);
        color: inherit;
        line-height: 1.45;
    }

        .section-metadata-note > .alert > .btn-close {
            top: 0;
            right: 0;
            bottom: 0;
            width: 2.35rem;
            height: auto;
            padding: 0;
            border-left: 1px solid color-mix(in srgb, var(--bs-info-200) 24%, var(--modern-white));
            border-radius: 0 0.3rem 0.3rem 0;
            background-size: 0.65rem;
            background-position: center;
            opacity: 0.75;
        }

            .section-metadata-note > .alert > .btn-close:hover,
            .section-metadata-note > .alert > .btn-close:focus-visible {
                background-color: color-mix(in srgb, var(--bs-info-200) 14%, var(--modern-white));
                background-size: 0.75rem;
                opacity: 1;
            }

        .section-metadata-note > .alert.alert-warning {
            border-left-color: var(--modern-warning-icon);
        }

            .section-metadata-note > .alert.alert-warning > .btn-close {
                border-left-color: color-mix(in srgb, var(--modern-warning-icon) 24%, var(--modern-white));
            }

                .section-metadata-note > .alert.alert-warning > .btn-close:hover,
                .section-metadata-note > .alert.alert-warning > .btn-close:focus-visible {
                    background-color: color-mix(in srgb, var(--modern-warning-icon) 14%, var(--modern-white));
                }

        .section-metadata-note > .alert.alert-danger {
            border-left-color: var(--bs-danger-200);
        }

            .section-metadata-note > .alert.alert-danger > .btn-close {
                border-left-color: color-mix(in srgb, var(--bs-danger-200) 24%, var(--modern-white));
            }

                .section-metadata-note > .alert.alert-danger > .btn-close:hover,
                .section-metadata-note > .alert.alert-danger > .btn-close:focus-visible {
                    background-color: color-mix(in srgb, var(--bs-danger-200) 14%, var(--modern-white));
                }

        .section-metadata-note > .alert.alert-success {
            border-left-color: var(--bs-success-200);
        }

            .section-metadata-note > .alert.alert-success > .btn-close {
                border-left-color: color-mix(in srgb, var(--bs-success-200) 24%, var(--modern-white));
            }

                .section-metadata-note > .alert.alert-success > .btn-close:hover,
                .section-metadata-note > .alert.alert-success > .btn-close:focus-visible {
                    background-color: color-mix(in srgb, var(--bs-success-200) 14%, var(--modern-white));
                }

}

.section-metadata-note .alert-inline {
    padding: 0;
    border-left-width: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent !important;
}

    .section-metadata-note .alert-inline i {
        display: none;
    }

    .section-metadata-note .alert-inline strong,
    .section-metadata-note .alert-inline b {
        color: inherit;
        font-size: 0.8rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

.missingInfo .fa-ul {
    position: relative;
    counter-reset: missing-info-item;
    margin-left: 0;
    padding: 0.25rem 0 0.25rem 2rem;
    border-left: 3px solid var(--modern-warning-icon);
    background-color: transparent;
    box-shadow: none;
}

.missingInfo li {
    position: relative;
    counter-increment: missing-info-item;
    padding: 0.25rem 0 0.25rem 0.4rem;
    list-style: none;
}

    .missingInfo li::before {
        content: counter(missing-info-item) ".";
        position: absolute;
        left: -1.65rem;
        width: 1.25rem;
        color: inherit;
        font-weight: inherit;
        text-align: right;
    }

.missingInfo i.fa-li {
    display: none;
}


.alert-inline {
    font-size: 1em;
    color: inherit;
    padding: 10px 14px;
    border-radius: 6px;
    box-shadow: 0 1px 3px var(--modern-shadow-black-rgb-20);
    cursor: default;
    border-left: 6px solid transparent;
}

    .alert-inline i,
    .alert-inline-info i,
    .alert-inline-warning i,
    .alert-inline-success i,
    .alert-inline-danger i {
        font-size: 1.5em;
    }

    .alert-inline div {
        line-height: 1.45;
    }

.alert-inline-info {
    border-left-color: var(--bs-info-200);
    color: var(--modern-text);
}

    .alert-inline-info i {
        color: var(--bs-info-200);
    }

.alert-inline-success {
    border-left-color: var(--bs-success-200);
}

    .alert-inline-success i {
        color: var(--bs-success-200);
    }

.alert-inline-warning {
    border-left-color: var(--modern-warning-icon);
    color: var(--modern-text);
}

    .alert-inline-warning i {
        color: var(--modern-warning-icon);
    }

.alert-inline-danger {
    border-left-color: var(--bs-danger-200);
    color: var(--modern-text);
}

    .alert-inline-danger i {
        color: var(--bs-danger-200);
    }

.site-toast {
    border-radius: 6px;
    box-shadow: 0 4px 14px var(--modern-shadow-black-15);
    color: var(--modern-text);
}

    .site-toast .toast-body {
        padding: 0.65rem 0.85rem;
        font-weight: 500;
    }

.site-toast-success {
    background-color: var(--modern-success-toast-bg);
    border: 1px solid var(--modern-success-toast-border) !important;
    color: var(--modern-success-toast-text);
}

.site-toast-clipboard {
    background-color: var(--modern-success-toast-bg);
    border: 1px solid var(--modern-success-toast-border) !important;
    color: var(--modern-success-toast-text);
}

.btn-page-section-action {
    margin-top: -8px;
    margin-right: 0px;
}

    .btn-page-section-action .btn-link {
        position: relative;
        font-size: 0.9rem;
        font-weight: 500;
        text-decoration: none;
        color: var(--modern-text);
        background: var(--modern-white) !important;
        border: 1px solid var(--modern-border) !important;
        padding: 0.4rem 1rem;
        border-radius: 0.3rem;
        box-shadow: none !important;
        transition: all 0.15s ease;
    }

    /* Keep each grouped action button fully rounded (Bootstrap strips adjacent
       corners inside .btn-group) and give a small gap when both buttons show. */
    .btn-page-section-action .btn-group {
        gap: 0.4rem;
    }

        .btn-page-section-action .btn-group > .btn-link {
            border-radius: 0.3rem !important;
            margin-left: 0 !important;
        }

/* Add breathing room between the action button and the section underline. */
.row.sectionHeading:has(.btn-page-section-action) {
    padding-bottom: 0.35rem;
}

.btn-page-section-action .btn-link:hover {
    text-decoration: none;
    color: var(--theme-accent-primary) !important;
    background: var(--modern-white) !important;
    border-color: var(--theme-accent-primary) !important;
}

    .btn-page-section-action .btn-link:hover i {
        transition: transform 0.15s ease, color 0.15s ease;
        transform: scale(1.2);
        color: var(--theme-accent-primary) !important;
        -webkit-text-stroke-width: 0;
        animation: none !important;
    }

.fsr-network-payload {
    font-size: 1.15rem;
    margin-top: -.7rem;
    cursor: pointer;
    min-height: 15px;
    border-radius: 3px;
}

.btn-wizard-nav {
    border: 1px solid var(--bs-info);
    color: var(--bs-info);
    background-color: white;
}

    .btn-wizard-nav:disabled {
        color: var(--bs-white);
        background-color: var(--bs-btn-info-disabled-bg);
        border-color: var(--bs-btn-info-disabled-bg);
        cursor: not-allowed;
        opacity: 1;
    }

    .btn-wizard-nav:focus,
    .btn-wizard-nav:focus-visible,
    .btn-wizard-nav:active,
    .btn-wizard-nav.show {
        background-color: var(--bs-info) !important;
        border-color: var(--bs-info) !important;
        color: white !important;
        box-shadow: none !important;
    }

    .btn-wizard-nav:hover {
        background-color: var(--bs-btn-info-hover-bg) !important;
        color: white !important;
    }

.btn-page-section-action .btn.btn-link:focus-visible {
    outline: 0;
    text-decoration: none;
    color: var(--theme-accent-primary) !important;
    background: var(--modern-white) !important;
    border-color: var(--theme-accent-primary) !important;
}

.btn-page-section-action .btn-link::after {
    content: none;
}

.btn-page-section-action .btn-link i {
    color: var(--modern-text-muted);
    display: inline-block;
    margin-right: 0.5rem;
    transition: transform 0.15s ease, color 0.15s ease;
    transform-origin: center center;
    -webkit-text-stroke-width: 0;
}

.btn-page-section-action .btn-link:active i,
.btn-page-section-action .btn.btn-link:focus i,
.btn-page-section-action .btn.btn-link:focus-visible i {
    transform: scale(1.2);
    color: var(--theme-accent-primary) !important;
    -webkit-text-stroke-width: 0;
    animation: none !important;
}

.btn-page-section-action .btn-link:active,
.btn-page-section-action .btn.btn-link:focus,
.btn-page-section-action .btn.btn-link:focus-visible {
    background: var(--modern-white) !important;
    border-color: var(--theme-accent-primary) !important;
    box-shadow: none !important;
    color: var(--theme-accent-primary) !important;
    outline: 0;
    text-decoration: none;
}

div.header-title > a {
    position: relative;
    display: inline-block;
    text-decoration: none;
}

    div.header-title > a::after {
        content: '';
        position: absolute;
        left: 50%;
        bottom: -2px;
        width: 0;
        height: 2px;
        border-radius: 2px;
        transform: translateX(-50%);
        transition: width .25s ease, height .25s ease;
        background-color: var(--modern-accent-emphasis);
    }

    div.header-title > a:hover::after,
    div.header-title > a:focus-visible::after {
        width: 100%;
    }

    div.header-title > a:focus-visible {
        outline: 0;
    }

.fa.transparent, .fa.required.transparent {
    color: transparent !important;
}

@keyframes wait-title-pulse {
    0%, 100% {
        opacity: 0.85;
    }

    50% {
        opacity: 1;
    }
}

.static-prefix-field,
.static-suffix-field {
    display: flex;
    align-items: stretch;
    width: 100%;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--modern-border);
    border-radius: var(--bs-border-radius);
    overflow: hidden;
    box-shadow: 0 .125rem .25rem var(--modern-shadow-black-rgb-075);
}

    .static-prefix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):focus:not(:disabled):not([disabled]):not([readonly])),
    .static-suffix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):focus:not(:disabled):not([disabled]):not([readonly])) {
        border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
        box-shadow: 0 0 0 0.2rem var(--modern-accent-primary-25);
    }

    .static-prefix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):is(:disabled, [disabled], [readonly])),
    .static-suffix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):is(:disabled, [disabled], [readonly])) {
        background-color: var(--bs-disabled-bg);
        border-color: var(--modern-control-disabled-border);
    }

.static-prefix-field-prefix,
.static-suffix-field-suffix {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    height: calc(1.5em + 0.75rem);
    min-height: calc(1.5em + 0.75rem);
    max-height: calc(1.5em + 0.75rem);
    padding: 0.375rem 0.5rem;
    background-color: var(--bs-disabled-bg);
    color: var(--bs-body-color);
    line-height: 1.5;
    white-space: nowrap;
    position: relative;
    z-index: 1;
}

.static-suffix-field-suffix {
    padding: 0.375rem 0.5rem;
    min-width: 2.75rem;
    justify-content: center;
}

.static-prefix-field > .form-control,
.static-prefix-field > .form-select,
.static-prefix-field > select.form-select:not([multiple]):not([size]),
.static-prefix-field > .form-control:focus,
.static-prefix-field > .form-select:focus,
.static-prefix-field > select.form-select:not([multiple]):not([size]):focus,
.static-prefix-field > input.fv-plugins-icon-input:focus,
.static-suffix-field > .form-control,
.static-suffix-field > .form-control:focus,
.static-suffix-field > input.fv-plugins-icon-input:focus {
    flex: 1 1 auto;
    min-width: 0;
    height: calc(1.5em + 0.75rem);
    min-height: calc(1.5em + 0.75rem);
    max-height: calc(1.5em + 0.75rem);
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
    background-image: none !important;
}

.static-prefix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):is(:disabled, [disabled], [readonly])) > :is(.form-control, .form-select, input.fv-plugins-icon-input),
.static-suffix-field:has(> :is(.form-control, .form-select, input.fv-plugins-icon-input):is(:disabled, [disabled], [readonly])) > :is(.form-control, .form-select, input.fv-plugins-icon-input) {
    color: var(--modern-control-disabled-text);
}

.static-prefix-field > .form-control,
.static-prefix-field > .form-select,
.static-prefix-field > .form-control:focus,
.static-prefix-field > .form-select:focus,
.static-prefix-field > input.fv-plugins-icon-input:focus {
    margin-left: -1px;
    padding-left: calc(0.5rem + 1px);
}

.static-suffix-field > .form-control,
.static-suffix-field > .form-control:focus,
.static-suffix-field > input.fv-plugins-icon-input:focus {
    margin-right: -1px;
    padding-right: calc(0.5rem + 1px);
}

/***********************************************************************************************************************************************************/
/* Input Styles */
/***********************************************************************************************************************************************************/

select option {
    background-color: var(--modern-white);
    color: var(--modern-black);
    font-style: normal;
    font-weight: 500;
    text-decoration: none;
    text-shadow: none;
}

    select option:checked:not(:disabled) {
        background: linear-gradient(var(--theme-accent-primary), var(--theme-accent-primary));
        color: var(--modern-white);
    }

    select option:disabled,
    select option[disabled] {
        background-color: var(--modern-white);
        color: color-mix(in srgb, var(--bs-text-disabled) 48%, var(--modern-white)) !important;
        font-style: normal;
        font-weight: 400;
    }

input.dt-date[type="date"]::-webkit-calendar-picker-indicator {
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    opacity: 1;
    background-color: var(--bs-gray-800);
    background-image: none;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 .5a.5.5 0 0 0-1 0V1H2a2 2 0 0 0-2 2v1h16V3a2 2 0 0 0-2-2h-1V.5a.5.5 0 0 0-1 0V1H4V.5zM16 14V5H0v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 .5a.5.5 0 0 0-1 0V1H2a2 2 0 0 0-2 2v1h16V3a2 2 0 0 0-2-2h-1V.5a.5.5 0 0 0-1 0V1H4V.5zM16 14V5H0v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 1rem 1rem;
    mask-size: 1rem 1rem;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    outline: none;
    box-shadow: none;
    transform-origin: center;
    transition: background-color .15s ease, transform .15s ease, opacity .15s ease;
}

input.dt-date[type="date"]:enabled:hover::-webkit-calendar-picker-indicator,
input.dt-date[type="date"]:enabled:focus::-webkit-calendar-picker-indicator,
input.dt-date[type="date"].dt-picker-active:enabled::-webkit-calendar-picker-indicator {
    background-color: var(--modern-accent-emphasis);
    transform: scale(1.2);
}

input.dt-date[type="date"]::-webkit-calendar-picker-indicator:focus,
input.dt-date[type="date"]::-webkit-calendar-picker-indicator:focus-visible {
    outline: none;
    box-shadow: none;
}

input.dt-date[type="date"]:disabled::-webkit-calendar-picker-indicator {
    cursor: default;
    background-color: var(--bs-text-disabled);
    opacity: .65;
    transform: none;
}

input.dt-time[type="time"]::-webkit-calendar-picker-indicator {
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    opacity: 1;
    background-color: var(--bs-gray-800);
    background-image: none;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 1rem 1rem;
    mask-size: 1rem 1rem;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    outline: none;
    box-shadow: none;
    transform-origin: center;
    transition: background-color .15s ease, transform .15s ease, opacity .15s ease;
}

input.dt-time[type="time"]:enabled:hover::-webkit-calendar-picker-indicator,
input.dt-time[type="time"]:enabled:focus::-webkit-calendar-picker-indicator,
input.dt-time[type="time"].dt-picker-active:enabled::-webkit-calendar-picker-indicator {
    background-color: var(--modern-accent-emphasis);
    transform: scale(1.2);
}

input.dt-time[type="time"]::-webkit-calendar-picker-indicator:focus,
input.dt-time[type="time"]::-webkit-calendar-picker-indicator:focus-visible {
    outline: none;
    box-shadow: none;
}

input.dt-time[type="time"]:disabled::-webkit-calendar-picker-indicator {
    cursor: default;
    background-color: var(--bs-text-disabled);
    opacity: .65;
    transform: none;
}

/* Modern customizable <select> (no third-party widget).
   Progressive enhancement: only applies where the browser supports
   appearance: base-select. Unsupported browsers fall back to the native
   select popup above. This lets us control the popup, hover, selected item,
   and caret consistently across Chrome and Edge instead of relying on each
   browser's native (blue vs gray/brown) active-row rendering. */
@supports (appearance: base-select) {
    /* Specificity must beat Bootstrap's .form-select / .form-control
       { appearance: none }, otherwise the control never enters base-select. */
    select.form-select,
    select.form-control,
    select,
    ::picker(select) {
        appearance: base-select;
    }
        /* Closed control: single-line button. .form-select keeps Bootstrap's
       chevron (hide the native picker icon); other selects keep a caret on
       the right. */
        select.form-select:not([multiple]):not([size]),
        select.form-control:not([multiple]):not([size]) {
            display: flex;
            align-items: center;
            flex-wrap: nowrap;
            cursor: pointer;
            min-width: 0;
            max-width: 100%;
            height: calc(1.5em + 0.75rem + 2px);
            min-height: calc(1.5em + 0.75rem + 2px);
            max-height: calc(1.5em + 0.75rem + 2px);
            overflow: hidden;
            white-space: nowrap;
            clip-path: inset(0 round var(--bs-border-radius));
        }

        select.form-select:not([multiple]):not([size]):disabled,
        select.form-select:not([multiple]):not([size])[disabled],
        select.form-control:not([multiple]):not([size]):disabled,
        select.form-control:not([multiple]):not([size])[disabled] {
            cursor: default;
        }

        select.form-select:not([multiple]):not([size]) {
            background-image: none;
        }

            select.form-select:not([multiple]):not([size]):focus,
            select.form-control:not([multiple]):not([size]):focus,
            select.form-select:not([multiple]):not([size]):open,
            select.form-control:not([multiple]):not([size]):open {
                clip-path: none;
            }

                select.form-select:not([multiple]):not([size]):open:not([disabled]):not(.is-invalid):not(.search-control):not(.filter-control),
                select.form-control:not([multiple]):not([size]):open:not([disabled]):not(.is-invalid):not(.search-control):not(.filter-control) {
                    border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
                    box-shadow: var(--bs-focus-shadow-accent) !important;
                }

            select.form-select:not([multiple]):not([size]).is-invalid:open,
            select.form-control:not([multiple]):not([size]).is-invalid:open {
                border-color: var(--bs-form-invalid-border-color) !important;
                box-shadow: var(--bs-focus-shadow-danger) !important;
            }
    /* base-select forces overflow:visible on the <select>, so its long selected
       text inflates scrollWidth and can bleed up through visible ancestors into
       a page scrollbar. Contain it consistently, including focus/open states. */
    [class*="col-"]:has(> .form-select),
    [class*="col-"]:has(> .selectContainer > .form-select),
    .selectContainer:has(> .form-select) {
        overflow-x: clip;
    }

    [class*="col-"]:has(> .form-select:is(:focus, :open)),
    [class*="col-"]:has(> .selectContainer > .form-select:is(:focus, :open)),
    .selectContainer:has(> .form-select:is(:focus, :open)) {
        overflow-x: visible;
    }

    select.form-select:not([multiple]):not([size])::selectedcontent,
    select.form-control:not([multiple]):not([size])::selectedcontent {
        flex: 1 1 auto;
        min-width: 0;
        padding-right: 1.5rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    select::picker-icon {
        content: "";
        width: 1rem;
        height: 0.75rem;
        margin-left: auto;
        margin-right: -1.5rem;
        background-color: var(--bs-gray-800);
        -webkit-mask-image: var(--bs-form-select-bg-img);
        mask-image: var(--bs-form-select-bg-img);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: 1rem 0.75rem;
        mask-size: 1rem 0.75rem;
        transition: background-color 0.15s ease, transform 0.15s ease;
        transform-origin: center;
    }

    select:not(:disabled):not([disabled]):hover::picker-icon,
    select:not(:disabled):not([disabled]):focus::picker-icon {
        background-color: var(--modern-accent-emphasis);
        transform: scale(1.15);
    }

    select:not(:disabled):not([disabled]):open::picker-icon {
        background-color: var(--modern-accent-emphasis);
        transform: rotate(180deg) scale(1.15);
    }

    select.form-select.is-invalid::picker-icon,
    select.form-control.is-invalid::picker-icon {
        display: none;
    }
    /* Popup container: matches the bootstrap-select menu (border, radius,
       shadow, blue scrollbar). */
    ::picker(select) {
        background: var(--modern-white);
        border: 1px solid var(--modern-border);
        border-radius: 8px;
        box-shadow: 0 4px 16px var(--modern-shadow-black-10);
        padding: 8px 0;
        scrollbar-color: var(--modern-btn-primary-bg) var(--bs-white);
        scrollbar-width: auto;
    }

        ::picker(select)::-webkit-scrollbar {
            width: 14px;
        }

        ::picker(select)::-webkit-scrollbar-track {
            background: var(--bs-white);
        }

        ::picker(select)::-webkit-scrollbar-thumb {
            background: var(--modern-btn-primary-bg);
            border: 3px solid var(--bs-white);
            border-radius: 7px;
        }
    /* Options: pill rows with side accents on hover and a reserved checkmark
       column on the left, mirroring the bootstrap-select dropdown items. */
    select.form-select:not([multiple]):not([size]) option,
    select.form-control:not([multiple]):not([size]) option {
        position: relative;
        display: block;
        cursor: pointer;
        font-weight: 400;
        border: 1px solid transparent;
        border-left-width: 3px;
        border-right-width: 3px;
        border-radius: 6px;
        padding: 7px 14px 7px 34px;
        background-color: var(--modern-white);
        color: var(--modern-text) !important;
        transition: background-color 0.15s, border-color 0.15s, color 0.15s;
    }
    /* Selected option: never filled. Force no background and dark text so it
       matches the Features control, even when it is the option auto-focused
       as the popup opens. */
    select.form-select:not([multiple]):not([size]) option:checked:not(:disabled),
    select.form-control:not([multiple]):not([size]) option:checked:not(:disabled) {
        background: var(--modern-white) !important;
        color: var(--modern-accent-emphasis) !important;
        font-weight: 500 !important;
    }
    /* Highlight pill on hover / keyboard navigation, including the selected
       option, but never on disabled options. The selected option stays
       unfilled when the popup first opens (mouse-open isn't :focus-visible);
       hovering or arrowing to it shows the pill, and the pill rule comes after
       option:checked so it wins. */
    option:hover:not(:disabled),
    option:focus-visible:not(:disabled) {
        background-color: var(--modern-row-selected) !important;
        border-color: var(--modern-hover-edge) !important;
        border-left-color: var(--modern-btn-primary-bg) !important;
        border-right-color: var(--modern-btn-primary-bg) !important;
        color: var(--modern-accent-emphasis) !important;
    }
    /* Disabled options: muted and not interactive. The base option color rule
       above (select.form-select ... option) is more specific than the shared
       `select option:disabled` rule, so it would otherwise win and un-mute
       disabled options. Match that specificity here so the muted color sticks. */
    select.form-select:not([multiple]):not([size]) option:disabled,
    select.form-control:not([multiple]):not([size]) option:disabled {
        cursor: default;
        color: color-mix(in srgb, var(--bs-text-disabled) 48%, var(--modern-white)) !important;
    }

    option:disabled:hover,
    option:disabled:focus-visible {
        background-color: var(--bs-dropdown-link-hover-bg, var(--bs-gray-100)) !important;
    }

    option::checkmark {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        color: var(--modern-accent-emphasis);
    }
}

input, select, textarea {
    border: 1px solid var(--bs-gray-300);
    box-shadow: 0 .125rem .25rem var(--modern-shadow-black-rgb-075);
    transition: box-shadow .2s ease !important;
}

    /* Accent focus (exclude various fields) */
    input:focus:not(:disabled):not([disabled]):not([readonly]):not(.is-invalid):not(.search-control):not(.filter-control),
    select:focus:not(:disabled):not([disabled]):not(.is-invalid):not(.search-control):not(.filter-control),
    textarea:focus:not(:disabled):not([disabled]):not([readonly]):not(.is-invalid):not(.search-control):not(.filter-control) {
        box-shadow: var(--bs-focus-shadow-accent) !important;
    }

    /* Invalid focus */
    input.is-invalid:focus,
    select.is-invalid:focus,
    textarea.is-invalid:focus {
        box-shadow: var(--bs-focus-shadow-danger) !important;
    }

    #txtFindSolution, input[id$="_txtFindSolution"], input.search-control, select.search-control, input.filter-control {
        border-left: 0px;
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: 0 2px;
        transition: background-size 0.2s ease !important;
        background-image: linear-gradient(var(--modern-accent-interactive), var(--modern-accent-interactive));
        box-shadow: none !important;
    }

        #txtFindSolution:not(:disabled):not([disabled]):not([readonly]):focus,
        input.form-control[id$="_txtFindSolution"]:not(:disabled):not([disabled]):not([readonly]):focus,
        input.form-control.search-control:not(:disabled):not([disabled]):not([readonly]):focus,
        select.form-select.search-control:not(:disabled):not([disabled]):focus,
        select.form-control.search-control:not(:disabled):not([disabled]):focus,
        input.form-control.filter-control:not(:disabled):not([disabled]):not([readonly]):focus {
            border-color: var(--form-control-border-color);
            background-size: 100% 2px;
            box-shadow: none !important;
        }

/* Keep focused search/lookup icons in the modern emphasis accent instead of the
   brighter legacy cyan. */
.input-control-icon-focus {
    color: var(--modern-accent-emphasis) !important;
    -webkit-text-stroke-width: 0;
}


#txtFindSolution, #btnFindSolution, #btnFindSolution ~ button, .module-search-bar button {
    height: inherit !important;
}

.input-group:has(> select.form-select.search-control:focus),
.input-group:has(> select.form-select.search-control:open) {
    border-radius: 0.375rem;
    box-shadow: var(--bs-focus-shadow-accent) !important;
}

    .input-group:has(> select.form-select.search-control:focus) > .input-group-text,
    .input-group:has(> select.form-select.search-control:focus) > select.form-select.search-control,
    .input-group:has(> select.form-select.search-control:open) > .input-group-text,
    .input-group:has(> select.form-select.search-control:open) > select.form-select.search-control {
        border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white);
    }

    .input-group:has(> select.form-select.search-control:focus) > select.form-select.search-control,
    .input-group:has(> select.form-select.search-control:open) > select.form-select.search-control {
        box-shadow: none !important;
    }

:is(.form-control, .form-select):focus:not(.is-invalid):not(:disabled):not([disabled]):not([readonly]) {
    border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
}


/***********************************************************************************************************************************************************/
/* Action Button Dropdown  */
/***********************************************************************************************************************************************************/

/* Base button layout */
.action-btn-dropdown:active {
    border-color: transparent !important;
}

.action-btn-dropdown > a,
.action-btn-dropdown > a.dropdown-toggle {
    box-shadow: none !important;
    outline: none !important;
    position: relative;
    text-align: center;
}

    /* Hide Bootstrap's default dropdown arrow */
    .action-btn-dropdown > a::after,
    .action-btn-dropdown > a.dropdown-toggle::after,
    a.action-btn-dropdown.dropdown-toggle::after {
        display: none !important;
        content: none !important;
    }

/* Icon and caret layout */
.action-btn-dropdown .fa-icon-pair {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    line-height: 1;
}

    .action-btn-dropdown .fa-icon-pair .fa:first-child {
        font-size: 1.25em;
        line-height: 1;
    }

    /* Caret visual fix: consistent size, no stroke shift */
    .action-btn-dropdown .fa-icon-pair .fa-caret-down,
    .action-btn-dropdown > a:hover .fa-icon-pair .fa-caret-down,
    .action-btn-dropdown > a.show .fa-icon-pair .fa-caret-down {
        font-size: 0.7em;
        transform: translateY(1px);
        transition: transform 0.15s ease, color 0.15s ease;
        transform-origin: center center;
        -webkit-text-stroke-width: 0 !important;
        text-shadow: none !important;
    }

.action-btn-dropdown > a:hover .fa-icon-pair .fa-caret-down,
.action-btn-dropdown > a:focus-visible .fa-icon-pair .fa-caret-down {
    transform: translateY(1px) rotate(180deg) scale(1.2);
}

.action-btn-dropdown > a.show .fa-icon-pair .fa-caret-down,
.action-btn-dropdown > a[aria-expanded="true"] .fa-icon-pair .fa-caret-down {
    transform: translateY(1px) rotate(180deg) scale(1.2);
}

/* Keep icon and caret consistent during hover/open states */
.action-btn-dropdown > a:hover .fa-icon-pair .fa:first-child,
.action-btn-dropdown > a.show .fa-icon-pair .fa:first-child,
.action-btn-dropdown > a:hover .fa-icon-pair .fa-caret-down,
.action-btn-dropdown > a.show .fa-icon-pair .fa-caret-down {
    color: var(--modern-accent-emphasis);
}

.action-btn-dropdown > a.show .fa-icon-pair .fa:first-child,
.action-btn-dropdown > a[aria-expanded="true"] .fa-icon-pair .fa:first-child {
    transform: scale(1.2);
}

.action-btn-dropdown > a:hover span,
.action-btn-dropdown > a.show span {
    color: var(--modern-accent-emphasis);
}

.action-btn-dropdown > a:hover,
.action-btn-dropdown > a:focus,
.action-btn-dropdown > a.show {
    background-color: var(--modern-accent-primary-12) !important;
    border-color: var(--modern-border-soft) !important;
    box-shadow: none !important;
    color: var(--modern-accent-emphasis);
}

.action-btn-dropdown .dropdown-menu .dropdown-item a,
.action-btn-dropdown .dropdown-menu .dropdown-item a:hover,
.action-btn-dropdown .dropdown-menu .dropdown-item a:focus {
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    padding-left: unset;
    padding-right: unset;
}

/***********************************************************************************************************************************************************/
/* HTML Control Style Override */
/***********************************************************************************************************************************************************/

.fileUpload {
    position: relative;
    overflow: hidden;
}

    .fileUpload input.upload {
        position: absolute;
        top: 0;
        right: 0;
        margin: 0;
        padding: 0;
        font-size: 20px;
        cursor: pointer;
        opacity: 0;
        filter: alpha(opacity=0);
    }

progress[id$="FileUploadProgress"] {
    width: 100%;
    height: 0.55rem;
    margin-top: 0.5rem;
    overflow: hidden;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: var(--bs-border-radius-pill);
    background-color: var(--bs-tertiary-bg);
    box-shadow: inset 0 0 0 1px var(--modern-border-soft);
}

    progress[id$="FileUploadProgress"]::-webkit-progress-bar {
        border-radius: var(--bs-border-radius-pill);
        background-color: var(--bs-tertiary-bg);
    }

    progress[id$="FileUploadProgress"]::-webkit-progress-value {
        border-radius: var(--bs-border-radius-pill);
        background-color: var(--bs-info);
        background-image: linear-gradient(90deg, var(--theme-nav-primary), var(--bs-info));
        transition: width 0.2s ease;
    }

    progress[id$="FileUploadProgress"]::-moz-progress-bar {
        border-radius: var(--bs-border-radius-pill);
        background-color: var(--bs-info);
        background-image: linear-gradient(90deg, var(--theme-nav-primary), var(--bs-info));
        transition: width 0.2s ease;
    }

textarea {
    height: 175px !important;
    line-height: 1.45;
    padding: 0.75rem 0.85rem;
    resize: none;
    scrollbar-color: var(--modern-btn-primary-bg) var(--bs-white);
    scrollbar-width: auto;
}

    textarea::-webkit-scrollbar {
        width: 14px;
    }

    textarea::-webkit-scrollbar-track {
        background: var(--bs-white);
    }

    textarea::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg);
        border: 3px solid var(--bs-white);
        border-radius: 7px;
    }

input.form-control::file-selector-button {
    background-color: var(--bs-white) !important;
    color: var(--bs-body-color);
    border: 0;
    border-inline-end: 1px solid var(--bs-border-color) !important;
    border-radius: 0;
    margin-inline-end: 0.75rem;
    transition: color 0.15s ease;
}

input.form-control:hover::file-selector-button {
    color: var(--theme-accent-primary) !important;
}

.input-group-btn-vertical > .btn {
    height: 19px;
    display: block;
    width: 42px;
    border-color: var(--form-control-border-color);
}

    .input-group-btn-vertical > .btn:active {
        border-color: var(--form-control-border-color) !important;
    }

.input-group-btn-vertical i {
    position: absolute;
    top: 0;
    left: 15px;
    transition: color 0.15s ease, transform 0.15s ease;
    transform-origin: center;
}

.input-group-btn-vertical > .btn:not(:disabled):not([disabled]):hover i,
.input-group-btn-vertical > .btn:not(:disabled):not([disabled]):focus i,
.input-group-btn-vertical > .btn:not(:disabled):not([disabled]):focus-visible i {
    color: var(--modern-accent-emphasis);
    -webkit-text-stroke-width: 0;
    transform: scale(1.1);
}

.input-group-btn-vertical > .btn:first-child {
    border-radius: 0px 4px 0px 0px;
    border-bottom: 0px;
}

.input-group-btn-vertical > .btn:last-child {
    border-radius: 0px 0px 4px 0px;
}

.input-group-btn-vertical > .btn:focus {
    outline: none;
    box-shadow: none;
    background-color: var(--form-control-border-color);
}

.spinner input {
    text-align: right;
}

    .spinner input[disabled] ~ .input-group-btn-vertical button, .spinner input[disabled] ~ .input-group-btn-vertical button:hover {
        color: var(--bs-gray);
        background-color: var(--bs-disabled-bg);
    }

label.hidden {
    display: inherit;
}

.ac-CompletionList {
    margin: -1px 0 0 0 !important;
    background-color: var(--bs-white);
    border: 1px solid var(--modern-border) !important;
    color: var(--modern-text);
    cursor: pointer;
    text-align: left;
    list-style-type: none;
    padding: 8px 0;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 300px;
}

    .ac-CompletionList::-webkit-scrollbar {
        width: 14px !important;
    }

    .ac-CompletionList::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg) !important;
        border: 3px solid var(--bs-white) !important;
        border-radius: 7px !important;
    }

    .ac-CompletionList::-webkit-scrollbar-track {
        background: var(--bs-white) !important;
        border-bottom-right-radius: 8px !important;
    }

.ac-ListItem {
    background-color: var(--bs-white);
    border: 1px solid transparent;
    border-left-width: 3px;
    border-right-width: 3px;
    border-radius: 6px;
    padding: 7px 14px;
    margin: 0;
    box-sizing: border-box;
}

    /* normal wrapper inside each list item */
    .ac-ListItem .ui-menu-item-wrapper {
        border: none;
        margin: 0;
        padding: 0;
        color: var(--modern-text);
    }

/* legacy AjaxToolkit highlight */
.ac-HighlightedListItem {
    background-color: var(--modern-row-selected) !important;
    border-color: var(--modern-hover-edge) !important;
    border-left: 3px solid var(--modern-btn-primary-bg) !important;
    border-right: 3px solid var(--modern-btn-primary-bg) !important;
    border-radius: 6px;
    color: var(--modern-btn-primary-bg);
    padding: 7px 14px;
}

/* new jQuery UI highlight */
.ac-ListItem .ui-menu-item-wrapper.ui-state-active {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--modern-btn-primary-bg) !important;
}

.ac-ListItem:has(.ui-menu-item-wrapper.ui-state-active) {
    background-color: var(--modern-row-selected) !important;
    border-color: var(--modern-hover-edge) !important;
    border-left: 3px solid var(--modern-btn-primary-bg) !important;
    border-right: 3px solid var(--modern-btn-primary-bg) !important;
    border-radius: 6px;
}

.ui-autocomplete {
    visibility: visible !important;
    z-index: 9999 !important;
}

/***********************************************************************************************************************************************************/
/* Controls Overrides (Focus Visible) */
/***********************************************************************************************************************************************************/

/* Generic .form-control:focus and .form-select:focus rules are already defined in ThirdParty/Bootstrap.css.
   App-specific input-group and spinner rules below. */

.input-group.spinner .btn:focus-visible {
    background-color: transparent !important;
    color: var(--modern-accent-focus);
}

.lookup-control-open {
    text-decoration: underline;
    cursor: pointer !important;
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1rem;
    padding-right: 2rem;
    background-color: var(--bs-form-control-bg, var(--bs-gray-200));
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: box-shadow .2s ease, background-size 0.12s ease-out, color 0.15s ease !important;
    color: var(--modern-accent-interactive);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%232f88ad' d='M307 34.8c-11.5 5.1-19 16.6-19 29.2l0 64-112 0C78.8 128 0 206.8 0 304C0 417.3 81.5 467.9 100.2 478.1c2.5 1.4 5.3 1.9 8.1 1.9c10.9 0 19.7-8.9 19.7-19.7c0-7.5-4.3-14.4-9.8-19.5C108.8 431.9 96 414.4 96 384c0-53 43-96 96-96l96 0 0 64c0 12.6 7.4 24.1 19 29.2s25 3 34.4-5.4l160-144c6.7-6.1 10.6-14.7 10.6-23.8s-3.8-17.7-10.6-23.8l-160-144c-9.4-8.5-22.9-10.6-34.4-5.4z'/%3E%3C/svg%3E");
}

    .lookup-control-open:focus, .lookup-control-open:hover {
        text-decoration: underline;
        text-decoration-thickness: 2px;
        text-underline-offset: 3px;
        text-shadow: none;
        color: var(--modern-accent-emphasis);
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%231f6f92' d='M307 34.8c-11.5 5.1-19 16.6-19 29.2l0 64-112 0C78.8 128 0 206.8 0 304C0 417.3 81.5 467.9 100.2 478.1c2.5 1.4 5.3 1.9 8.1 1.9c10.9 0 19.7-8.9 19.7-19.7c0-7.5-4.3-14.4-9.8-19.5C108.8 431.9 96 414.4 96 384c0-53 43-96 96-96l96 0 0 64c0 12.6 7.4 24.1 19 29.2s25 3 34.4-5.4l160-144c6.7-6.1 10.6-14.7 10.6-23.8s-3.8-17.7-10.6-23.8l-160-144c-9.4-8.5-22.9-10.6-34.4-5.4z'/%3E%3C/svg%3E");
        background-size: 1.2rem;
        background-position: right 0.75rem center;
    }

/* Hide disabled action buttons in lookup controls */
.input-group.lookup-control > .input-group-text[disabled] {
    display: none !important;
}

.html-readonly {
    background-color: var(--bs-disabled-bg);
    border-color: var(--modern-control-disabled-border);
    color: var(--modern-control-disabled-text);
    border-width: 1px;
    opacity: 1;
    min-height: 150px;
    height: 150px;
    white-space: pre-wrap;
    overflow-y: auto;
    scrollbar-color: var(--modern-btn-primary-bg) var(--bs-white);
    scrollbar-width: auto;
}

    .html-readonly::-webkit-scrollbar {
        width: 14px;
    }

    .html-readonly::-webkit-scrollbar-track {
        background: var(--bs-white);
    }

    .html-readonly::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg);
        border: 3px solid var(--bs-white);
        border-radius: 7px;
    }

    .html-readonly.save-error, .html-readonly.save-error * {
        color: var(--bs-danger) !important;
        font-weight: normal !important;
    }

/***********************************************************************************************************************************************************/
/* Custom Context/Popup Menu Stuff */
/***********************************************************************************************************************************************************/
.custom-context-menu {
    position: absolute;
    display: none;
    background: var(--bs-white);
    border: 1px solid var(--modern-border);
    padding: 4px 0;
    z-index: 9999;
    border-radius: 8px;
    box-shadow: 0 4px 12px var(--modern-shadow-black-rgb-15);
    font-size: 14px;
    min-width: 220px;
}

.custom-context-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
    white-space: nowrap;
    gap: 10px;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-radius: 6px;
}

    .custom-context-item:hover {
        background-color: var(--modern-row-selected) !important;
        border-color: var(--modern-hover-edge) !important;
        border-left-color: var(--modern-btn-primary-bg) !important;
        border-right-color: var(--modern-btn-primary-bg) !important;
    }

        .custom-context-item:hover .custom-context-item-icon,
        .custom-context-item:hover .custom-context-item-label {
            color: var(--modern-accent-emphasis);
        }

.custom-context-item-icon {
    width: 18px;
    color: var(--bs-gray-600);
    text-align: center;
    font-size: 14px;
}

.custom-context-item-label {
    flex: 1;
    color: var(--bs-gray-900);
}

.custom-context-item-shortcut {
    font-size: 12px;
    color: var(--bs-gray-900);
}

.select-hover-popup {
    position: absolute;
    z-index: 9999;
    background: var(--bs-white);
    border: 1px solid var(--bs-gray-300);
    border-radius: 6px;
    box-shadow: 0 4px 12px var(--modern-shadow-black-rgb-15);
    max-height: 200px;
    overflow-y: auto;
    font-size: 14px;
    min-width: 200px;
    padding: 4px 0;
    display: none;
    scrollbar-color: var(--modern-btn-primary-bg) var(--bs-white);
    scrollbar-width: auto;
}

    .select-hover-popup::-webkit-scrollbar {
        width: 14px !important;
        height: 14px !important;
    }

    .select-hover-popup::-webkit-scrollbar-track {
        background: var(--bs-white) !important;
    }

    .select-hover-popup::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg) !important;
        border: 3px solid var(--bs-white) !important;
        border-radius: 7px !important;
    }

    .select-hover-popup::-webkit-scrollbar-corner {
        background: var(--bs-white) !important;
    }

.select-hover-popup-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    color: var(--bs-gray-900);
    white-space: nowrap;
}

    .select-hover-popup-item.selected {
        color: var(--modern-accent-emphasis);
        font-weight: 500;
    }

.select-hover-popup-check {
    width: 1rem;
    flex: 0 0 1rem;
    color: var(--modern-accent-emphasis);
    text-align: center;
    font-size: .8rem;
}

.select-hover-popup-text {
    flex: 1 1 auto;
}

.select-hover-popup-item.disabled {
    color: var(--bs-gray-500);
    pointer-events: none;
    cursor: not-allowed;
}

/***********************************************************************************************************************************************************/
/* PAGE SUMMARY PANEL */
/***********************************************************************************************************************************************************/

.page-summary-group + .page-summary-group {
    border-top: 1px solid var(--modern-border);
}

.page-summary-group-heading {
    font-size: 12px;
    font-weight: 700;
    color: var(--modern-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 12px 14px 4px;
}


.page-summary-toolbar-group {
    display: flex;
    align-items: center;
    gap: 4px;
}

.page-summary-toolbar-btn {
    background: none;
    border: 1px solid transparent;
    border-radius: 4px;
    color: var(--modern-text-muted);
    font-size: 17px;
    padding: 4px 10px;
    cursor: pointer;
    transition: color 0.15s, background-color 0.15s, border-color 0.15s;
}

    .page-summary-toolbar-btn:hover {
        color: var(--modern-btn-primary-bg);
        background-color: var(--modern-row-selected);
        border-color: var(--modern-border);
    }

.page-summary-toolbar-sep {
    width: 1px;
    align-self: stretch;
    background-color: var(--modern-border);
}

.page-summary-section {
    display: flex;
    align-items: center;
    padding: 6px 14px;
    gap: 10px;
    cursor: pointer;
    transition: background-color 0.15s;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
}

    .page-summary-section:not(.active):hover {
        background-color: var(--modern-row-selected);
        border-right-color: var(--modern-btn-primary-bg);
    }

    .page-summary-section:active {
        background-color: var(--modern-border-subtle);
    }

    .page-summary-section.active {
        background-color: var(--modern-row-selected);
        border-left-color: var(--modern-btn-primary-bg);
    }

        .page-summary-section.active .page-summary-section-icon {
            color: var(--modern-btn-primary-bg);
        }

.page-summary-section-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--modern-text-muted);
    font-size: 14px;
}

.page-summary-section-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--modern-text);
    line-height: 1.3;
}

/* -- Summary panel: validation alert adorners -- */

.page-summary-section.sb-validation-alert {
    border-left-color: var(--modern-danger-btn-bg);
}

    .page-summary-section.sb-validation-alert .page-summary-section-icon {
        position: relative;
        color: var(--bs-danger);
    }

        .page-summary-section.sb-validation-alert .page-summary-section-icon::after {
            content: "\f071";
            font-family: "Font Awesome 6 Free";
            font-weight: 900;
            font-size: 9px;
            background: var(--modern-white);
            border-radius: 50%;
            line-height: 1;
            padding: 1px;
            position: absolute;
            top: -5px;
            right: -5px;
            text-shadow: 0 0 1px var(--modern-white), 0 0 2px var(--modern-white);
            color: var(--modern-danger-btn-bg);
        }

    .page-summary-section.sb-validation-alert.active .page-summary-section-icon {
        color: var(--bs-danger);
    }

    .page-summary-section.sb-validation-alert .page-summary-section-name {
        color: var(--bs-danger);
    }

.page-summary-section-status .page-summary-section-icon {
    color: var(--bs-success);
}

.page-summary-section-status.sb-validation-alert .page-summary-section-icon {
    color: var(--bs-danger);
}

    .page-summary-section-status.sb-validation-alert .page-summary-section-icon::after {
        content: none;
    }

.page-summary-section-status.active .page-summary-section-icon {
    color: var(--bs-success);
}

.page-summary-section-status.sb-validation-alert.active .page-summary-section-icon {
    color: var(--bs-danger);
}


.page-summary-panel {
    position: fixed;
    top: 0;
    right: 0;
    box-sizing: border-box;
    width: 280px;
    min-width: 280px;
    border-top: 1px solid transparent;
    border-left: 1px solid var(--modern-border);
    background: var(--modern-white);
    display: flex;
    flex-direction: column;
    transition: width 0.3s ease, min-width 0.3s ease;
    overflow: hidden;
    z-index: 100;
}

    .page-summary-panel.page-summary-panel-hidden {
        display: none;
    }

    /* Collapsed width restored to the original summary-panel strip size. */
    .page-summary-panel.collapsed {
        width: 36px;
        min-width: 36px;
    }

        .page-summary-panel.collapsed .page-summary-panel-body {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.15s ease, visibility 0s 0.15s;
        }

        .page-summary-panel.collapsed .page-summary-panel-collapsed-strip {
            opacity: 1;
            visibility: visible;
            height: 100%;
            transition: opacity 0.2s ease 0.15s, visibility 0s 0s;
        }

.page-summary-panel-collapsed-strip {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Align the collapsed chevron with the expanded tab baseline
       (body top gap + the tab button's own ~10px top padding). */
    padding-top: calc(var(--modern-content-top-gap) + 10px);
    gap: 8px;
    cursor: pointer;
    transition: opacity 0.15s ease, visibility 0s 0.15s, background-color 0.15s ease;
}

    /* Slim collapsed strip is a small target, so the whole column reacts on
       hover: subtle fill, accent-brightened chevron/label, and a gentle
       leftward nudge cueing that the panel pulls open. */
    .page-summary-panel-collapsed-strip:hover {
        background-color: var(--modern-row-selected);
    }

        .page-summary-panel-collapsed-strip:hover .page-summary-panel-collapsed-label {
            color: var(--modern-accent-emphasis);
        }

        .page-summary-panel-collapsed-strip:hover .page-summary-panel-expand-btn {
            color: var(--modern-accent-emphasis);
            background: none;
            animation: nudge-left 0.9s ease-in-out infinite;
        }

.page-summary-panel-collapsed-label {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 11px;
    font-weight: 600;
    color: var(--modern-text-muted);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.page-summary-panel-expand-btn,
.page-summary-panel-collapse-btn {
    background: none;
    border: none;
    color: var(--modern-text-muted);
    cursor: pointer;
    padding: 4px 6px;
    font-size: 12px;
    line-height: 1;
    border-radius: 4px;
    transition: color 0.15s, background-color 0.15s, transform 0.15s ease;
}

    .page-summary-panel-expand-btn:hover,
    .page-summary-panel-collapse-btn:hover {
        color: var(--modern-text-hover);
        background-color: var(--modern-row-selected);
    }

    .page-summary-panel-collapse-btn:hover {
        animation: summary-panel-nudge-right 0.9s ease-in-out infinite;
    }

@keyframes summary-panel-nudge-right {
    0% {
        transform: translateX(0);
    }

    40% {
        transform: translateX(3px);
    }

    100% {
        transform: translateX(0);
    }
}

.page-summary-panel-body {
    display: flex;
    flex-direction: column;
    height: 100%;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.2s ease 0.1s, visibility 0s 0s;
    /* Nudge the tab strip down off the title baseline (expanded state). */
    padding-top: var(--modern-content-top-gap);
}

.page-summary-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    height: calc(45px - var(--modern-content-top-gap) - 1px);
    min-height: calc(45px - var(--modern-content-top-gap) - 1px);
    /* Right padding aligns the collapse chevron's icon edge with the toolbar
       next-arrow and the header Info/Print buttons (~38px content edge). */
    padding: 0 18px 0 0;
    border-bottom: 1px solid var(--modern-border);
}

.page-summary-panel-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
}

.page-summary-panel-pin {
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 24px;
    margin-top: 1px;
    opacity: .5;
    background: none;
    border: 0;
    color: var(--theme-nav-primary);
    cursor: pointer;
    transition: opacity 0.15s ease;
}

    .page-summary-panel-pin i {
        transition: transform 0.15s ease;
    }

    .page-summary-panel-pin:not(.selected):hover {
        opacity: 1;
        animation: nudge 0.3s ease;
    }

    .page-summary-panel-pin.selected {
        opacity: 1;
        color: var(--theme-nav-primary);
    }

        .page-summary-panel-pin.selected i {
            transform: rotate(90deg);
        }

.page-summary-panel-tabs {
    display: flex;
    flex: 1;
    min-width: 0;
    align-items: stretch;
    position: relative;
}

.page-summary-panel-tab {
    position: relative;
    padding: 10px 14px 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--modern-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.25s ease;
}

    .page-summary-panel-tab::after {
        content: '';
        position: absolute;
        left: 14px;
        right: 14px;
        bottom: 0;
        height: 2px;
        background-color: var(--modern-btn-primary-bg);
        border-radius: 2px;
        transform: scaleX(0);
        transition: transform 0.25s ease;
    }

    .page-summary-panel-tab:hover {
        color: var(--modern-btn-primary-bg);
        text-shadow: 0 0 1px var(--modern-shadow-black-05);
    }

        .page-summary-panel-tab:hover::after {
            transform: scaleX(1);
        }

    .page-summary-panel-tab.active {
        color: var(--modern-btn-primary-bg);
    }

        .page-summary-panel-tab.active::after {
            transform: scaleX(1);
        }

/* Overflow menu */
.page-summary-panel-tab-overflow {
    position: relative;
    display: none;
    align-items: center;
    margin-left: auto;
}

    .page-summary-panel-tab-overflow.visible {
        display: flex;
    }

.page-summary-panel-tab-overflow-btn {
    background: none;
    border: none;
    color: var(--modern-text-muted);
    font-size: 14px;
    padding: 6px 10px;
    cursor: pointer;
    transition: color 0.2s ease;
}

    .page-summary-panel-tab-overflow-btn:hover {
        color: var(--modern-btn-primary-bg);
    }

.page-summary-panel-tab-overflow-menu {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 140px;
    background: var(--modern-white);
    border: 1px solid var(--modern-border);
    border-radius: 6px;
    box-shadow: 0 4px 12px var(--modern-shadow-black-10);
    z-index: 20;
    padding: 4px 0;
}

    .page-summary-panel-tab-overflow-menu.open {
        display: block;
    }

.page-summary-panel-tab-overflow-item {
    display: block;
    width: 100%;
    padding: 8px 14px;
    font-size: 12px;
    font-weight: 600;
    color: var(--modern-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}

    .page-summary-panel-tab-overflow-item:hover {
        background: var(--modern-row-selected);
        color: var(--modern-btn-primary-bg);
    }

    .page-summary-panel-tab-overflow-item.active {
        color: var(--modern-btn-primary-bg);
    }

.page-summary-panel-tab-content {
    display: none;
    position: relative;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

    .page-summary-panel-tab-content.active {
        display: flex;
    }

.page-summary-panel-sections-wrap {
    position: relative;
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.page-summary-panel-scroll-cue {
    position: absolute;
    left: 0;
    right: 4px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--modern-btn-primary-bg);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0s 0.2s;
    z-index: 2;
}

    .page-summary-panel-scroll-cue i {
        font-size: 13px;
    }

.page-summary-panel-scroll-cue-up {
    top: 0;
    background: linear-gradient(to bottom, var(--modern-row-selected) 10%, var(--modern-row-selected-transparent));
}

.page-summary-panel-scroll-cue-down {
    bottom: 0;
    background: linear-gradient(to top, var(--modern-row-selected) 10%, var(--modern-row-selected-transparent));
}

.page-summary-panel.has-scroll-cue-up .page-summary-panel-scroll-cue-up,
.page-summary-panel.has-scroll-cue-down .page-summary-panel-scroll-cue-down {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.2s ease, visibility 0s 0s;
}

.page-summary-panel-tab-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 40px 14px;
    color: var(--modern-text-muted);
    font-size: 13px;
}

    .page-summary-panel-tab-placeholder i {
        font-size: 24px;
        opacity: 0.5;
    }

.page-summary-section.sb-validation-alert :is(.page-summary-section-icon, .page-summary-section-name),
.page-summary-section-status.sb-validation-alert .page-summary-section-icon,
.page-summary-section-status.sb-validation-alert.active .page-summary-section-icon {
    color: var(--modern-danger-btn-bg);
}

.page-summary-panel-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--modern-text);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.page-summary-panel-sections {
    flex: 1;
    min-height: 0;
    padding: 4px 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

    .page-summary-panel-sections::-webkit-scrollbar {
        width: 3px;
    }

    .page-summary-panel-sections::-webkit-scrollbar-button {
        display: none;
        width: 0;
        height: 0;
    }

    .page-summary-panel-sections::-webkit-scrollbar-track {
        background: transparent;
    }

    .page-summary-panel-sections::-webkit-scrollbar-thumb {
        background: transparent;
        border-radius: 999px;
    }

    /* Keep the panel scrollbar nearly invisible so it doesn't compete with the
   content-container scrollbar; only a faint thumb hints on hover. */
    .page-summary-panel:hover .page-summary-panel-sections,
    .page-summary-panel-sections:hover,
    .page-summary-panel-sections:focus-within {
        scrollbar-color: var(--modern-shadow-muted-blue-25) transparent;
    }

        .page-summary-panel:hover .page-summary-panel-sections::-webkit-scrollbar-thumb,
        .page-summary-panel-sections:hover::-webkit-scrollbar-thumb,
        .page-summary-panel-sections:focus-within::-webkit-scrollbar-thumb {
            background: var(--modern-shadow-muted-blue-25);
        }

.page-summary-panel-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 14px;
    border-bottom: 1px solid var(--modern-border);
}

/***********************************************************************************************************************************************************/
/* ALERT INFO PANEL */
/***********************************************************************************************************************************************************/

:is(#alertInfoPanel, .alertInfoPanel) {
    margin-top: 0;
    border: 0 !important;
    outline: none !important;
}

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert {
        box-sizing: border-box;
        min-height: 0;
        height: 45px;
        line-height: 43px;
        margin-bottom: 0 !important;
        font-size: 0.9rem;
        text-transform: none !important;
        /* Left padding matches the form card's .px-4 (1.5rem) so the alert content
       lines up flush with the card's left edge and the content column. */
        padding: 0 1.5rem;
        border: 0 !important;
        border-top: 1px solid var(--modern-warning-border-strong) !important;
        border-bottom: 1px solid var(--modern-warning-border-strong) !important;
        border-radius: 0 !important;
        background-color: var(--modern-warning-surface);
        color: var(--modern-alert-text);
        box-shadow: none !important;
    }

        /* The base background above is the warning (cream) treatment. Danger
           alerts get the red error palette so the banner color matches its
           classname, not just the icon/border. */
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-danger {
            background-color: var(--modern-danger-header-bg);
            border-top-color: var(--modern-danger-border) !important;
            border-bottom-color: var(--modern-danger-border) !important;
        }

        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-info {
            border-top-color: var(--modern-info-border) !important;
            border-bottom-color: var(--modern-info-border) !important;
        }

        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-accent.alert-warning {
            border-left: 5px solid var(--modern-warning-icon) !important;
            padding-left: calc(1.5rem - 5px);
        }

        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-accent.alert-danger {
            border-left: 5px solid var(--modern-danger-text) !important;
            padding-left: calc(1.5rem - 5px);
        }

        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-accent.alert-info {
            border-left: 5px solid var(--bs-info-200) !important;
            padding-left: calc(1.5rem - 5px);
        }

        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-success {
            border-top-color: var(--modern-success-toast-border) !important;
            border-bottom-color: var(--modern-success-toast-border) !important;
        }

.formPanel-content > :is(#alertInfoPanel, .alertInfoPanel) > div.alert:first-of-type {
    border-top: 1px solid transparent !important;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-dismissible {
    position: relative;
    padding-right: 3rem;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline) {
    padding-left: 0;
    border-left-width: 0 !important;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline):not(:has(.toggle-details)) {
    height: auto;
    min-height: 45px;
    line-height: 1.4;
    padding: 0;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-details-expanded,
:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(.details.show),
:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(.details.collapsing) {
    height: auto;
    min-height: 45px;
    line-height: 1.4;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-dismissible > .btn-close {
    top: 0;
    bottom: 0;
    padding: 0;
    transform: none;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert > div {
    border-left: 3px solid var(--modern-warning-icon);
    padding-left: 0.75rem;
    line-height: 1.4;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert > .alert-inline {
    width: 100%;
    min-height: 43px;
    padding-top: 0;
    padding-left: calc(1.5rem - 5px);
    padding-right: 1.5rem;
    padding-bottom: 0;
    border-left-width: 5px;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    align-items: center !important;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline):not(:has(.toggle-details)) > .alert-inline {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-details-expanded > .alert-inline,
:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(.details.show) > .alert-inline,
:is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(.details.collapsing) > .alert-inline {
    min-height: 0;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    align-items: flex-start !important;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert > .alert-inline i {
    font-size: 1.25rem;
}

:is(
    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
    .contentContainer > div.alert:has(> .alert-inline)
) > .alert-inline > .flex-grow-1 {
    min-width: 0;
}

:is(
    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
    .contentContainer > div.alert:has(> .alert-inline)
) > .alert-inline > .flex-grow-1 > .d-flex {
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

:is(
    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
    .contentContainer > div.alert:has(> .alert-inline)
) > .alert-inline > .flex-grow-1 > .d-flex > div:first-child {
    min-width: 0;
    white-space: normal;
}

:is(
    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
    .contentContainer > div.alert:has(> .alert-inline)
):has(.toggle-details):not(.alert-details-expanded):not(:has(.details.show)):not(:has(.details.collapsing)) > .alert-inline > .flex-grow-1 > .d-flex > div:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:is(
    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
    .contentContainer > div.alert:has(> .alert-inline)
) > .alert-inline > .flex-grow-1 > .d-flex > .toggle-details {
    flex: 0 0 auto;
    white-space: nowrap;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert strong {
    color: var(--modern-alert-text);
    font-weight: 700;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert i {
    color: var(--modern-warning-icon);
    font-size: 0.9rem;
    align-self: center;
}

:is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-warning {
    border-left-color: var(--modern-warning-icon);
}

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-warning i {
        color: var(--modern-warning-icon);
    }

:is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-danger {
    border-left-color: var(--modern-danger-text);
}

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-danger i {
        color: var(--modern-danger-text);
    }

:is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-info {
    border-left-color: var(--bs-info-200);
}

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-info i {
        color: var(--bs-info-200);
    }

:is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-success {
    border-left-color: var(--bs-success-200);
}

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert .alert-inline-success i {
        color: var(--bs-success-200);
    }

:is(#alertInfoPanel, .alertInfoPanel) .text-uppercase {
    text-transform: none !important;
}

/***********************************************************************************************************************************************************/
/* BUTTON GROUPS */
/***********************************************************************************************************************************************************/
.btn-group button:not(.dropdown-menu) i.fa,
.btn-group button:not(.dropdown-menu) i.fas {
    display: inline-block;
    transition: transform 0.15s ease;
    transform-origin: center center;
}

.btn-group button:not(.dropdown-menu):hover i.fa,
.btn-group button:not(.dropdown-menu):hover i.fas {
    transform: scale(1.2);
}

.btn-group:has(> .dropdown-list-mode) {
    --bs-info: var(--modern-btn-primary-bg);
    --bs-info-rgb: var(--modern-accent-primary-rgb);
    --bs-btn-info-hover-bg: var(--modern-btn-primary-hover);
}

    /* Treat the list-mode split-button (bars + label + caret) as a single control:
   hovering or opening any segment highlights the whole group, and the label
   segment truncates with an ellipsis instead of stretching the trigger. */
    .btn-group:has(> .dropdown-list-mode):hover > .btn-info,
    .btn-group:has(> .dropdown-list-mode).show > .btn-info,
    .btn-group:has(> .dropdown-list-mode).dropdown-open > .btn-info {
        background-color: var(--bs-btn-info-hover-bg) !important;
        border-color: var(--bs-btn-info-hover-bg) !important;
        color: var(--bs-white) !important;
    }

        .btn-group:has(> .dropdown-list-mode):hover > .btn-info.dropdown-toggle::after,
        .btn-group:has(> .dropdown-list-mode).show > .btn-info.dropdown-toggle::after,
        .btn-group:has(> .dropdown-list-mode).dropdown-open > .btn-info.dropdown-toggle::after {
            border-top-color: var(--bs-white) !important;
        }

/* Three-part list-mode trigger only: icon + label + caret. Keep this scoped
   away from search option dropdowns and other dropdown-list-mode controls. */
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .btn-info {
    --joined-control-edge-width: 2.25rem;
    background-color: var(--bs-body-bg) !important;
    border-color: var(--modern-border-soft) !important;
    color: var(--theme-nav-primary) !important;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.75px;
    text-transform: uppercase;
}

    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .btn-info:first-child {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 var(--joined-control-edge-width) !important;
        width: var(--joined-control-edge-width) !important;
        min-width: var(--joined-control-edge-width) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-right-color: transparent !important;
    }

    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .btn-info.btn-autosize:not(:first-child) {
        border-left-color: transparent !important;
        border-right-color: transparent !important;
        color: var(--modern-accent-emphasis) !important;
        font-weight: 600 !important;
    }

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .dropdown-list-mode {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--joined-control-edge-width) !important;
    width: var(--joined-control-edge-width) !important;
    min-width: var(--joined-control-edge-width) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-left-color: transparent !important;
}

    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .dropdown-list-mode::after {
        margin-left: 0;
        vertical-align: middle;
    }

.btn-group:has(> .dropdown-list-mode) > .dropdown-menu .dropdown-item a.selected {
    color: var(--modern-accent-emphasis) !important;
    font-weight: 600 !important;
}

    .btn-group:has(> .dropdown-list-mode) > .dropdown-menu .dropdown-item a.selected > .fa {
        color: var(--modern-accent-emphasis) !important;
    }

.dropdown-list-mode:disabled::after,
.dropdown-list-mode.disabled::after {
    display: none;
}

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .btn-info i,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .btn-info.dropdown-toggle::after {
    color: var(--theme-nav-primary) !important;
    border-top-color: var(--theme-nav-primary) !important;
}

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .btn-info,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .btn-info,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .btn-info,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):focus-within > .btn-info {
    background-color: var(--modern-row-hover) !important;
    border-color: var(--modern-border-soft) !important;
    color: var(--theme-nav-primary) !important;
}

    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .btn-info:first-child,
    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .btn-info:first-child,
    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .btn-info:first-child {
        border-right-color: transparent !important;
    }

    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .btn-info.btn-autosize:not(:first-child),
    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .btn-info.btn-autosize:not(:first-child),
    .btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .btn-info.btn-autosize:not(:first-child) {
        border-left-color: transparent !important;
        border-right-color: transparent !important;
    }

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .dropdown-list-mode,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .dropdown-list-mode,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .dropdown-list-mode,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):focus-within > .dropdown-list-mode {
    border-left-color: transparent !important;
}

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .btn-info i,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .btn-info i,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .btn-info i,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):not(:has(> .dropdown-list-mode:disabled)):not(:has(> .dropdown-list-mode.disabled)):hover > .btn-info.dropdown-toggle::after,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).show > .btn-info.dropdown-toggle::after,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode).dropdown-open > .btn-info.dropdown-toggle::after,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):focus-within > .btn-info i,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode):focus-within > .btn-info.dropdown-toggle::after {
    color: var(--theme-nav-primary) !important;
    border-top-color: var(--theme-nav-primary) !important;
}

.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .dropdown-list-mode:focus,
.btn-group:has(> .btn-info.btn-autosize:first-child > i.fa):has(> .dropdown-list-mode) > .dropdown-list-mode:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:not(:first-child) {
    max-width: min(22rem, 32vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dropdown-stack-on-wrap.is-stacked > .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:not(:first-child) {
    max-width: none;
}

.search-options-dropdown,
.search-mode-options-dropdown,
#searchOptionsDropdown,
.lookup-control-open-popup .dropdown-menu,
.dropdown-toggle-split ~ .dropdown-menu,
.dropdown-list-mode ~ .dropdown-menu {
    border: 1px solid var(--modern-border) !important;
    border-radius: 8px;
    box-shadow: 0 4px 16px var(--modern-shadow-black-10);
    padding: 8px 0;
}

ul.dropdown-menu.dropdown-search-menu {
    width: min(32rem, calc(100vw - 2rem));
    max-width: calc(100vw - 2rem);
    max-height: none !important;
    overflow: visible !important;
}

.dropdown-options-menu-list {
    max-height: 20rem;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: auto;
}

    .dropdown-options-menu-list::-webkit-scrollbar {
        width: 14px !important;
        height: 14px !important;
    }

    .dropdown-options-menu-list::-webkit-scrollbar-button:single-button,
    .dropdown-options-menu-list::-webkit-scrollbar-button:vertical:decrement,
    .dropdown-options-menu-list::-webkit-scrollbar-button:vertical:increment,
    .dropdown-options-menu-list::-webkit-scrollbar-button:horizontal:decrement,
    .dropdown-options-menu-list::-webkit-scrollbar-button:horizontal:increment {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        background: transparent !important;
        border: 0 !important;
    }

    .dropdown-options-menu-list::-webkit-scrollbar-track {
        background: var(--bs-white) !important;
    }

    .dropdown-options-menu-list::-webkit-scrollbar-thumb {
        background: var(--modern-btn-primary-bg) !important;
        border: 3px solid var(--bs-white) !important;
        border-radius: 7px !important;
    }


    .search-options-dropdown .dropdown-header,
    .search-mode-options-dropdown .dropdown-header,
    #searchOptionsDropdown .dropdown-header {
        color: var(--modern-text-muted);
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        padding: 5px 12px 4px;
    }

    .action-btn-dropdown .search-options-dropdown .dropdown-header {
        padding-left: 14px;
        padding-right: 14px;
    }

        .action-btn-dropdown .search-options-dropdown .dropdown-header:not(.network-solution-current) {
            padding-top: 10px;
            padding-bottom: 8px;
        }

        .action-btn-dropdown .search-options-dropdown .dropdown-item.network-solution-current {
            font-size: 0.95rem;
            font-weight: 500;
            text-transform: none;
            letter-spacing: 0;
            padding-top: 7px;
            padding-bottom: 7px;
        }

            .action-btn-dropdown .search-options-dropdown .dropdown-item.network-solution-current > a,
            .action-btn-dropdown .search-options-dropdown .dropdown-item.network-solution-current > a strong {
                color: var(--modern-accent-emphasis) !important;
                font-weight: 500;
            }

    .search-options-dropdown .dropdown-item,
    .search-mode-options-dropdown .dropdown-item,
    .lookup-control-open-popup .dropdown-item,
    .dropdown-toggle-split ~ .dropdown-menu .dropdown-item,
    .dropdown-list-mode ~ .dropdown-menu .dropdown-item,
    #searchOptionsDropdown .dropdown-item {
        border: 1px solid transparent;
        border-left-width: 3px;
        border-right-width: 3px;
        border-radius: 6px;
        padding: 7px 14px;
        margin: 0;
        color: var(--modern-text);
        transition: background-color 0.15s, border-color 0.15s;
    }

        .search-options-dropdown .dropdown-item > a,
        .search-mode-options-dropdown .dropdown-item > a,
        .dropdown-toggle-split ~ .dropdown-menu .dropdown-item > a,
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item > a,
        #searchOptionsDropdown .dropdown-item > a {
            color: var(--modern-text);
            font-size: 1rem;
            display: block;
            transition: color 0.15s;
        }

        .action-btn-dropdown .search-options-dropdown .dropdown-item > a,
        .action-btn-dropdown .search-options-dropdown .dropdown-item.network-solution-current > a {
            display: flex;
            align-items: center;
            font-size: 0.95rem;
            line-height: 1.4;
            padding-top: 0;
            padding-bottom: 0;
        }

        .search-options-dropdown .dropdown-item:hover:not(:has(a.pointer-events-none)),
        .search-options-dropdown .dropdown-item:focus-within:not(:has(a.pointer-events-none)),
        .search-mode-options-dropdown .dropdown-item:hover:not(:has(a.pointer-events-none)),
        .search-mode-options-dropdown .dropdown-item:focus-within:not(:has(a.pointer-events-none)),
        .lookup-control-open-popup .dropdown-item:hover,
        .lookup-control-open-popup .dropdown-item:focus,
        .dropdown-toggle-split ~ .dropdown-menu .dropdown-item:hover:not(:has(a.pointer-events-none)),
        .dropdown-toggle-split ~ .dropdown-menu .dropdown-item:focus-within:not(:has(a.pointer-events-none)),
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item:hover:not(:has(a.pointer-events-none)),
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item:focus-within:not(:has(a.pointer-events-none)),
        #searchOptionsDropdown .dropdown-item:hover:not(:has(a.pointer-events-none)),
        #searchOptionsDropdown .dropdown-item:focus-within:not(:has(a.pointer-events-none)) {
            background-color: var(--modern-accent-primary-12) !important;
            border-color: var(--modern-hover-edge) !important;
            border-left: 3px solid var(--modern-btn-primary-bg) !important;
            border-right: 3px solid var(--modern-btn-primary-bg) !important;
            border-radius: 6px;
            color: var(--modern-accent-emphasis);
        }

        .search-options-dropdown .dropdown-item:hover > a,
        .search-options-dropdown .dropdown-item:focus-within > a,
        .search-mode-options-dropdown .dropdown-item:hover > a,
        .search-mode-options-dropdown .dropdown-item:focus-within > a,
        .dropdown-toggle-split ~ .dropdown-menu .dropdown-item:hover > a,
        .dropdown-toggle-split ~ .dropdown-menu .dropdown-item:focus-within > a,
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item:hover > a,
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item:focus-within > a,
        #searchOptionsDropdown .dropdown-item:hover > a,
        #searchOptionsDropdown .dropdown-item:focus-within > a {
            color: var(--modern-accent-emphasis);
            text-decoration: none;
        }

        .search-options-dropdown .dropdown-item > a .fa-check,
        .search-mode-options-dropdown .dropdown-item > a .fa-check,
        .dropdown-list-mode ~ .dropdown-menu .dropdown-item:not(:has(a.pointer-events-none)) > a .fa-check,
        #searchOptionsDropdown .dropdown-item:not(:has(a.pointer-events-none)) > a .fa-check {
            color: var(--modern-accent-emphasis) !important;
            margin-right: 8px;
            font-size: 0.8rem;
        }

        .action-btn-dropdown .search-options-dropdown .dropdown-item > a .fa-check,
        .action-btn-dropdown .search-options-dropdown .dropdown-item.network-solution-current > a .fa-check {
            width: 0.8rem;
            min-width: 0.8rem;
            text-align: center;
        }

.module-action-btns .search-options-dropdown .dropdown-item > a:hover .fa-check {
    transform: none;
}

/* Non-interactive (required or disabled) search options: muted like a
           disabled <option> so it's clear they can't be toggled, which is why
           they don't show the hover pill. */
.search-options-dropdown .dropdown-item:has(a.pointer-events-none) > a,
.search-options-dropdown .dropdown-item:has(a.pointer-events-none) > a .fa-check,
.search-mode-options-dropdown .dropdown-item:has(a.pointer-events-none) > a,
.search-mode-options-dropdown .dropdown-item:has(a.pointer-events-none) > a .fa-check,
.dropdown-toggle-split ~ .dropdown-menu .dropdown-item:has(a.pointer-events-none) > a,
.dropdown-toggle-split ~ .dropdown-menu .dropdown-item:has(a.pointer-events-none) > a .fa-check,
.dropdown-list-mode ~ .dropdown-menu .dropdown-item:has(a.pointer-events-none) > a,
.dropdown-list-mode ~ .dropdown-menu .dropdown-item:has(a.pointer-events-none) > a .fa-check,
#searchOptionsDropdown .dropdown-item:has(a.pointer-events-none) > a,
#searchOptionsDropdown .dropdown-item:has(a.pointer-events-none) > a .fa-check {
    color: color-mix(in srgb, var(--bs-text-disabled) 48%, var(--modern-white)) !important;
}



.search-options-dropdown .dropdown-divider,
.search-mode-options-dropdown .dropdown-divider,
.dropdown-toggle-split ~ .dropdown-menu .dropdown-divider,
.dropdown-list-mode ~ .dropdown-menu .dropdown-divider,
#searchOptionsDropdown .dropdown-divider {
    border-color: var(--modern-border);
    margin: 4px 14px;
}

.action-btn-dropdown .search-options-dropdown .dropdown-divider {
    margin: 8px 14px;
}

/***********************************************************************************************************************************************************/
/* NAVLINK VALIDATION */
/***********************************************************************************************************************************************************/

.nav-link.ht-validation-alert.warning {
    --tab-validation-color: var(--modern-warning-btn-bg);
    --tab-validation-hover-color: var(--modern-warning-btn-hover);
    --tab-validation-active-color: var(--modern-warning-btn-hover);
    --tab-validation-active-bg: var(--modern-warning-surface);
    --tab-validation-active-border: var(--modern-warning-border-strong);
}

.nav-link.ht-validation-alert.error {
    --tab-validation-color: var(--modern-danger-btn-bg);
    --tab-validation-hover-color: var(--modern-danger-btn-hover);
    --tab-validation-active-bg: var(--modern-danger-header-bg);
    --tab-validation-active-border: var(--modern-danger-border);
}

    .nav-link.ht-validation-alert.warning,
    .nav-link.ht-validation-alert.error,
    .nav-link.ht-validation-alert.warning .validation-icon,
    .nav-link.ht-validation-alert.error .validation-icon {
        color: var(--tab-validation-color) !important;
    }

        .nav-link.ht-validation-alert.warning::after,
        .nav-link.ht-validation-alert.error::after {
            width: 100%;
            height: 2px;
            bottom: 0;
            background-color: var(--tab-validation-color) !important;
        }

        .nav-link.ht-validation-alert.warning:hover,
        .nav-link.ht-validation-alert.warning:focus-visible,
        .nav-link.ht-validation-alert.error:hover,
        .nav-link.ht-validation-alert.error:focus-visible {
            background-color: var(--tab-validation-active-bg, color-mix(in srgb, var(--tab-validation-color) 13%, white)) !important;
            color: var(--tab-validation-hover-color) !important;
        }

            .nav-link.ht-validation-alert.warning:hover::after,
            .nav-link.ht-validation-alert.warning:focus-visible::after,
            .nav-link.ht-validation-alert.error:hover::after,
            .nav-link.ht-validation-alert.error:focus-visible::after {
                height: 3px;
            }

            .nav-link.ht-validation-alert.warning:hover .validation-icon,
            .nav-link.ht-validation-alert.warning:focus-visible .validation-icon,
            .nav-link.ht-validation-alert.error:hover .validation-icon,
            .nav-link.ht-validation-alert.error:focus-visible .validation-icon {
                color: var(--tab-validation-color) !important;
            }

.nav-tabs .nav-link.ht-validation-alert.warning.active,
.nav-tabs .nav-link.ht-validation-alert.warning.active:hover,
.nav-tabs .nav-link.ht-validation-alert.warning.active:focus-visible,
.nav-tabs .nav-link.ht-validation-alert.error.active,
.nav-tabs .nav-link.ht-validation-alert.error.active:hover,
.nav-tabs .nav-link.ht-validation-alert.error.active:focus-visible {
    background-color: var(--tab-validation-active-bg, color-mix(in srgb, var(--tab-validation-color) 13%, white)) !important;
    border-top-color: var(--tab-validation-active-border, var(--modern-border-soft)) !important;
    border-left-color: var(--tab-validation-active-border, var(--modern-border-soft)) !important;
    border-right-color: var(--tab-validation-active-border, var(--modern-border-soft)) !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    color: var(--tab-validation-active-color, var(--tab-validation-color)) !important;
}

    .nav-tabs .nav-link.ht-validation-alert.warning.active::after,
    .nav-tabs .nav-link.ht-validation-alert.warning.active:hover::after,
    .nav-tabs .nav-link.ht-validation-alert.warning.active:focus-visible::after,
    .nav-tabs .nav-link.ht-validation-alert.error.active::after,
    .nav-tabs .nav-link.ht-validation-alert.error.active:hover::after,
    .nav-tabs .nav-link.ht-validation-alert.error.active:focus-visible::after {
        width: 100%;
        height: 2px;
        background-color: var(--tab-validation-color) !important;
    }

/***********************************************************************************************************************************************************/
/* TOOLTIPS - SEMANTIC STYLING */
/***********************************************************************************************************************************************************/

.semantic-status {
    transition: color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.semantic-status.success {
    color: var(--modern-success-text);
}

.semantic-status.warning {
    color: var(--modern-warning-icon);
}

.semantic-status.danger {
    color: var(--modern-danger-text);
}

.tooltip-status-cell {
    cursor: pointer;
}

.tooltip-status-cell.warning:hover,
.tooltip-status-cell.warning:focus-within {
    background-color: color-mix(in srgb, var(--modern-warning-icon) 9%, var(--modern-white));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--modern-warning-icon) 24%, transparent);
}

.tooltip-status-cell.danger:hover,
.tooltip-status-cell.danger:focus-within {
    background-color: color-mix(in srgb, var(--modern-danger-text) 9%, var(--modern-white));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--modern-danger-text) 24%, transparent);
}

.tooltip-status-trigger {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
}

.tooltip-status-trigger:focus-visible {
    outline: 0;
}

.tooltip.tooltip-warning .tooltip-inner {
    max-width: 500px;
    padding: 8px 12px;
    background-color: var(--modern-warning-surface);
    color: var(--modern-alert-text);
    border: 1px solid var(--modern-warning-border-strong);
    border-left: 4px solid var(--modern-warning-icon);
    box-shadow: 0 8px 20px var(--modern-shadow-slate-12);
    text-align: left;
}

.tooltip.tooltip-warning.bs-tooltip-top .tooltip-arrow::before,
.tooltip.tooltip-warning.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    border-top-color: var(--modern-warning-border-strong);
}

.tooltip.tooltip-warning.bs-tooltip-bottom .tooltip-arrow::before,
.tooltip.tooltip-warning.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
    border-bottom-color: var(--modern-warning-border-strong);
}

.tooltip.tooltip-warning.bs-tooltip-start .tooltip-arrow::before,
.tooltip.tooltip-warning.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before {
    border-left-color: var(--modern-warning-border-strong);
}

.tooltip.tooltip-warning.bs-tooltip-end .tooltip-arrow::before,
.tooltip.tooltip-warning.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
    border-right-color: var(--modern-warning-border-strong);
}

/* Error/info tooltips use the soft danger surface from the modern
   danger dialog family (pale pink panel, danger-red text). This keeps red as the
   semantic "something went wrong" signal while shedding the heavy solid-red block
   that felt too bold against the pastel scheme. The INFO button stays bold red and
   now "opens into" this gentle panel for a cohesive danger language. */
.tooltip.tooltip-error .tooltip-inner {
    background-color: color-mix(in srgb, var(--modern-danger-header-bg) 45%, var(--modern-white));
    color: var(--modern-alert-text);
    border: 1px solid var(--modern-danger-border);
    border-left: 4px solid var(--modern-danger-btn-bg);
    box-shadow: 0 6px 18px var(--modern-danger-shadow-18);
    text-shadow: none;
    text-align: left;
    padding: 14px 18px;
    min-width: 280px;
    max-width: 500px;
    width: max-content;
}

    .tooltip.tooltip-error .tooltip-inner :is(strong, b) {
        color: var(--modern-danger-text);
    }

.tooltip.tooltip-error .error-tooltip-summary {
    display: block;
    margin-bottom: 0.85rem;
}

.tooltip.tooltip-error .error-tooltip-action {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    padding: 0.75rem 0.85rem;
    background-color: var(--modern-white);
    border: 1px solid color-mix(in srgb, var(--modern-danger-border) 70%, var(--modern-white));
    border-radius: 6px;
    box-shadow: 0 1px 4px var(--modern-shadow-black-07);
}

    .tooltip.tooltip-error .error-tooltip-action i {
        margin-top: 0.15rem;
        color: var(--modern-danger-text);
    }

.tooltip.tooltip-error .error-clear-note {
    display: flex;
    gap: 0.45rem;
    align-items: center;
    margin-top: 0.65rem;
    padding: 0.45rem 0.6rem;
    background-color: color-mix(in srgb, var(--modern-danger-header-bg) 20%, var(--modern-white));
    border: 1px solid color-mix(in srgb, var(--modern-danger-border) 45%, var(--modern-white));
    border-radius: 5px;
    color: var(--modern-alert-text);
    font-size: 0.9em;
}

    .tooltip.tooltip-error .error-clear-note i {
        color: var(--modern-danger-text);
    }

/* Inner "last error" detail box: white card that visibly lifts off the pale
   danger surface so the raw error reads as a distinct, elevated "raw detail"
   card. A monospace, uppercase-label treatment gives it a diagnostic feel. */
.tooltip.tooltip-error .last-error {
    display: block;
    margin-top: 1rem;
    padding: 0.75rem 0.95rem;
    background-color: var(--modern-white);
    color: var(--modern-text);
    border: 1px solid var(--modern-danger-border);
    border-radius: 6px;
    box-shadow: 0 2px 8px var(--modern-shadow-black-07);
    font-family: var(--bs-font-monospace, ui-monospace, "Cascadia Code", "Consolas", monospace);
    font-size: 0.95em;
    line-height: 1.4;
    text-align: left;
}

/* Uppercase tag that prefixes the raw error detail. */
.tooltip.tooltip-error .last-error-label {
    display: block;
    margin-bottom: 0.35rem;
    font-family: var(--bs-font-sans-serif, system-ui, sans-serif);
    font-size: 0.82em;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--modern-danger-btn-bg);
}

/* Error tooltip arrow colors for all placement variants */
.tooltip.tooltip-error.bs-tooltip-top .tooltip-arrow::before,
.tooltip.tooltip-error.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    border-top-color: var(--modern-danger-btn-bg);
}

.tooltip.tooltip-error.bs-tooltip-bottom .tooltip-arrow::before,
.tooltip.tooltip-error.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
    border-bottom-color: var(--modern-danger-btn-bg);
}

.tooltip.tooltip-error.bs-tooltip-start .tooltip-arrow::before,
.tooltip.tooltip-error.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before {
    border-left-color: var(--modern-danger-btn-bg);
}

.tooltip.tooltip-error.bs-tooltip-end .tooltip-arrow::before,
.tooltip.tooltip-error.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
    border-right-color: var(--modern-danger-btn-bg);
}

/***********************************************************************************************************************************************************/
/* VALIDATION & INPUT GROUP STYLING */
/***********************************************************************************************************************************************************/

/* Unify validation/danger signals to the new danger token across
   field validation, side navigation adorners, and module header status chrome. */
:is( .invalid-feedback, .fv-plugins-message-container.invalid-feedback, .fv-plugins-message-container--enabled.invalid-feedback ) {
    color: var(--modern-danger-btn-bg) !important;
}

:is( .text-danger, .validation-icon.text-danger, .form-label.text-danger, label.text-danger ) {
    color: var(--modern-danger-btn-bg) !important;
}

label.is-invalid,
.fv-plugins-bootstrap5-row-invalid > .input-group button > i.fa,
.fv-plugins-bootstrap5-row-invalid > .input-group button > i.fas,
.fv-plugins-bootstrap5-row-invalid > .input-group.validation-action-group > .fv-plugins-icon.fa,
.fv-plugins-bootstrap5-row-invalid > .input-group.validation-action-group > .fv-plugins-icon.fas {
    color: var(--modern-danger-btn-bg) !important;
}

.input-group.validation-action-group > .fv-plugins-icon.fa-times {
    top: 50% !important;
    transform: translateY(-50%);
}

/* Tighten input-group vertical alignment so lookup/action icons
   sit on the same optical baseline as the text input across cards/modals.
   Exclude collapsed elements (e.g. the AG-grid "Remove user filters" button)
   so this layout rule never overrides Bootstrap's .collapse display:none. */
.input-group > .input-group-text:not(.collapse:not(.show)),
.modal .input-group > .input-group-text:not(.collapse:not(.show)) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
}

/* Remove internal input-group separators so joined controls read as one cohesive field. */
.input-group:has(> input.form-control) > .input-group-text:not(:first-child):not(.collapse:not(.show)),
.modal .input-group:has(> input.form-control) > .input-group-text:not(:first-child):not(.collapse:not(.show)) {
    border-left-color: transparent;
}

.input-group:has(> input.form-control) > .input-group-text:has(~ .input-group-text:not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"])),
.modal .input-group:has(> input.form-control) > .input-group-text:has(~ .input-group-text:not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"])) {
    border-right-color: transparent;
}

.input-group.validation-action-group > input[type="password"]::-ms-reveal,
.input-group.validation-action-group > input[type="password"]::-ms-clear {
    display: none;
}

.input-group > .input-group-text i,
.modal .input-group > .input-group-text i {
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
    transform-origin: center center;
    -webkit-text-stroke-width: 0;
    transition: color 0.15s ease, transform 0.15s ease;
}

/* Restore border-radius when hidden trailing buttons prevent rounding. */
.input-group > input.form-control:has(+ .input-group-text:is(.collapse:not(.show), .d-none, [style*="display: none"], [style*="display:none"])):not(:has(~ .input-group-text:not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"]))) {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
}

/***********************************************************************************************************************************************************/
/* LOOKUP CONTROL */
/***********************************************************************************************************************************************************/

.input-group.lookup-control:has(> .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"])) > .lookup-control-open,
.input-group.lookup-control:has(> .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"])) > input.form-control[data-role="name"] {
    border-right-color: transparent;
    border-right-width: 0 !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* Treat lookup input-groups as one cohesive control shell (like header search). */
.input-group.lookup-control {
    border: 0;
    border-radius: 0;
    overflow: visible;
}

    .input-group.lookup-control > .lookup-control-open,
    .input-group.lookup-control > input.form-control[data-role="name"],
    .input-group.lookup-control > .input-group-text {
        border: 1px solid var(--modern-border) !important;
        box-shadow: none !important;
    }

    .input-group.lookup-control > .lookup-control-open,
    .input-group.lookup-control > input.form-control[data-role="name"] {
        border-top-left-radius: var(--bs-border-radius);
        border-bottom-left-radius: var(--bs-border-radius);
    }

    .input-group.lookup-control > .input-group-text {
        border-left-width: 0 !important;
        border-right-width: 0 !important;
        border-radius: 0;
    }

    /* Normalize padding added by FormValidation status icons in lookup groups. */
    .input-group.lookup-control > input.form-control[data-role="name"].fv-plugins-icon-input:not(.lookup-control-open) {
        padding-right: 0.75rem !important;
    }

    .input-group.lookup-control > .lookup-control-open.fv-plugins-icon-input {
        padding-right: 2rem !important;
    }

.inputGroupContainer.fv-plugins-icon-container:has(.input-group.lookup-control:not(.validation-action-group)) > .fv-plugins-icon {
    display: none !important;
}

.inputGroupContainer.fv-plugins-icon-container > .input-group.lookup-control:not(.validation-action-group) + .fv-plugins-icon {
    display: none !important;
}

.inputGroupContainer.fv-plugins-icon-container > .input-group.lookup-control > .fv-plugins-icon-input {
    padding-right: 0.75rem !important;
}

.inputGroupContainer.fv-plugins-icon-container > .input-group.lookup-control > .lookup-control-open.fv-plugins-icon-input {
    padding-right: 2rem !important;
}

.input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"],
.modal .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"] {
    color: var(--modern-accent-interactive);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    text-shadow: none;
}

    .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:hover,
    .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:focus,
    .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:focus-visible,
    .modal .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:hover,
    .modal .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:focus,
    .modal .input-group.lookup-control > input.form-control.lookup-control-open[data-role="name"]:focus-visible {
        color: var(--modern-accent-emphasis) !important;
        text-decoration: underline !important;
        text-decoration-thickness: 2px !important;
        text-shadow: none !important;
        outline: 0;
    }

.input-group.lookup-control > .fv-plugins-message-container.invalid-feedback:empty,
.input-group.lookup-control > .fv-plugins-message-container--enabled.invalid-feedback:empty {
    display: none !important;
    margin-top: 0 !important;
}

.inputGroupContainer > .fv-plugins-message-container.invalid-feedback:empty,
.inputGroupContainer > .fv-plugins-message-container--enabled.invalid-feedback:empty,
.inputGroupContainer.fv-plugins-icon-container > .fv-plugins-message-container.invalid-feedback:empty,
.inputGroupContainer.fv-plugins-icon-container > .fv-plugins-message-container--enabled.invalid-feedback:empty {
    display: none !important;
    margin-top: 0 !important;
}

/* Remove Bootstrap/FormValidation valid-state adorners (background image + padding) that create false spacers. */
.input-group.lookup-control > input.form-control[data-role="name"].is-valid,
.input-group.lookup-control > input.form-control[data-role="name"].is-invalid,
.input-group.lookup-control > input.form-control[data-role="name"].fv-plugins-icon-input.is-valid,
.input-group.lookup-control > input.form-control[data-role="name"].fv-plugins-icon-input.is-invalid,
.input-group.lookup-control.was-validated > input.form-control[data-role="name"]:valid,
.input-group.lookup-control.was-validated > input.form-control[data-role="name"]:invalid {
    background-image: none !important;
    padding-right: 0.75rem !important;
}

.input-group.lookup-control > :not(:first-child) {
    margin-left: 0 !important;
}

.input-group.lookup-control:has(> :is(.lookup-control-open, button.input-group-text):not(:disabled):not([disabled])):not(:has(> input.form-control.is-invalid)):not(:has(> input.form-control:invalid)):focus-within {
    border-color: transparent;
    border-radius: var(--bs-border-radius);
    box-shadow: 0 0 0 0.2rem var(--modern-accent-primary-25);
}

    .input-group.lookup-control:has(> :is(.lookup-control-open, button.input-group-text):not(:disabled):not([disabled])):not(:has(> input.form-control.is-invalid)):not(:has(> input.form-control:invalid)):focus-within > .lookup-control-open,
    .input-group.lookup-control:has(> :is(.lookup-control-open, button.input-group-text):not(:disabled):not([disabled])):not(:has(> input.form-control.is-invalid)):not(:has(> input.form-control:invalid)):focus-within > input.form-control[data-role="name"],
    .input-group.lookup-control:has(> :is(.lookup-control-open, button.input-group-text):not(:disabled):not([disabled])):not(:has(> input.form-control.is-invalid)):not(:has(> input.form-control:invalid)):focus-within > .input-group-text {
        border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
    }

    .input-group.lookup-control:has(> :is(.lookup-control-open, button.input-group-text):not(:disabled):not([disabled])):not(:has(> input.form-control.is-invalid)):not(:has(> input.form-control:invalid)):focus-within > :not([type="hidden"]):not(.fv-plugins-message-container):not(.fv-plugins-message-container--enabled):not(.invalid-feedback) {
        border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
        box-shadow: none !important;
    }

.input-group.lookup-control > .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"]):not(:has(~ .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"]))) {
    border-right-color: var(--modern-border);
    border-right-width: 1px !important;
    border-top-right-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
}

.fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control:focus-within {
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-focus-shadow-danger) !important;
}

    .fv-plugins-bootstrap5-row-invalid > .input-group.validation-action-group > input.form-control,
    .fv-plugins-bootstrap5-row-invalid > .input-group.validation-action-group > .input-group-text,
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control > input.form-control[data-role="name"],
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control > .input-group-text,
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control:focus-within > input.form-control[data-role="name"],
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control:focus-within > .input-group-text,
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control.validation-action-group > input.form-control[data-role="name"],
    .fv-plugins-bootstrap5-row-invalid > .input-group.lookup-control.validation-action-group > .input-group-text {
        border-color: var(--modern-danger-btn-bg) !important;
        box-shadow: none !important;
    }

.input-group.lookup-control > .input-group-text:hover i,
.input-group.lookup-control > .input-group-text:focus-visible i,
.modal .input-group.lookup-control > .input-group-text:hover i,
.modal .input-group.lookup-control > .input-group-text:focus-visible i,
.modal .input-group:not(:has(> input.search-control)):not(:has(> select.search-control)) > .input-group-text:not([disabled]):hover i,
.modal .input-group:not(:has(> input.search-control)):not(:has(> select.search-control)) > .input-group-text:not([disabled]):focus-visible i {
    color: var(--modern-accent-emphasis);
    transform: scale(1.1);
    -webkit-text-stroke-width: 0 !important;
}

.input-group.lookup-control a:not(.btn),
.modal .input-group.lookup-control a:not(.btn) {
    color: var(--modern-accent-interactive);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    text-shadow: none;
}

    .input-group.lookup-control a:not(.btn):hover,
    .input-group.lookup-control a:not(.btn):focus-visible,
    .modal .input-group.lookup-control a:not(.btn):hover,
    .modal .input-group.lookup-control a:not(.btn):focus-visible {
        color: var(--modern-accent-emphasis) !important;
        text-decoration: underline !important;
        text-decoration-thickness: 2px !important;
        text-shadow: none !important;
        outline: 0;
    }

/* Square lookup input right edge when joined to action buttons; re-enabled by hidden/disabled restore rules below. */
.input-group.lookup-control > .lookup-control-open,
.input-group.lookup-control > input.form-control[data-role="name"],
.modal .input-group.lookup-control > .lookup-control-open,
.modal .input-group.lookup-control > input.form-control[data-role="name"] {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

    /* Restore right border-radius when no usable trailing buttons remain. */
    .input-group.lookup-control > .lookup-control-open:not(:has(~ .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"]))),
    .input-group.lookup-control > input.form-control[data-role="name"]:not(:has(~ .input-group-text:not([disabled]):not(.collapse:not(.show)):not(.d-none):not([style*="display: none"]):not([style*="display:none"]))) {
        border-top-right-radius: var(--bs-border-radius) !important;
        border-bottom-right-radius: var(--bs-border-radius) !important;
    }


/***********************************************************************************************************************************************************/
/* WIZARD */
/***********************************************************************************************************************************************************/

.modal-footer .btn-wizard-nav:hover,
.modal-footer .btn-wizard-nav:focus,
.modal-footer .btn-wizard-nav:focus-visible {
    background-color: var(--modern-header-bg) !important;
    border-color: var(--modern-accent-emphasis) !important;
    color: var(--modern-accent-emphasis) !important;
    box-shadow: none !important;
    outline: 0;
}

.modal-footer .btn-wizard-nav:disabled,
.modal-footer .btn-wizard-nav[disabled] {
    background-color: color-mix(in srgb, var(--modern-header-bg) 72%, white) !important;
    border-color: var(--modern-info-border) !important;
    color: var(--modern-text-disabled) !important;
    opacity: 1 !important;
    box-shadow: none !important;
    cursor: default;
}

/* Modern form: script-managed tab/wizard navigation buttons */
.modal-footer .btn-wizard-nav {
    background-color: var(--bs-white) !important;
    border-color: var(--modern-accent-focus) !important;
    color: var(--modern-accent-interactive) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}


/***********************************************************************************************************************************************************/
/* AG-GRID */
/***********************************************************************************************************************************************************/

[id^="ag-quick-filter-container-"] .input-group {
    border: 1px solid var(--modern-border) !important;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    overflow: visible;
}

/* Round the filter row's top corners only when it is the topmost element in
       the grid stack (i.e., no "filters applied" alert prepended above it). When
       the alert is showing, this row stays square and sits flush beneath it while
       the alert carries the rounded top. Mirrors the agGrid.css :first-child logic. */
[id^="ag-quick-filter-container-"]:first-child .input-group {
    border-top-left-radius: var(--bs-border-radius);
    border-top-right-radius: var(--bs-border-radius);
}

[id^="ag-quick-filter-container-"] .input-group > :not(:first-child) {
    margin-left: 0 !important;
}

[id^="ag-quick-filter-container-"] .input-group > .input-group-text,
[id^="ag-quick-filter-container-"] .input-group > input.filter-control {
    border-width: 0 !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    box-shadow: none !important;
}

[id^="ag-quick-filter-container-"] .input-group > :first-child {
    border-left-width: 0 !important;
    border-bottom-left-radius: 0 !important;
}

[id^="ag-quick-filter-container-"] .input-group > :last-child {
    border-right-width: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.ag-theme-quartz:has([id^="ag-quick-filter"]) > .ag-root-wrapper {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

[id^="ag-quick-filter-container-"] .input-group > input.filter-control:focus {
    border-color: transparent !important;
    box-shadow: none !important;
}

[id^="ag-quick-filter-container-"] .input-group:has(input.filter-control:focus) {
    border-color: color-mix(in srgb, var(--modern-accent-focus) 78%, white) !important;
}

[id^="ag-quick-filter-container-"] .input-group-text i.fa-filter {
    color: color-mix(in srgb, var(--theme-nav-secondary) 70%, var(--modern-text-muted));
}

    [id^="ag-quick-filter-container-"] .input-group-text i.fa-filter.input-control-icon-focus,
    [id^="ag-quick-filter-container-"] .input-group:has(input.filter-control:focus) .input-group-text i.fa-filter {
        color: var(--modern-accent-emphasis) !important;
    }

/***********************************************************************************************************************************************************/
/* GOOGLE MAPS CHROME */
/* Frame the embedded Google Maps canvas and tint its default controls (map-type toggle, fullscreen, pegman,   */
/* zoom) to the site theme. We only recolor/round Google's existing control DOM - we do NOT restructure it     */
/* (an earlier "joined buttons" attempt broke the control). div.map-canvas wins the cascade over the base rule  */
/* in Default.css, which loads after this file.                                                                */
/***********************************************************************************************************************************************************/
div.map-canvas {
    border: 1px solid var(--modern-border);
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px var(--modern-shadow-slate-08);
}

/* Let the basestation map grow with the dialog (i.e., fullscreen) instead of staying at its default height. */
#popVerticalAssetsMap .modal-body,
#popVerticalAssetsMap .modal-body > .card,
#popVerticalAssetsMap .modal-body > .card > .card-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

#popVerticalAssetsMap .modal-body > .card,
#popVerticalAssetsMap .modal-body > .card > .card-body,
#popVerticalAssetsMap div.map-canvas {
    flex: 1 1 auto;
}

/* Control surface for fullscreen, pegman and zoom: clean rounded white card with a soft themed shadow in place
   of Google's hard grey border/shadow. */
.map-canvas .gm-style .gm-bundled-control .gmnoprint > div,
.map-canvas .gm-style .gm-fullscreen-control,
.map-canvas .gm-style .gm-svpc {
    border-radius: 8px !important;
    box-shadow: 0 2px 6px var(--modern-shadow-slate-16) !important;
    background-color: var(--modern-white) !important;
}

/* Map / Satellite: join the two buttons into a single Bootstrap-style group. The group's rounded corners and
   shadow live on the wrapper (the direct parent of the .gm-style-mtc button cells). IMPORTANT: no overflow:hidden
   here - the Terrain/Labels dropdown is a child of a .gm-style-mtc and clipping it is what broke the control
   before. Outer corners are rounded on the buttons themselves instead. */
.map-canvas .gm-style div:has(> .gm-style-mtc) {
    border-radius: 8px !important;
    box-shadow: 0 2px 6px var(--modern-shadow-slate-16) !important;
}

.map-canvas .gm-style .gm-style-mtc > button {
    height: 34px !important;
    padding: 0 12px !important;
    font-weight: 400 !important;
    color: var(--modern-text) !important;
    background-color: var(--modern-white) !important;
    border: 1px solid var(--modern-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.15s ease, color 0.15s ease;
}

    .map-canvas .gm-style .gm-style-mtc > button * {
        font-weight: 400 !important;
    }

/* Round only the outer corners and collapse the shared seam so the pair reads as one joined group */
.map-canvas .gm-style .gm-style-mtc:first-child > button {
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

.map-canvas .gm-style .gm-style-mtc:last-child > button {
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.map-canvas .gm-style .gm-style-mtc:not(:first-child) > button {
    margin-left: -1px !important;
}

    /* Highlight (hover): light-blue surface, dark-blue text */
    .map-canvas .gm-style .gm-style-mtc > button:hover {
        background-color: var(--modern-row-hover) !important;
        color: var(--modern-accent-emphasis) !important;
        position: relative;
        z-index: 1;
    }

    /* Selected map type: match the site's themed primary button fill */
    .map-canvas .gm-style .gm-style-mtc > button[aria-checked="true"] {
        background-color: var(--modern-btn-primary-bg) !important;
        border-color: var(--modern-btn-primary-bg) !important;
        color: var(--modern-white) !important;
        position: relative;
        z-index: 1;
    }

/* Satellite dropdown (Labels / Terrain): lightly theme Google's own menu without changing its layout. */
.map-canvas .gm-style .gm-style-mtc ul {
    background-color: var(--modern-white) !important;
    border: 1px solid var(--modern-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 6px var(--modern-shadow-slate-16) !important;
    padding: 4px !important;
}

.map-canvas .gm-style .gm-style-mtc ul li {
    border-radius: 6px !important;
    color: var(--modern-text) !important;
    transition: background-color 0.15s ease, color 0.15s ease;
}

    .map-canvas .gm-style .gm-style-mtc ul li,
    .map-canvas .gm-style .gm-style-mtc ul li * {
        font-weight: 400 !important;
    }

    .map-canvas .gm-style .gm-style-mtc ul li:hover {
        background-color: var(--modern-row-hover) !important;
        color: var(--modern-accent-emphasis) !important;
        box-shadow: inset 0 0 0 1px var(--modern-accent-emphasis) !important;
    }

        .map-canvas .gm-style .gm-style-mtc ul li:hover * {
            color: var(--modern-accent-emphasis) !important;
        }

    .map-canvas .gm-style .gm-style-mtc ul li:has(input[type="checkbox"]:checked),
    .map-canvas .gm-style .gm-style-mtc ul li:has(input[type="checkbox"]:checked) * {
        color: var(--modern-accent-emphasis) !important;
        font-weight: 500 !important;
    }

/* Fullscreen and zoom buttons: light-blue hover on the themed surface */
.map-canvas .gm-style .gm-fullscreen-control:hover,
.map-canvas .gm-style .gm-bundled-control button:hover {
    background-color: var(--modern-row-hover) !important;
}

    .map-canvas .gm-style .gm-fullscreen-control:hover img,
    .map-canvas .gm-style .gm-bundled-control button:hover img {
        filter: brightness(0) saturate(100%) invert(24%) sepia(45%) saturate(973%) hue-rotate(162deg) brightness(91%) contrast(92%);
    }

/* Zoom control: clip the two stacked buttons to the rounded surface */
.map-canvas .gm-style .gm-bundled-control .gmnoprint > div {
    overflow: hidden;
}

/* Selected vertical-asset marker: a continuously radiating focus ring (never stops), drawn over the marker by
   an OverlayView so it isn't reset when Google redraws the marker icon. Color is set per-selection via the
   --map-pulse-color custom property. */
.map-selected-pulse {
    width: 0;
    height: 0;
    z-index: 1;
}

    .map-selected-pulse.satellite::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background-color: rgba(var(--bs-white-rgb), 0.35);
        box-shadow: 0 0 0 2px rgba(var(--bs-white-rgb), 0.85), 0 0 12px rgba(var(--bs-white-rgb), 0.75);
        transform: translate(-50%, -50%);
    }

.map-selected-pulse .map-selected-pulse-ring {
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    border: 2px solid var(--map-pulse-color, var(--theme-accent-primary));
    transform: translate(-50%, -50%);
    animation: map-selected-pulse 1.6s ease-out infinite;
}

    .map-selected-pulse .map-selected-pulse-ring:nth-child(2) {
        animation-delay: 0.8s;
    }

    .map-selected-pulse.satellite .map-selected-pulse-ring {
        border-width: 2.5px;
        box-shadow: 0 0 0 2px rgba(var(--bs-white-rgb), 0.95), 0 0 10px rgba(var(--bs-white-rgb), 0.8);
    }

@keyframes map-selected-pulse {
    0% {
        width: 12px;
        height: 12px;
        opacity: 0.6;
    }

    100% {
        width: 46px;
        height: 46px;
        opacity: 0;
    }
}

/***********************************************************************************************************************************************************/
/* RESPONSIVE OVERRIDES */
/***********************************************************************************************************************************************************/

@media (max-width: 1200px) {
    [id$="WalkMeGuideLink"] {
        display: none !important;
    }

    .profile-container > [id$="UserProfileLink"]:has(.work-queue-badge:not(.d-none):not(:empty)) {
        margin-right: 4px;
    }

    .profile-container > [id$="UserProfileLink"] .work-queue-badge {
        right: -5px;
    }

    .profile-container > [id$="OemsAssistantLink"] {
        margin-left: 0;
    }

    .profile-container > [id$="OemsAssistantLink"] > .separator {
        display: inline-flex;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link,
    [id$="UserSiteInfoLink"] .site-info-link {
        min-height: auto;
        border: 0;
        border-radius: 0;
        padding: 0;
        background-color: transparent;
        box-shadow: none !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link {
        color: var(--modern-accent-interactive) !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link:hover,
    [id$="OemsAssistantLink"] .oems-assistant-link:focus-visible,
    [id$="UserSiteInfoLink"] .site-info-link:hover,
    [id$="UserSiteInfoLink"] .site-info-link:focus-visible,
    [id$="UserSiteInfoLink"] .site-info-link.error:hover,
    [id$="UserSiteInfoLink"] .site-info-link.error:focus-visible {
        border-color: transparent;
        background-color: transparent;
        box-shadow: none !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link:hover,
    [id$="OemsAssistantLink"] .oems-assistant-link:focus-visible,
    [id$="UserSiteInfoLink"] .site-info-link:hover,
    [id$="UserSiteInfoLink"] .site-info-link:focus-visible {
        color: var(--modern-accent-focus) !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link:hover i,
    [id$="OemsAssistantLink"] .oems-assistant-link:focus-visible i,
    [id$="OemsAssistantLink"] .oems-assistant-link.show i,
    [id$="OemsAssistantLink"] .oems-assistant-link[aria-expanded="true"] i {
        color: inherit !important;
    }

    [id$="UserSiteInfoLink"] .site-info-link.error:hover,
    [id$="UserSiteInfoLink"] .site-info-link.error:focus-visible {
        color: var(--modern-danger-btn-bg) !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link > span,
    [id$="UserSiteInfoLink"] .site-info-link > span {
        display: none !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link .fa {
        margin-right: 0;
    }

    .module-title {
        width: 0;
        min-width: 0;
        flex-basis: 0;
        flex-shrink: 1;
        padding-left: 0;
        padding-right: 0;
        box-shadow: none;
    }

    .module-header-container:not(.module-header-contextless) .module-title {
        display: none;
    }

        .module-title .module-title-text {
            display: none;
        }

    .module-top-header-container .module-mobile-profile-context {
        display: flex !important;
        align-items: center;
        justify-content: center;
        margin: 0 0 6px;
        min-height: 36px;
        padding: 0 10px;
        border-top: 1px solid color-mix(in srgb, var(--theme-nav-secondary) 20%, var(--modern-border));
        border-bottom: 1px solid color-mix(in srgb, var(--theme-nav-secondary) 20%, var(--modern-border));
        border-left: 0;
        border-right: 0;
        border-radius: 0;
        color: var(--theme-nav-primary);
        background-color: color-mix(in srgb, var(--theme-nav-secondary) 14%, white);
        font-size: inherit;
        font-weight: 500;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .module-top-header-container .module-mobile-profile-context > span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 34px;
        width: 100%;
        line-height: 1.2;
        padding-bottom: 0;
        text-align: center;
    }

    .module-top-header-container .module-mobile-profile-context > span:empty {
        display: none;
    }

    .module-top-header-container .module-mobile-profile-context:has(> span:empty) {
        display: none !important;
    }

    .module-top-header-container .module-mobile-profile-context a {
        position: relative;
        display: inline-flex;
        align-items: center;
        padding-bottom: 0;
        cursor: pointer;
        text-decoration: none !important;
        text-decoration-color: currentColor !important;
        color: inherit !important;
    }

    .module-top-header-container .module-mobile-profile-context a:hover,
    .module-top-header-container .module-mobile-profile-context a:focus-visible {
        outline: 0;
        color: inherit !important;
        text-decoration: none !important;
    }

    .module-top-header-container .module-mobile-profile-context a::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -4px;
        width: 0;
        height: 2px;
        background-color: var(--modern-accent-emphasis);
        border-radius: 2px;
        transform: translateX(-50%);
        transition: width .25s ease, height .25s ease;
    }

    .module-top-header-container .module-mobile-profile-context.sb-validation-alert a::after {
        background-color: var(--modern-danger-text);
    }

    .module-top-header-container .module-mobile-profile-context a:hover::after,
    .module-top-header-container .module-mobile-profile-context a:focus-visible::after {
        width: 100%;
    }

    .module-search-container {
        display: flex;
        align-items: center;
        width: 100%;
    }

    .module-search-bar {
        padding-left: 4px;
    }

    .page-summary-panel {
        display: none;
    }

    .profile-container .separator {
        padding-left: 3px;
        padding-right: 3px;
    }

    .profile-container .profile-link span {
        padding-left: 4px;
        padding-right: 4px;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    .module-search-bar {
        padding-left: 0;
    }
}

@media (max-width: 1100px) {
    .module-header-container:not(.module-header-contextless) .module-title {
        width: var(--sidebar-width);
        min-width: var(--sidebar-width);
        flex: 0 0 var(--sidebar-width);
    }

        .module-header-container:not(.module-header-contextless) .module-title .module-title-text {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
}

@media (max-width: 1024px) {
    #mainContentContainer {
        --page-chrome-inset: 12px;
    }

    .header-container,
    .module-header-container,
    .module-subheader-container,
    .contentWrapper,
    .main-content-container-scroll,
    main,
    .contentContainer {
        min-width: 0;
        max-width: 100%;
    }

    .header-title,
    .profile-container,
    .module-search-container,
    .module-action-btns {
        min-width: 0;
    }
}

@media (min-width: 901px) and (max-width: 1100px) {
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header.d-flex,
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header > .d-flex {
        flex-wrap: wrap;
        row-gap: 0.5rem;
        align-items: flex-start !important;
    }

    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header.d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group),
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header > .d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) {
        order: 2;
        flex: 1 1 100%;
        width: 100%;
        margin-top: 0.25rem;
        margin-left: 0 !important;
        justify-content: flex-end;
    }

    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header.d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) > .btn-group,
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header > .d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) > .btn-group,
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header.d-flex > .btn-group,
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header > .d-flex > .btn-group {
        display: flex;
        width: 100%;
        max-width: 100%;
    }

    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header :is(.btn-group, .btn-page-section-action .btn-group) > .btn {
        flex: 1 1 0;
        min-width: 0;
    }

    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:first-child,
    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header .btn-group:has(> .dropdown-list-mode) > .dropdown-list-mode {
        flex: 0 0 auto;
        width: auto;
        min-width: 0;
    }

    body:has(.sitenav-sidebar-selected.pinned, .sitenav-sidebar-options.pinned) .card > .card-header .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:not(:first-child):not(.dropdown-toggle) {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
    }
}

@media (max-width: 900px) {
    .card > .card-header.d-flex,
    .card > .card-header > .d-flex {
        flex-wrap: wrap;
        row-gap: 0.5rem;
        align-items: flex-start !important;
    }

    .card > .card-header.d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group),
    .card > .card-header > .d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) {
        order: 2;
        flex: 1 1 100%;
        width: 100%;
        margin-top: 0.25rem;
        margin-left: 0 !important;
        justify-content: flex-end;
    }

    .card > .card-header.d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) > .btn-group,
    .card > .card-header > .d-flex > :is(.ms-auto, .btn-page-section-action, .btn-group) > .btn-group,
    .card > .card-header.d-flex > .btn-group,
    .card > .card-header > .d-flex > .btn-group {
        display: flex;
        width: 100%;
        max-width: 100%;
    }

    .card > .card-header :is(.btn-group, .btn-page-section-action .btn-group) > .btn {
        flex: 1 1 0;
        min-width: 0;
    }

    .card > .card-header .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:first-child,
    .card > .card-header .btn-group:has(> .dropdown-list-mode) > .dropdown-list-mode {
        flex: 0 0 auto;
        width: auto;
        min-width: 0;
    }

    .card > .card-header .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:not(:first-child):not(.dropdown-toggle) {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
    }

    .card > .card-header .btn-group:has(> .dropdown-list-mode) > .btn-info.btn-autosize:first-child {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
    }

    .card > .card-header .btn-group:has(> .dropdown-list-mode) > .dropdown-list-mode {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

}

@media (max-width: 767px) {
    .module-header-container.module-header-empty {
        display: none;
    }

    /* Reserve the state-accent gutter, but show it only for validation and
       missing-information states. Keep the selected title's hairlines across
       the transparent gutter. */
    .sitenav-sidebar-selected:not(.sb-validation-alert):not(.warning) {
        border-left-color: transparent;
        background-image: linear-gradient(to bottom, var(--page-accent-primary) 0 1px, transparent 1px calc(100% - 1px), color-mix(in srgb, var(--theme-nav-primary) 18%, transparent) calc(100% - 1px));
    }

    html,
    body {
        overflow-x: clip;
    }

    html,
    body,
    #aspnetForm,
    #mainContentContainer {
        height: var(--mobile-viewport-height, 100vh);
    }

    #mainContentContainer,
    .contentWrapper {
        min-height: 0;
    }

    .contentWrapper {
        flex: 1 1 auto;
    }

    .btn-group > .dropdown-search-menu {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }

    body.modal-mobile-scroll-locked {
        position: fixed;
        left: 0;
        right: 0;
        overflow: hidden;
    }

    /* Mobile fullscreen modals can inherit page-level modal-body max-height caps
       (for desktop drill-ins), which leaves a blank gutter under body content.
       Clear those caps only while fullscreen is active on mobile. */
    .modalWindow .modal-dialog.modal-fullscreen .modal-body {
        max-height: none !important;
    }

    .header-title {
        width: 128px;
        min-height: 66px;
    }

    .site-header-logo {
        width: 118px;
        max-width: 118px;
    }

    .profile-container {
        height: 66px;
        padding-top: 14px;
        font-size: 0.84em;
    }

    .profile-container .separator {
        padding-left: 3px;
        padding-right: 3px;
    }

    .profile-container .profile-link span {
        padding-left: 3px;
        padding-right: 3px;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link {
        min-height: auto;
        border: 0;
        border-radius: 0;
        padding: 0;
        background-color: transparent;
        color: var(--modern-accent-interactive) !important;
        box-shadow: none !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link:hover,
    [id$="OemsAssistantLink"] .oems-assistant-link:focus-visible {
        border-color: transparent;
        background-color: transparent;
        color: var(--modern-accent-focus) !important;
        box-shadow: none !important;
    }

    [id$="OemsAssistantLink"] .oems-assistant-link .fa {
        margin-right: 0;
    }

    [id$="UserSiteInfoLink"] .site-info-link {
        min-height: auto;
        border: 0;
        border-radius: 0;
        padding: 0;
        background-color: transparent;
    }

    [id$="UserSiteInfoLink"] .site-info-link:hover,
    [id$="UserSiteInfoLink"] .site-info-link:focus-visible,
    [id$="UserSiteInfoLink"] .site-info-link.error:hover,
    [id$="UserSiteInfoLink"] .site-info-link.error:focus-visible {
        border-color: transparent;
        background-color: transparent;
        box-shadow: none !important;
    }

    [id$="UserSiteInfoLink"] .site-info-link.error {
        border-color: transparent;
    }

    [id$="UserSiteInfoLink"] .site-info-link::after {
        content: '' !important;
    }

    .profile-container > [id$="UserSiteInfoLink"] .profile-link:hover,
    .profile-container > [id$="UserSiteInfoLink"] .profile-link:focus-visible {
        transform: translateY(-1px);
        color: var(--modern-accent-focus) !important;
        text-decoration: none !important;
        text-shadow: none !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    .profile-container > [id$="UserSiteInfoLink"] .profile-link.error:hover,
    .profile-container > [id$="UserSiteInfoLink"] .profile-link.error:focus-visible {
        color: var(--modern-danger-btn-bg) !important;
    }

    .profile-container > [id$="UserSiteInfoLink"] .profile-link:hover i,
    .profile-container > [id$="UserSiteInfoLink"] .profile-link:focus-visible i {
        transform: none;
    }

    #UserLogoutLink .profile-link span {
        letter-spacing: 0.4px;
    }

    [id$="UserSitemap"] .dropdown-toggle::after {
        display: none;
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
        .contentContainer > div.alert:has(> .alert-inline)
    ) > .alert-inline {
        align-items: center;
        border-left-width: 5px;
        padding-left: calc(var(--page-chrome-inset) - 5px);
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
        .contentContainer > div.alert:has(> .alert-inline)
    ) > .alert-inline > i {
        align-self: center;
        margin-top: 0;
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
        .contentContainer > div.alert:has(> .alert-inline)
    ) > .alert-inline > .flex-grow-1 {
        min-width: 0;
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
        .contentContainer > div.alert:has(> .alert-inline)
    ) > .alert-inline > .flex-grow-1 > .d-flex {
        flex-wrap: nowrap;
        gap: 0.5rem;
        min-width: 0;
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(> .alert-inline),
        .contentContainer > div.alert:has(> .alert-inline)
    ) > .alert-inline > .flex-grow-1 > .d-flex > .toggle-details {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:not(:has(.toggle-details)) {
        height: auto;
        min-height: 45px;
        line-height: 1.35;
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }

    :is(#alertInfoPanel, .alertInfoPanel) > div.alert:not(:has(.toggle-details)):has(> .alert-inline) > .alert-inline {
        min-height: 45px;
        padding-top: 0.55rem;
        padding-bottom: 0.55rem;
    }

    :is(
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert.alert-details-expanded:has(> .alert-inline),
        :is(#alertInfoPanel, .alertInfoPanel) > div.alert:has(.details.show):has(> .alert-inline),
        .contentContainer > div.alert.alert-details-expanded:has(> .alert-inline),
        .contentContainer > div.alert:has(.details.show):has(> .alert-inline)
    ) > .alert-inline > .flex-grow-1 > .d-flex > div:first-child {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    #aspnetForm,
    #mainContentContainer,
    .header-container,
    .module-header-container,
    .module-subheader-container,
    .contentWrapper {
        width: 100%;
        max-width: 100vw;
    }

    .contentWrapper,
    .main-content-container-scroll,
    main {
        min-height: 0;
    }

    .main-content-container-scroll {
        overscroll-behavior-y: contain;
    }

    footer ul > li + li::before {
        content: none;
    }

    footer ul > li + li + li::before {
        content: "\2022";
        margin: 0px 8px;
    }

    .release-notification-badge-desktop {
        display: none !important;
    }

    .release-notification-badge-mobile:not(.d-none) {
        display: inline !important;
    }

    .module-subheader-overflow-container {
        display: none;
    }

    .module-sidebar-nav-title,
    .sitenav-sidebar {
        width: 100% !important;
        flex-basis: 100%;
        flex-grow: 1;
    }

    .sitenav-sidebar-title-stack {
        max-width: calc(100% - 92px);
    }

    .sitenav-sidebar-selected {
        padding-left: calc(var(--page-chrome-inset) - 5px);
    }

    .sitenav-sidebar-options li {
        padding-left: calc(var(--page-chrome-inset) - 5px);
        text-indent: 0;
    }

    .sitenav-sidebar-options li.sb-validation-alert,
    .sitenav-sidebar-options li.sidebar-missing-info {
        padding-left: calc(var(--page-chrome-inset) + 19px) !important;
    }

    .sitenav-sidebar-options li.sb-validation-alert::before,
    .sitenav-sidebar-options li.sidebar-missing-info::before {
        left: calc(var(--page-chrome-inset) - 5px);
    }

    .sitenav-sidebar-options li.sb-validation-alert a,
    .sitenav-sidebar-options li.sb-validation-alert:not(.selected) a,
    .sitenav-sidebar-options li.sidebar-missing-info a {
        padding-left: 0;
    }

    /* On mobile, an unpinned sidebar must be fully closed: it should not reserve the
       sidebar-width column and its options must not render inline. The options only
       appear when the user explicitly opens them (JS moves the list into the popup
       container), so hide only the copy that sits in the inline default container. */
    .sitenav-sidebar-options-container:not(:has(.sitenav-sidebar-options.pinned)) {
        width: 0 !important;
        min-width: 0 !important;
        box-shadow: none;
    }

    .sitenav-sidebar-options-container > .sitenav-sidebar-options:not(.pinned) {
        display: none !important;
    }

    .sitenav-sidebar-selected-actions {
        margin-left: auto;
        padding-left: 10px;
    }

    .sitenav-sidebar-step-stack {
        width: 32px;
        height: 38px;
        gap: 2px;
        margin-right: 0;
    }

    .sitenav-sidebar-step {
        width: 32px;
        height: 18px;
    }

    .sitenav-sidebar-step i {
        font-size: 16px;
    }

    .module-search-bar {
        display: block !important;
        flex: 1 1 auto;
        min-width: 0;
        overflow: visible;
        padding-left: 4px;
        padding-right: 4px;
    }

    .module-header-container:not(.module-header-contextless) .module-search-bar {
        display: none !important;
    }

    .module-search-container {
        justify-content: flex-start;
    }

    .module-header-container:not(.module-header-contextless) .module-search-container {
        justify-content: flex-end;
    }

    .module-action-btns {
        margin-left: 6px;
        padding-right: var(--page-chrome-inset);
    }

    .module-header-container:not(.module-header-contextless) .module-action-btns {
        transform: none;
        max-height: none;
        align-self: stretch;
    }

    .module-action-btns a.btn,
    .module-action-overflow > button {
        padding-left: 8px;
        padding-right: 8px;
        padding-top: 6px;
        padding-bottom: 2px;
        border-bottom: 0;
        border-radius: 6px 6px 0 0;
        margin-top: 0;
        height: 100%;
    }

    .module-header-container:not(.module-header-contextless) .module-action-btns a.btn span.fa-75,
    .module-header-container:not(.module-header-contextless) .module-action-overflow > button > span.fa-75 {
        display: block;
        font-size: 0.62rem;
        line-height: 1;
        margin-top: 0;
    }

    .module-header-container:not(.module-header-contextless) .module-action-btns a.btn > i.fa,
    .module-header-container:not(.module-header-contextless) .module-action-btns a.btn > i.fas,
    .module-header-container:not(.module-header-contextless) .module-action-btns a.btn > i.far,
    .module-header-container:not(.module-header-contextless) .module-action-btns a.btn > div.loading-icon,
    .module-header-container:not(.module-header-contextless) .module-action-overflow > button > i.fa-ellipsis-v {
        margin-bottom: 2px;
    }

        .module-search-bar .input-group {
            display: flex;
            flex-wrap: nowrap;
            min-width: 0;
        }

    .module-search-bar .input-group > #txtFindSolution,
    .module-search-bar .input-group > input[id$="_txtFindSolution"],
    .module-search-bar .input-group > input.search-control,
    .module-search-bar .input-group > select.search-control,
    .module-search-bar .input-group > input.filter-control {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .module-search-bar .input-group > .input-group-text,
    .module-search-bar .input-group > .dropdown-toggle {
        padding-left: 6px;
        padding-right: 6px;
    }

    .sitenav-sidebar-selected-pin {
        display: none;
    }

    footer {
        padding-left: 0;
        min-height: 0;
        padding-top: 4px;
        padding-bottom: 4px;
    }

    footer > ul {
        display: flex !important;
        justify-content: center;
        flex-wrap: wrap;
        row-gap: 4px;
        margin-bottom: 0;
    }

    footer ul > li:not(.footer-env-item) {
        display: none !important;
    }

    footer ul > li.footer-env-item {
        display: inline-flex !important;
        align-items: center;
    }

    footer ul > li + li::before {
        content: none;
    }

    footer ul > li::before {
        content: none !important;
    }

    footer ul > li.footer-env-item ~ li.footer-env-item::before {
        content: "\2022" !important;
        color: var(--modern-text-muted);
        margin-left: 12px;
        margin-right: 12px;
    }

    footer > div.fine-print {
        display: none;
    }

    .grid-action-row .btn-group .btn:not(.dropdown-toggle) {
        min-width: 0;
    }

    @supports (appearance: base-select) {
        ::picker(select) {
            max-height: min(50vh, 20rem);
            overflow-y: auto;
        }
    }
}

@media (max-width: 576px) {
    .col-form-label.text-end {
        text-align: start !important;
        width: 100%;
    }

    /* Modal footers using float-start / float-end inside a .col wrapper:
       convert to flexbox and stack the two groups on separate rows so they
       don't overlap on narrow viewports. Left group (secondary actions) goes
       second visually; right group (primary Ok/Cancel) goes first. */
    .modal-footer > .col:has(> .float-start):has(> .float-end) {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .modal-footer > .col > .float-start,
    .modal-footer > .col > .float-end {
        float: none !important;
        width: 100%;
    }

    .modal-footer > .col > .float-end {
        order: -1;
    }

    .modal-footer > .col > .float-start > .btn-group,
    .modal-footer > .col > .float-end > .btn-group {
        display: flex;
        width: 100%;
    }

    .modal-footer > .col > .float-start > .btn-group > .btn,
    .modal-footer > .col > .float-end > .btn-group > .btn {
        flex: 1 1 0;
        min-width: 0;
    }

    /* Modal footers with only right-aligned buttons (plain .btn-group directly
       in the footer): stretch the group full-width so buttons flex evenly. */
    .modal-footer > .btn-group {
        width: 100%;
    }

    .modal-footer > .btn-group > .btn {
        flex: 1 1 0;
        min-width: 0;
    }

    /* Wizard-style modal footers keep navigation buttons immediately left of
       Ok/Cancel on wider screens. On phones, stack the action groups and flex
       each group so Previous/Next and Ok/Cancel both use the available width. */
    .modal-footer > .d-flex.justify-content-end:has(> .btn-group > .btn-wizard-nav) {
        flex-direction: column;
        gap: 0.5rem;
        width: 100%;
    }

    .modal-footer > .d-flex.justify-content-end:has(> .btn-group > .btn-wizard-nav) > .btn-group {
        display: flex;
        width: 100%;
        margin-left: 0 !important;
    }

    .modal-footer > .d-flex.justify-content-end:has(> .btn-group > .btn-wizard-nav) > .btn-group:not(:has(> .btn-wizard-nav)) {
        order: -1;
    }

    .modal-footer > .d-flex.justify-content-end:has(> .btn-group > .btn-wizard-nav) > .btn-group > .btn {
        flex: 1 1 0;
        min-width: 0;
    }
}

:root {
    --site-core-css-loaded: 1;
}