body {
    background: #f4f4f4;
    color: #333333;
    font-family: 'Georgia', serif;
}

header {
    background: #ffffff;
    border-bottom: 1px solid #cccccc;
}

.company-name {
    color: #222222;
}

.status-type {
    color: #555555;
}

.header-right {
    color: #777777;
}

.logo {
    background: #dddddd;
    color: #222222;
    border-radius: 4px;
}

footer {
    border-top: 1px solid #cccccc;
    color: #555555;
    background: #f9f9f9;
}

footer a {
    color: #1a73e8;
}

.hero h1 {
    color: #1a1a1a;
}

.hero p {
    color: #555555;
}

.hero-meta {
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

.meta-label {
    color: #777777;
}

.meta-value {
    color: #333333;
}

.section-title {
    color: #1a1a1a;
    border-bottom: 1px solid #cccccc;
}

.service {
    background: #ffffff;
    border: 1px solid #dddddd;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    border-radius: 6px;
}

.service:hover {
    background: #f0f0f0;
    border: 1px solid #1a73e8;
    transition: all 0.2s ease;
}

.service-info h3 {
    color: #222222;
}

.stat-row {
    border-bottom: 1px dashed #cccccc;
}

.stat-label {
    color: #555555;
}

.stat-value {
    color: #333333;
}

.uptime-percentage {
    color: #1a73e8;
}

.uptime-label {
    color: #777777;
}

.badge-operational {
    background: #e6f4ea;
    color: #2e7d32;
    border-radius: 4px;
}

.dot-up {
    background: #2e7d32;
}

.badge-degraded {
    background: #fff4e5;
    color: #f57c00;
    border-radius: 4px;
}

.dot-degraded {
    background: #f57c00;
}

.badge-outage {
    background: #fdecea;
    color: #d32f2f;
    border-radius: 4px;
}

.dot-down {
    background: #d32f2f;
}

.chart-container {
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 6px;
}
