.providerPortal div.ErrorBox,
.providerPortal div.SuccessBox,
.providerPortal div.InfoBox {
    padding: 15px;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
    background-image: none;
}

.providerPortal div.ErrorBox .title,
.providerPortal div.SuccessBox .title,
.providerPortal div.InfoBox .title {
    font-size: 18px;
}

/* 
    Bootstrap adds some margin bottom to certain types, but the infobox already gives consistent padding on the internals, so remove any additional margin from the last entry.
*/
    .providerPortal div.ErrorBox span :last-child,
    .providerPortal div.SuccessBox span :last-child,
    .providerPortal div.InfoBox span :last-child {
        margin: 0;
    }

.providerPortal div.ErrorBox {
    border-color: #d9534f;
    background-color: #fbd2d3;
}

.providerPortal div.ErrorBox .title {
    color: #d9534f;
}

.providerPortal div.SuccessBox {
    border-left-color: #5cb85c;
    background-color: #ffffff;
}

.providerPortal div.SuccessBox .title {
    color: #5cb85c;
}

.providerPortal div.InfoBox {
    border-left-color: #5bc0de;
    background-color: #ffffff;
}

.providerPortal div.InfoBox .title {
    color: #5bc0de;
}

.providerPortal .actionBarPanel {
    width: 250px;
}

/*
    If the custom action list is within an action bar panel and it's the first item, you can get a situation where you have the padding of the action bar panel and margin on the 
    divider div. So 
*/
.providerPortal .actionBarPanel .customActionList.removeFirstDividerMargin:first-of-type .divider {
    margin-top: 8px;
}

/*
    Styling the actionbar scrollbar. Part of a number of settings that are all needed for the better visuals.
*/
.actionBarPanel .actionBarContainer::-webkit-scrollbar,
.actionBarPanel .actionBarContainer::-webkit-scrollbar-thumb {
    width: 14px;
    border-radius: 13px;
    background-clip: padding-box;
    border: 4px solid transparent;
    background-color: transparent;
}

/*
    Styling the actionbar scrollbar. Part of a number of settings that are all needed for the better visuals.
*/
.actionBarPanel .actionBarContainer::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 0 10px;
}

/*
    Styling the actionbar scrollbar. Part of a number of settings that are all needed for the better visuals.
*/
.actionBarPanel .actionBarContainer::-webkit-scrollbar-track {
    box-shadow: none;
    background-color: transparent;
}

/*
    Styling the actionbar scrollbar. Part of a number of settings that are all needed for the better visuals.
*/
.actionBarPanel .actionBarContainer::-webkit-scrollbar-button,
.actionBarPanel .actionBarContainer::-webkit-scrollbar-track-piece,
.actionBarPanel .actionBarContainer::-webkit-scrollbar-corner,
.actionBarPanel .actionBarContainer::-webkit-resizer {
     display: none;
}

/*
    Centers the icon with the form field label text.    
*/
.providerPortal .formfieldclient > label > span.formfieldicon {
    line-height: 1.5;
    position: absolute;
    top: 7px;
    right: 10px;
    display: inline-block;
    margin-left: 4px;
}

/*
    Make sure that link buttons align correctly to the left and central.
*/
.providerPortal .formfieldclient div span.btn-link {
    padding-left: 0;
    text-align: left;
}

/*
    If we have a custom action list without any elements hide it.    
*/
.providerPortal .customActionList:empty {
    display: none;
}

/*
    The multiselectcombobox has a button next to the combobox so we want to square off the combobox.
*/
.providerPortal .multiSelectComboBox .RadComboBox_Bootstrap .rcbActionButton,
.providerPortal .multiSelectComboBox .RadComboBox_Bootstrap .rcbInner {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/*
    The options menu has radbuttons in... But theyve been tweaked to style the icon for a normal button icon. For the toggle
    in the options menu we want the icon to be slightly bigger.
*/
.providerPortal .optionsMenuListItem button .rbIcon::before {
    font-size: 16px;
}

/*
    For historic / cross application reasons, the history button column is added as a button within a template so the styling doesn't look right. Bring in line with the provider portal.
*/
.providerPortal .attributeValueList .RadGrid .history button {
    background-color: transparent;
    border: none;
}

/*
    Bring the buttons in line with Telerik (combobox toggle / date time picker buttons etc) so when they're stacked they look uniform.
*/
.providerPortal .multiSelectComboBox button[value=Add],
.providerPortal .multiSelectComboBox button[value=Close],
.providerPortal .multiSelectTextBox button.iconOnly {
    width: 34px !important;
    padding: 0;
}

    /* 
        On the provider portal we use icons where possible, so hide the text (Add / Close) which we'll replace with icons.
    */
    .providerPortal .multiSelectComboBox button[value=Add] span.rbText,
    .providerPortal .multiSelectComboBox button[value=Close] span.rbText {
        font-size: 0;
    }

    /*
        Set the font size / icons.
    */
        .providerPortal .multiSelectComboBox button[value=Add] span.rbText:before,
        .providerPortal .multiSelectComboBox button[value=Close] span.rbText:before {
            font-family: FontAwesome;
            display: inline-block;
            content: '\f067';
            font-size: 14px;
        }

        /*
            Different icon for close button.
        */
        .providerPortal .multiSelectComboBox button[value=Close] span.rbText:before {
            content: '\f058';
        }

        /*
            Default colour of the history icon is black, so bring it inline with the rest of the site.
        */
        .providerPortal .attributeValueList .fas.fa-history {
            color: #337ab7;
        }

/* 
    If an icon is an error icon in the form field, make it red.
*/
.providerPortal .formfieldicon.fa-exclamation-circle {
    color: var(--bs-danger);
}

/*
    Not sure if this was due to historical reasons, but out of the box there is 3px padding which shifts the icon out of center. This makes it look as it should
*/
.providerPortal .actionBarIcon {
    padding-left: 0px;
}