/* ============================================================
   FASTER Asset Solutions — Bootstrap Skin Theme Override
   Theme: FASTER Brand Theme — Option 4 "Pale Blue Nav"
   Source: FASTER Brand Design Tokens — FasterWeb UI Refresh
           Official Brand Colors · April 2026
   Skin: Bootstrap | RenderMode: Lightweight
   Font: Rethink Sans (Display) + Inter (Body) + Inter (Mono)
   Icons: Bootstrap Icons
   Author: Generated for Claude Code execution
   Usage: Link AFTER Telerik's embedded Bootstrap skin CSS

   IMPORTANT BRAND RULES (from brand guidelines):
   - Red (#EB1A28) is reserved for logo, danger/errors, and
     active nav indicator ONLY. Never as background or primary
     button color.
   - Dark Blue (#002859) is the primary UI action color.
   - Golden Yellow (#E58C1A) is for warnings/alerts, NOT errors.

   OPTION 4 CHANGES vs faster-brand-theme.css:
   - Nav bar background: #E6F1FF (was #FFFFFF — pale blue)
   - Nav hover: #CCE3FF (was #F0F5FA)
   - Nav active / active border: #CCE3FF (was #E6F1FF)
   - Nav border: #CCE3FF (was #E6F1FF)
   - Banner (top bar) background: #E6F1FF (was #002859)
   - Banner text: #002859 (was #66ABFF)
   - .dm-user links/labels use dark colors for pale-blue background
   - .dm-banner gets a border-bottom separator
   - .RegionHeading: pale blue background (#66ABFF), dark text (#002859)
   ============================================================ */

/* ─── Fonts & icons loaded via MasterPageHandler/PageHandler ── */

/* ─── Brand Color Palette (Official FASTER Brand Guidelines) ── */
:root {
    --faster-red: #EB1A28; /* secondary-500 — logo + danger/error ONLY */
    --faster-dark-blue: #002859; /* primary-900 — nav, headers, buttons */
    --faster-bright-blue: #0056BD; /* primary-500 — links, CTAs — FASPD-52474: Updated from #0065E0 to #0056BD for WCAG 2.1 AA compliance (4.51:1 contrast ratio on light backgrounds) */
    --faster-light-blue: #66ABFF; /* primary-400 — hover accents */
    --faster-pale-blue: #E6F1FF; /* primary-100 — card tints, row hover */
    --faster-golden-yellow: #E58C1A; /* warning-500 — warnings + alerts */
    --faster-gray: #667891; /* neutral-600 — muted text */
    --faster-deep-red: #515353; /* dark neutral, secondary labels */
    --faster-white: #FFFFFF; /* neutral-0 */
    --faster-black: #000000;
}

/* ─── Design Tokens (mapped from official token PDF) ─────────── */
:root {
    /* ── typography ── */
    --faster-font-display: 'Rethink Sans', sans-serif;
    --bs-body-font-family: 'Inter', sans-serif;
    --faster-font-mono: 'Inter', monospace;
    --faster-icon-set: 'Bootstrap Icons';
    /* ── accent ── */
    --bs-primary: #002859; /* primary-900 */
    --faster-hover: #003B80; /* primary-800 */
    --faster-light-tint: #E6F1FF; /* primary-100 */
    --bs-link-color: #0056BD; /* primary-500 — FASPD-52474: Updated from #0065E0 to #0056BD for WCAG 2.1 AA compliance (4.51:1 contrast ratio) */
    /* ── navigation (Option 4: pale blue nav bar) ── */
    --faster-nav-bg: #E6F1FF; /* primary-100 — pale blue nav bar */
    --faster-nav-text: #002859; /* primary-900 — dark text on pale blue */
    --faster-nav-hover: #CCE3FF; /* primary-200 — hover contrast */
    --faster-nav-active: #CCE3FF; /* primary-200 */
    --faster-nav-border: #CCE3FF; /* primary-200 */
    --faster-nav-item-text: #26364A; /* neutral-900 */
    --faster-nav-item-hover-bg: #CCE3FF;
    --faster-nav-active-text: #002859;
    --faster-topbar-bg: #002859;
    --faster-nav-active-border: #EB1A28;
    /* ── banner (Option 4: pale blue banner) ── */
    --faster-banner-bg: #E6F1FF; /* primary-100 */
    --faster-banner-text: #002859; /* primary-900 */
    /* ── submenu / dropdown ── */
    --faster-submenu-bg: #FFFFFF;
    --faster-submenu-text: #667891; /* neutral-600 */
    --faster-submenu-hover: #E6F1FF; /* primary-100 */
    --faster-submenu-border: #EB1A28;
    /* ── page & cards ── */
    --bs-body-bg: #F8FAFC; /* neutral-50 */
    --bs-card-bg: #FFFFFF;
    --bs-card-border-color: #E2E8F0; /* neutral-200 */
    --faster-header-bg: #F1F5F9; /* neutral-100 */
    /* ── typography tokens ── */
    --bs-body-color: #26364A; /* neutral-900 */
    --faster-text-secondary: #596070; /* neutral-600 — FASPD-52188: #667891 (4.49:1 on white, fails on pale-blue) → #596070 (6.30:1 on white, 5.59:1 on pale-blue) */
    --bs-secondary-color: #A1B4C3; /* neutral-500 */
    --bs-heading-color: #002859; /* primary-900 */
    /* ── grid ── */
    --bs-table-bg: #FFFFFF;
    --bs-table-striped-bg: #F1F5F9; /* neutral-100 */
    --bs-table-hover-bg: #E6F1FF; /* primary-100 */
    --faster-row-selected: #66ABFF; /* primary-400 */
    /* ── inputs & buttons ── */
    --bs-form-control-bg: #FFFFFF;
    --bs-border-color: #CED8E3; /* neutral-300 */
    --bs-focus-ring-color: rgba(0,114,247,0.2); /* primary-500 */
    --faster-btn-primary-bg: #002859; /* primary-900 */
    --faster-btn-primary-text: #FFFFFF;
    --bs-btn-border-radius: 4px;
    --bs-danger: #EB1A28;
    --bs-danger-text: #C00000; /* FASPD-52188: accessible text red (6.47:1 on white) vs brand red #EB1A28 (4.46:1 fails WCAG 2.1 AA) */
    /* ── section headers ── */
    --faster-section-header-bg: #002859; /* primary-900 */
    --faster-section-header-text: #FFFFFF;
    --faster-section-accent: #EB1A28;
    /* ── status ── */
    --bs-success: #096347; /* success-700 */
    --bs-success-bg-subtle: #E6F9F2; /* success-100 */
    --bs-warning: #E58C1A; /* warning-500 */
    --bs-warning-bg-subtle: #FFF4E6; /* warning-100 */
    --bs-danger-bg-subtle: #FDEBEC; /* error-100 */
    /* ── convenience aliases used throughout this file ── */
    --faster-font-body: var(--bs-body-font-family);
    --faster-background: var(--bs-body-bg);
    --faster-card-bg: var(--bs-card-bg);
    --faster-border: var(--bs-card-border-color);
    --faster-border-light: #E2E8F0; /* neutral-200 */
    --faster-text-primary: var(--bs-body-color);
    --faster-text-muted: var(--bs-secondary-color);
    --faster-accent: var(--bs-primary);
    --faster-accent-hover: var(--faster-hover);
    --faster-accent-light: var(--faster-light-tint);
    --faster-accent-text: var(--faster-bright-blue);
    --faster-header-text: var(--bs-heading-color);
    --faster-header-border: var(--faster-light-blue);
    --faster-input-bg: var(--bs-form-control-bg);
    --faster-input-border: var(--bs-border-color);
    --faster-input-focus: var(--faster-bright-blue);
    --faster-input-text: var(--bs-body-color);
    --faster-btn-hover: var(--faster-hover);
    --faster-success-bg: var(--bs-success-bg-subtle);
    --faster-success-text: var(--bs-success);
    --faster-success-border: #C8F0E1; /* success-200 */
    --faster-warning-bg: var(--bs-warning-bg-subtle);
    --faster-warning-text: #8F4D00; /* warning-700 */
    --faster-warning-border: #FFE2BF; /* warning-200 */
    --faster-danger-bg: var(--bs-danger-bg-subtle);
    --faster-danger-text: var(--bs-danger-text);
    --faster-danger-border: #F9D2D4; /* error-200 */
    --faster-row-even: var(--bs-table-striped-bg);
    --faster-row-odd: var(--bs-table-bg);
    --faster-row-hover: var(--bs-table-hover-bg);
    --faster-row-selected-text: var(--faster-dark-blue);
    --faster-radius-sm: 4px;
    --faster-radius-md: var(--bs-btn-border-radius);
    --faster-radius-lg: 8px;
    --faster-shadow-sm: 0 1px 3px rgba(0,40,89,0.08);
    --faster-shadow-md: 0 4px 16px rgba(0,40,89,0.12);
}

/* ─── Base Page ─────────────────────────────────────────────── */
body,
.RadAjax body {
    font-family: var(--bs-body-font-family);
    font-size: 14px;
    color: var(--bs-body-color);
    background: var(--bs-body-bg);
    min-height: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--faster-font-display);
    color: var(--bs-heading-color);
    font-weight: 700;
}

code, pre, .mono,
td.id-col, th.id-col {
    font-family: var(--faster-font-mono);
    font-size: 13px;
}

/* ============================================================
   RAD MENU
   ============================================================ */

