:root{--primary-color: #4361ee;--secondary-color: #3f37c9;--bg-color: #f8f9fa;--sidebar-width: 280px}body{background-color:var(--bg-color);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.dashboard-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:#fff;border-right:1px solid #e9ecef;position:fixed;height:100vh;padding:1.5rem;z-index:100}.main-content{flex:1;margin-left:var(--sidebar-width);padding:2rem}.stat-card{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 2px 12px #0000000a;transition:transform .2s;border:none;height:100%}.monitor-card{background:#fff;border-radius:12px;border:1px solid #edf2f7;padding:.75rem 1rem;margin-bottom:.5rem;transition:all .2s}@keyframes pulse-green{0%{box-shadow:0 0 #4caf50b3}70%{box-shadow:0 0 0 6px #4caf5000}to{box-shadow:0 0 #4caf5000}}@keyframes pulse-warning{0%{box-shadow:0 0 #ffc107b3}70%{box-shadow:0 0 0 6px #ffc10700}to{box-shadow:0 0 #ffc10700}}.live-indicator{width:10px;height:10px;border-radius:50%;display:inline-block}.live-indicator.active{background-color:#198754;animation:pulse-green 2s infinite}.live-indicator.delayed{background-color:#ffc107;animation:pulse-warning 2s infinite}.stat-icon{width:44px;height:44px;flex-shrink:0}.stat-card{transition:transform .15s ease,box-shadow .15s ease;border-left:3px solid transparent}.stat-card:hover{transform:translateY(-2px)}.stat-card.accent-primary{border-left-color:#0d6efd;background:linear-gradient(135deg,#0d6efd0d,#fff 65%)}.stat-card.accent-success{border-left-color:#198754;background:linear-gradient(135deg,#1987540d,#fff 65%)}.stat-card.accent-danger{border-left-color:#dc3545;background:linear-gradient(135deg,#dc35450d,#fff 65%)}.stat-card.accent-warning{border-left-color:#ffc107;background:linear-gradient(135deg,#ffc10714,#fff 65%)}.stat-card.accent-info{border-left-color:#0dcaf0;background:linear-gradient(135deg,#0dcaf00f,#fff 65%)}.uptime-ring-wrap{display:flex;flex-direction:column;align-items:center;gap:.5rem}.uptime-ring-value{font-size:1.1rem;font-weight:700}.filter-pills{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;background-color:#eef1f5;border-radius:50rem}.filter-pill{display:inline-flex;align-items:center;gap:.4rem;border:none;background:transparent;color:#6c757d;font-size:.9rem;font-weight:600;padding:.45rem 1rem;border-radius:50rem;transition:color .15s ease,background-color .15s ease,box-shadow .15s ease}.filter-pill:hover:not(.active){color:#495057;background-color:#fff9}.filter-pill.active{background:linear-gradient(135deg,#0d6efd,#3b82f6);color:#fff;box-shadow:0 2px 6px #0d6efd59}.filter-pills-sm{padding:3px}.filter-pills-sm .filter-pill{padding:.3rem .75rem;font-size:.8rem}.filter-pills-sm .filter-pill.active{box-shadow:0 2px 5px #0d6efd4d}.badge-pill-soft{padding:.4rem .85rem;border-radius:50rem;font-weight:600;font-size:.75rem;background-color:#6c757d1f;color:#495057}.status-banner{border-radius:1rem;box-shadow:0 6px 16px #00000014}.status-banner.status-success{background:linear-gradient(135deg,#198754,#20c997)}.status-banner.status-danger{background:linear-gradient(135deg,#dc3545,#f4623a)}.status-banner-icon{width:44px;height:44px;background-color:#ffffff38}.monitor-row{border:none;border-left:3px solid transparent;border-radius:.75rem!important;transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease;margin-bottom:.5rem}.monitor-row:hover{transform:translate(2px);background-color:#f8f9fb}.monitor-row.row-down{border-left-color:#dc3545}.monitor-row.row-up{border-left-color:#198754}.monitor-row.row-paused{border-left-color:#ffc107}.stat-pill-warning{background-color:#ffc1072e;color:#997404}.stat-value{font-size:1.75rem;line-height:1.2}.stat-icon-sm{width:28px;height:28px;flex-shrink:0}.stat-value-lg{font-size:2.75rem;line-height:1.1}.stat-pill{display:inline-block;padding:.2em .55em;border-radius:50rem;font-size:.8rem;font-weight:600}.stat-pill-lg{padding:.25em .6em;font-size:1.15rem;font-weight:700}.stat-pill-success{background-color:#19875426;color:#146c43}.stat-pill-danger{background-color:#dc354526;color:#b02a37}.monitor-card:hover{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border-color:#cbd5e0}.status-badge{padding:.35em .8em;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-up{background-color:#d1fae5;color:#065f46}.status-down{background-color:#fee2e2;color:#991b1b}.metric-box{background:#f8fafc;border-radius:6px;padding:.35rem .5rem;text-align:center}.metric-label{font-size:.65rem;color:#64748b;margin-bottom:0;display:block;white-space:nowrap}.metric-value{font-size:.8rem;font-weight:600;color:#334155}.score-high{color:#059669}.score-mid{color:#d97706}.score-low{color:#dc2626}.btn-primary{background-color:var(--primary-color);border-color:var(--primary-color)}.monitor-detail-modal .modal-content{border-radius:16px;border:none;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.monitor-detail-modal .nav-tabs .nav-link{color:#64748b;border:none;border-bottom:2px solid transparent;padding:.75rem 1rem;font-weight:500}.monitor-detail-modal .nav-tabs .nav-link.active{color:var(--primary-color);border-bottom-color:var(--primary-color);background:transparent}@media (max-width: 768px){.sidebar{transform:translate(-100%);transition:transform .3s ease-in-out;z-index:1050;box-shadow:4px 0 10px #0000001a}.sidebar.show{transform:translate(0)}.main-content{margin-left:0;padding:5rem 1rem 1rem}.monitor-card .col-md-4,.monitor-card .col-md-6,.monitor-card .col-md-2{margin-bottom:1rem;text-align:left!important}.monitor-card .col-md-2{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #f1f5f9;padding-top:.5rem;margin-top:.5rem}}
