@font-face {
    font-family: 'NeoSansStdLight';
    src: url('../font/NeoSansStdLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NeoSansStdRegular';
    src: url('../font/NeoSansStdRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NeoSansStdMedium';
    src: url('../font/NeoSansStdMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

a {
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

html, body {
    font-family: 'NeoSansStdRegular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    height: 100%;
    max-height: 100%;
    min-height: 100%;
    overflow: hidden;
}

/*
    Make labels a bit more interesting.
*/
label:not(.k-radio-label) {
    font-weight: bold;
}

.file-list-view .k-listview-item {
    display: inline-block;
}

/*
    Ensure article paragraphs have a minimum height, so that spaces intentionally put in by authors are preserved.
*/
.article-section p {
    min-height: 1rem;
}

/*
    Remove padding from KB tile layout card bodies.
*/
.article-tilelayout-item > .k-tilelayout-item-body {
    padding: 0 !important;
}

/*
    Formatting for tables designed to replace inline definition lists.
*/
.definition-table th {
    padding-right: 1rem;
    text-align: left;
}

.definition-table tr:not(:last-child) th {
    padding-bottom: 0.25rem;
}

/*
    For some reason this isn't applied by default...
*/
.floating-action-button {
    z-index: 10;
}

/*
    Set home button size.
*/
.handler-home-button {
    height: 135px;
    width: 135px;
}

    /*
    Make home button text wrap.
*/
    .handler-home-button .handler-home-button-text {
        white-space: normal;
    }

/*
        A class which, when applied to an element, will hide its children (but not the element itself).
    */
.hide-children * {
    display: none;
}

/*
    Control the opacity of hover buttons.
*/
.hover-button-container > .hover-button {
    opacity: 0;
}

.hover-button-container:hover > .hover-button {
    opacity: 0.5;
}

    .hover-button-container:hover > .hover-button:hover {
        opacity: 1;
    }

/*
    Give the icon picker list view a cool grid layout.
*/
.icon-picker-list-view .k-listview-content {
    display: grid;
    grid-template-columns: auto auto;
    gap: 10px;
    margin-top: 10px;
}

/*
    Make sure the nav bar links are visible.
*/
.k-appbar .k-menu-link, .k-appbar .k-menu-link:hover {
    color: white;
}

/*
    Get rid of the background colour for breadcrumb and list views cos they look arse in dark mode.
*/
.k-breadcrumb, .k-listview {
    background-color: transparent;
}

/*
    Make sure this is white otherwise it's hard to read in dark mode.
*/
.k-editor-content {
    background-color: white;
}

/*
    Pad/space the Telerik notification container so it's not hard up against the corner of the window.
*/
.k-notification-container {
    margin: 0.5rem;
}

/*
    Make the notification content text a bit larger than the default "microscopic".
*/
.k-notification-content {
    font-size: 1rem;
}

/*
    Don't display the action buttons for upload components as we want to handle this in code.
*/
.k-upload .k-actions {
    display: none;
}

.listview-hidden-pager .k-listview-pager {
    display: none;
}

.listview-rounded > .k-listview-pager {
    border-radius: 9999px;
}

    .listview-rounded > .k-listview-pager .k-button {
        border-radius: 9999px;
    }

.navigation-card a {
    font-family: 'NeoSansStdMedium';
}

/*
    Set the page div height to full and make it scrollable - this is to make the loader container work.
*/
.page {
    height: 100%;
    overflow: auto;
}

/*
    Format holiday cells (unfortunately we can't format the events themselves as the args don't expose occurrence dates).
*/
.scheduler-all-staff-holiday:not(.k-nonwork-hour)::after {
    content: "All Staff Holiday";
}

.scheduler-holiday::after {
    color: var(--kendo-color-secondary, #666666);
    font-size: var(--kendo-fs-sm, 0.75rem);
    margin-left: var(--kendo-spacing-1, 0.25rem);
}

.scheduler-support-holiday:not(.k-nonwork-hour)::after {
    content: "Support Holiday";
}

.scheduler-teaching-holiday:not(.k-nonwork-hour)::after {
    content: "Teaching Holiday";
}

/*
    Stop the SA admin tab strip from jittering.
*/
.service-area-admin-tab-strip > .k-tabstrip-items-wrapper .k-link-text {
    white-space: nowrap;
}

/*
    Don't show the "all day" row in the service area scheduler as operating hours should never be all day.
*/
.service-area-scheduler .k-scheduler-all-day-row {
    display: none;
}

/*
    Same for the checkbox in the popup.
*/
.service-area-scheduler-edit-dialog #is-all-day-checkbox, .service-area-scheduler-edit-dialog [for=is-all-day-checkbox] {
    display: none;
}

/*
    Position the "show redirect dialog" button absolutely on the bottom-right.
*/
.show-redirect-dialog-button {
    bottom: 1rem;
    right: 2rem;
    position: fixed !important;
    z-index: 3;
}

.ticket-container {
    column-count: 1;
}

    .ticket-container .k-form .k-form-field, .ticket-container .ticket-container-field {
        break-inside: avoid;
    }

    .ticket-container .ticket-container-item {
        margin-bottom: 1rem;
    }

.ticket-container-container {
    container-type: inline-size;
}

@container(min-width: 768px) {
    .ticket-container {
        column-count: 2;
    }
}

@container(min-width: 1200px) {
    .ticket-container {
        column-count: 3;
    }
}

/*.ticket-container {
    column-count: 1;
    column-gap: 1rem;
}

    .ticket-container .k-form .k-form-field, .ticket-container .ticket-container-field {
        break-inside: avoid;
    }

    .ticket-container .ticket-container-item {
        margin-bottom: 1rem;
    }

@media(min-width: 992px) {
    .ticket-container {
        column-count: 2;
    }
}

@media(min-width: 1200px) {
    .ticket-container {
        column-count: 3;
    }
}*/
.ticket-redirect-action-dialog .k-dialog-content {
    overflow-y: scroll;
}

/*
    Sanitise the ticket reply div size in case of massive images.
*/
.ticket-reply {
    max-height: 300px;
    max-width: 100%;
    overflow: auto;
}

.ticket-reply-container {
    max-width: 95%;
}

.unpadded-dialog .k-dialog-content {
    padding: 0;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    color: black;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }