:root {
    --text-color: #243142;
    --link-color: #006298;
    --link-hover-color: #00385f;
    --link-bg-color: #edfafd;
    --active-element-color: #990000;
    --active-element-bg-color: #fff3f0;
    --header-logo-bg-color: transparent;
    --footer-bg-color: #990000;
    --footer-text-color: #fff;
}

#app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

h1:focus {
    outline: none;
}

/* The skip link moves focus to <main id="main-content" tabindex="-1">. The landmark
   itself needs no ring (the next Tab shows one on a real control), same as h1:focus. */
main#main-content:focus {
    outline: none;
}

/* TEMP-RIVET: RivetBlazor shows the searchable-select focus ring by toggling a server-side
   class (.search-field-group-focused) from the input's @onfocus, so over a Blazor Server
   circuit the ring lags the real focus. Draw the same ring with pure CSS :focus-within so it
   appears instantly around the whole control (input plus the clear/expander buttons). Scoped to
   the group div (.search-field.rvt-input-group), not the inner input — Rivet suppresses the
   input's own ring on purpose. Remove when RivetBlazor rings the group via CSS
   (see STRY0016325 / RivetBlazor a11y stories). */
.search-field.rvt-input-group:focus-within {
    box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #006298;
    border-radius: .25rem;
}

/* TEMP-RIVET: Rivet also sets input.search-field:focus { box-shadow: none !important }, which
   kills the ring on the RivetPager filter box (input#search.search-field), whose group is a plain
   .rvt-input-group — not the .search-field.rvt-input-group searchable-select group ringed above —
   so the :focus-within rule doesn't reach it. Restore a keyboard ring on the input, then cancel it
   inside the searchable-select group where the group ring already handles it (keeps those dropdowns
   to a single ring, no partial inner border).
   Remove when RivetBlazor rings the filter box via CSS (see STRY0016325 / RivetBlazor a11y stories). */
input.search-field:focus-visible {
    box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #006298 !important;
    border-radius: .25rem;
}
.search-field.rvt-input-group input.search-field:focus-visible {
    box-shadow: none !important;
}

/* TEMP-RIVET: like the searchable select, RivetBlazor shows the file field's focus ring by
   toggling a server-side class (.file-field-focused) from the input's focus, so over a Blazor
   Server circuit the ring lags the real focus — and Rivet suppresses the label's own outline on
   purpose (label.rvt-file-field:focus { outline: none }). Draw the same ring with pure CSS
   :focus-within on the container so it appears instantly around the whole control (file button
   + clear button). Remove when RivetBlazor rings the container via CSS
   (see STRY0016325 / RivetBlazor a11y stories). */
.rvt-file-field-container:focus-within {
    box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #006298;
    border-radius: .25rem;
}

/* TEMP-RIVET: rivet-searchable-components.css sets
   .search-field-selected { background-color: #5286c0 !important } on the currently-selected
   result row; its white text is 3.8:1, below WCAG 1.4.3 AA (4.5:1). Override to Rivet link
   blue (#006298, 6.56:1 with the white text Rivet already sets). Affects the Related Titles,
   Category, and Publisher search fields on title edit.
   Remove when RivetBlazor ships the fix (see STRY0016326 / RivetBlazor a11y stories). */
.search-field-selected {
    background-color: #006298 !important;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.no-text-decoration {
    text-decoration: none;
}

.text-capitalize {
    text-transform: capitalize;
}

div.super-header {
    background-color: var(--active-element-color);
    color: white;
    letter-spacing: 1px;
}

