/* Light Theme Styles */
:root {
  --brand: #f7981d;
}

body {
  background: #ffffff;
  color: #222;
}

.navbar, .footer {
  background: #fff;
  border-bottom: 1px solid #eee;
}

.navbar .navbar-brand span {
  color: #000;
}

.badge-status {
  font-weight: 600;
  letter-spacing: .2px;
}

.badge-up { background-color: #198754 !important; }
.badge-degraded { background-color: #ffc107 !important; color: #111 !important; }
.badge-down { background-color: #dc3545 !important; }
.badge-maintenance { background-color: var(--brand) !important; color: #111 !important; }

.card {
  background: #fff;
  border: 1px solid #eee;
  box-shadow: 0 8px 18px rgba(0,0,0,.05);
}

a { color: var(--brand); text-decoration: none; }
a:hover { color: #e2860a; }

.btn-brand {
  background: var(--brand);
  border: none;
  color: #fff;
  font-weight: 600;
}
.btn-brand:hover { filter: brightness(1.1); color:#fff; }

.brand-accent {
  width: 100px; height: 100px;
  background: conic-gradient(from 270deg, var(--brand) 0 80%, transparent 80% 100%);
  border-radius: 50%;
  position: absolute; right: -30px; top: -30px; opacity: .15;
}

.hero {
  position: relative; overflow: hidden;
  border: 1px solid #eee; border-radius: 1rem;
  background: #fff;
}
.hero h1 { font-weight: 800; color: #000; }

.text-secondary { color: #666 !important; }
.footer { border-top: 1px solid #eee; }