/* ================================================
   System Health Dashboard - system-health.css
   ================================================ */

/* Özet Kart */
.sh-summary-card {
    border: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.sh-summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}

/* Icon kutucukları */
.sh-icon-box {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sh-icon-primary {
    background-color: rgba(81, 86, 190, 0.12);
    color: #5156be;
}

.sh-icon-success {
    background-color: rgba(52, 195, 143, 0.12);
    color: #34c38f;
}

.sh-icon-danger {
    background-color: rgba(244, 106, 106, 0.12);
    color: #f46a6a;
}

.sh-icon-warning {
    background-color: rgba(241, 180, 76, 0.12);
    color: #f1b44c;
}

/* Servis Kartları */
.sh-service-card {
    border: none;
    border-left: 4px solid transparent;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.sh-service-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}

.sh-service-healthy {
    border-left-color: #34c38f;
}

.sh-service-degraded {
    border-left-color: #f1b44c;
}

.sh-service-unhealthy {
    border-left-color: #f46a6a;
}

/* Pulse animasyonu - Yeşil */
.sh-pulse-green {
    position: relative;
}

.sh-pulse-green::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background-color: rgba(52, 195, 143, 0.5);
    animation: sh-pulse 2s ease-out infinite;
}

/* Pulse animasyonu - Kırmızı */
.sh-pulse-red {
    position: relative;
}

.sh-pulse-red::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background-color: rgba(244, 106, 106, 0.5);
    animation: sh-pulse 1.5s ease-out infinite;
}

@keyframes sh-pulse {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(1.6); opacity: 0; }
}

/* Responsive */
@media (max-width: 768px) {
    .sh-service-card {
        margin-bottom: 12px;
    }
}