/*.clientPortal .RadCalendar th {
    text-align: center;
}

.clientPortal .RadCalendar .rcMain .rcRow td {
    text-align: center;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.clientPortal .RadCalendar .rcWeek th:last-child {
    padding-right: 0 !important;
}

.clientPortal .RadCalendar.RadCalendar_MetroTouch .rcSelected a {
    border-color: var(--cjrs-primary-colour);
    background-color: var(--cjrs-primary-colour);
}

.clientPortal .RadGrid.RadGrid_MetroTouch th.rgSorted {
    background-color: var(--cjrs-primary-colour);
}

.clientPortal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgNumPart a.rgCurrentPage {
    border-color: var(--cjrs-primary-colour);
    color: var(--cjrs-primary-colour);
}

.clientPortal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgNumPart a:active,
.clientPortal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgNumPart a.rgCurrentPage:active,
.clientPortal .RadComboBox_MetroTouch .rcbReadOnly.rcbFocused,
.clientPortal .RadComboBox_MetroTouch .rcbReadOnly.rcbExpanded {
    border-color: var(--cjrs-primary-colour) !important;
    color: #fff;
    background-color: var(--cjrs-primary-colour) !important;
}
*/

/*
    Taking the default Telerik values (16px) means the font awesome icons essentially touch the label text.
    Setting to the initial value gives a bit more space.
*/
.clientPortal .RadButton .rbIcon.fas {
    width: initial;
    height: initial;
}

/*
    If we're only displaying an icon, remove the right margin from the icon so it's correctly centered.
*/
.clientPortal .RadButton.rbIconOnly .rbIcon {
    margin-right: 0;
}

/*
    If we're displaying a font awesome icon, make sure we override the family.
*/
.clientPortal .RadButton span.fas.rbIcon::before,
.clientPortal .RadButton span.fa-solid.rbIcon::before {
    font-family: "Font Awesome 6 Pro" !important;
}