body {
  font-family: "Inter", "Inter Fallback", "Helvetica Neue", Helvetica, Arial, Sans-Serif ! important;
  padding-top: 20px;
  background-color: #ecf3fc;
}

.shared-partial, .page-footer {
  display: none
}

.component-inner-container .showcased {
  vertical-align: bottom;
}

.tooltip-base {
  height: 100%;
  font-size: 1rem; 
  vertical-align: bottom;
}

h2.font-largest {
  margin-bottom: 8px; 
}

body.status .layout-content.status .border-color, hr, .tooltip-base, .markdown-display table, div[id^="subscribe-modal"], #uptime-tooltip .tooltip-box {
    border-color: #e0e0e000 ! important;
}

.layout-content.status.status-index .custom-metrics-container .timeframes-container .timeframe.active {
  font-weight: 600 ! important;
  color: rgb(6, 15, 40) ! important;
}

.layout-content.status.status-full-history .history-nav a.current {
  background-color: #ffffff00 ! important;
  border-bottom: 2px solid #0F8CEB;
  border-width: 0px 0px 1px 0px;
  font-weight: 600;
}

.metric {
  border-radius: 8px; 
}

.component-selector {
  background-color: #0F8CEB;
  border: none;
  border-radius: 8px;
  color: #ffffff;
}

.scheduled-maintenances-container {
  margin-top: 0px ! important; 
}

/*.color-secondary {
  color: #7C8B9F ! important; 
}*/

.small {
  color: #7C8B9F ! important; 
}

.container {
  max-width: 1024px ! important;
}

.boxed {
  background-color: #ffffff;
  padding: 25px;
  border-radius: 8px;
  margin-bottom: 30px ! important;
}

.month {
  background-color: #ffffff;
  padding: 25px;
  border-radius: 8px;
  margin-bottom: 30px ! important;
}

.previous-page, .next-page {
  background-color: #081332;
  color: #ffffff ! important;
}

.left-arrow::before, .right-arrow::before {
  color: #ffffff ! important;
}

.group-parent-indicator {
  box-shadow: none ! important; 
}

.hidden {
  display: none ! important; 
}

.incident-title a {
  color: #030d28 ! important;
}

.font-largest {
  color: rgb(6, 15, 40);
  font-weight: 600 ! important;
}

.components-affected {
  color: #000000 ! important;
  border-radius: 8px ! important;
  margin-bottom: 40px;
}

.layout-content.status.status-incident>.container {
    margin-top: 30px ! important;
}

.layout-content.status.status-incident .page-title .subheader {
  display: none; 
}

.updates-dropdown-container {
  justify-content: end;
  display: flex ! important;
}

.width-container.updates-dropdown-container a {
  color: #ffffff;
}

.layout-content.status.status-index .components-section .component-container.is-group {
  padding: 0.5rem 1.4rem ! important; 
}

#show-updates-dropdown {
	border-radius: 6px;
	padding: 8px 10px;
	background-color: #118CEB;
	color: #ffffff ! important;
}

.subscribe-button {
  border: 1px solid #030d28;
  border-radius: 25px;
  padding: 5px 10px;
  background-color: #030d28 ! important;
}

.cookie-consent-banner {
 	 top: unset;
  bottom: 0;
  position: fixed;
}

.layout-content.status .custom-header-container {
  margin-bottom: 0px; 
}

.status {
  padding-top: 0px; 
}

.layout-content {
  display: flex ! important;
  flex-direction: column;
  min-height: 100vh ! important;
}

content.status.status-incident>.container {
    margin-top: 30px ! important;
}

.container {
  flex: 1 ! important;
  padding-top: 100px;
  padding-bottom: 50px;
}

.sticky-header {
  z-index: 1000;
  top: 0;
  position: fixed;
  width: 100%;
  	background-color: #ffffffde;
  border-bottom: 1px solid #E8E8E8;
  display: flex;
  backdrop-filter: blur(8px);
  box-shadow: 1px 1px 12px 0px #00000014;
}

.width-container {
  width: 1024px;
  margin: 0px auto;
  padding: 0px 10px 0px 0px;
  display: flex;
}

