/* * {
    border: black 1px solid;
} */


/* VARIABLES */



@media (min-width: 1200px) {
    .container {
        max-width: 1215px;
    }
}

/* END VARIABLES */

html {
    min-height: 100%;
}



body {
    min-height: 100%;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    background-image: url('./../img/pattern.png');
    background-repeat: no-repeat;
    /* background-attachment: fixed; */
    background-size: 60%;
    background-position: bottom center;
    background-color: #F9FAFB;
}

tbody,
tfoot,
nav.navbar {
    background-color: white;
}

.header_row {
    /* height: 10vh; */
    margin-top: 6vh;
}


/* html,
body {
    height: 100%;
    font-family: 'Montserrat', sans-serif;
} */

h1 {
    /* font-weight: 600;
    font-size: 24px;
    color: #636464;
    height: 29px;
    width: 197px; */
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 29px;
    padding-top: 6px;
}

h2 {
    color: #000000;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 22px;
}

h3 {
    color: #636464;
    font-family: Montserrat;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 18px;
}

.h-100 {
    height: 100%;
}

.breadcrumb-item+.breadcrumb-item::before {
    content: url('./../img/icon-paginator.svg');
}

.dropdown-toggle.floor_switch::after {
    position: absolute;
    right: 24px;
    bottom: 37px;
}

.dropdown-toggle::after {
    border: none;
    content: url('./../img/icon-caret.svg');
}

nav.breadcrumb {
    background: transparent;
}

.breadcrumb {
    background: transparent;
    padding: 0;
}

.breadcrumb-item {
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
}

.breadcrumb-item>a {
    color: rgba(0, 0, 0, 0.6);
}


/* BTNS */

.btn {
    font-weight: 500;
    font-size: 0.8em;
}

.btn-outline:hover,
.btn-outline:active,
.btn-outline:focus,
.btn-outline.active {
    background: #4fbfa8;
    color: #ffffff;
    border-color: #4fbfa8;
}

.btn-dota-green {
    color: #fff;
    background-color: var(--color-login-btn);
    border-color: var(--color-login-btn);
    letter-spacing: 0.05em;
    border-radius: 0;
}

.btn-dota-green:hover {
    background: var(--color-login-btn-hover);
    color: #ffffff;
    border-color: var(--color-login-btn-hover);
}

.btn-dota-green:active,
.btn-dota-green:focus,
.btn-dota-green.active {
    background: var(--color-login-btn-active);
    color: #ffffff;
    border-color: var(--color-login-btn-active);
}

.on_hover_pointer:hover {
    cursor: pointer;
}

.nav_dropdown {
    color: #000000;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;
}

.nav_user_dropdown {
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 16px;
}

.nav_lang_dropdown {
    color: #777777;
}

.nav_center_options .active {
    /* opacity: 1; */
    font-weight: 600;
    border-bottom: 2px var(--color-accent) solid;
}

.nav_center_options {
    color: #000000;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 16px;
}

.transparency {
    color: rgba(0, 0, 0, 0.6);
}


/* ##### TABLE */

.search_input {
    margin-left: 2px;
    margin-right: 2px;
    border-radius: 0.25rem !important;
}

.table.dataTable.no-footer {
    border: none;
    border-bottom: 1px solid rgb(222, 226, 230);
}

.thead-blueGradient {
    height: 20px;
    width: 1200px;
    background: linear-gradient(225.11deg, var(--color-accent_gradient_start) 0%, var(--color-accent) 100%);
    white-space: nowrap;
}

.thead-blueGradient th {
    height: 20px;
    width: 41px;
    color: #FFFFFF;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 16px;
}

tr.blueTable>th {
    border-left: 1px solid white;
    height: 16px;
    width: 41px;
    color: #FFFFFF;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 16px;
}

tr.blueTable>th:first-of-type {
    border-left: none;
}

tbody>tr>td {
    height: 16px;
    width: 200px;
    color: #000000;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
    vertical-align: middle !important;
}

