:root {
    /* custom variables */
    --be-color-brand: #FD5108;
    --be-color-brand-300: #FFAA72;
    --be-color-brand-400: #FE7C39;
    --be-color-brand-1000: #1F0606;
    --be-color-black: #000000;
    --be-color-grey-200: #DFE3E6;
    --be-color-grey-600: #8E95A2;
    --be-color-grey-800: #626771;
    --be-color-grey-1000: #111113;
    --be-color-menu: #252525;
    --be-color-menu-active: #E8E8E8;
    --be-color-off: #818181;
    /* expressive background gradient */
    --be-color-gradient-white: #FFFFFF;
    --be-color-gradient-red-100: #FFE2E5;
    --be-color-gradient-orange-200: #FFCDA8;
    /* custom variables */
    --be-color-warning: #FFBF1F;
    --be-color-error: #C52A1A;
    --be-color-success: #22992E;
    --be-theme-color-btnthirdhover: #C5C5C5;
    --be-theme-color-btnthirdactive: #AFAFAF;
    /* appkit overrides */
    --theme-color-control: var(--be-color-brand-300);
    --theme-color-btnprihover: var(--be-color-brand-400);
    --theme-color-btnpriactive: var(--be-color-brand-300);
    --theme-color-btnsechover: var(--theme-color-btnprihover);
    --theme-color-btnsecactive: var(--theme-color-btnpriactive);
    --theme-color-tabfont: #696969;
    --theme-color-font: #252525;
    --theme-color-chartfont: var(--theme-color-font);
    --theme-color-main: #F3F3F3 !important;
    --theme-color-navheader: var(--theme-color-main) !important;
    --theme-color-purewhite: var(--be-color-brand-1000);
    --theme-color-link: var(--be-color-brand);
    /* telerik overrides */
    --kendo-color-primary: var(--be-color-brand);
    --kendo-color-on-app-surface: var(--theme-color-font);
}


.appkiticon {
    color: var(--be-color-brand-1000) !important;
}

.a-loading.a-primary {
    background-image: url(rebranding-assets/Loading1.svg) !important;
}

.a-badge-warning {
    background-color: var(--be-color-warning) !important
}

.a-badge-warning {
    background-color: var(--be-color-warning) !important
}

.a-badge-error {
    background-color: var(--be-color-error) !important
}

.a-badge-success {
    background-color: var(--be-color-warning) !important
}

.a-header {
    box-shadow: none !important;
    height:4rem;
    font-size:100%;
}

.a-pwc-logo-grid.a-md {
    background-image: url(rebranding-assets/pwc_logo.svg);
    width: 3.4375rem;
    min-width: 3.4375rem;
    height: 1.75rem;
    background-size: contain;
    background-repeat: no-repeat;
}

/*blazor validation*/
.validation-message {
    font-size: .75rem;
    line-height: 1.1875rem;
    color: var(--be-color-error);
    margin-top: .625rem
}

.invalid.a-text-input, .k-invalid .k-input-inner {
    border: none !important;
    box-shadow: 0 0 0 0.0625rem var(--be-color-error) !important;
    background-color: #C52A1A1F !important;
}

    .invalid.a-text-input:focus, .k-invalid .k-input-inner:focus {
        border: none !important;
        box-shadow: 0 0 0 0.0625rem var(--be-color-error) !important
    }


.k-invalid .k-input-button, .k-invalid .k-input-button:focus {
    background-color: #C52A1A1F !important;
}




/* telerik checkbox */
.k-checkbox {
    border-color: var(--be-color-grey-800);
}

    .k-checkbox:focus-visible {
        outline: 2px solid var(--be-color-grey-1000) !important;
    }

/* appkit button */


