:root {
  --cce-red: #6f1d24;
  --cce-red-dark: #57161c;
  --cce-grey: #3f3f41;
  --bs-primary: var(--cce-red);
  --bs-primary-rgb: 111, 29, 36;
  --bs-link-color: var(--cce-red);
  --bs-link-color-rgb: 111, 29, 36;
  --bs-link-hover-color: var(--cce-red-dark);
  --bs-link-hover-color-rgb: 87, 22, 28;
  --bs-body-bg: #f5f5f4;
  --bs-body-color: #26262a;
}
body { min-height: 100vh; }
.navbar-cce { background: #fff; border-bottom: 3px solid var(--cce-red); }
.navbar-cce .navbar-brand { color: var(--cce-grey); font-weight: 600; letter-spacing: .01em; }
.navbar-cce .navbar-brand img { height: 40px; width: 40px; }
.navbar-cce .nav-link { color: var(--cce-grey); font-weight: 500; }
.navbar-cce .nav-link.active { color: var(--cce-red); box-shadow: inset 0 -2px 0 var(--cce-red); }
.btn-primary {
  --bs-btn-bg: var(--cce-red); --bs-btn-border-color: var(--cce-red);
  --bs-btn-hover-bg: var(--cce-red-dark); --bs-btn-hover-border-color: var(--cce-red-dark);
  --bs-btn-active-bg: var(--cce-red-dark); --bs-btn-active-border-color: var(--cce-red-dark);
  --bs-btn-disabled-bg: var(--cce-red); --bs-btn-disabled-border-color: var(--cce-red);
}
.btn-outline-primary {
  --bs-btn-color: var(--cce-red); --bs-btn-border-color: var(--cce-red);
  --bs-btn-hover-bg: var(--cce-red); --bs-btn-hover-border-color: var(--cce-red);
  --bs-btn-active-bg: var(--cce-red); --bs-btn-active-border-color: var(--cce-red);
}
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: #b98a8e; box-shadow: 0 0 0 .2rem rgba(111, 29, 36, .15);
}
.form-check-input:checked { background-color: var(--cce-red); border-color: var(--cce-red); }
.nav-tabs .nav-link { color: var(--cce-grey); }
.nav-tabs .nav-link.active { color: var(--cce-red); font-weight: 600; }
.card { border: 1px solid #e3e2e0; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.server-card .card-title a { color: inherit; text-decoration: none; }
.server-card .card-title a:hover { color: var(--cce-red); }
.status-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .35rem; background: #adb5bd; }
.status-running .status-dot { background: #2e9d5b; }
.status-error .status-dot { background: #c9302c; }
.status-stopped .status-dot, .status-new .status-dot { background: #9a9a9a; }
.status-label { font-weight: 600; font-size: .875rem; white-space: nowrap; }
.stat { font-size: .8rem; color: #6c6c70; }
.stat strong { display: block; font-size: 1rem; color: var(--bs-body-color); font-variant-numeric: tabular-nums; }
.usage { min-width: 7rem; }
.usage .progress { height: .4rem; }
.usage small { font-variant-numeric: tabular-nums; }
.job-log {
  background: #1e1e20; color: #e6e6e6; padding: 1rem; border-radius: .5rem;
  font-size: .8rem; max-height: 65vh; overflow: auto; white-space: pre-wrap; word-break: break-word;
}
.table > :not(caption) > * > * { vertical-align: middle; }
.table-responsive { overflow-x: auto; }
.section-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: #6c6c70; font-weight: 600; }
.login-wrap { max-width: 24rem; }
.login-wrap img { width: 220px; }
.recreate-note { font-size: .75rem; color: var(--cce-red); font-weight: 500; }
code { color: var(--cce-red-dark); }
.login-wrap img, .navbar-cce .navbar-brand img { mix-blend-mode: multiply; }
.usage small { white-space: nowrap; }
.progress { min-width: 3rem; }
