:root 
{
  --primary-text-color: #222222; /*fill-gray-9*/
  --primary-background-color: #ffffff;  /*white*/
  --primary-border-color: #e7e7e7;  /*fill-gray-2*/
  --primary-link-color: #0c7ac9;  /*fill-blue-5*/
  
  --secondary-background-color: #006fba;  /*fill-blue-6*/
  --secondary-text-color: #ffffff; /*white*/

  --status-available: #689e36; /*fill-green-6*/
  --status-informational:#87ccea; /*fill-blue-3*/
  --status-degraded: #f9c200; /*fill-orange-1*/
  --status-maintenance: #a7a7a7; /*fill-gray-5*/
  --status-unavailable: #ee3524; /*fill-red-2*/
  --status-investigating: #f3901d; /*fill-orange-3*/
  --status-monitoring: #00a4a4; /*fill-aqua-4*/
  --status-identified: #8f6b99; /*fill-purple-2*/
}
body{color:var(--primary-text-color);}
a{color:var(--primary-link-color) !important;}
table,td,th,.border{border-color:var(--primary-border-color) !important;}
table > thead > tr > th 
{
    background-color:var(--primary-background-color) !important;
    color:var(--primary-text-color);
}
table > tbody > tr > td 
{
    color:var(--primary-text-color);
}
.logo {
    padding-top: 10px;
    padding-bottom: 10px;
    max-height: 75px;
    max-width: 280px;
}
.navbar-toggler {
    background-color: #006fba;
    color: #fff;
    padding: 6px 12px;
    font-size: 0.875rem;
    margin: 8px;
}

#page-wrapper{background-color:var(--primary-background-color)}

.navbar{background-color:var(--primary-background-color) !important;}
.ibox-title
{
    background-color:var(--secondary-background-color);
    border-color:var(--primary-border-color);
    color:var(--secondary-text-color);
}
.ibox-content
{
    background-color:var(--primary-background-color);
    border-color:var(--primary-border-color);
}
.fa-chevron-up,.fa-chevron-down,.fa-expand { color:var(--secondary-text-color)}
.widget-tableofcontents > div > div.ibox-content{
    border: none;
    padding: 0px 20px 0px 20px;
}
.component-uptime-from{color:var(--primary-text-color);}
.text-secondary.component-uptime-to{color:var(--primary-text-color)!important;}
.component-uptime-percentage{color:var(--primary-text-color);}
.component-uptime-percentage::after{content:" total uptime over 30 days";}
.status-list-component-status-text {color:var(--primary-text-color)!important;}
.subscribe-link
{
    background-color:var(--primary-background-color);
    color::var(--primary-text-color);
}
.footer-brand a {color:var(--primary-text-color) }

/*button and bar colors*/
.component-available {color: var(--status-available);}
.component-informational {color: var(--status-informational);}
.component-investigating {color:var(--status-investigating);}
.component-monitoring {color:var(--status-monitoring);}
.component-identified {color:var(--status-identified);}
.component-degraded {color: var(--status-degraded);}
.component-unavailable {color: var(--status-unavailable);}
.component-maintenance {color:var(--status-maintenance);} 


/*fonticon swap*/
i.component-available::before {content: "\f111";}
i.component-informational::before {content: "\f111";}
i.component-investigating::before {content: "\f111";}
i.component-monitoring::before {content: "\f111";}
i.component-identified::before {content: "\f111";}
i.component-degraded::before {content: "\f111";}
i.component-unavailable::before {content: "\f111";}
i.component-maintenance::before {content: "\f111";}

.status-available{background-color: var(--status-available);}
.status-degraded{background-color: var(--status-degraded);}
.status-informational {background-color: var(--status-informational);}
.status-unavailable{background-color: var(--status-unavailable);}
.status-maintenance {background-color: var(--status-maintenance);} 
.status-investigating {background-color: var(--status-investigating);} 
.status-monitoring {background-color: var(--status-monitoring);} 
.status-identified {background-color: var(--status-identified);}

.incident-customfields {display: none;}