.a-btn {
    box-sizing: border-box;
    display: inline-flex;
    border: 0;
    border-radius: 0.25rem;
}

    /* Primary */
    .a-btn.a-btn-primary {
        background-color: var(--theme-color-control);
        color: var(--be-color-brand-1000);
    }
        .a-btn.a-btn-primary:hover:not(:disabled) {
            background-color: var(--theme-color-btnprihover);
        }

        .a-btn.a-btn-primary:active:not(:disabled) {
            background-color: var(--theme-color-btnpriactive);
        }

        .a-btn.a-btn-primary:focus {
            outline: none;
        }

        .a-btn.a-btn-primary:focus-visible {
            outline: 0.125rem solid var(--be-color-grey-1000);
            outline-offset: 0.125rem;
        }

        .a-btn.a-btn-primary:disabled {
            background-color: var(--be-color-grey-200);
            color: var(--be-color-grey-600);
            cursor: not-allowed;
        }


    /* Secondary */

    .a-btn.a-btn-secondary {
        background-color: transparent;
        border: 0.09375rem solid var(--be-color-grey-600);
        color: var(--be-color-grey-1000);
    }

        .a-btn.a-btn-secondary:hover:not(:disabled) {
            border: 0;
            background-color: var(--theme-color-btnprihover);
            color: var(--be-color-brand-1000);
        }

        .a-btn.a-btn-secondary:active:not(:disabled) {
            border: 0;
            background-color: var(--theme-color-btnpriactive);
        }

        .a-btn.a-btn-secondary:focus {
            outline: none;
        }

        .a-btn.a-btn-secondary:focus-visible {
            outline: 0.125rem solid var(--be-color-grey-1000);
            outline-offset: 0.1875rem;
        }

        .a-btn.a-btn-secondary:disabled {
            background-color: transparent;
            border-color: var(--be-color-grey-200);
            color: var(--be-color-grey-600);
            cursor: not-allowed;
        }

/* side menu*/
.side-nav-item {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 16px;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1.4;
    color: var(--be-color-menu);
    font-weight: 400;
    text-decoration: none;
}

    .side-nav-item:hover {
        background: var(--be-color-menu-active);
        color: var(--be-color-menu);
        text-decoration: none;
    }

    .side-nav-item__icon {
        width: 20px;
        height: 20px;
        color: var(--be-color-brand) !important;
    }

.side-nav-item--active {
    color: var(--be-color-brand);
    font-weight: 500;
}

    .side-nav-item--active:hover {
        color: var(--be-color-brand);
        text-decoration: none;
    }

/* messaging */
.messaging-wrapper .messaging .messaging-detail .messaging-info .messaging-name {
    color: var(--be-color-brand);
}


