/* Custom Styles */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

:root {
    --font-small: 0.875rem; 
    --font-title: 3rem;
    --font-h1: 2.25rem; 
    --font-h2: 1.75rem; 
    --font-h3: 1.25rem; 
    --font-regular: 1rem; 
  
    --font-weight-regular: 400;
    --font-weight-bold: 700;

    --container-box-shadow: 0px 2px 6.3px 0px rgba(41, 41, 41, 0.07);
}

.small-text {
    font-size: var(--font-small);
    font-weight: var(--font-weight-regular);
}

.title {
    font-size: var(--font-title);
    font-weight: var(--font-weight-bold);
}

h1 {
    font-size: var(--font-h1);
    font-weight: var(--font-weight-bold);
}

h2 {
    font-size: var(--font-h2);
    font-weight: var(--font-weight-bold);
}


p {
    font-size: var(--font-regular);
    font-weight: var(--font-weight-regular);
}

/* Bold Text */
strong,
.strong {
    font-size: var(--font-regular);
    font-weight: var(--font-weight-bold);
}

body {
    background-color: #FFFFFF;
    color: #292932;
    font-family: 'Inter', Verdana, sans-serif;
    padding-top: 100px;
}

.card-box {
    box-shadow: var(--container-box-shadow);
    border: 1px solid #E0E0E0;
    box-sizing: border-box; 
    background: #F6F6F6;
    padding: 1.156rem 0;
    border-radius: 6px;
    margin-left: 0px;
    margin-right: 0px;
}

.card-box .col {
    margin-top: 0;
}

/* BOOTSTRAP CUSTOM STYLES */

@media (min-width: 1400px) {
    body .container {
        max-width: 1200px;
    }
    body header .container {
        padding-right: 0;
    }
}

@media only screen and (max-width: 992px) {
    .map-wrapper {
        overflow: auto;
    }
}

/* BUTTONS CUSTOM STYLES */

body .btn {
    border-radius: 8px;
    --bs-btn-padding-y: 0.782rem;
    font-weight: bold;
}

body .btn-success {
    color: #FFFFFF;
    border-color: #50AB5D;
    background-color: #50AB5D;
}

body .btn-success:hover {
    color: white;
    background-color: #007A00;
    border-color: #50AB5D;
}

body .btn-success:focus {
    color: white;
    background-color: #007A00;
    border-color: #50AB5D;
    box-shadow: 0 0 0 0.25rem rgba(0, 179, 0, 0.5);
}

body .btn-success:active {
    color: white;
    background-color: #007A00;
    border-color: #007A00;
}


body .btn-outline-danger {
    color: #F33419;
    border-color: #F33419;
}

body .btn-outline-danger:hover {
    color: white;
    background-color: #F33419;
    border-color: #F33419;
}

body .btn-outline-danger:focus {
    color: white;
    background-color: #F33419;
    border-color: #F33419;
    box-shadow: 0 0 0 0.25rem rgba(247, 43, 43, 0.5);
}

body .btn-outline-danger:active {
    color: white;
    background-color: #D32B2B;
    border-color: #D32B2B;
}


/* HEADER */

body header.header {
    background: #F6F6F6;
    position: fixed;
    top: 0;
    left: 0;
    padding: 0;
    width: 100vw;
    z-index: 6;
    box-shadow: var(--container-box-shadow);
    border: 1px solid #E0E0E0;
    box-sizing: border-box;
}

body header .container {
    padding-right: calc(var(--bs-gutter-x)* .5);
    padding-left: calc(var(--bs-gutter-x)* .5);
}

@media only screen and (max-width: 992px) {
    body .menu .nav-link {
        text-align: center;
    }

    body header.header {
        background: #FFFFFF;
        padding: 1rem 0;
    }

    body header .navbar-collapse {
        margin-top: 1rem;
    }

    .nav-item.ml-auto {
        margin-left: inherit;
        padding-top: 1rem;
    }
}

body header.header .nav-link {
    font-size:  1.125rem;
    padding: 18px 0;
    color: #3B4F59;
}

body .menu .nav-link:hover {
    background-color: #EBEBEB;
}

body header.header .nav-link.active {
    background-color: #EBEBEB;
    color: #3B4F59;
    border-bottom: 2px solid #26BC6A;
}

body header.header .nav-link.highlight {
    background-color: #EBCB10;
    color: #3B4F59;
    border-bottom: 2px solid #BC6A26;
}

body .menu {
    width: 100%;
    justify-content: flex-start;
    display: flex;
}

