/* This rail reserves the same two pixels before, during and after a request. */
:root { --popup-content-gap: 1rem; }
.has-loading-rail, .popover-heading, .deck-search-heading { position: relative; }
.card-actions-dialog-bar:not(.has-loading-rail)::after,
.deck-search-heading:not(.has-loading-rail)::after,
.popover-heading:not(.has-loading-rail)::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 2px;
    background: var(--line-strong, #727780);
    pointer-events: none;
}
.loading-rail-container { position: absolute; inset: auto 0 0; height: 2px; pointer-events: none; }
.loading-rail { --loading-segment-width: clamp(4rem, 12vw, 6rem); position: relative; width: 100%; height: 2px; overflow: hidden; background: var(--line-strong, #727780); }
.loading-rail-segment { position: absolute; top: 0; left: calc(-1 * var(--loading-segment-width)); display: flex; width: var(--loading-segment-width); height: 2px; opacity: 0; }
.loading-rail-color { flex: 1 1 20%; height: 100%; }
.loading-rail-white { background: #e8ddb2; }
.loading-rail-blue { background: #579bcc; }
.loading-rail-black { background: #6f657c; }
.loading-rail-red { background: #d56858; }
.loading-rail-green { background: #6caa7b; }
.loading-rail[data-loading-state="active"] .loading-rail-segment { opacity: 1; animation: magic-loading-pass 1.6s linear infinite; }
.loading-rail[data-loading-state="error"] { background: var(--red-500, #bc4545); pointer-events: auto; }
.site-header { border-bottom: 0; }
.site-header > .loading-rail-container { bottom: 0; }
.card-actions-dialog-bar { border-bottom: 0; }
.card-actions-dialog-body { padding-top: var(--popup-content-gap); }
.card-actions-dialog [data-card-printing-search] { margin-top: 0 !important; }
.popover-card > .form-stack { row-gap: var(--popup-content-gap); }
.popover-heading { padding-bottom: .75rem; }
#deck-search-dialog .deck-search-heading > .loading-rail-container {
    left: calc(-1 * var(--deck-search-inline-padding, 1rem));
    right: calc(-1 * var(--deck-search-inline-padding, 1rem));
}
#deck-search-dialog .deck-search-heading:not(.has-loading-rail)::after {
    left: calc(-1 * var(--deck-search-inline-padding, 1rem));
    right: calc(-1 * var(--deck-search-inline-padding, 1rem));
}

@keyframes magic-loading-pass {
    from { left: calc(-1 * var(--loading-segment-width)); }
    to { left: 100%; }
}

@media (max-width: 40rem) {
    :root { --popup-content-gap: .85rem; }
}

@media (prefers-reduced-motion: reduce) {
    .loading-rail[data-loading-state="active"] .loading-rail-segment { left: 0; animation: none; }
}

@media (forced-colors: active) {
    .loading-rail { background: GrayText; }
    .loading-rail[data-loading-state="active"] .loading-rail-color { background: Highlight; }
    .loading-rail[data-loading-state="error"] { background: LinkText; }
}