/* input */
.a-text-input {
    border: .0625rem solid var(--be-color-grey-600) !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

    .a-text-input:hover:not(:disabled) {
        border: .0625rem solid var(--be-color-brand) !important
    }

    .a-text-input:active:not(:disabled) {
        border: .0625rem solid var(--be-color-brand) !important;
        box-shadow: none !important;
    }

    .a-text-input:focus:not(:disabled) {
        border: .0625rem solid var(--be-color-brand) !important;
        box-shadow: none !important;
    }

    /*.a-text-input:focus {
        outline: none;
        box-shadow: none !important;
    }

    .a-text-input:focus-visible {
        outline: 2px solid var(--be-color-grey-1000) !important;
        box-shadow: none !important;
    }*/

    .a-text-input:disabled {
        background-color: var(--be-color-grey-200);
        color: var(--be-color-grey-600);
        border: none
    }

/* telerik input override */
.k-input-inner {
    border: none;
    background-color: var(--theme-color-panel) !important;
}

.k-input-button {
    background-color: var(--theme-color-panel) !important;
}

.k-input, .k-dropdownlist {
    border: .0625rem solid var(--be-color-grey-600);
    background-color: var(--theme-color-panel) !important;
    box-shadow: none !important;
}

    .k-input:hover:not(:disabled), .k-dropdownlist:hover:not(:disabled) {
        border: .0625rem solid var(--be-color-brand)
    }

    .k-input:active:not(:disabled), .k-dropdownlist:active:not(:disabled) {
        border: .0625rem solid var(--be-color-brand);
        box-shadow: none !important;
    }

    .k-input:disabled, .k-dropdownlist:disabled {
        background-color: var(--be-color-grey-200);
        color: var(--be-color-grey-600);
        border: none
    }

.k-focus:not(:disabled) {
    border: .0625rem solid var(--be-color-brand);
    box-shadow: none !important;
}

    .k-picker.k-focus,
    .k-picker[aria-expanded="true"],
    .k-multiselect:has([aria-expanded="true"]),
    .k-input:has([aria-expanded="true"]) {
        border: .0625rem solid var(--be-color-brand);
    }

    .k-switch.k-focus{
        border:none !important;
    }

.k-switch-off .k-switch-track {
    background-color: var(--be-color-off);
    color: var(--kendo-color-on-primary);
}

/* override specifically for nav header section menu dropdown */
.be-section-menu .k-input-inner, .k-dropdownlist.be-section-menu {
    border: none !important;
    background-color: var(--theme-color-navheader) !important;
    box-shadow: none !important;
}

.be-section-menu .k-input-button {
    background-color: var(--theme-color-navheader) !important;
}

/* Match the product name's font metrics: the header centres both boxes, so
       identical font-size/line-height is what makes the baselines line up. */
.be-section-menu .k-input-inner {
    font-size: 14px;
    line-height: 1.25;
}

/* blazored toast msg*/
.blazored-toast-container {
    z-index: 9999 !important;
}

.blazored-toast-container.position-topright {
    top: 55px !important; /* Adjust this value to push it lower */
}

/* appkit badge */
.a-badge {
    background-color: var(--be-color-brand);
    color: #FFFFFF;
}

/* appkit footer */
.a-footer {
    color: var(--be-color-menu);
}

a.a-footer {
    color: var(--be-color-menu);
    text-decoration: underline;
    padding: 0px 24px 0px 0px;
}

    a.a-footer:hover {
        text-decoration: none;
    }

a.a-footer-text {
    color: var(--be-color-menu);
    text-decoration: underline;
}

a.a-footer-text:hover {
    text-decoration: none;
}

/* telerik buttons in toolbar (as per appkit tertiary button) */
.k-grid-toolbar .k-button {
    background-color: var(--be-color-menu-active);
}
    .k-grid-toolbar .k-button:hover:not(:disabled) {
        background-color: var(--be-theme-color-btnthirdhover);
    }

    .k-grid-toolbar .k-button:active:not(:disabled) {
        background-color: var(--be-theme-color-btnthirdactive);
    }

    .k-grid-toolbar .k-button:disabled {
        background-color: var(--be-color-menu-active);
        opacity:.32;
        cursor: not-allowed;
    }

/* telerik tab */
.k-tabstrip-item .k-link-text {
    color: var(--theme-color-tabfont);
    font-weight: normal;
}

.k-tabstrip-item.k-active .k-link-text,
.k-tabstrip-item[aria-selected="true"] .k-tabstrip-item-text {
    color: var(--be-color-brand);
    font-weight: 500;
}

.k-tabstrip-item:not(.k-active):hover .k-link-text {
    color: var(--theme-color-tabfont);
    font-weight: 500;
}

.k-tabstrip-item.k-active .k-link-text::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px; /* nudge down to overlap the wrapper's border */
    height: 2px; /* match or slightly exceed the grey line's thickness */
    background-color: var(--be-color-brand);
    z-index: 1; /* ensure it draws on top of the grey line */
}

/* HOVER underline on inactive tabs - same alignment */
.k-tabstrip-item:not(.k-active):hover .k-link-text::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background-color: var(--theme-color-tabfont);
    z-index: 1;
}

/* product name in header */

.be-brand-lockup {
    gap: 12px;
}

/* Sticky must sit on the banner itself: .a-header can only stick within its
       parent's box, which is exactly its own height, so it never stays put. */
.be-sticky-banner {
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: var(--theme-color-navheader);
}

/* Nudged as one block so the product name and the section menu stay aligned
       with each other while both keep the optical offset to the PwC logotype. */
.be-header-titlebar {
    transform: translateY(2.5px);
}

.be-product-name {
    /*font-family: "PwC Helvetica Neue", "Helvetica Neue", Arial, sans-serif;*/
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    color: var(--be-color-menu);
}

/* larger logo on login page */
.ap-pwc-logo {
    background-image: url(rebranding-assets/pwc_logo.svg);
    width: 5.25rem;
    min-width: 5.25rem;
    height: 2.5625rem;
    background-size: contain;
    background-repeat: no-repeat;
}