table {
    border-color: rgb(222, 226, 230);
    border-style: solid;
    border-width: 1px;
}

.table_row_sum {
    height: 15px;
    width: 75px;
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 15px;
    vertical-align: middle !important;
}



/* TABLE ##### */

/* slots tatus #### */

.slot_status_icon.status_busy:before {
    content: "Busy";
}

.slot_status_icon.status_free:before {
    content: "Free";
}

.slot_status_icon.status_error:before {
    content: "Error";
}

.slot_status_icon.status_null:before {
    content: "Not assigned";
}

.slot_status_icon.active:before {
    content: "Active";
}

.slot_status_icon.disabled:before {
    content: "Disabled";
}

.slot_status_icon.status_busy {
    background-color: rgba(33, 146, 221, 0.1);
    color: rgb(50, 115, 255);
}

.slot_status_icon.status_free {
    background-color: #E8F8F0;
    color: #40C282;
}

.slot_status_icon.status_null {
    background-color: #F6F6F6;
    color: #6c757d;
}

.slot_status_icon.active {
    background-color: #E8F8F0;
    color: #40C282;
}

.slot_status_icon.disabled {
    background-color: #F6F6F6;
    color: #A6A6A6;
}

.slot_status_icon.status_error {
    background-color: #FBE8E8;
    color: #DF2E2E;
}

.slot_status_icon {
    height: 20px;
    /* width: 51px; */
    border-radius: 3px;
    font-family: Montserrat;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 15px;
    text-align: center;
    line-height: 20px;
}


/* #### slots tatus  */

.live_label:before {
    content: "•";
    margin-right: 10px;
}

.live_label:hover {
    cursor: pointer;
}

.live_label {
    color: rgba(221, 33, 33, 0.6);
    font-family: Montserrat;
    font-size: 19px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 18px;
}

.live_label_button {
    margin-top: 16%;
    margin-right: 40%;
}

.card-title.mini_stat {
    color: #000000;
    font-family: Montserrat;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

.card-title>.big_stat {
    color: #000000;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 22px;
    /* height: 15%; */
    margin: 0;
    margin-bottom: 5px;
}

.card-title.mini_stat.centered {
    text-align: center;
}

.card-text.card_ministat_value {
    color: var(--color-fleximodo_darkBlue);
    font-family: Montserrat;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 39px;
    text-align: center;
}

p.card_bigstat_content {
    margin-bottom: 0;
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

span.card_label_name {
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 16px;
}

.card-footer.card_bigstat_footer {
    background-color: #DDE3EF;
}


/* ##### user icons */

.user_role.admin:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f005";
    margin-right: 10px;
}

.user_role.operators:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f505";
    margin-right: 10px;
}

.user_role.user:before {
    font-family: "Font Awesome 5 Free";
    /* font-weight: 900; */
    content: "\f007";
    margin-right: 10px;
}

.user_role {
    color: var(--color-fleximodo_darkBlue);
    font-family: Montserrat;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 15px;
}


/*  user icons #####*/

.row_map_header {
    height: 20%;
}

.row_map_content {
    height: 75%;
}

.carpark_selector_dropdown {
    color: rgba(0, 0, 0, 0.6);
    font-family: Montserrat;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 15px;
}

.carpark_selector_badge {
    width: 28px;
    font-family: Montserrat;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 14px;
}


/* timepicker width fix  */

.bootstrap-datetimepicker-widget.dropdown-menu {
    width: 15rem !important;
}

.data_loading_msg_graphs {
    color: gray;
    font-size: 1.4em;
    animation: blinkLive 2s infinite;
}

.data_loading_msg {
    color: gray;
    font-size: 1.4em;
    animation: blinkLive 2s infinite;
}


@keyframes blinkLive {
    from {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}


.dropdown-item:active {
    background-color: var(--color-accent);
}   

a:hover {
    color: rgba(0,0,0,.7);
}