.RadMenu_Bootstrap.RadMenu,
.RadMenu_Bootstrap .rmRootGroup {
    background: var(--faster-nav-bg) !important;
    background-color: var(--faster-nav-bg) !important;
    border-color: var(--faster-nav-border) !important;
    color: var(--faster-nav-item-text) !important;
    font-family: var(--faster-font-display);
    font-size: 13px;
    font-weight: 600;
    box-shadow: var(--faster-shadow-sm);
}

    .RadMenu_Bootstrap .rmRootGroup > .rmItem > .rmLink {
        color: var(--faster-nav-item-text);
        font-family: var(--bs-body-font-family);
        font-size: 13px;
        font-weight: 600;
        padding: 0 10px;
        height: 50px;
        display: flex;
        align-items: center;
        border-bottom: 3px solid transparent;
        transition: all 0.15s ease;
        white-space: pre;
    }

        .RadMenu_Bootstrap .rmRootGroup > .rmItem > .rmLink:hover {
            background: var(--faster-nav-item-hover-bg);
            background-color: var(--faster-nav-item-hover-bg);
            color: var(--faster-nav-active-text);
            white-space: pre;
        }

    .RadMenu_Bootstrap .rmRootGroup > .rmItem.rmFocused > .rmLink {
        background: var(--faster-nav-item-hover-bg);
        background-color: var(--faster-nav-item-hover-bg);
        color: var(--faster-nav-active-text);
        white-space:pre;
    }

    /* Parent item active — child page is the current page */
    .RadMenu_Bootstrap .rmRootGroup > .rmItem.rmExpanded > .rmLink {
        background: var(--faster-pale-blue) !important;
        background-color: var(--faster-pale-blue) !important;
        color: var(--faster-nav-active-text) !important;
        border-bottom: 3px solid var(--faster-nav-active-border) !important;
        font-weight: 700 !important;
    }

    /* Active nav item — this item's URL is the current page */
    .RadMenu_Bootstrap .rmRootGroup > .rmItem.rmSelected > .rmLink {
        background: var(--faster-pale-blue) !important;
        background-color: var(--faster-pale-blue) !important;
        color: var(--faster-nav-active-text) !important;
        border-bottom: 3px solid var(--faster-nav-active-border) !important;
        font-weight: 700 !important;
    }

    /* FASPD-53208 #7 - Disabled root menu items (e.g. the "Alerts" asset-detail tab when the
       asset has no active alerts) inherit Telerik's skin rule ".RadMenu .rmDisabled .rmLink
       { opacity: 0.5 }". At 50% opacity the #26364A text over the pale-blue tab strip
       (#E6F1FF) computes to roughly #93A0AF ≈ 2.3:1 contrast, failing WCAG 2.1 AA. Replace
       the opacity dimming with a solid accessible grey (#595959 ≈ 5.4:1 on #E6F1FF) so the
       disabled tab still reads as disabled but remains legible. Higher specificity + opacity:1
       beats the skin's ".RadMenu .rmDisabled .rmLink" (0,2,1) rule. */
    .RadMenu_Bootstrap .rmRootGroup > .rmItem.rmDisabled > .rmLink {
        opacity: 1 !important;
        color: #595959 !important;
    }


/* My User Account – remove active underline only */
#ctl00_Navigation_RadMenuHomeNavigation.RadMenu_Bootstrap .rmRootGroup > .rmItem.rmSelected > .rmLink {
    border-bottom: none !important;
    background: var(--faster-pale-blue) !important;
    background-color: var(--faster-pale-blue) !important;
    color: var(--faster-nav-active-text) !important;
    font-weight: 700 !important;
}
/* Accounting - Submenu - remove red bottom color */
#ctl00_Navigation_RadMenuActions.RadMenu_Bootstrap .rmRootGroup > .rmItem.rmSelected > .rmLink {
    border-bottom: none !important;
    background: var(--faster-pale-blue) !important;
    background-color: var(--faster-pale-blue) !important;
    color: var(--faster-nav-active-text) !important;
    font-weight: 700 !important;
}
#ctl00_ContentPlaceHolder_Content_MasterBillingAccountDetailMenu_BillingAccountDetailMenu.RadMenu_Bootstrap .rmRootGroup > .rmItem.rmSelected > .rmLink {
    border-bottom: none !important;
    background: var(--faster-pale-blue) !important;
    background-color: var(--faster-pale-blue) !important;
    color: var(--faster-nav-active-text) !important;
    font-weight: 700 !important;
}

/* Dropdown slide */
.RadMenu_Bootstrap .rmSlide,
.RadMenu_Bootstrap .rmSlide .rmGroup {
    background: var(--faster-submenu-bg);
    background-color: var(--faster-submenu-bg);
    color: var(--faster-submenu-text);
    border: 1px solid var(--bs-card-border-color);
    border-top: 3px solid var(--faster-submenu-border);
    border-radius: 0 0 var(--faster-radius-lg) var(--faster-radius-lg);
    box-shadow: var(--faster-shadow-md);
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    min-width: 180px;
}

    .RadMenu_Bootstrap .rmSlide .rmGroup .rmItem > .rmLink {
        color: var(--faster-submenu-text);
        padding: 10px 16px;
        display: flex;
        align-items: center;
        gap: 8px;
        border-bottom: 1px solid var(--bs-card-border-color);
        transition: all 0.12s ease;
        white-space: pre;
    }

    .RadMenu_Bootstrap .rmSlide .rmGroup .rmItem:last-child > .rmLink {
        border-bottom: none;
    }

    .RadMenu_Bootstrap .rmSlide .rmGroup .rmItem > .rmLink:hover,
    .RadMenu_Bootstrap .rmSlide .rmGroup .rmItem.rmFocused > .rmLink {
        background: var(--faster-submenu-hover);
        color: var(--faster-dark-blue);
    }

    .RadMenu_Bootstrap .rmSlide .rmGroup .rmItem.rmSelected > .rmLink {
        background: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
        font-weight: 600;
    }

.RadMenu_Bootstrap .rmSeparator {
    border-top: 1px solid var(--bs-card-border-color);
    margin: 4px 0;
}

/* ============================================================
   RAD GRID
   ============================================================ */