.ml-auto {
    margin-left: auto;
}

body .menu .nav-link {
    transition: transform 0.2s ease, color 0.2s ease;
}

@media only screen and (max-width: 992px) {
    body header.header .navbar-toggler {
        border: none;
    }

    body .navbar-toggler:focus {
        outline: 0;
        border: none;
        box-shadow: none
    }
}

@media only screen and (max-width: 992px) {
    body .menu .nav-link {
        text-align: center;
    }
}

body .menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    display: none;
}

body .menu-overlay.active {
    display: block;
}

.navbar-toggler.burger-menu div {
    width: 24px;
    height: 1px;
    background-color: #000;
    margin: 6px 0;
}

/* LOGIN FORM */

.login-form .card {
    width: 390px;
}

.login-form .card h2 {
    color: #292932;
    font-size: 1.3rem;
}

.login-form label {
    font-size: var(--font-regular);
    margin-bottom: 0.7rem;
}

.login-form .small-text {
    color: #71717B;
}

.login-form input.form-control {
    padding: .66rem .75rem;
}

/* TABLE CONTROLS */

.controls .align-items-center{
    display: flex;
}

@media only screen and (max-width: 992px) {
    .controls {
        margin-top: 0;
    }
}  

.-controls #password {
    max-width: 178px;
}  

.controls.card-box input.form-control {
    padding: .782rem .75rem;
}

.table-wrapper table {
    width: 100%;
    border: none;
    margin-top: 2rem;
}

body .table-wrappe #mtable tr:first-child th:first-child {
    border-top-left-radius: 10px;
  }
  
  body .table-wrappe #mtable tr:first-child th:last-child {
    border-top-right-radius: 10px;
  }
  
  body .table-wrappe #mtable tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
  }
  
  body .table-wrappe  #mtable tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
  }

body .table-wrapper .sticky-top {
    top: 60px;
    border-color:  #E0E0E0;
    box-shadow: var(--container-box-shadow);
    border-top: 1px solid #E0E0E0;
    border-top-left-radius: 10px;
}
.table-wrapper .sticky-top tr th {
    width: 5%;
}

.table-wrapper .sticky-top tr th:first-child {
    width: 8.5%;
}

.table-wrapper .sticky-top tr th:last-child {
    width: 15%;
    position: relative;
}

.table-wrapper .sticky-top tr th:last-child::before {
    position: absolute;
    content: "";
    top: 40px;
    left: -1px;
    width: 1px;
    height: 60px;
    background-color: #E0E0E0;
}

.table-wrapper table th {
    background: #F6F6F6;
    border-color: #E0E0E0;
    text-align: center;
    border-width: 1px;
    padding: 0.938rem 0.5rem;
    border-style: solid;
    font-size: var(--font-regular);
    font-weight: var(--font-weight-bold);
}


body table td {
    border-width: 1px;
    padding: 5px;
    border-style: solid;
    border-color: #DEDEDE;
    background-color: #FFFFFF;
    text-align: right;
    padding-left: 3%;
}

table.gridtable tr.first-row {
    background-color: #FFFFFF;
    text-align: center;
    position: relative;

}


table.gridtable tr.first-row td {
    background-color: #FFFFFF;
    text-align: center;
    position: relative;
    height: 57px;
}

.time-main {
    width: 15%;
}

table.gridtable tr td span {
    position: absolute; 
    font-size: 1rem;
    width: 100%;
    top: 71%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    padding: 8px 0;
}

body .table-wrapper table.gridtable .table-striped td.transparent {
    background: transparent;
    box-shadow: none;
    border-top: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;

}

table.gridtable thead tr td, 
table.gridtable .second-row td {
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0;
}

table.gridtable .second-row .time-cell,
table.gridtable .second-row td,
table.gridtable thead tr td,
body .table-wrapper table.gridtable td,
body .table-wrapper table.gridtable th,
body .table-wrapper table.gridtable {
    border: none;
}

body .table-wrapper table .first-row td {
    border-left: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;
    border-top: 1px solid #E0E0E0;
}

body .table-wrapper table .second-row,
body .table-wrapper table.gridtable {
    border-left: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;
}

body .table-wrapper table.gridtable tr th {
    border-left: 1px solid #E0E0E0;
}

body .table-wrapper table.gridtable .table-striped td.hidden {
    border: none;
}

.second-row tr td {
    font-weight: var(--font-weight-bold);
}

.table-wrapper table .table-striped {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}