.upper-topbar {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: space-between;
}

.dropdown-nav {
  display: none; 
}
.dropdown-nav.visible {
  display: flex;
  flex-direction: column;
  padding: 0px 30px 20px 30px;
  gap: 5px;
}

.dropdown-nav a {
  padding: 5px 10px;
  background-color: #030d28;
  color: #fff;
  border-radius: 5px;
}

.dropdown-nav a:hover {
  color: #fff;
}

.navbar-left {
  width: 220px;
  display: flex;
  align-items: center;
}

.component-status {
  margin-left: 5px; 
}

.topnav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
}

.topnav a {
  color: #000000 ! important;
}

.topnav a:hover {
  color: #000000 ! important;
}

.topnav .icon {
  display: none;
}

.logo {
  fill: #060f28;
  height: 35px;
}

.logo-link {
  display: flex;
  align-items: center; 
}

.logo-footer {
  fill: #ffffff;
  height: 25px;
}

.footer {
  padding: 25px 0px 20px 0px;
  width: 100%;
  	background-color: #030d28;
  color: #ffffff;
}

.footer-contacts {
  margin: 15px 0px; 
}

.scheduled-maintenance {
  margin-top: 0px ! important; 
  border-bottom: 1px solid #dddddd;
}
.scheduled-maintenance .updates-container {
  display: none; 
}

a {
  color: #000000; 
}

a:hover {
  text-decoration: underline;
}

.components-section {
  margin-bottom: 0px ! important; 
}

.component-container {
  padding: 10px 20px ! important; 
}

.child-components-container .component-inner-container {
  margin-top: 5px ! important; 
}

.incident-title {
  padding: 6px 0px ! important;
  align-items: center;
  display: flex;
  justify-content: space-between;
  font-size: 16px ! important;
  margin-bottom: 0px ! important;
  width: 100%;
  background-color: #fff ! important;
  text-shadow: none ! important;
}

.unresolved-incident {
  margin-top: 0px ! important;
  display: flex;
  align-items: center;
  background-color: #030d2800;
  border-bottom: 1px solid #dddddd;
}

.unresolved-incident .updates {
  display: none; 
}

.unresolved-incident .impact-indicator {
  margin: 0px 20px 0px 0px ! important;
}

.impact-indicator {
  width: 15px ! important;
  height: 15px ! important;
  border-radius: 50%;
  background-color: #dddddd;
}

.impact-none-c {
  background-color: #2fcc70;
}

.impact-minor-c {
  background-color: #f1c40f;
}

.impact-major-c {
  background-color: #e67e22;
}

.impact-critical-c {
  background-color: #e74c3c;
}

.page-status {
  margin-bottom: 15px ! important; 
}

.show {
  display: block;
}

.collapsible {
  padding: 15px 0px; 
}

.collapsible-header {
  cursor: pointer; 
  font-weight: 500;
  font-size: 16px;
}

.collapsible-content {
  display: none;
}

.collapsible-content.show {
  display: block; 
}

.collapsible-content > .metric {
  padding: 1.5rem 1.5rem 1.25rem; 
}

.collapsible-content > .metric > .metric-meta {
  display: flex;
  justify-content: space-between;
}

/* ------------------------- */

@media screen and (max-width: 575.98px) {
  .logo {
     height: 30px;
  }
  .width-container {
     width: 100%;
     padding: 0px;
     display: flex;
     flex-direction: column;
  }
  .container {
     width: 100%;
     padding-top: 60px;
     padding-bottom: 0px;
     display: flex;
     flex-direction: column;
     gap: 10px;
  }
  .upper-topbar {
     padding: 0% 6%;
  }
  .footer {
					     padding-left: 25px;
  }
  .component-status {
    display: none;
  }
  .boxed, .month {
    border-radius: 0px; 
    margin-bottom: 0px ! important;
  }
  .incident-updates-container {
    padding: 25px; 
  }
  .component-selector {
    margin: 0px 20px; 
  }
  
}

@media screen and (max-width: 600px) {
  .topnav a {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive a:not(.icon) {
    float: none;
    display: none;
    text-align: left;
  }
}