/* Hide the uptime % text in the legend, month uptime figure, and the spacer between statuses.*/
.legend-item.legend-item-uptime-value,
.spacer,
.month-uptime {
  display: none;
}

/* "Back to Status Page" link (injected via footer JS on /incidents/* views) */
.centered-link {
  display: block;
  margin: 10px auto;
  text-align: center;
}

/* Product subtitle shown under the GoDaddy logo (injected via footer JS) */
.mwp-subtitle {
  clear: both;
  display: block;
  color: #00A4A6;
  font-weight: 700;
  font-size: 1.15rem;
  margin-top: 0.25rem;
  margin-bottom: 1rem;
  margin-left: 75px;
  text-align: left;
}

/* Underline links inside each component box */
.component-inner-container a:link,
.component-inner-container a:visited,
.component-inner-container a:hover,
.component-inner-container a:active {
  text-decoration: underline;
}

/* Remove Statuspage's default row dividers so each component becomes a standalone box */
.layout-content.status.status-index .components-section .components-container.two-columns .component-container,
.components-container.two-columns {
  border: none;
}

/* Render each component as a rounded, bordered box. */
.component-inner-container {
  border: 1px solid;
  border-radius: 3px;
  padding: 1.1rem 1.25rem 1rem;
}

/* Grey the +/- indicators on grouped components */
span[class^="fa group-parent-indicator color-secondary font-small fa-plus-square-o"],
span[class^="fa group-parent-indicator color-secondary font-small fa-minus-square-o"] {
  color: grey;
}

/* Two-column layout */
.components-container {
  display: flex;
  flex-wrap: wrap;
}
.component-container:nth-child(even) {
  border-left: 0 !important;
}
@media screen and (min-width: 650px) {
  .component-container {
    flex-basis: 50%;
  }
}

/* Copyright / legal block at the bottom of the page — centered and narrower */
.footer {
  text-align: center;
  max-width: 60%;
  margin-bottom: 0.1rem;
  margin-left: auto;
  margin-right: auto;
}
.footer a:link,
.footer a:visited {
  text-decoration: underline;
}

/*Dark Mode code */
@media (prefers-color-scheme: dark) {
  body {
    color: #5a5a5a !important;
    background: #292929 !important;
    font: 100% system-ui;
  }
  .font-regular {
    color: white;
  }
  .font-large,
  .footer,
  .font-largest.no-link,
  span,
  .month-name,
  .past-incidents,
  .no-logo,
  .legend-item {
    color: white;
  }
  a,
  a:hover,
  .layout-content.status-index .page-footer span a:hover,
  .layout-content.status-index .timeframes-container .timeframe:not(.active):hover,
  .layout-content.status-incident .subheader a:hover {
    color: white;
  }
  body.status,
  .color-primary,
  .color-primary:hover,
  .layout-content.status-index .status-day .update-title a,
  .layout-content.status-index .status-day .update-title a:hover,
  .layout-content.status-index .timeframes-container .timeframe.active,
  .layout-content.status-full-history .month .incident-container [class*="impact-"],
  .layout-content.status.status-index .incidents-list .incident-title a,
  .incident-history [class*="impact-"],
  .layout-content.status .grouped-items-selector.inline .grouped-item.active,
  .layout-content.status.status-full-history .history-nav a.current,
  .layout-content.status.status-full-history .history-nav a:not(.current):hover,
  div[id^="subscribe-modal"] .modal-header .close,
  .grouped-item-label,
  #uptime-tooltip .tooltip-box .tooltip-content .related-events .related-event a.related-event-link {
    color: #fff;
  }
  div[id^="component-info-container"],
  button[id^="component-description-"],
  button[id^="tooltip-"] {
    border-color: #ffffff;
    color: #ffffff;
  }
  .footer a:link,
  .footer a:visited,
  .footer a:hover,
  .footer a:active {
    color: #ffffff;
  }
  .layout-content.status-incident .subheader a:visited,
  .layout-content.status-incident .subheader a:hover,
  .layout-content.status-incident .subheader a:active {
    color: #ffffff !important;
  }
}