:root { color-scheme: dark; }

/* Card surfaces */
.component-container,
#uptime-tooltip .tooltip-box,
div[id^="updates-dropdown"] .updates-dropdown-section {
  background-color: #111822 !important;
  border-color: #26313F !important;
}

/* Buttons inherit the link colour as a FILL — force dark text */
.btn, .btn-default, .btn-primary, a.button, .subscribe-btn {
  color: #04121A !important;
  font-weight: 600 !important;
  letter-spacing: .08em;
}

/* Bright status fills require dark text */
.page-status .status,
.update-title.impact-critical a,
.update-title.impact-major a,
.update-title.impact-minor a,
.update-title.impact-maintenance a,
.unresolved-incident:not(.impact-none) .incident-title,
.unresolved-incident:not(.impact-none) .incident-title a {
  color: #04121A !important;
}

/* Form controls */
input, select, textarea {
  background-color: #0B1219 !important;
  border-color: #26313F !important;
  color: #E7F2F8 !important;
}
input::placeholder, textarea::placeholder { color: #6D7A88 !important; }
input:focus, select:focus, textarea:focus {
  border-color: #02E5FF !important;
  box-shadow: 0 0 0 3px rgba(2,229,255,.20) !important;
  outline: none !important;
}

/* Hairlines between components — softer than the box border */
.component-container + .component-container,
.components-section .component-inner-container {
  border-top-color: #1B2430 !important;
}

.btn-default,
.btn-default *,
.btn-subscribe,
.btn-subscribe *,
.subscribe-text,
.subscribe-text-mobile,
.subscribe-text-full,
[data-js-hook="subscribe-button"],
[data-js-hook="subscribe-button"] * {
  color: #04121A !important;
  fill: #04121A !important;
  font-weight: 600 !important;
}

/* 2b — outline instead. Use INSTEAD of the block above. */
.btn-default,
.subscribe-text-full,
.btn-subscribe,
[data-js-hook="subscribe-button"] {
  background-color: rgba(2,229,255,.08) !important;
  border: 1px solid rgba(2,229,255,.5) !important;
  box-shadow: none !important;
}
.btn-default, .btn-default *,
.btn-subscribe, .btn-subscribe *,
[data-js-hook="subscribe-button"],
[data-js-hook="subscribe-button"] * {
  color: #02E5FF !important;
  fill: #02E5FF !important;
}

span.subscribe-text-full {
    color: #0a0f14;
}