body .table-wrapper table.gridtable .table-striped td {
    text-align: center;
    width: 5%;
    vertical-align: middle;
    box-sizing: border-box;
    border: 1px solid #FFFFFF;
    height: 40px; 
    overflow: hidden;
    white-space: nowrap; /
}

.time-main {
    position: relative;
    font-size: 0.9rem;
}

.time-main::before {
    top: 30px;
    left: -1px;
    content: "";
    position: absolute;
    height: 60px;
    width: 1px;
    background-color: #E0E0E0;
}

body .table-wrapper table.gridtable .table-striped td.time-cell,
body .table-wrapper table.gridtable .table-striped td.hidden {
    background: #FFFFFF;
    --bs-table-accent-bg: #FFFFFF;
    width: 18%;
    padding: 0;
    font-size: var(--font-small);
    font-weight: var(--font-weight-regular);
}


body .table-wrapper table.gridtable  td.time-cell  span.time {
    background: transparent;
    top: auto;
    left: 5%;
    transform: translate(0, 0);
    position: relative;
    font-size: 0.8rem;
}

body .table-wrapper table.gridtable .table-striped td.time-cell {
    border: none;
}


.horizontal-form {
    display: flex;
    align-items: center; 
    gap: 10px; 
    
}
  
.horizontal-form label {
    width: 40%;
    white-space: nowrap; 
    margin-right: 10px; 
    font-size: var(--font-regular);
    font-weight: var(--font-weight-bold);
    box-sizing: border-box;
    text-align: left;
}

.horizontal-form input {
    flex: 1; 
    width: 60%;
    box-sizing: border-box;
}

@media only screen and (max-width: 992px) {
    .map-wrapper {
        overflow: scroll;
    }

    #limit_percent,
    #limit_mw,
    .controls #password {
        width: 100%;
        max-width: inherit;
    }

    .btn-outline-danger,
    .btn-success {
        width: 100%;
    }

    .align-items-center .form-label {   
        font-size: 1.1rem;
        margin-bottom: 0.7rem;
    }
    
    .controls .col {
        display: block;
    }

    .nav-item.ml-auto {
        margin-left: inherit;
    }

    .table-wrapper {
        min-width: 1140px;         
    }

    body .table-wrapper .sticky-top {
        top: 0;
    }

    .controls.card-box  {
        display: block;
        overflow: hidden;
    }
}


body .controls.controls-wrapper {
    max-width: 390px;
    max-width: 0 auto;
    
}

.controls-wrapper .card-box {
    text-align: center;
    padding: 24px;
}

.controls-wrapper p {
    font-size: var(--font-regular);
    font-weight: var(--font-weight-regular);
    width: 100%;
    display: block;
    text-align: center;
}

.controls-wrapper p strong {
    font-size: var(--font-regular);
    font-weight: var(--font-weight-bold);
}

.controls-wrapper .btn {
    --bs-btn-padding-y: 0.563rem;
    font-weight: bold;
    margin-top: 0.8rem;    
    width: 100%;
}

.controls-wrapper .btn-outline-danger {
    background-color: #FAF2F2;
}

.controls-wrapper .btn-outline-danger:hover {
    color: white;
    background-color: #F33419;
    border-color: #F33419;
}

.mt-16 {
    margin-top: 1rem;
}

.mb-16 {
    margin-bottom: 1rem;
}

@media only screen and (max-width: 992px) {
    .card-box .top-16 {
        margin-top: 1rem;
    }

    .table-controls #button_clear_limit {
        margin-top: 3rem;
        position: relative;
    }

    .table-controls #button_clear_limit::before {
        position: absolute;
        content: "";
        left: -10px;
        top: -20px;
        width: 100vw;
        height: 1px;
        background-color: #ced4da;
       
    }
}

body .container .warning-color,
body .table-wrapper table.gridtable .table-striped td.warning-color {
    color: #FF0000;
}

body .container .success-color,
body .table-wrapper table.gridtable .table-striped td.success-color {
    color: #198754;
}


body .container .info-message{
    margin-bottom: 1rem;
    text-align: center;
    font-size: var(--font-regular);
}

@media (min-width: 992px) {
    body .container .table-container div.info-message {
        margin-bottom: 2rem;
    }

}

body .container .info-message.warning-color {
   background-color: #FFF6F6;
   color: #FF0000;
   --container-box-shadow: 0px 2px 6.3px 0px rgba(255, 0, 0, 0.07);
}


body .container .info-message.success-color {
    background-color: #FAFFFA;
    color: #50AB5D;
    --container-box-shadow: 0px 2px 6.3px 0px rgba(80, 171, 93, 0.07);
}