:root { --subtrack-footer-height: 32px; }
#subtrack-copyright-footer {
    position: relative;
    inset: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex: 0 0 auto;
    gap: 0 12px;
    box-sizing: border-box;
    width: 100%;
    height: var(--subtrack-footer-height);
    margin: 0;
    padding: 6px 12px;
    border: 0;
    border-top: 1px solid #dbe1e8;
    border-radius: 0;
    background: #f7f9fb;
    color: #5d6875;
    font: 11px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
    text-align: center;
    box-shadow: none;
    clear: both;
}
/* Reserve footer space in workspaces that size themselves to the viewport. */
@media screen {
    body > .app:has(.login-card) { height: calc(100dvh - var(--subtrack-footer-height)); }
    body > .screen:has(.channel_list) { height: calc(100dvh - var(--subtrack-footer-height)); }
    body:has(> #subtrack-copyright-footer):has(#listPane) > .container, body:has(.nav-tabs) > .container { max-height: calc(100dvh - 60px - var(--subtrack-footer-height)); }
}
@media(max-width:480px) {
    :root { --subtrack-footer-height: 48px; }
    #subtrack-copyright-footer { flex-direction: column; gap: 0; }
}
@media print { #subtrack-copyright-footer { display: none !important; } }

.subtrack-welcome-copyright { margin-top: 32px; padding: 12px; color: #5d6875; text-align: center; font: 11px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
#workspace > .empty:has(.subtrack-welcome-copyright) { min-height: 100%; display: flex; flex-direction: column; align-items: center; padding-bottom: 0; }
#workspace > .empty > .subtrack-welcome-copyright { margin-top: auto; padding-top: 32px; }
#mainContent > .subtrack-welcome-copyright { margin-top: 40vh; }
@media print { .subtrack-welcome-copyright { display: none !important; } }