.RadGrid_Bootstrap,
.RadGrid_Bootstrap .rgMasterTable {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
    background: var(--bs-card-bg);
    background-color: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: var(--faster-radius-lg);
    overflow: hidden;
    box-shadow: var(--faster-shadow-sm);
}

    .RadGrid_Bootstrap .rgHeader,
    .RadGrid_Bootstrap .rgHeaderOver,
    .RadGrid_Bootstrap th.rgHeader {
        background: var(--faster-header-bg);
        background-color: var(--faster-header-bg);
        color: var(--bs-heading-color);
        font-family: var(--faster-font-display);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border-bottom: 2px solid var(--faster-dark-blue);
        border-right: 1px solid var(--faster-header-border);
        padding: 10px 6px !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        white-space: normal !important;
    }

    .RadGrid_Bootstrap th.col-other,
    .RadGrid_Bootstrap td.col-other {
        min-width: 220px;
        max-width: 220px; /* optional */
        white-space: nowrap;
    }

    .RadGrid_Bootstrap .rgHeader *,
    .RadGrid_Bootstrap th.rgHeader *,
    .RadGrid_Bootstrap .rgRow td *,
    .RadGrid_Bootstrap .rgAltRow td * {
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    .RadGrid_Bootstrap .rgHeader a,
    .RadGrid_Bootstrap th.rgHeader a {
        color: var(--bs-heading-color);
        text-decoration: none;
    }

        .RadGrid_Bootstrap .rgHeader a:hover {
            color: var(--faster-bright-blue);
        }

    .RadGrid_Bootstrap .rgSortAsc::after {
        content: " ↑";
        color: var(--faster-red);
    }

    .RadGrid_Bootstrap .rgSortDesc::after {
        content: " ↓";
        color: var(--faster-red);
    }

    .RadGrid_Bootstrap .rgRow td,
    .RadGrid_Bootstrap .rgAltRow td {
        border-right: 1px solid var(--faster-border-light);
        border-bottom: 1px solid var(--faster-border-light);
        padding: 10px 6px !important;
        vertical-align: middle;
        transition: background 0.1s;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    .RadGrid_Bootstrap .rgRow {
        background: var(--bs-table-bg);
    }

    .RadGrid_Bootstrap .rgAltRow {
        background: var(--bs-table-striped-bg);
    }

        .RadGrid_Bootstrap .rgRow:hover td,
        .RadGrid_Bootstrap .rgAltRow:hover td {
            background: var(--bs-table-hover-bg);
        }

    .RadGrid_Bootstrap .rgSelectedRow td,
    .RadGrid_Bootstrap .rgSelectedRow:hover td {
        background: var(--faster-row-selected);
        color: var(--faster-dark-blue);
    }

    .RadGrid_Bootstrap .rgGroupHeader td {
        background: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
        font-weight: 700;
        font-family: var(--faster-font-display);
        border-bottom: 1px solid var(--faster-light-blue);
    }

    .RadGrid_Bootstrap .rgFooter td {
        background: var(--faster-header-bg);
        color: var(--faster-text-secondary);
        font-weight: 600;
        border-top: 2px solid var(--bs-card-border-color);
        font-family: var(--faster-font-display);
    }

    .RadGrid_Bootstrap .rgPager,
    .RadGrid_Bootstrap .rgPagerCell {
        background: var(--faster-header-bg);
        background-color: var(--faster-header-bg);
        border-top: 1px solid var(--bs-card-border-color);
        padding: 8px 12px;
        font-size: 12px;
        color: var(--faster-text-secondary);
    }

        /* FASPD-51552 — slider-mode pagers render their buttons as anchors inside
           .RadSlider; the button treatment below (background shorthand + body font)
           wipes the skin's icon glyphs, leaving empty squares. Keep slider anchors
           on the stock skin styling. */
        .RadGrid_Bootstrap .rgPager a:not(.RadSlider a),
        .RadGrid_Bootstrap .rgPagerButton {
            color: var(--faster-bright-blue);
            border: 1px solid var(--bs-border-color);
            border-radius: var(--faster-radius-sm);
            padding: 3px 8px;
            background: var(--bs-card-bg);
            font-family: var(--bs-body-font-family);
        }

            .RadGrid_Bootstrap .rgPager a:not(.RadSlider a):hover,
            .RadGrid_Bootstrap .rgPager a:not(.RadSlider a):focus,
            .RadGrid_Bootstrap .rgPagerButton:hover,
            .RadGrid_Bootstrap .rgPagerButton:focus {
                /* FASPD-51474 — :focus was missing; tab navigation landed on
                   Show More/Show All links with no visible highlight. */
                background: var(--faster-dark-blue);
                color: #FFFFFF;
                border-color: var(--faster-dark-blue);
                outline: none;
                box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
            }

    .RadGrid_Bootstrap .rgCurrentPage,
    .RadGrid_Bootstrap .rgCurrentPage a,
    .RadGrid_Bootstrap .rgCurrentPage span,
    .RadGrid_Bootstrap .rgCurrentPage input {
        background: var(--faster-dark-blue) !important;
        color: #FFFFFF !important;
        border-color: var(--faster-dark-blue) !important;
        font-weight: 700 !important;
    }

    .RadGrid_Bootstrap .rgFilterRow td {
        background: var(--faster-pale-blue);
        border-bottom: 1px solid var(--faster-light-blue);
        padding: 6px 8px;
    }

    .RadGrid_Bootstrap .rgFilterRow input {
        font-family: var(--bs-body-font-family);
        font-size: 12px;
        border: 1px solid var(--bs-border-color);
        border-radius: var(--faster-radius-sm);
        padding: 4px 8px;
        background: var(--bs-form-control-bg);
        color: var(--bs-body-color);
    }

    .RadGrid_Bootstrap .rgEditRow td {
        background: #FFF8F0;
        border-bottom: 1px solid #FDE68A;
    }

    .RadGrid_Bootstrap .rgCommandCell a,
    .RadGrid_Bootstrap .rgCommandCell button {
        color: var(--faster-bright-blue);
        font-family: var(--bs-body-font-family);
        font-size: 12px;
    }

    .RadGrid_Bootstrap .rgHeaderDiv {
        background: var(--faster-header-bg);
    }

/* ============================================================
   RAD COMBO BOX
   ============================================================ */

.RadComboBox_Bootstrap input.rcbInput {
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
    color: var(--bs-body-color) !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    height: auto !important;
    box-shadow: none !important;
}

/* Required-field highlight — Bootstrap danger pattern replaces legacy yellow.
   Server-side validation sets BackColor = LightGoldenrodYellow inline;
   we intercept via attribute selector and apply the danger style instead. */
.RadComboBox_Bootstrap input.rcbInput[style*="lightgoldenrodyellow" i] {
    background: var(--bs-danger-bg-subtle) !important;
    background-color: var(--bs-danger-bg-subtle) !important;
}
.RadComboBox_Bootstrap:has(input.rcbInput[style*="lightgoldenrodyellow" i]) {
    border-color: var(--faster-red) !important;
}
.RadInput_Bootstrap input.riTextBox[style*="lightgoldenrodyellow" i],
.RadInput_Bootstrap input.riTextBox[style*="LightGoldenrodYellow"] {
    background: var(--bs-danger-bg-subtle) !important;
    background-color: var(--bs-danger-bg-subtle) !important;
    border-color: var(--faster-red) !important;
}
table[style*="lightgoldenrodyellow" i],
div[style*="lightgoldenrodyellow" i],
td[style*="lightgoldenrodyellow" i],
tr[style*="lightgoldenrodyellow" i] {
    background: var(--bs-danger-bg-subtle) !important;
    background-color: var(--bs-danger-bg-subtle) !important;
    border: 1px solid var(--faster-red) !important;
    border-radius: var(--bs-border-radius);
}

.RadComboBox_Bootstrap {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    background: var(--bs-form-control-bg) !important;
    background-color: var(--bs-form-control-bg) !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: var(--faster-radius-md) !important;
}

    .RadComboBox_Bootstrap input.rcbInput:focus {
        outline: none;
        border-color: var(--faster-bright-blue) !important;
        box-shadow: 0 0 0 3px var(--bs-focus-ring-color) !important;
    }

    .RadComboBox_Bootstrap .rcbArrowCell,
    .RadComboBox_Bootstrap .rcbArrow {
        background: var(--bs-form-control-bg);
        border-left: 1px solid var(--bs-border-color);
        color: var(--faster-text-secondary);
    }

    /* FASPD-52494 #11 — the dropdown arrow is a WebComponentsIcons glyph inside a
       display:block .rcbActionButton; its table-cell/line-height mismatch left the
       chevron ~4px below the input center (e.g. Create Work Order "Organization").
       Center the button and glyph so the arrow lines up with the field text. */
    .RadComboBox_Bootstrap .rcbActionButton {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

        .RadComboBox_Bootstrap .rcbActionButton .p-icon {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            line-height: 1 !important;
            height: auto !important;
        }

.RadComboBoxDropDown_Bootstrap,
.RadComboBoxDropDown_Bootstrap .rcbList {
    background: var(--faster-submenu-bg);
    background-color: var(--faster-submenu-bg);
    color: var(--bs-body-color);
    border: 1px solid var(--bs-card-border-color);
    border-radius: 0 0 var(--faster-radius-md) var(--faster-radius-md);
    box-shadow: var(--faster-shadow-md);
    font-family: var(--bs-body-font-family);
    font-size: 13px;
}

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbItem,
    .RadComboBoxDropDown_Bootstrap .rcbItem {
        background: var(--faster-submenu-bg);
        background-color: var(--faster-submenu-bg);
        color: var(--bs-body-color);
        font-family: var(--bs-body-font-family);
        font-size: 13px;
        padding: 9px 12px;
        cursor: pointer;
        white-space: nowrap;
    }

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbHovered,
    .RadComboBoxDropDown_Bootstrap .rcbHovered {
        background: var(--faster-submenu-hover);
        background-color: var(--faster-submenu-hover);
        color: var(--faster-dark-blue);
        font-family: var(--bs-body-font-family);
        font-size: 13px;
        padding: 9px 12px;
        cursor: pointer;
        white-space: nowrap;
    }

    .RadComboBoxDropDown_Bootstrap .rcbChecked,
    .RadComboBoxDropDown_Bootstrap .rcbCheckedHovered {
        background: var(--faster-pale-blue);
        background-color: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
        font-weight: 600;
    }

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbDisabled,
    .RadComboBoxDropDown_Bootstrap .rcbDisabled {
        background: var(--faster-submenu-bg);
        background-color: var(--faster-submenu-bg);
        color: var(--faster-gray);
        cursor: not-allowed;
        opacity: 0.6;
    }

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbLoading,
    .RadComboBoxDropDown_Bootstrap .rcbLoading {
        background: var(--faster-submenu-bg);
        background-color: var(--faster-submenu-bg);
        color: var(--faster-text-secondary);
        font-style: italic;
        padding: 8px 12px;
    }

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbCheckAllItems,
    .RadComboBoxDropDown_Bootstrap .rcbCheckAllItems {
        background: var(--faster-header-bg);
        background-color: var(--faster-header-bg);
        color: var(--faster-dark-blue);
        font-family: var(--faster-font-display);
        font-size: 12px;
        font-weight: 700;
        border-bottom: 1px solid var(--bs-card-border-color);
        padding: 8px 12px;
    }

    .RadComboBoxDropDown_Bootstrap.RadComboBoxDropDown .rcbCheckAllItemsHovered,
    .RadComboBoxDropDown_Bootstrap .rcbCheckAllItemsHovered {
        background: var(--faster-pale-blue);
        background-color: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
    }

/* ============================================================
   RAD INPUT (Text / Numeric / Mask)
   ============================================================ */

.RadInput_Bootstrap input.riTextBox,
.RadInput_Bootstrap .riEnabled {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    /* FASPD-52494 #12 — RadTextBoxes placed inside a <th> (e.g. the Create Work
       Order "Asset Number" field) inherited the header cell's bold weight, so the
       entered text looked different from the neighbouring combo. Force the normal
       body weight for all skinned text inputs. */
    font-weight: 400;
    color: var(--bs-body-color);
    background: var(--bs-form-control-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--faster-radius-md);
    padding: 6px 10px;
    height: 34px;
    transition: border-color 0.15s;
}

    .RadInput_Bootstrap input.riTextBox:focus,
    .RadInput_Bootstrap .riFocused input {
        border-color: var(--faster-bright-blue);
        outline: none;
        box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
    }

    .RadInput_Bootstrap .riError input,
    .RadInput_Bootstrap input.riTextBox.riError {
        border-color: var(--faster-red);
        background: var(--bs-danger-bg-subtle);
    }

/* ============================================================
   RAD DATE PICKER / TIME PICKER
   ============================================================ */

.RadPicker_Bootstrap .rcCalPopup,
.RadDatePicker_Bootstrap .rdInput {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--faster-radius-md);
    background: var(--bs-form-control-bg);
    color: var(--bs-body-color);
    height: 34px;
    padding: 6px 10px;
}

.RadDatePicker_Bootstrap .rdFocused .rdInput {
    border-color: var(--faster-bright-blue);
    box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
}

.RadCalendar_Bootstrap .rcMainTable {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    border: 1px solid var(--bs-card-border-color);
    border-top: 3px solid var(--faster-dark-blue);
    border-radius: var(--faster-radius-lg);
    box-shadow: var(--faster-shadow-md);
    background: var(--bs-card-bg);
    overflow: hidden;
}

.RadCalendar_Bootstrap .rcTitlebar,
.RadCalendar_Bootstrap .rcTitlebar td {
    background: var(--faster-header-bg);
    color: var(--faster-dark-blue);
    font-family: var(--faster-font-display);
    font-weight: 700;
    padding: 8px;
    border-bottom: 1px solid var(--faster-pale-blue);
}

    .RadCalendar_Bootstrap .rcTitlebar a {
        color: var(--faster-bright-blue);
    }

.RadCalendar_Bootstrap .rcWeek th {
    background: var(--faster-header-bg);
    color: #26364A !important;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px;
}

.RadCalendar_Bootstrap .rcRow td {
    padding: 5px;
}

/* FASPD-52474: Fix calendar date text contrast — non-selected dates must meet WCAG 2.1 AA 4.5:1 ratio */
/* Updated: Changed from #26364A to #1a3a52 (8:1 on white) for enhanced contrast and axe best practices compliance */
.RadCalendar_Bootstrap .rcDay {
    color: #26364A !important;
}

.RadCalendar_Bootstrap .rcRow .rcDay:hover {
    background: var(--bs-table-hover-bg);
    color: #26364A !important;
    border-radius: var(--faster-radius-sm);
    cursor: pointer;
}

/* FASPD-52474: Added !important to ensure selected date has sufficient contrast (prevents Bootstrap skin override) */
.RadCalendar_Bootstrap .rcSelected .rcDay,
.RadCalendar_Bootstrap .rcSelected .rcDay:hover,
.RadCalendar_Bootstrap td.rcSelected a,
.RadCalendar_Bootstrap td.rcSelected a:hover,
.RadCalendar_Bootstrap .rcHover.rcSelected,
.RadCalendar_Bootstrap .rcSelected.rcHover a {
    background: var(--faster-dark-blue) !important;
    background-color: var(--faster-dark-blue) !important;
    color: #FFFFFF !important;
    border-radius: var(--faster-radius-sm);
    font-weight: 700;
}

.RadCalendar_Bootstrap .rcToday .rcDay {
    border: 2px solid var(--faster-red);
    border-radius: var(--faster-radius-sm);
    color: #C8001A;
    font-weight: 700;
    background: #FFFFFF;
}

/* When today's date is selected */
.RadCalendar_Bootstrap .rcToday.rcSelected .rcDay,
.RadCalendar_Bootstrap td.rcToday.rcSelected a {
    background: var(--faster-dark-blue) !important;
    background-color: var(--faster-dark-blue) !important;
    color: #FFFFFF !important;
    border-color: var(--faster-dark-blue) !important;
}

.RadCalendar_Bootstrap .rcOtherMonth .rcDay,
.RadCalendar_Bootstrap .rcOtherMonth a,
.RadCalendar_Bootstrap td.rcOtherMonth .rcDay,
.RadCalendar_Bootstrap td.rcOtherMonth a,
.RadCalendar_Bootstrap .rcRow .rcOtherMonth .rcDay,
.RadCalendar_Bootstrap .rcRow td.rcOtherMonth a {
    color: #767676 !important;
    background: #FFFFFF;
    opacity: 1 !important;
}

.RadCalendar_Bootstrap .rcOtherMonth .rcDay:hover,
.RadCalendar_Bootstrap .rcOtherMonth a:hover,
.RadCalendar_Bootstrap td.rcOtherMonth .rcDay:hover,
.RadCalendar_Bootstrap td.rcOtherMonth a:hover {
    background: var(--bs-table-hover-bg);
    color: #767676 !important;
    opacity: 1 !important;
}

/* RAD TIME PICKER popup — mirror FASTER theme used by the calendar popup */

.RadCalendarTimeView_Bootstrap .rcTitlebar,
.RadCalendarTimeView_Bootstrap .rcTitlebar td,
.RadCalendarTimeView_Bootstrap th {
    background: var(--faster-header-bg) !important;
    color: var(--faster-dark-blue) !important;
    font-family: var(--faster-font-display);
    font-weight: 700;
    border-bottom: 1px solid var(--faster-pale-blue);
}

.RadCalendarTimeView_Bootstrap td {
    padding: 2px 4px;
}

.RadCalendarTimeView_Bootstrap a:hover {
    background: var(--bs-table-hover-bg) !important;
    background-image: none !important;
    color: var(--bs-body-color) !important;
    border-radius: var(--faster-radius-sm);
    border-color: transparent !important;
}

.RadCalendarTimeView_Bootstrap .rcSelected a,
.RadCalendarTimeView_Bootstrap .rcSelected a:hover {
    background: var(--faster-dark-blue) !important;
    background-image: none !important;
    color: #FFFFFF !important;
    border-radius: var(--faster-radius-sm);
    border-color: var(--faster-dark-blue) !important;
    font-weight: 700;
}

/* ============================================================
   RAD DROP DOWN LIST
   ============================================================ */

.RadDropDownList_Bootstrap .rddlFakInput {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
    background: var(--bs-form-control-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--faster-radius-md);
    height: 34px;
    padding: 6px 10px;
}

    .RadDropDownList_Bootstrap .rddlFakInput:focus,
    .RadDropDownList_Bootstrap.rddlFocused .rddlFakInput {
        border-color: var(--faster-bright-blue);
        box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
    }

.RadDropDownListPopup_Bootstrap .rddlList {
    background: var(--faster-submenu-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: 0 0 var(--faster-radius-md) var(--faster-radius-md);
    box-shadow: var(--faster-shadow-md);
    font-family: var(--bs-body-font-family);
    font-size: 13px;
}

.RadDropDownListPopup_Bootstrap .rddlItem {
    color: var(--bs-body-color);
    padding: 9px 12px;
}

.RadDropDownListPopup_Bootstrap .rddlItemHovered {
    background: var(--faster-submenu-hover);
    color: var(--faster-dark-blue);
}

.RadDropDownListPopup_Bootstrap .rddlItemChecked {
    background: var(--faster-pale-blue);
    color: var(--faster-dark-blue);
    font-weight: 600;
}

/* ============================================================
   RAD WINDOW (Modal / Dialog)
   ============================================================ */

.RadWindow_Bootstrap .rwTitlebarControls,
.RadWindow_Bootstrap .rwTitlebar,
.RadWindow_Bootstrap .rwTitleBar {
    background: var(--faster-dark-blue) !important;
    background-color: var(--faster-dark-blue) !important;
    border-bottom: 3px solid var(--faster-red);
    color: #FFFFFF;
    font-family: var(--faster-font-display);
    font-size: 14px;
    font-weight: 700;
    padding: 10px 16px;
}

.RadWindow_Bootstrap .rwTitle,
.RadWindow_Bootstrap h6.rwTitle {
    display: inline-block;
    margin: 0;
    padding: 0 0 0 15px;
    font-family: var(--faster-font-display);
    font-size: 15px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.RadWindow_Bootstrap .rwContent {
    background: var(--bs-card-bg);
    background-color: var(--bs-card-bg);
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
    padding: 16px;
    overflow: auto !important;
}

/* Suppress scrollbar in fixed-size profile/question/timezone popups */
.MyProfileEditDialog .rwContent,
.SecurityQuestionEditDialog .rwContent,
.TimeZoneEditDialog .rwContent {
    overflow: hidden !important;
}

/* Fix extra white space below buttons in popup windows */
.TimeZoneEditDialog .PaddingForm,
.SecurityQuestionEditDialog .PaddingForm,
.MyProfileEditDialog .PaddingForm {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.TimeZoneEditDialog .RadAjaxPanel,
.SecurityQuestionEditDialog .RadAjaxPanel,
.MyProfileEditDialog .RadAjaxPanel {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.RadWindow_Bootstrap .rwFooter,
.RadWindow_Bootstrap .rwFooterRow {
    background: var(--faster-header-bg);
    border-top: 1px solid var(--bs-card-border-color);
    padding: 10px 16px;
}

.RadWindow_Bootstrap .rwControlButtons .rwMinimizeButton,
.RadWindow_Bootstrap .rwControlButtons .rwMaximizeButton,
.RadWindow_Bootstrap .rwControlButtons .rwCloseButton {
    color: rgba(255,255,255,0.7);
}

    .RadWindow_Bootstrap .rwControlButtons .rwCloseButton:hover {
        color: #FFFFFF;
    }
.RadWindow .rwCommandButton.rwCloseButton {
    background-image: none !important;
}

    .RadWindow .rwCommandButton.rwCloseButton:before {
        content: "✕";
        color: #ffffff;
        font-size: 16px;
        line-height: 1;
    }

.RadWindow_Bootstrap .rwIcon:not(.rwCustomIcon),
.RadWindow_Bootstrap a.rwIcon:not(.rwCustomIcon),
.RadWindow_Bootstrap .rwTitlebar a.rwIcon:not(.rwCustomIcon) {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

.RadWindow_Bootstrap .rwIcon:not(.rwCustomIcon)::before,
.RadWindow_Bootstrap a.rwIcon:not(.rwCustomIcon)::before {
    content: none !important;
    display: none !important;
}

.RadWindow_Bootstrap .rwIcon:not(.rwCustomIcon)::after {
    content: '' !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("../Images/layout-text-window.svg") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

    .RadWindow_Bootstrap .rwIcon,
    .RadWindow_Bootstrap .rwIcon:hover {
        cursor: default !important;
        opacity: 1 !important;
    }

.RadWindowOverlay {
    background: rgba(0, 35, 77, 0.5);
}

/* ============================================================
   RAD TAB STRIP
   ============================================================ */

.RadTabStrip_Bootstrap .rtsUL {
    background: var(--faster-nav-bg) !important;
    border-bottom: 3px solid var(--faster-nav-border);
    font-family: var(--faster-font-display);
    font-size: 13px;
    padding: 0 8px;
    box-shadow: var(--faster-shadow-sm);
}

.RadTabStrip_Bootstrap .rtsTab,
.RadTabStrip_Bootstrap .rtsLevel1 .rtsLI .rtsLink {
    color: var(--faster-nav-item-text) !important;
    font-weight: 600 !important;
    padding: 10px 16px;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px;
    transition: all 0.15s;
    background: transparent !important;
}

    .RadTabStrip_Bootstrap .rtsTab:hover,
    .RadTabStrip_Bootstrap .rtsTab.rtsHover,
    .RadTabStrip_Bootstrap .rtsLevel1 .rtsLI:hover .rtsLink,
    .RadTabStrip_Bootstrap .rtsLevel1 .rtsLI.rtsHovered .rtsLink {
        color: var(--faster-nav-active-text) !important;
        background: var(--faster-nav-item-hover-bg) !important;
        border-bottom: 3px solid var(--faster-dark-blue);
    }

    .RadTabStrip_Bootstrap .rtsTab.rtsFocused,
    .RadTabStrip_Bootstrap .rtsTab.rtsSelected,
    .RadTabStrip_Bootstrap .rtsLevel1 .rtsLI.rtsSelected .rtsLink {
        color: var(--faster-nav-active-text) !important;
        background: var(--faster-pale-blue) !important;
        border-bottom: 3px solid var(--faster-nav-active-border, #EB1A28);
        font-weight: 700 !important;
    }

.RadTabStrip_Bootstrap .rtsLevel.rtsL1 .rtsSelected > .rtsLink {
    color: var(--faster-nav-active-text) !important;
    background: var(--faster-pale-blue) !important;
    border-bottom: 3px solid var(--faster-nav-active-border, #EB1A28);
    font-weight: 700 !important;
}

.RadTabStrip_Bootstrap .TabLinkButton.rtsLink,
.RadTabStrip_Bootstrap .rtsLI.TabLinkButton .rtsLink {
    color: var(--faster-nav-item-text) !important;
    font-weight: 600 !important;
    padding: 10px 16px;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px;
    background: transparent !important;
}
.RadTabStrip_Bootstrap .TabLinkButton.rtsLink:hover,
.RadTabStrip_Bootstrap .rtsLI.TabLinkButton:hover .rtsLink {
    color: var(--faster-nav-active-text) !important;
    background: var(--faster-nav-item-hover-bg) !important;
    border-bottom: 3px solid var(--faster-dark-blue);
}
.RadTabStrip_Bootstrap .TabLinkButton.rtsSelected .rtsLink,
.RadTabStrip_Bootstrap .rtsSelected.TabLinkButton.rtsLink {
    color: var(--faster-nav-active-text) !important;
    background: var(--faster-pale-blue) !important;
    border-bottom: 3px solid var(--faster-nav-active-border);
    font-weight: 700 !important;
}

.RadPageView_Bootstrap {
    background: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-top: none;
    border-radius: 0 0 var(--faster-radius-md) var(--faster-radius-md);
    padding: 16px;
    font-family: var(--bs-body-font-family);
    font-size: 13px;
}

/* ============================================================
   RAD BUTTON
   ============================================================ */

.RadButton_Bootstrap:not(.rbCheckBox):not(.rbRadioButton),
.RadButton_Bootstrap.rbPrimaryButton:not(.rbCheckBox):not(.rbRadioButton) {
    font-family: var(--faster-font-display) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    background: var(--faster-btn-primary-bg) !important;
    background-color: var(--faster-btn-primary-bg) !important;
    color: var(--faster-btn-primary-text) !important;
    border: none !important;
    border-radius: var(--bs-btn-border-radius) !important;
    height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all 0.15s;
    box-shadow: var(--faster-shadow-sm) !important;
    letter-spacing: 0.2px;
}

/* FASPD-51508 — utility pages hide postback-only buttons with .HiddenControl
   (display: none !important), but the skin rule above outranks it on
   specificity and forces inline-flex, making "hidden" buttons visible.
   Restore the hide with a more specific selector. */
.RadButton_Bootstrap.HiddenControl:not(.rbCheckBox),
.RadButton_Bootstrap.rbPrimaryButton.HiddenControl:not(.rbCheckBox) {
    display: none !important;
}

    .RadButton_Bootstrap:not(.rbCheckBox):not(.rbRadioButton):hover,
    .RadButton_Bootstrap.rbPrimaryButton:not(.rbCheckBox):not(.rbRadioButton):hover {
        background: var(--faster-hover) !important;
        background-color: var(--faster-hover) !important;
        color: var(--faster-btn-primary-text) !important;
        box-shadow: var(--faster-shadow-md) !important;
    }

    .RadButton_Bootstrap:not(.rbCheckBox):focus,
    .RadButton_Bootstrap.rbPrimaryButton:not(.rbCheckBox):focus {
        outline: 3px solid var(--bs-focus-ring-color) !important;
        outline-offset: 2px !important;
    }

/* Checkbox/radio toggle buttons (Exact Match, Include Closed, Add new component, etc.)
   FASPD-51552 — rbRadioButton toggles got the navy primary-button background while
   their .rbText stayed dark, making the options unreadable; style them like
   checkbox toggles. */
.RadButton_Bootstrap.rbCheckBox,
.RadButton_Bootstrap.rbRadioButton {
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    background: var(--bs-card-bg) !important;
    background-color: var(--bs-card-bg) !important;
    color: var(--bs-body-color) !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: var(--bs-btn-border-radius) !important;
    padding: 6px 12px !important;
    height: auto !important;
    min-height: 34px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
    transition: all 0.15s;
}

    .RadButton_Bootstrap.rbCheckBox:hover,
    .RadButton_Bootstrap.rbRadioButton:hover {
        background: var(--faster-pale-blue) !important;
        background-color: var(--faster-pale-blue) !important;
        border-color: var(--faster-bright-blue) !important;
        color: var(--faster-dark-blue) !important;
    }

    .RadButton_Bootstrap.rbCheckBox.rbChecked,
    .RadButton_Bootstrap.rbCheckBox[aria-checked="true"],
    .RadButton_Bootstrap.rbRadioButton.rbChecked,
    .RadButton_Bootstrap.rbRadioButton[aria-checked="true"] {
        background: var(--faster-pale-blue) !important;
        background-color: var(--faster-pale-blue) !important;
        border: 2px solid var(--faster-dark-blue) !important;
        border-color: var(--faster-dark-blue) !important;
        color: var(--faster-dark-blue) !important;
        font-weight: 700 !important;
    }

/* Secondary = bright blue outline */
.RadButton_Bootstrap.rbSecondaryButton {
    background: var(--bs-card-bg);
    color: var(--faster-bright-blue);
    border: 2px solid var(--faster-bright-blue);
}

    .RadButton_Bootstrap.rbSecondaryButton:hover {
        background: var(--faster-pale-blue);
    }

/* Danger button — red, per brand spec */
.RadButton_Bootstrap.rbDangerButton,
.RadButton_Bootstrap[class*="danger"],
.RadButton_Bootstrap[class*="delete"] {
    background: var(--bs-danger);
    color: #FFFFFF;
    border: none;
}

    .RadButton_Bootstrap.rbDangerButton:hover {
        background: #C71520;
    }

.RadButton_Bootstrap.rbDisabled,
.RadButton_Bootstrap:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ============================================================
   Plain asp:Button decorated by RadFormDecorator
   ============================================================ */

.RadForm .rfdSkinnedButton,
.RadForm_Bootstrap .rfdSkinnedButton,
.RadForm.rfdButton a.rfdSkinnedButton,
a.RadForm.rfdButton.rfdSkinnedButton,
a.rfdSkinnedButton,
input.rfdSkinnedButton,
button.rfdSkinnedButton {
    font-family: var(--faster-font-display) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    background: var(--faster-btn-primary-bg) !important;
    background-color: var(--faster-btn-primary-bg) !important;
    color: var(--faster-btn-primary-text) !important;
    border: none !important;
    border-radius: var(--bs-btn-border-radius) !important;
    padding: 7px 20px !important;
    cursor: pointer !important;
    transition: all 0.15s;
    box-shadow: var(--faster-shadow-sm);
    text-decoration: none !important;
    text-align: center !important;
}

    .RadForm .rfdSkinnedButton:hover,
    .RadForm_Bootstrap .rfdSkinnedButton:hover,
    a.rfdSkinnedButton:hover,
    input.rfdSkinnedButton:hover,
    button.rfdSkinnedButton:hover {
        background: var(--faster-hover) !important;
        background-color: var(--faster-hover) !important;
        box-shadow: var(--faster-shadow-md);
        color: var(--faster-btn-primary-text) !important;
        text-decoration: none !important;
    }

    .RadForm .rfdSkinnedButton:focus,
    .RadForm_Bootstrap .rfdSkinnedButton:focus,
    a.rfdSkinnedButton:focus,
    input.rfdSkinnedButton:focus,
    button.rfdSkinnedButton:focus {
        outline: 3px solid var(--bs-focus-ring-color) !important;
        outline-offset: 2px !important;
    }

    .RadForm .rfdSkinnedButton.aspNetDisabled,
    a.rfdSkinnedButton.aspNetDisabled,
    input.rfdSkinnedButton.aspNetDisabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* ============================================================
   RAD FORM DECORATOR
   ============================================================ */

.rfdDecorated_Bootstrap input[type="text"],
.rfdDecorated_Bootstrap input[type="email"],
.rfdDecorated_Bootstrap input[type="password"],
.rfdDecorated_Bootstrap input[type="number"],
.rfdDecorated_Bootstrap textarea,
.rfdDecorated_Bootstrap select {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
    background: var(--bs-form-control-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--faster-radius-md);
    padding: 6px 10px;
    height: 34px;
    transition: border-color 0.15s;
}

    .rfdDecorated_Bootstrap input:focus,
    .rfdDecorated_Bootstrap textarea:focus,
    .rfdDecorated_Bootstrap select:focus {
        border-color: var(--faster-bright-blue);
        outline: none;
        box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
    }

.rfdDecorated_Bootstrap input[type="checkbox"],
.rfdDecorated_Bootstrap .rfdCheckbox {
    accent-color: var(--faster-dark-blue);
    width: 16px;
    height: 16px;
}

.rfdDecorated_Bootstrap input[type="radio"],
.rfdDecorated_Bootstrap .rfdRadio {
    accent-color: var(--faster-dark-blue);
}

 
.RadForm label.rfdRadioUnchecked,
.RadForm label.rfdRadioChecked,
.RadForm_Bootstrap label.rfdRadioUnchecked,
.RadForm_Bootstrap label.rfdRadioChecked {
    color: var(--bs-body-color) !important;
    font-family: var(--bs-body-font-family) !important;
    font-size: 12px !important;
    cursor: pointer;
    accent-color: var(--faster-dark-blue);
}

.RadForm label.rfdCheckboxUnchecked,
.RadForm label.rfdCheckboxChecked,
.RadForm label.rfdCheckboxFilled,
.RadForm_Bootstrap label.rfdCheckboxUnchecked,
.RadForm_Bootstrap label.rfdCheckboxChecked,
.RadForm_Bootstrap label.rfdCheckboxFilled,
 {
    color: var(--bs-body-color) !important;
    font-family: var(--bs-body-font-family) !important;
    cursor: pointer;
    accent-color: var(--faster-dark-blue);
}

/* ============================================================
   RAD TREE VIEW
   ============================================================ */

.RadTreeView_Bootstrap {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
}

    .RadTreeView_Bootstrap .rtIn {
        padding: 5px 8px;
        border-radius: var(--faster-radius-sm);
        color: var(--bs-body-color);
        transition: all 0.12s;
    }

    .RadTreeView_Bootstrap .rtHover > .rtIn {
        background: var(--bs-table-hover-bg);
        color: var(--faster-dark-blue);
    }

    .RadTreeView_Bootstrap .rtSelected > .rtIn {
        background: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
        font-weight: 600;
    }

    .RadTreeView_Bootstrap .rtLines .rtLI .rtTop,
    .RadTreeView_Bootstrap .rtLines .rtLI .rtMid,
    .RadTreeView_Bootstrap .rtLines .rtLI .rtBot {
        border-color: var(--bs-card-border-color);
    }

    .RadTreeView_Bootstrap .rtPlus,
    .RadTreeView_Bootstrap .rtMinus {
        color: var(--faster-bright-blue);
        border: 1px solid var(--bs-card-border-color);
        border-radius: var(--faster-radius-sm);
    }

/* ============================================================
   RAD DOCK
   ============================================================ */

.RadDock_Bootstrap {
    background: var(--bs-card-bg);
    background-color: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: var(--faster-radius-lg);
    box-shadow: var(--faster-shadow-sm);
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
    overflow: hidden;
}

    .RadDock_Bootstrap .rdTop {
        background: var(--faster-dark-blue) !important;
        background-color: var(--faster-dark-blue) !important;
        border-bottom: 3px solid var(--faster-red) !important;
    }

    .RadDock_Bootstrap .rdTopCenter {
        background: transparent !important;
        background-color: transparent !important;
        border-bottom: none !important;
    }

    .RadDock_Bootstrap .rdTitleWrapper {
        background: transparent !important;
        background-color: transparent !important;
        border-bottom: none !important;
        padding: 8px 12px !important;
        line-height: 22px !important;
    }

    .RadDock_Bootstrap .rdTitle {
        color: #FFFFFF !important;
        font-family: var(--faster-font-display) !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        vertical-align: middle !important;
        display: inline !important;
    }

    .RadDock_Bootstrap .rdCommandButton {
        filter: brightness(0) invert(1) !important;
        opacity: 0.6 !important;
        vertical-align: middle !important;
        display: inline-block !important;
        border-radius: 4px !important;
        padding: 3px !important;
        transition: background 0.15s, opacity 0.15s !important;
    }

        .RadDock_Bootstrap .rdCommandButton:hover {
            filter: brightness(0) invert(1) !important;
            opacity: 1 !important;
            background: rgba(255, 255, 255, 0.18) !important;
            background-color: rgba(255, 255, 255, 0.18) !important;
        }

    /* ── rdCommands: override Telerik absolute positioning so  */
    /* icons align vertically with the title text               */
    .RadDock_Bootstrap .rdCommands,
    .RadDock .rdCommands {
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin-top: 10px !important;
    }

    .RadDock_Bootstrap .rdContent,
    .RadDock_Bootstrap .rdMiddle {
        background: var(--bs-card-bg);
        background-color: var(--bs-card-bg);
        color: var(--bs-body-color);
        padding: 12px;
    }

/* ============================================================
   RAD SPLITTER / NOTIFICATION / AJAX / PANEL BAR / TOOLTIP / UPLOAD
   ============================================================ */

.RadSplitter_Bootstrap {
    border: 1px solid var(--bs-card-border-color);
    background: var(--bs-body-bg);
}

    .RadSplitter_Bootstrap .rspPane {
        background: var(--bs-card-bg);
    }

    .RadSplitter_Bootstrap .rspSplitBar {
        background: var(--faster-header-bg);
        border-color: var(--bs-card-border-color);
    }

        .RadSplitter_Bootstrap .rspSplitBar:hover {
            background: var(--faster-pale-blue);
        }

.RadNotification_Bootstrap .rnTitle {
    font-family: var(--faster-font-display);
    font-weight: 700;
    font-size: 13px;
}

.RadNotification_Bootstrap .rnContent {
    font-family: var(--bs-body-font-family);
    font-size: 12px;
}

.RadNotification_Bootstrap.rnSuccess {
    background: var(--bs-success-bg-subtle);
    border: 1px solid var(--faster-success-border);
    color: var(--bs-success);
}

.RadNotification_Bootstrap.rnWarning {
    background: var(--bs-warning-bg-subtle);
    border: 1px solid var(--faster-warning-border);
    color: var(--faster-warning-text);
}

.RadNotification_Bootstrap.rnError {
    background: var(--bs-danger-bg-subtle);
    border: 1px solid var(--faster-danger-border);
    color: var(--bs-danger-text); /* FASPD-52188: accessible text red */
}

.RadAjax_Bootstrap .raDiv {
    background: rgba(255,255,255,0.90);
    border: 1px solid var(--bs-card-border-color);
    border-radius: var(--faster-radius-md);
    color: var(--faster-text-secondary);
    font-family: var(--bs-body-font-family);
    font-size: 12px;
}

.RadPanelBar_Bootstrap .rpRootGroup {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
}

.RadPanelBar_Bootstrap .rpItem > .rpLink {
    color: var(--bs-body-color);
    background: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: var(--faster-radius-md);
    padding: 10px 14px;
    font-weight: 600;
    font-family: var(--faster-font-display);
    transition: all 0.15s;
}

    .RadPanelBar_Bootstrap .rpItem > .rpLink:hover {
        background: var(--faster-pale-blue);
        color: var(--faster-dark-blue);
    }

.RadPanelBar_Bootstrap .rpExpanded > .rpLink,
.RadPanelBar_Bootstrap .rpItem.rpExpanded > .rpLink {
    background: var(--faster-pale-blue);
    color: var(--faster-dark-blue);
    border-color: var(--faster-light-blue);
}

.RadPanelBar_Bootstrap .rpGroup {
    background: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-top: none;
    padding: 8px 0;
}

    .RadPanelBar_Bootstrap .rpGroup .rpItem > .rpLink {
        font-weight: 400;
        font-family: var(--bs-body-font-family);
        border: none;
        border-radius: 0;
        padding: 7px 24px;
        color: var(--faster-text-secondary);
    }

        .RadPanelBar_Bootstrap .rpGroup .rpItem > .rpLink:hover {
            background: var(--faster-submenu-hover);
            color: var(--faster-dark-blue);
        }

.RadToolTip_Bootstrap .rtContent {
    font-family: var(--bs-body-font-family);
    font-size: 12px;
    color: var(--bs-body-color);
    background: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-top: 3px solid var(--faster-dark-blue);
    border-radius: var(--faster-radius-md);
    box-shadow: var(--faster-shadow-md);
    padding: 8px 12px;
}

.RadUpload_Bootstrap .ruFakeInput {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--faster-radius-md) 0 0 var(--faster-radius-md);
    background: var(--bs-form-control-bg);
    color: var(--faster-text-secondary);
    height: 34px;
    padding: 6px 10px;
}

.RadUpload_Bootstrap .ruButton {
    background: var(--faster-btn-primary-bg);
    color: var(--faster-btn-primary-text);
    border: none;
    border-radius: 0 var(--faster-radius-md) var(--faster-radius-md) 0;
    font-family: var(--faster-font-display);
    font-weight: 700;
    font-size: 12px;
    height: 34px;
    padding: 0 14px;
    cursor: pointer;
}

    .RadUpload_Bootstrap .ruButton:hover {
        background: var(--faster-hover);
    }

/* RadUpload styled mode (.ruStyled) — Select / Clear buttons */
.RadUpload .ruStyled .ruFileInput,
.RadUpload .ruStyled .ruBrowse {
    display: inline-flex;
    align-items: center;
    background: var(--faster-btn-primary-bg) !important;
    color: var(--faster-btn-primary-text) !important;
    border: none !important;
    border-radius: var(--faster-radius-md) !important;
    font-family: var(--faster-font-display) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    height: 34px !important;
    padding: 0 14px !important;
    cursor: pointer !important;
    white-space: nowrap;
}

    .RadUpload .ruStyled .ruFileInput:hover,
    .RadUpload .ruStyled .ruBrowse:hover {
        background: var(--faster-hover) !important;
        color: var(--faster-btn-primary-text) !important;
    }

.RadUpload .ruButton,
.RadAsyncUploadButton {
    background: var(--faster-btn-primary-bg) !important;
    color: var(--faster-btn-primary-text) !important;
    border: none !important;
    border-radius: var(--faster-radius-md) !important;
    font-family: var(--faster-font-display) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    height: 34px !important;
    padding: 0 14px !important;
    cursor: pointer !important;
}

    .RadUpload .ruButton:hover,
    .RadAsyncUploadButton:hover {
        background: var(--faster-hover) !important;
    }

/* ============================================================
   UTILITY HELPERS
   ============================================================ */

.faster-badge-success {
    display: inline-block;
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success);
    border: 1px solid var(--faster-success-border);
    border-radius: var(--faster-radius-sm);
    font-family: var(--bs-body-font-family);
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
}
/* Warning uses golden yellow per brand spec */
.faster-badge-warning {
    display: inline-block;
    background: var(--bs-warning-bg-subtle);
    color: var(--faster-warning-text);
    border: 1px solid var(--faster-warning-border);
    border-radius: var(--faster-radius-sm);
    font-family: var(--bs-body-font-family);
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
}
/* Danger uses accessible text red per FASPD-52188 */
.faster-badge-danger {
    display: inline-block;
    background: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text); /* FASPD-52188: accessible text red */
    border: 1px solid var(--faster-danger-border);
    border-radius: var(--faster-radius-sm);
    font-family: var(--bs-body-font-family);
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
}
/* Info uses bright blue */
.faster-badge-info {
    display: inline-block;
    background: var(--faster-pale-blue);
    color: var(--faster-dark-blue);
    border: 1px solid var(--faster-light-blue);
    border-radius: var(--faster-radius-sm);
    font-family: var(--bs-body-font-family);
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
}

.faster-mono {
    font-family: var(--faster-font-mono);
    font-size: 12px;
    color: var(--faster-text-secondary);
}

.radDockContainer {
    background: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: var(--faster-radius-lg);
    box-shadow: var(--faster-shadow-sm);
}

/* ============================================================
   APP-SPECIFIC CLASSES
   ============================================================ */

.PageHeaderClass h1 {
    font-family: var(--faster-font-display);
    font-size: 22px !important;
    font-weight: 800;
    color: var(--faster-dark-blue);
    margin-bottom: 4px;
}

.PageHeaderLabel {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--faster-text-secondary);
    margin-bottom: 20px;
}

.FieldSearchLabel {
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
    color: var(--bs-body-color) !important;
}

.FieldLabel {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    font-weight: 600;
    color: var(--bs-body-color);
    white-space: nowrap;
}

.ValueLabel {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    color: var(--bs-body-color);
}

.BoldLabel {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    font-weight: 700;
    color: var(--bs-body-color);
}

.MessageLabel {
    font-family: var(--bs-body-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--bs-danger-text) !important; /* FASPD-52188: use accessible text red (6.47:1) not brand red (4.46:1) */
}

.FieldLeftTopSearchLabel {
    font-family: var(--bs-body-font-family);
    font-size: 10px;
    font-weight: 700;
    color: var(--faster-gray);
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.FieldRadWindowLabel {
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--faster-dark-blue) !important;
}

/* FASPD-52958 #8 - The FieldRadWindowNoPaddingLabel skin (used for field labels like
   "Asset Number", "Service Urgency", "Maint Shop", "Name" on the Service Request detail view
   and 30+ other pages) had no color rule, so it fell back to black (#000) while its sibling
   FieldRadWindowLabel renders in theme navy (--faster-dark-blue). QA flagged the wording color
   mismatch. Give it the same navy so all field labels are consistent app-wide. Both are dark
   on light backgrounds, so WCAG AA contrast is preserved. */
.FieldRadWindowNoPaddingLabel {
    color: var(--faster-dark-blue) !important;
}

/* ============================================================
   SETUP PAGE — FASTER Brand overrides (Option 4: Pale Blue Nav)
   ============================================================ */

/* Top header bar — pale blue background, dark blue text */
.dm-banner {
    background: var(--faster-banner-bg) !important;
    background-color: var(--faster-banner-bg) !important;
    color: var(--faster-banner-text) !important;
    font-family: var(--bs-body-font-family);
    font-size: 12px;
    border-bottom: 1px solid var(--faster-nav-border) !important;
}

.dm-user {
    color: var(--faster-banner-text) !important;
}

    .dm-user a,
    .dm-user .LargeLinkButton,
    .dm-user .WelcomeLabel,
    .dm-user .LoginName {
        color: var(--faster-banner-text) !important;
    }
    .dm-user a,
    .dm-user .LargeLinkButton {
        color: var(--faster-banner-text) !important;
        text-decoration: underline !important;
    }

        .dm-user a.LargeLinkButton,
        .dm-user a[id*="LogoutLinkButton"],
        .dm-user a[id*="HelpLinkButton"] {
            color: var(--faster-banner-text) !important;
        }

            .dm-user a.LargeLinkButton:hover,
            .dm-user a[id*="LogoutLinkButton"]:hover,
            .dm-user a[id*="HelpLinkButton"]:hover {
                color: var(--bs-link-color) !important;
            }

/* Sidebar */
#RadPane_Menu,
#SeondaryNavigation {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border-right: 1px solid var(--faster-nav-bg);
}

.TreeViewNavigationLinkButton,
.RadTreeView_Bootstrap .TreeViewNavigationLinkButton .rtIn {
    font-family: var(--bs-body-font-family);
    font-size: 12px;
    font-weight: 400;
    color: #515353;
    padding: 7px 14px;
}

.RadTreeView_Bootstrap .rtHover > .rtIn {
    background: var(--faster-nav-hover) !important;
    background-color: var(--faster-nav-hover) !important;
    color: var(--faster-nav-text) !important;
}

.RadTreeView_Bootstrap .rtSelected > .rtIn {
    background: var(--faster-nav-hover) !important;
    background-color: var(--faster-nav-hover) !important;
    color: var(--faster-nav-text) !important;
    /*border-left: 3px solid #EB1A28;*/ /* red left indicator per brand active rule */
    font-weight: 600;
}

.RadTreeView_Bootstrap .rtLI.rtLast > .rtLines {
    display: none;
}

body {
    background: var(--bs-body-bg) !important;
}

/* Panel title bars — dark blue with red bottom border */
.RadDockTitlebarTemplateTableClass {
    font-family: var(--faster-font-display) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #FFFFFF !important;
    background: var(--faster-section-header-bg) !important;
    background-color: var(--faster-section-header-bg) !important;
   /* border-bottom: 3px solid #EB1A28;*/ /* Blue color windows border red is not required*/
    padding: 8px 12px;
    float: none;
    width: 100%;
    box-sizing: border-box;
    /* FASPD-51554: clearfix — ensures rdTitleBar height grows to contain this table */
    display: block;
}

/* FASPD-51554 — Hide rdContent when dock is collapsed so the title bar is the only
   visible element. The Bootstrap skin uses scrollTop to implement collapse which hides
   the custom TitlebarTemplate; display:none ensures content is hidden regardless. */
.RadDock.rdCollapsed .rdContent {
    display: none !important;
}

/* FASPD-51554 — The Telerik Bootstrap skin sets rdTitleWrapper to a fixed 1.42857em
   height (~18px). Our custom TitlebarTemplate table is taller (42px with padding).
   Override to auto so the collapsed dock grows to show the full section-header bar. */
.RadDock.rdCollapsed .rdTitleWrapper {
    height: auto !important;
    min-height: auto !important;
}

/* FASPD-51687 — When collapsed, rdTitleWrapper is height: auto (~54px). The general
   rdCommands rule uses margin-top: 10px to compensate for the tiny expanded wrapper
   height (~18px). In the collapsed state top: 50% already resolves to the true visual
   center, so the extra 10px pushes the buttons off-center. Reset to 0 here. */
.RadDock.rdCollapsed .rdCommands {
    margin-top: 0 !important;
}

/* Section group headers — pale blue bg (primary-400), dark text, red left bar */
.RegionHeading {
    background: var(--faster-row-selected) !important;
    background-color: var(--faster-row-selected) !important;
    color: var(--bs-primary) !important;
    font-family: var(--faster-font-display) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--faster-hover);
    /*border-left: 3px solid #EB1A28;*/
    padding: 8px 12px;
}

/* FASPD-52718 #4 — action links inside a RegionHeading bar (e.g. "Add a New
   Pending Repair") rendered white on the #66ABFF header, failing WCAG AA
   (2.38:1). Use the same primary navy as the heading's own text so the link
   reads at 6.1:1. */
/* Also covers RadLabel/span children with inline ForeColor="White" — white on
   #66abff is only 2.37:1. Force dark navy to match the heading text (6.1:1). */
.RegionHeading a,
.RegionHeading a:link,
.RegionHeading a:visited,
.RegionHeading span,
.RegionHeading label {
    color: var(--bs-primary) !important;
}

    .RegionHeading a:hover,
    .RegionHeading a:focus {
        color: var(--faster-dark-blue) !important;
        text-decoration: underline !important;
    }

/* Navigation links — bright blue */
.NavigationLinkButton {
    font-family: var(--bs-body-font-family) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    color: var(--bs-link-color) !important;
    text-decoration: none !important;
}

    .NavigationLinkButton:hover {
        color: var(--bs-primary) !important;
        border-bottom: 1px solid var(--bs-link-color);
        text-decoration: none !important;
    }

/* ─── Utility classes (replaces inline styles in ASPX markup) ── */

/* Section "What would you like to do?" table header */
.faster-th-header {
    background-color: var(--faster-section-header-bg);
    color: var(--faster-section-header-text);
    white-space: nowrap;
    width: 1%;
}

/* Alternating table row tint */
.faster-row-alt {
    background-color: var(--bs-table-striped-bg);
    white-space: nowrap;
    width: 1%;
}

/* RadGrid command item row (replaces BackColor="#B3D4FF" on CommandItemStyle) */
.RadGrid_Bootstrap .rgCommandRow td {
    background-color: var(--faster-nav-hover);
    color: var(--bs-body-color);
    font-weight: 700;
    height: 20px;
}

/* Panel / Label highlight tint (replaces BackColor="#B3D4FF" on Panel/Label) */
.faster-panel-highlight {
    background-color: var(--faster-nav-hover);
    border: 1px solid var(--faster-nav-border);
}

/* Highlighted table row (replaces style="background-color:#6d90b4") */
.faster-row-highlight td {
    background-color: var(--faster-row-selected);
    color: var(--faster-dark-blue);
}

/* CustomerPortal side nav pane (replaces BackColor="#adc9f7" on MenuRadPane) */
.customer-portal-menu-rad-pane {
    background-color: var(--faster-nav-bg) !important;
}

/* ─────────────────────────────────────────────────────────────── */

/* Action link buttons — bright blue */
.LargeLinkButton, .MediumLinkButton, a[href].SmallLinkButton,
.ExpandCollapseLinkButton, .WOHeaderLinkButton,
a[href].SmallHyperLink, .RightAlignSmallLinkButton, .LeftTopSearchLinkButton {
    color: var(--bs-link-color) !important;
    font-family: var(--bs-body-font-family);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

    .LargeLinkButton:hover, .MediumLinkButton:hover, a[href].SmallLinkButton:hover,
    .WOHeaderLinkButton:hover,
    a[href].SmallHyperLink:hover, .RightAlignSmallLinkButton:hover, .LeftTopSearchLinkButton:hover {
        color: var(--bs-primary) !important;
        text-decoration: underline;
    }

/* FASPD-53150 — "Group By" matches the color expected*/
.GroupByCommandLabel {
    color: var(--bs-link-color) !important;
}

/* FASPD-53150 — Repair status ("Open") text needs WCAG AA contrast; override the
   gray FieldLeftTopSearchLabel default with the accessible link blue (4.51:1). */
.RepairStatusLabel {
    color: var(--bs-link-color) !important;
}

/* FASPD-52181 — darker blue in form popup/page contexts for WCAG AA contrast (6:1 on white) */
.PaddingForm .MediumLinkButton,
.ContentPaddingLeft .MediumLinkButton {
    color: #005FCC !important;
}

/* FASPD-52718 — "Add Credit Card" link needs WCAG AA contrast on light blue page background */
a[href].SmallLinkButton {
    color: #0050D8 !important;
}

/* RadEditor dialogs (FASPD-51595) — this file is injected into Telerik's DialogHandler.aspx
   pages via DialogsCssFile on the RadEditor skins (Faster.skin); those pages load no other
   FASTER CSS. Secondary (flat) dialog buttons such as Close get an outlined style, and the
   Find And Replace layout is compacted so its content fits the dialog height without a
   vertical scrollbar. */
button.rfdFlatButton.rfdSkinnedButton,
input.rfdFlatButton.rfdSkinnedButton,
a.rfdFlatButton.rfdSkinnedButton {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: var(--bs-primary) !important;
    border: 1px solid var(--bs-primary) !important;
}

    button.rfdFlatButton.rfdSkinnedButton:hover,
    input.rfdFlatButton.rfdSkinnedButton:hover,
    a.rfdFlatButton.rfdSkinnedButton:hover {
        background: var(--faster-light-tint) !important;
        background-color: var(--faster-light-tint) !important;
        color: var(--bs-primary) !important;
    }

/* Telerik's dialog skin gives the F&R wrapper/body fixed heights sized for the
   uncompacted layout — release them so the dialog collapses to its real content
   height and the vertical scrollbar disappears. */
html.redFindAndReplace,
html.redFindAndReplace body,
div.redFindAndReplace,
.redFindAndReplace .redWrapper {
    height: auto !important;
    min-height: 0 !important;
}

/* The dialog document must not grow its own scrollbar — the outer rwContent is the
   single scroll owner (rule above). This kills the second (inner) scrollbar; the
   taller Replace tab still scrolls via rwContent, so nothing is clipped. */
html.redFindAndReplace {
    overflow: hidden !important;
}

.redFindAndReplace .redRow {
    padding: 4px 0 !important;
}

.redFindAndReplace .redSection {
    padding: 8px 12px !important;
    margin: 0 !important;
}

.redFindAndReplace .redSectionTop {
    padding-top: 6px !important;
}

.redFindAndReplace .redSectionNoBorder {
    padding-bottom: 0 !important;
}

.redFindAndReplace .redRowNoPadding {
    padding: 2px 0 !important;
}

.redFindAndReplace .RadMultiPage {
    padding-bottom: 0 !important;
}

.redFindAndReplace .redActionButtonsWrapper {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

/* Disabled link buttons (FASPD-51595) — ASP.NET renders Enabled="false" LinkButtons as
   <a class="aspNetDisabled ..."> without href; the themed color above is !important and
   would keep them bright blue, making e.g. "Show all Notes" look clickable when there are
   no records. Higher specificity wins among !important rules. */
a.aspNetDisabled.SmallLinkButton, a.aspNetDisabled.MediumLinkButton,
a.aspNetDisabled.LargeLinkButton, a.aspNetDisabled.RightAlignSmallLinkButton,
a.aspNetDisabled.SmallHyperLink, a.aspNetDisabled.LeftTopSearchLinkButton {
    color: #727272 !important;
    cursor: default !important;
    text-decoration: none !important;
}

/* Disabled links on dark .HeaderRow / .rdTitleBar backgrounds (#727272/#002859 = 2.07:1, fails AA).
   Light blue-gray #b8c9e0 gives 8.6:1 on #002859. Specificity (0,3,1) beats rule above (0,2,1). */
.HeaderRow a.aspNetDisabled.SmallLinkButton,
.HeaderRow a.aspNetDisabled.MediumLinkButton,
.rdTitleBar a.aspNetDisabled.SmallLinkButton,
.rdTitleBar a.aspNetDisabled.MediumLinkButton {
    color: #b8c9e0 !important;
}

/* Link buttons inside RadDock title bar or grid HeaderRow sit on a dark background — keep text white */
.rdTitleBar a[href].SmallLinkButton,
.rdTitleBar .LargeLinkButton,
.rdTitleBar .MediumLinkButton,
.HeaderRow a[href].SmallLinkButton,
.HeaderRow a[href].MediumLinkButton {
    color: #fff !important;
}

.rdTitleBar a[href].SmallLinkButton:hover,
.rdTitleBar .LargeLinkButton:hover,
.rdTitleBar .MediumLinkButton:hover,
.HeaderRow a[href].SmallLinkButton:hover,
.HeaderRow a[href].MediumLinkButton:hover {
    color: #fff !important;
    text-decoration: underline;
}

.a[href].SmallLinkGridButton 
  {
    color: var(--bs-link-color) !important;
    font-family: var(--bs-body-font-family);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

     a[href].SmallLinkGridButton:hover
      {
        
        text-decoration: underline;
    }

/* ============================================================
   LOGIN PAGE
   ============================================================ */
.LoginBody {
    font-family: var(--bs-body-font-family) !important;
    background: url('../Images/Background.jpg') no-repeat center center !important;
    background-size: cover !important;
    min-height: 100vh !important;
}

.FieldLoginLabel {
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
    color: var(--bs-body-color) !important;
    font-weight: 600;
}

.LoginControl {
    background-color: rgba(255, 255, 255, 0.97) !important;
    border-radius: var(--faster-radius-lg) !important;
    box-shadow: var(--faster-shadow-md) !important;
}

.LoginTh {
    font-family: var(--faster-font-display) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--bs-heading-color) !important;
}

.LoginTdButton {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.LoginBody .SmallLinkButton,
.LoginBody a {
    color: var(--bs-link-color) !important;
    font-family: var(--bs-body-font-family) !important;
    font-size: 13px !important;
}

.LoginBody .RadTextBox_Bootstrap,
.LoginBody .RadInput_Bootstrap input.riTextBox {
    width: 100% !important;
}

/* Sign In button — scoped to login page only */
.LoginBody .RadButton_Bootstrap:not(.rbCheckBox):not(.rbIconButton),
.LoginBody .rfdSkinnedButton,
.LoginBody button.rbRound,
.LoginBody button[type="submit"] {
    background: var(--faster-btn-primary-bg) !important;
    background-color: var(--faster-btn-primary-bg) !important;
    color: var(--faster-btn-primary-text) !important;
    border: none !important;
    border-radius: var(--bs-btn-border-radius) !important;
    font-family: var(--faster-font-display) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    padding: 7px 20px !important;
    cursor: pointer !important;
    box-shadow: var(--faster-shadow-sm) !important;
}

    .LoginBody .RadButton_Bootstrap:not(.rbCheckBox):not(.rbIconButton):hover,
    .LoginBody .rfdSkinnedButton:hover,
    .LoginBody button.rbRound:hover,
    .LoginBody button[type="submit"]:hover {
        background: var(--faster-hover) !important;
        background-color: var(--faster-hover) !important;
        color: var(--faster-btn-primary-text) !important;
        box-shadow: var(--faster-shadow-md) !important;
    }
/* ============================================================
   FIX: RadScheduler Web20 – green Week selection 
   ============================================================ */

/* Selected view tab (Day / Week / Month) */
.RadScheduler_Web20 .rsViews .rsSelected .rsButton {
    background-image: none !important; /* kills blue gradient */
    background-color: var(--bs-success) !important;
    border-color: var(--bs-success) !important;
    color: #FFFFFF !important;
    font-weight: 700;
}

    /* Text inside the button */
    .RadScheduler_Web20 .rsViews .rsSelected .rsButton span {
        color: #FFFFFF !important;
    }

/* Week header bar (date range strip) */
.RadScheduler_Web20.rsWeekView .rsTopWrap,
.RadScheduler_Web20.rsWeekView .rsHeader {
    background-image: none !important;
    background-color: var(--bs-success-bg-subtle) !important;
    border-bottom: 2px solid var(--bs-success);
}

    /* Date text in header */
    .RadScheduler_Web20.rsWeekView .rsHeader,
    .RadScheduler_Web20.rsWeekView .rsHeader span {
        color: var(--bs-success) !important;
        font-weight: 700;
     }
/* FASPD-52494 #4 — the previous rule forced every radio label to white, but the
   unselected items sit on a light background, so "One Time"/"On Day:"/"On:" were
   invisible (white on white). The FASPD-51552 toggle theming already gives the
   selected radio a pale-blue background with dark text, so a single dark body
   color is readable in both selected and unselected states. */
.UnavailabilityRadioButtonList .rbText,
.UnavailabilityTypeRadioButtonList .rbText {
    color: var(--bs-body-color) !important;
}

/* Gap between One Time / Recurring items */
.UnavailabilityRadioButtonList .rbListItem + .rbListItem {
    margin-left: 14px;
}

.PaddingTop35 {
    padding-top: 35px;
}


/* FASPD-51474 — "Search Results" title bar was hidden; QA reported the
   section header was missing on the Purchase Orders tab. Removed both rules
   so the dock renders with its standard title and default content padding. */