/* Modern server monitoring block. Loaded after global.css. */
body.theme-modern .monitor-id {
    margin: 0 0 14px;
}
body.theme-modern .monitor-id:last-child {
    margin-bottom: 0;
}
body.theme-modern .monitor-id > .title {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-bottom: 7px;
    color: #d5dce7;
    font-size: 12px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
body.theme-modern .monitor-id > .title .icon-info-sign {
    flex: 0 0 auto;
    opacity: .6;
}
body.theme-modern .monitor-id > .progress {
    position: relative;
    width: 100%;
    height: 22px;
    margin: 0;
    overflow: hidden;
    background: #0a1018;
    background-image: none !important;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.18);
}
body.theme-modern .monitor-id > .progress > .bar {
    position: absolute;
    inset: 0 auto 0 0;
    height: 100%;
    min-width: 0;
    transform: none !important;
    background: linear-gradient(90deg, rgba(94,111,232,.78), rgba(126,143,255,.92));
    background-image: linear-gradient(90deg, rgba(94,111,232,.78), rgba(126,143,255,.92)) !important;
    background-position: 0 0 !important;
    background-size: 100% 100% !important;
    border-radius: 7px;
    box-shadow: none;
    animation: none !important;
    transition: width .38s cubic-bezier(.22,.8,.26,1), background .2s ease;
}
body.theme-modern .monitor-id > .progress > .stats {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 0 8px;
    color: #e8edf7;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.75);
    pointer-events: none;
}
body.theme-modern .monitor-id > .progress.progress-danger > .bar {
    background: linear-gradient(90deg, rgba(190,55,72,.76), rgba(251,113,133,.88));
    background-image: linear-gradient(90deg, rgba(190,55,72,.76), rgba(251,113,133,.88)) !important;
}

/* Hard-disable Bootstrap 2 striped/active progress behavior if those legacy
   classes are injected by an old template or cached fragment. */
body.theme-modern .monitor-id > .progress.progress-striped,
body.theme-modern .monitor-id > .progress.active,
body.theme-modern .monitor-id > .progress.progress-striped > .bar,
body.theme-modern .monitor-id > .progress.active > .bar {
    animation: none !important;
    background-repeat: no-repeat !important;
}

@media (prefers-reduced-motion: reduce) {
    body.theme-modern .monitor-id > .progress > .bar {
        transition: none !important;
    }
}