.content-preview {
    border: 1px solid #75838f;
    border-radius: .25rem;
    height: 2.5rem;
    min-width: 2.5rem;
    max-width: 10rem;
    object-fit: contain;
    padding: 4px;
    background-image: linear-gradient(45deg, #ccc 26%, transparent 26%), linear-gradient(135deg, #ccc 26%, transparent 26%), linear-gradient(45deg, transparent 75%, #ccc 75%), linear-gradient(135deg, transparent 75%, #ccc 75%);
    background-size: 20px 20px; /* Must be a square */
    background-position: 0 0, 10px 0, 10px -10px, 0px 10px; /* Must be half of one side of the square */
}

.color-preview {
    height: 2.5rem;
    width: 4.5rem;
    border: 1px solid #75838f;
    border-radius: .25rem;
    background-image: linear-gradient(45deg, #ccc 26%, transparent 26%), linear-gradient(135deg, #ccc 26%, transparent 26%), linear-gradient(45deg, transparent 75%, #ccc 75%), linear-gradient(135deg, transparent 75%, #ccc 75%);
    background-size: 20px 20px; /* Must be a square */
    background-position: 0 0, 10px 0, 10px -10px, 0px 10px; /* Must be half of one side of the square */
}

.footer-content-left {
    justify-content: start !important;
}

.footer-content-center {
    justify-content: center !important;
}

.footer-content-right {
    justify-content: right !important;
}

@media screen and (min-width: 46.25em) {
    .right-footer-border {
        padding-right: 1rem;
        border-right: solid 1px var(--footer-text-color)
    }

    .left-footer-border {
        padding-left: 1rem;
        border-left: solid 1px var(--footer-text-color)
    }
}

rvt-icon.ts-14 {
    padding-bottom: 2px;
}

    rvt-icon.ts-14 > svg {
        transform: scale(.75);
    }

.rvt-switch[disabled] {
    background-color: #e2e7e9;
    border-color: #75838f;
    cursor: not-allowed;
    color: #545454;
}

.rvt-switch[aria-checked=true][disabled]::after {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23545454" viewBox="0 0 16 16"><path d="m14.914 4-9.47 9.47L1.09 8.393 2.608 7.09l2.948 3.44L13.5 2.585 14.914 4Z"></path></svg>');
}

.rvt-button.platform-button {
    justify-content: center;
}

div.platform-buttons > a:last-of-type {
    margin-right: 0 !important;
}

/* header-only side menu sections (e.g. a catalog platform with no active
   categories, which has no child links) render as a standalone label rather
   than a nav, and need explicit vertical space before the nav below them */
#section-nav .side-menu-header-link {
    margin-bottom: var(--rvt-spacing-md);
}

span.highlight-text {
    background-color: var(--link-bg-color);
    border-radius: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    font-weight: 500;
    color: var(--link-hover-color);
}

.rvt-loader.gray-spinner {
    border-top-color: #75838f;
    border-right-color: #75838f;
    border-bottom-color: #75838f;
}

.standard-control-border-color {
    border-color: #75838f !important;
}

.standard-text-color {
    color: var(--text-color) !important;
}

a.rvt-button.disable-link-button, a.rvt-button.disable-link-button:hover {
    background-color: #f8f9fa;
    color: #4c5a69;
    border-color: #75838f;
    cursor: not-allowed;
    pointer-events: none;
    cursor: not-allowed;
}

h2.catalog-section-header {
    font-size: 1.25rem;
    padding-bottom: .75rem;
}

p.catalog-section-content, p.catalog-button {
    --flow-space: 1rem;
}

    p.catalog-button:nth-child(1 of p.catalog-button) {
        --flow-space: 1.5rem;
    }

/* Catalog download/link and package buttons must reflow at 320px (WCAG 1.4.10): allow a
   long deliverable or package name to wrap instead of forcing the button (and the page)
   wider than the viewport. overflow-wrap is inherited, so it reaches the inner label span.
   Rivet's button has a fixed height and no vertical padding, so add padding-block (and a
   little line-height) to keep wrapped labels from sitting edge-to-edge; min-height keeps
   single-line buttons at their usual 2.5rem. */
.catalog-button .rvt-button {
    height: auto;
    min-height: 2.5rem;
    padding-block: .5rem;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
    text-align: left;
}

p.extra-top-spacing:nth-child(1 of p.extra-top-spacing) {
    --flow-space: 2rem;
}

p.product-key-value-container {
    --flow-space: 1rem;
    /* the key value and assigned date read as one joined field: stretch so they share a
       height (staying a closed box when the key wraps), while the actions group keeps its
       own size. On narrow screens this flips to a stack (see the media query below). */
    align-items: stretch;
}

/* the clear/show buttons don't stretch to the field's height; they sit at the top of the row */
.product-key-action {
    align-self: flex-start;
}

/* the button text labels are shown only on narrow screens (icon-only otherwise) */
.product-key-action .action-label {
    display: none;
}

    p.product-key-value-container:nth-child(1 of p.product-key-value-container) {
        --flow-space: 1.5rem;
    }

div.product-key-field {
    /* center a single line and clamp it to the action buttons' height; the box grows only
       when the key actually wraps to more than one line (reduced padding + a set line-height
       keep a single line within 2.5rem so it lines up with the buttons). */
    display: flex;
    align-items: center;
    min-height: 2.5rem;
    line-height: 1.25;
    padding-top: .25rem;
    padding-bottom: .25rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: #e2e7e9;
    border-color: #75838f;
    border: solid 1px;
    border-radius: 0.25rem;
}

div.product-key-value {
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    /* a long key wraps to multiple lines (the markup drops rvt-text-nobr) so the full
       value stays visible and in the a11y tree; the box grows taller instead of forcing
       horizontal scroll (WCAG 1.4.10). The min-width is a floor: without it, overflow-wrap
       "anywhere" lets the box collapse to one character per line ("confetti") at very narrow
       widths. 6rem keeps the key wrapping in readable chunks and still fits within 320px
       alongside the date and the clear/show buttons. */
    overflow-wrap: anywhere;
    min-width: 6rem;
}

div.product-key-assigned {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    /* grows with min-height from .product-key-field; stretches (container align-items) to
       match the key box so the joined field stays closed when the key wraps */
}

/* On narrow screens the key, date, and buttons can't sit side by side without crushing the
   key, so stack them full-width (WCAG 1.4.10 reflow): key value, then assigned date, then the
   clear and show buttons. Restore the key and date borders/corners that are dropped to join
   them horizontally so each reads as a standalone box. */
@media (max-width: 30rem) {
    p.product-key-value-container {
        flex-direction: column;
        row-gap: .5rem;
        /* clearer separation between stacked keys than between the rows within one key */
        --flow-space: 2rem;
    }

    .product-key-action {
        align-self: stretch;              /* full-width buttons */
        margin-left: 0 !important;        /* drop the inline-row gap (Rivet's rvt-m-left-xs is !important) */
    }

    .product-key-action .action-label {
        display: inline;
    }

    div.product-key-value {
        border-right: solid 1px #75838f;
        border-radius: 0.25rem;
    }

    div.product-key-assigned {
        border-radius: 0.25rem;
    }
}

th.expand, td.expand {
    width: 30%
}

table.dont-wrap td, table.dont-wrap th {
    text-wrap: nowrap;
}

/* Per-cell opt-out of dont-wrap for long, flexible values (revealed key values,
   emails, urls, user-entered names and labels) so they wrap instead of forcing
   the table wider than the page. overflow-wrap lets unbroken tokens like emails
   and urls break mid-value as a last resort. The min-width is a floor for the
   column when the table is squeezed: without it, "anywhere" reduces the column's
   minimum width to a single character and narrow screens crush the wrapped cells
   to confetti. At the floor the table stops shrinking, so the pager's horizontal
   scroll region takes over instead. */
table.dont-wrap td.allow-wrap, table.dont-wrap th.allow-wrap {
    text-wrap: wrap;
    overflow-wrap: anywhere;
    min-width: 10rem;
}

/* Smaller wrap floor for dense tables (many columns) where the 10rem allow-wrap
   floor would push the table past a laptop viewport. Still wraps with a usable
   minimum so cells don't crush to a single character. */
table.dont-wrap td.allow-wrap-sm, table.dont-wrap th.allow-wrap-sm {
    text-wrap: wrap;
    overflow-wrap: anywhere;
    min-width: 6rem;
}

/* Wrap floor for a column of UPNs / emails: a typical address (bmoberly@iu.edu,
   16 chars or fewer) must never wrap, so the floor is 17 characters; longer
   addresses (umail / departmental) wrap only when the table is squeezed. ch
   units track the user's text size, so zoomed text wraps instead of overflowing.
   A screen reader still announces the address as one string. */
table.dont-wrap td.allow-wrap-upn, table.dont-wrap th.allow-wrap-upn {
    text-wrap: wrap;
    overflow-wrap: anywhere;
    min-width: 17ch;
}

table.align-top td, table.align-top th {
    vertical-align: top;
}

/* The row action button is a 2.5rem tall tap target (target-size), so its focus ring
   hugs the whole button. Center the action column's cell vertically so the centred
   icon sits mid-row and the ring hugs it, while the text columns stay top-aligned.
   The first column is always the action column in these report tables. */
table.align-top td:first-child {
    vertical-align: middle;
}

/* Fieldsets refuse to shrink below their content's natural width by default
   (min-inline-size: min-content), which defeats any horizontal scroll container
   inside them, e.g. the pager's responsive table region on ListProductKeys. */
fieldset.allow-shrink {
    min-inline-size: 0;
}

textarea.extra-height {
    height: 14rem;
}

.rvt-link-hub__link.featured-title-link {
    padding-top: 0;
}

    .rvt-link-hub__link.featured-title-link:after {
        top: .25rem;
    }

.featured-title-thumbnail {
    height: 4rem;
    width: 4rem;
    margin-right: 1.25rem;
}

.featured-titles-link-hub {
    grid-gap: 1rem 2rem;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
}

div.search-description p:first-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.url-entry:after {
    content: ",";
    padding-right: .5rem;
}

.url-entry:first-of-type:before {
    content: "(";
    padding-left: .5rem;
}

.url-entry:last-of-type:after {
    content: ")";
}

.limit-height {
    overflow: hidden;
    max-height: 7.5rem;
}

.fade-overflow {
    -webkit-mask-image: linear-gradient(180deg, #000 85%, transparent);
}

@media screen and (min-width: 67.5em) {
    .rvt-header-global__search.extra-wide {
        width: 25rem;
    }
}

button.signin-button {
    background-color: transparent;
    border: none;
    cursor: pointer;
}

button.search-result {
    display: block;
    text-decoration: none;
    color: #243142;
    padding: .375rem .5rem;
    background-color: transparent;
    border: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
}

    button.search-result[aria-selected="true"] {
        background-color: #006298 !important;
        color: #fff !important;
        text-decoration: none;
    }

    button.search-result:focus {
        background-color: #006298 !important;
        color: #fff !important;
        text-decoration: none;
    }

    /* Replace the browser-default focus outline (a dark border that reads oddly over the
       #006298 focused row) with an explicit, instant on-brand ring. :focus already paints
       the row #006298, so a white inset outline reads crisply against it (6.56:1). */
    button.search-result:focus-visible {
        outline: 0.125rem solid #fff;
        outline-offset: -0.125rem;
    }

    button.search-result:hover {
        background-color: #edfafd;
        color: #006298;
        text-decoration: none;
    }

/* SearchAutocomplete container: positioned so the popover result list below anchors to it
   without relying on RivetBlazor's enable-outside-click-detection rule to do so. */
.search-autocomplete {
    position: relative;
}

/* SearchAutocomplete results when PopoverResults is on: float over the content below
   the input (styled after .rvt-dropdown__menu) instead of pushing it down. */
.search-autocomplete__results--popover {
    position: absolute;
    left: 0;
    right: 0;
    margin-top: 0.25rem;
    padding: 0.5rem 0;
    background-color: #ffffff;
    border-radius: 0.25rem;
    box-shadow: 0 0.25rem 0.5rem rgba(36, 49, 66, 0.16);
    max-height: 20rem;
    overflow-y: auto;
}

.rvt-header-global__search[aria-hidden="true"] {
    display: none;
}

/* override rivet blazor's position variable for search box */
.rvt-header-global__search.enable-outside-click-detection {
    position: absolute;
}

/* if top banners are visible, then reduce padding between banner element and layout content  */
.rvt-header-global:has(.top-banner-container) ~ .rvt-layout__wrapper .rvt-layout__content.reduce-top-padding-when-banners-present {
    padding-top: 1rem !important;
}

/* if top banners are visible, then reduce padding between banner element and sidebar content  */
.rvt-header-global:has(.top-banner-container) ~ .rvt-layout__wrapper .rvt-layout__sidebar.reduce-top-padding-when-banners-present {
    padding-top: 1rem !important;
}

.top-banner {
    padding-top: 0;
    padding-bottom: 0;
}

@media screen and (min-width: 46.25em) {
    .top-banner:last-of-type {
        margin-bottom: 1.5rem;
    }
}

.top-banner-container:first-of-type{
    padding-top: 1.5rem;
}

.top-banner-container > .rvt-alert {
    margin-bottom: 1.5rem;
}

.top-banner-container > .rvt-alert:last-of-type {
    margin-bottom: 0;
}

.sidenav_disabled {
    font-size: 0.875rem;
    color: var(--text-color);
    flex-grow: 1;
    padding-top: 0.5rem;
    padding-right: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    position: relative;
    text-decoration: none;
    opacity: .75;
    cursor: not-allowed
}

/* Rivet sizes inline code at a flat 1rem (.rvt-code, .rvt-prose :where(code)), which is
   taller than the surrounding prose text and stretches the line height; size it to the
   text instead. The :where() in Rivet's selector carries no specificity, so this wins. */
.rvt-prose code {
    font-size: .875em;
}

/* Audit history (RecordHistory) must reflow at 320px (WCAG 1.4.10): let long audited
   values in <code> (HTML fragments, hashes, URLs) break instead of forcing horizontal
   scroll, and let each entry's header row (operation heading + "updated by") wrap when
   it can't fit on one line. */
.rvt-timeline code {
    overflow-wrap: anywhere;
}

.rvt-timeline__content > .rvt-flex {
    flex-wrap: wrap;
}

code.has-icon {
    display: inline-flex;
    align-items: center;
}

    code.has-icon > rvt-icon {
        margin-right: .25rem;
        margin-left: .25rem;
        line-height: 1;
    }

        /* size the icon to the surrounding code text so it doesn't stretch the line height */
        code.has-icon > rvt-icon > svg {
            width: .875em;
            height: .875em;
            display: block;
        }

/* Distribution Summary action buttons must reflow at 320px (WCAG 1.4.10): wrap the
   Generate / Download / Cancel row instead of overflowing the viewport. */
.report-button-row {
    flex-wrap: wrap;
}

.appear-disabled-when-read-only:read-only {
    background-color: #e2e7e9;
    border-color: #75838f;
}

/* Field help text comes from RivetBlazor's Description component, which renders a
   standalone inline alert with no class hook of its own -- the message span's id
   suffix is the only stable selector.

   Rivet's inline alert is built for validation messages, so it leads with a
   decorative caution icon and sets line-height: 1 on the message. Neither suits
   always-visible help text: hide the icon (the background and left border already
   read as informational) and give the text room to wrap. Font size and padding stay
   at Rivet's defaults so help text stays subordinate to the field it describes.
   Remove once RivetBlazor styles Description as help text rather than an alert. */
.rvt-inline-alert:has(> .rvt-inline-alert__message[id$="-description-message"]) .rvt-inline-alert__icon {
    display: none;
}

.rvt-inline-alert__message[id$="-description-message"] {
    margin-left: 0;
    line-height: var(--rvt-line-height-base);
}

a {
    text-underline-offset: .25rem;
}

.rvt-button-group.tight > *:not(:last-child) {
    margin-right: .5rem;
}

.has-accessibility-issue {
    box-shadow: 0 0 15px 2px #ffaa00;
    animation: accessibility-issue-pulse 2s ease-in-out 2;
}

@keyframes accessibility-issue-pulse {
    0% {
        box-shadow: 0 0 15px 2px #ffaa00;
    }

    50% {
        box-shadow: 0 0 0 0 #ffaa00;
    }

    100% {
        box-shadow: 0 0 15px 2px #ffaa00;
    }
}

rvt-icon.smaller > svg {
    width: 14px;
    height: 14px;
}

.rvt-disclosure__toggle.smaller {
    padding-left: 1.25rem;
}

    .rvt-disclosure__toggle.smaller:before {
        width: .85rem;
        height: .85rem;
    }

.rvt-badge.smaller {
    border: none;
}

.accessibility-node-text {
    max-width: 500px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.no-bottom-margin-for-last-item:last-of-type {
    margin-bottom: 0 !important;
}