/* =========================================
   GLOBAL
========================================= */

body.status {
  font-family: 'Figtree', sans-serif !important;
  color: #1F2937 !important;
}

.container,.masthead-container {
  max-width: 72rem !important;
}


/* =========================================
   TOP STATUS BANNER
========================================= */
.page-status .icon {
  display: none !important;
}

.page-status {
  padding: 0 !important;
  border: none !important;
  overflow: hidden !important;
  background-color: #2fcc66!important;
  background: transparent !important;
  margin-bottom: 1.5rem !important;
  text-shadow: none !important;
}


.page-status .last-updated-stamp {
  display: block !important;
  text-align: left !important;
  float: none !important;
  position: static !important;
  border-radius: 0 0 12px 12px !important;
  background-color: rgb(248, 249, 250) !important;
  color: #4B5563 !important;
  padding: 16px 24px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.page-status.status-none h2.status {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  position: relative;
  height: 3.6rem !important;
  border-radius: 12px 12px 0 0 !important;
}

.page-status.status-none h2.status::before {
  content: "";
  width: 28px;
  height: 28px;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.801 10A10 10 0 1 1 17 3.335'/%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3C/svg%3E");
}


/* GREEN TOP BAR */
.page-status.status-none h2.status {
  background: #4CAF50 !important;
  color: white !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  padding: 18px 24px !important;
  margin: 0 !important;
}

/* GREY BOTTOM BAR
.page-status .last-updated-stamp {
  display: block !important;
  background: #F3F4F6 !important;
  color: #4B5563 !important;
  padding: 16px 24px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
} */

.masthead-container .masthead {
  margin-bottom: 2rem !important;
}

.masthead-container .updates-dropdown-container .show-updates-dropdown{
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  text-shadow: none !important;
}

.layout-content.status .masthead-container.basic .masthead{
  padding-top: 4rem !important;
}

/* =========================================
   REMOVE DEFAULT ATLASSIAN CARD BORDERS
========================================= */

.border-color {
  border-color: transparent !important;
}

/* =========================================
   OVERRIDES
========================================= */

.custom-header-container{
  margin-bottom: 3rem !important;
}


/* =========================================
   HEADER LOGO
========================================= */

.logo-container img{
  height: 32px!important;
} 

/* =========================================
   SUBSCRIBE TO UPDATES BUTTON
========================================= */
.show-updates-dropdown {
  background: white !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid rgb(37, 99, 235) !important;
  border-radius: 10px !important;
  color: rgb(37, 99, 235) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  cursor: pointer;
  height: 40px !important;
  padding: 10px 24px !important;
  text-decoration: none;
}

/* .show-updates-dropdown:hover{
  border-color: #3498db !important;
  color: #3498db !important;
}  */


/* =========================================
  COMPONENT CARDS
========================================= */

/* .is-group {
  display: none;
} */

.legend .spacer{
  display: none;
}

.legend-item-uptime-value{
  font-weight: 700;
  font-size: 14px;
  color: rgb(102, 102, 102) !important;

}

.legend-item-date-range{
  font-size: 12px !important;
  color:black !important;
  color: rgb(102, 102, 102) !important;
}

.component-status {
  font-weight: 500 !important;
  font-size: 14px !important;
}

.component-container {
  background: rgb(248, 249, 250) !important;
  border: none !important;
  padding: 20px !important;
  margin-bottom: 10px !important;
}

.component-status {
  font-weight: 500 !important;
  font-size: 14px !important;
}

.layout-content.status.status-index .components-section .component-container.is-group.open .uptime-90-days-wrapper{
  display: block !important;
}
.layout-content.status.status-index .components-section .component-container.is-group.open .component-inner-container .component-status {
  display: block !important;
}

.group-parent-indicator.fa-plus-square-o::before {
  content: "\f078";
}

.group-parent-indicator.fa-minus-square-o::before {
  content: "\f077";
}

/* =========================================
   CHILD COMPONENTS
========================================= */

.component-inner-container .name {
  font-weight: 600 !important;
  font-size: 15px !important;
}

.component-inner-container {
  border: none !important;
  margin-top: 0 !important;
}

/* Status TEXT colors only (safe) */

.component-inner-container.status-green .component-status {
  color: #4CAF50 !important;
}

.component-inner-container.status-red .component-status {
  color: #E24A3B !important;
}

.component-inner-container.status-orange .component-status {
  color: #F4A62A !important;
}

html body.status 
.layout-content.status.status-index 
.components-section 
.components-container.one-column 
.component-container,
html body.status 
.layout-content.status.status-index 
.components-section 
.components-container.one-column 
.component-container:first-child {
  border-radius: 12px !important;
}

.components-section{
  margin-bottom: 1.5rem !important;
}

.incidents-list{
  margin-top: 2.5rem !important;
}


/* .component-container:has(.group-parent-indicator[aria-expanded="true"]) {
  background: #ffffff !important;
}

.component-container:has(.group-parent-indicator[aria-expanded="true"])
.child-components-container .component-inner-container {
  background: rgb(248, 249, 250) !important;
  border-radius: 1rem !important;
  border: none !important;
  padding: 16px 20px !important;
} */

.child-components-container {
  background: white;
  border-radius: 10px !important;
  padding: 20px 0 !important;
  margin-top: 1rem  !important;
}

/* .component-inner-container > .div:not(:last-child) {
  border-bottom: 1px solid #ff0000;
  margin-bottom: 0.75rem;
} */

.child-components-container  .component-inner-container:not(:last-child) {
  border-bottom: 2px solid rgb(248, 249, 250) !important; 
}

.child-components-container  .component-inner-container:not(:first-child):not(:last-child) {
  padding: 0.75rem 1.5rem 0.75rem 1.5rem !important;
}

.child-components-container  .component-inner-container:is(:last-child) {
  padding: 0.75rem 1.5rem 0 1.5rem !important;
}

.child-components-container  .component-inner-container:is(:first-child) {
  padding: 0 1.5rem 0.75rem 1.5rem !important;
}



/* =========================================
   UPTIME GRAPH
========================================= */

.layout-content.status.status-index .components-section .component-container .group-parent-indicator:focus {
  box-shadow: none;
}

.components-uptime-link {
  position: relative;
  padding-left: 8rem; /* space for "System Uptime" */
  margin-bottom: 16px;
}

.components-uptime-link::before {
  content: "System Uptime";
  position: absolute;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: rgb(51, 51, 51) !important;
  left: 0;
  top: 0;
}

.shared-partial.uptime-90-days-wrapper {
  margin-top: 12px !important;
}

/* Bar shape */
.availability-time-line-graphic span {
  width: 6px !important;
  height: 28px !important;
  margin-right: 4px !important;
  border-radius: 4px !important;
}

/* Scoped bar colors ONLY */

.availability-time-line-graphic span.status-green {
  background-color: #34B263 !important;
}

.availability-time-line-graphic span.status-red {
  background-color: #E24A3B !important;
}

.availability-time-line-graphic span.status-orange {
  background-color: #F4A62A !important;
}

.availability-time-line-graphic span.status-blue {
  background-color: #2F80ED !important;
}

/* Legend tweaks */

.legend {
  font-size: 13px !important;
}

.legend-item-uptime-value {
  font-weight: 600 !important;
}

.availability-time-line-graphic rect {
    height:32px!important;
    border-radius:2px!important;
    rx: 1px !important;
    ry: 1px !important;
    width:4.5px;
}


/* =========================================
   STATUS COLORS
========================================= */

.status-green .component-status,
.component-inner-container.status-green .component-status {
  color: #4CAF50 !important;
}

.status-red .component-status,
.component-inner-container.status-red .component-status {
  color: #E02020 !important;
}

.status-orange .component-status,
.component-inner-container.status-orange .component-status {
  color: #F5A623 !important;
}


/* =========================================
   PAST INCIDENTS
========================================= */

.incident-title.impact-maintenance a{
  color: rgb(0, 102, 255) !important;
}

.layout-content.status.status-index .incidents-list .incident-title a{
  color: rgb(0, 102, 255) !important;
}

.incident-title {
  border-radius: 12px 12px 0 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
}

.status-day .incident-title a{
  color: rgb(51, 51, 51);
  font-weight: 600;
  font-size: 16px;
}

.no-incidents{
  display: none !important;
}

.status-day{
  margin-top: 0.8rem!important;
}

.status-day p{
  background: rgb(248, 249, 250);
  padding: 1.3rem;
  border-radius: 1rem !important;
  font-size: 14px !important;
  color: rgb(51, 51, 51) !important;
}

.status-day .date{
  color: rgb(102, 102, 102)!important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.updates-container .update{
  font-size: 14px !important;
}


.updates {
  border: none !important;
  background: rgb(248, 249, 250) !important;
  border-radius: 0 0 12px 12px;
  font-size: 14px !important;
}


/* =========================================
  CURRENT INCIDENTS
========================================= */

.unresolved-incident .incident-title {
  display: flex;
  align-items: center;
  text-shadow: none !important;
}

.unresolved-incident .incident-title .subscribe {
  float: none !important;
  margin-left: auto;
  margin-right: 1rem;
}

.unresolved-incident .incident-title::before {
  content: "";
  width: 20px;
  height: 20px;
  margin-right: 8px;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.unresolved-incident .incident-title {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.layout-content.status.status-index .unresolved-incidents {
  margin-bottom: 1.5rem !important;
}


/* =========================================
   MAINTENANCE
========================================= */

.layout-content.status.status-index .scheduled-maintenances-container{
  margin-top: 0px !important;
  margin-bottom: 1.5rem !important;
}

.layout-content.status.status-index .scheduled-maintenances-container .scheduled-maintenance {
    margin-top: 1rem !important;
}

.unresolved-incident.impact-maintenance .incident-title::before {
  content: "";
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E");
}

.impact-maintenance .incident-title {
  color: #2980b9 !important;
}

.scheduled-maintenances-container h2, #past-incidents{
  font-size: 18px !important;
  font-weight: 600 !important;
}

.scheduled-maintenance, .incident-container{
  background: rgb(248, 249, 250);
  padding: 1.3rem;
  border-radius: 1rem !important;
  font-size: 14px !important;
  color: rgb(102, 102, 102)!important;
}

.scheduled-maintenance .incident-title::before {
  content: "";
  width: 20px;
  height: 20px;
  margin-right: 0.85rem;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232196F3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4'/%3E%3Cpath d='M16 2v4'/%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E");
}

.scheduled-maintenance .incident-title, .incident-container .incident-title{
  font-size: 16px !important;
  font-weight: 600 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  color: rgb(51, 51, 51) !important;
}

.layout-content.status.status-index .incidents-list .incident-title.impact-minor a{
  color: rgb(0, 102, 255) !important;
}

.scheduled-maintenance .incident-title {
  display: flex;
  align-items: center;
}

.scheduled-maintenance .incident-title .pull-right {
  float: none !important;
  margin-left: auto;
}


/* =========================================
   FOOTER
========================================= */

.page-footer{
  margin: 1.5rem 0 4.5rem 0 !important;
}

/* =========================================
   HISTORY PAGE
========================================= */

.history-nav .button.current {
  text-decoration: underline !important;
  text-decoration-color: rgb(37, 99, 235) !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 0.52em !important;
}