 :root {
     --theme-status_background_dark: 34, 42, 55;
     --theme-status_background_light: 53, 66, 87;
 }

 .ipsApp[data-pageapp="stsmanager"] #ipsLayout_sidebar {
     display: none;
 }

 .ipsApp[data-pageapp="stsmanager"] #ipsLayout_mainArea {
     display: block;
 }

 #statusPage__root {
     position: relative;
 }

 .statusPageHeader {
     padding: 2em;
     border-radius: var(--radius-2);
     position: relative;
     background: rgb(var(--theme-area_background_dark));
     border-bottom-left-radius: 0 !important;
     border-bottom-right-radius: 0 !important;
 }

 .statusPageHeader>header {
     display: flex;
     align-items: center;
 }

 .statusPageHeader__title {
     margin: 0;
     flex: 1;
     font-size: 2em;
     color: rgb(var(--theme-text_very_light));
 }

 .statusTypes {
     display: flex;
     align-items: center;
     margin: 0;
     padding: 0;
     list-style: none;
 }

 .statusType__row {
     display: flex;
     align-items: center;
     border-radius: var(--radius-1);
     text-transform: uppercase;
     font-weight: 600;
     text-transform: uppercase;
     font-size: 11px;
     line-height: 1;
     letter-spacing: 1px;
     padding: 1em;
 }

 .statusType__row:not(:last-child) {
     margin-right: 1.5em;
 }

 .statusPageControls {
     position: sticky;
     top: 0;
     z-index: 1450;
 }

 .status-page__controls {
     display: flex;
     gap: 1em;
     padding: 1.5em;
     overflow-x: scroll;
     background: rgb(var(--theme-status_background_light));
 }

 .status-page__controls::-webkit-scrollbar {
     height: 5px;
 }

 .status-page__controls::-webkit-scrollbar-track {
     background: transparent;
 }

 .status-page__controls::-webkit-scrollbar-thumb {
     background: rgb(var(--theme-brand_primary));
     border-radius: unset;
     border: 0;
 }

 .statusPageMain {
     padding: 2em;
     background: rgb(var(--theme-status_background_dark));
     border-radius: 0;
     border-bottom-right-radius: var(--radius-2);
     border-bottom-left-radius: var(--radius-2);
 }

 .ipsApp .status-tabButton {
     background: rgb(var(--theme-area_background_dark));
     border: 0;
     padding: 0.75rem 1rem;
     border-radius: var(--radius-1);
     color: #fff;
     font-weight: 500;
     font-size: 11px;
     line-height: 1;
     text-transform: uppercase;
     letter-spacing: .5px;
     cursor: pointer;
     white-space: nowrap;
     transition: 0.25s linear;
 }

 .ipsApp .statusButtonRow>a[disabled] {
     opacity: 0.5;
     cursor: not-allowed;
     pointer-events: none;
 }

 .status-tabButton:hover:not(.is-active) {
     background-color: rgb(var(--theme-primary_button), 0.2);
     color: rgb(var(--theme-primary_button));
 }

 .status-tabButton.is-active {
     background-color: rgb(var(--theme-primary_button));
     color: rgb(var(--theme-primary_button_font));
     font-weight: 600;
 }

 .status-tabContent {
     display: none;
 }

 .status-tabContent.is-active {
     display: block;
 }

 .statusGroup:not(:last-of-type, :only-of-type) {
     margin-bottom: 1.5rem;
 }
 
 .statusRow > .status {
      background-color: transparent !important;
      border: 1px solid transparent !important;
      color: inherit !important;
      padding: 1em !important;
    }
    
    .statusRow > .status.undetected {
      color: #1edb32 !important;
      border-left: 1px solid #1edb32 !important;
      border-right: 1px solid #1edb32 !important;
      background-color: rgba(30, 219, 50, .20) !important;
    }
    
    .statusRow > .status.updating,
    .statusRow > .status.testing {
      color: #ffd966 !important;
      border-left: 1px solid #ffd966 !important;
      border-right: 1px solid #ffd966 !important;
      background-color: rgba(255, 217, 102, .20) !important;
    }
    
    .statusRow > .status.risk,
    .statusRow > .status.detected {
      color: #f44336 !important;
      border-left: 1px solid #f44336 !important;
      border-right: 1px solid #f44336 !important;
      background-color: rgba(244, 67, 54, .20) !important;
    }
    
    .status--icon {
      position: relative;
      width: 1em;
      height: 1em;
    }
    .status--icon .icon-effect {
      position: absolute;
      top: 0;
      left: 0;
      opacity: .3;
      animation: pulse 1.5s infinite;
    }
    @keyframes pulse {
      0%,100% { opacity: .3; }
      50%     { opacity: .6; }
    }

 .statusGroup__title {
     margin: unset;
     font-size: 18px;
     font-weight: bold;
     letter-spacing: 1px;
     text-transform: uppercase;
     color: rgb(var(--theme-text_very_light));
 }

 .statusProduct {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 1.5em;
     position: relative;
     z-index: 1;
 }

 .statusProduct__desc {
     margin: 0;
     color: rgb(var(--theme-text_light));
 }

 .statusProduct:not(:last-of-type, :only-of-type) {
     border-bottom: 1px dashed rgb(var(--theme-status_background_light));
 }

 .statusProduct__title {
     color: rgb(var(--theme-text_very_light));
     margin: 0;
     overflow: hidden;
     text-overflow: ellipsis;
     max-width: 250px;
     white-space: nowrap;
 }

 .statusProduct__inner {
     display: flex;
     align-items: center;
     flex-wrap: nowrap;
     padding: 0;
     margin: 0;
     list-style: none;
     white-space: nowrap;
 }

 .statusRow {
     border-right: 1px dashed rgb(var(--theme-status_background_light));
     padding-right: 2em;
     margin-right: 2em;
     display: flex;
     flex-direction: column;
 }

 .statusRow>._type {
     text-transform: uppercase;
     font-size: 10px;
     letter-spacing: 0.5px;
     color: rgb(var(--theme-text_very_light));
     opacity: .70;
     font-weight: 400;
 }

 .statusRow>._text {
     color: rgb(var(--theme-text_very_light));
     line-height: 1;
     margin: 0.25em 0 0 0;
 }

 .statusRow>.status {
     font-weight: 600;
     text-transform: uppercase;
     font-size: 11px;
     line-height: 1;
     letter-spacing: 1px;
     padding: 1em;
     min-width: 145px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: var(--radius-1);
     gap: 0.3em;
     margin: 0;
     background: rgb(var(--theme-status_background_light));
     color: rgb(var(--theme-text_very_light));
 }

 .statusGroup__content {
     padding: 0;
     margin: 1em 0 0 0;
     background: rgb(var(--theme-area_background_dark));
     border-radius: var(--radius-2);
 }

 .statusButton {
     font-size: 14px;
     background: rgb(var(--theme-primary_button));
     color: rgb(var(--theme-primary_button_font));
     padding: 1em 1.5em;
     line-height: 1;
     display: flex;
     border-radius: var(--radius-1);
     font-weight: 500;
 }

 @media screen and (max-width:979px) {
     .statusPageHeader>header {
         flex-wrap: wrap;
         gap: 1em;
     }

     .statusTypes {
         flex-wrap: wrap;
         gap: 0.5em;
     }

     .statusType__row:not(:last-child) {
         margin-right: unset;
     }
 }

 @media screen and (max-width:800px) {
     .statusPageHeader>header {
         justify-content: center;
         text-align: center;
     }

     .statusTypes {
         justify-content: center;
     }

     .statusProduct {
         flex-direction: column;
         gap: 1em;
     }

     .statusProduct__inner {
         flex-direction: column;
         width: 100%;
     }

     .statusRow {
         flex-direction: row;
         justify-content: center;
         font-size: 10px;
         letter-spacing: 1px;
         border-right-width: 0;
         border-bottom: 1px dashed rgb(var(--theme-status_background_light));
         padding-right: 0;
         margin-right: 0;
         width: 100%;
         text-align: center;
         padding-bottom: 1em;
         margin-bottom: 1em;
     }

     .statusRow>._type {
         font-size: inherit;
         margin-right: 0.3em;
         letter-spacing: inherit;
     }

     .statusButtonRow {
         width: 100%;
     }

     .statusButton {
         justify-content: center;
     }

     .statusRow>.status {
         width: 100%;
     }
 }

.statusProduct.clickable {
    cursor: pointer;
}

.statusProduct.non-clickable {
    cursor: not-allowed;
}

.statusButton.disabled {
    cursor: not-allowed !important;
}