/* Use ctr+shift+R to force chrome | firefox to reload the css */


/* Eliminate some of the padding on the left margin. It is excessive. */
.trend_view {
    padding-left: 10px;
    margin-left: 10px;
}
.trend_view_charts {
    padding-top: 20px;
}

#stat_comparison td {white-space:pre;}

input.jq-datepicker {
    text-align: center;
}

.top-buffer {
    margin-top: 8px;
}

.invalid-input {
 background-color: #ef6e70;
    color: black;
    /* margin is outside of the container */
    margin-top: 80px;
    margin-bottom: 0px;
    margin-left: 10px;
    margin-right: 0px;
    border-style: solid;
    border-width: 2px;
    border-color: red;
    border-radius: 5px;
    /* padding is inside of the container */
    padding-top: 2px;
    padding-right: 10px;
    padding-botom: 10px;
    padding-left: 10px;
 }

/* set up class selector for the electrode add per-phase table */
/* add this to the class="per-phase" of the element */
th.per-phase {
    font-size: xx-small;
    font-weight: normal;
    /* something in the thead-light class is preventing the background color. Added ! to override it */
    background-color: transparent !important;
}
th.c-phase {
    /* something in the thead-light class is preventing the background color. Added ! to override it */
    border-right-width: 1px;
    border-right-style: dotted;
    border-right-color: gray !important;
}
td.c-phase {
    border-right-width: 1px;
    border-right-style: dotted;
    border-right-color: gray;
}

/*.failure-table {*/
    /*white-space: nowrap;*/
    /*border-collapse: collapse;*/
    /*color: #6ec2e8;*/
/*}*/

/* Zebra stripe rows */
/*tr.zebra:nth-child(even) {*/
/*  background-color: #f2f2f2;*/
/*}*/

/* prevent the column headings i.e. 2020-01 from wrapping into 2 rows */
th.col_head {
    white-space: nowrap;
    font-weight: bold;
}

/* this works, but doesn't look good if there are only a few columns. It doesn't automatically center in the column.
   maybe try adding vertical-align: middle?? */
th.rotate {
    height: 70px;
    white-space: nowrap;
}
th.rotate > div {
    transform:
        translate(15px, -6px)
        rotate(-60deg);
    width: 30px;
    /*border-bottom: 1px solid #555555;*/
}

/* align the measurements in the middle if the heading text wraps */
td.data_row {
    vertical-align: middle;
    /*white-space: nowrap;*/
}

td.row_head {
    text-align: left;
    white-space: nowrap;
    font-weight: bold;
}

/*th.left, td.left {*/
    /*text-align: left;*/
/*}*/

/*.failure-table th.center, td.center {*/
    /*text-align: center;*/
/*}*/

.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}

.form-check-input {
    margin-left: 0;
    width: 1.2rem;
    height: 1.2rem;
}
.btn-config {
    margin-bottom: 10px;
}