﻿.header-grid {
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 3fr 1fr;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    height: 55px;
}

.header-grid-with-text {
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 3fr 1fr;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
}

.header-grid.fullrow {
    grid-template-columns: 1fr;
}

.header-grid-status {
    justify-self: end;
}

.login-page {
    /* background-image: url("/images/bg-login.jpg"); */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #00c5b4;
}

.card-status-body {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
}

iframe {
    position: absolute;
    border: none;
    top: 57px;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-bottom: 57px;
}

.card-body.card-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2em;
}

.card-primary:not(.card-outline) > .card-header {
    background-color: #0bc3ab;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active {
    background-color: #0bc3ab;
    color: #fff;
}

[class*="sidebar-dark-"] .nav-treeview > .nav-item > .nav-link.active, [class*="sidebar-dark-"] .nav-treeview > .nav-item > .nav-link.active:focus, [class*="sidebar-dark-"] .nav-treeview > .nav-item > .nav-link.active:hover {
    background-color: #0bc3ab;
    color: white;
}

.status-block-vendor {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "assignemnt completed"
        "assignemnt canceled"
}

.status-block-vendor-offer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "offerstatus spacer"
        "assignemnt completed"
        "assignemnt canceled"
        "gridm gridm"
}

.status-block-vendor-offerstatus {
    grid-area: offerstatus;
    padding-inline-end: 40px;
}

.status-block-vendor-assignment {
    grid-area: assignemnt;
    padding-inline-end: 40px;
}

.status-block-vendor-completed {
    grid-area: completed;
    padding-inline-end: 20px;
}

.status-block-vendor-canceled {
    grid-area: canceled;
    padding-inline-end: 20px;
}

.specific-details-vendor-box {
    padding: 14px;
    width: 12em;
}

.status-block-vendor-spacer {
    grid-area: spacer;
    padding-inline-end: 20px;
}

.status-block-vendor-gridm {
    grid-area: gridm;
    padding-top: 30px;
}

.cleaner-form-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-areas:
        "name name image"
        "surname surname image"
        "gender gender image"
        "vendor vendor vendor"
        "uploader uploader uploader";
}

.cleaner-form-name {
    grid-area: name;
}

.cleaner-form-surname {
    grid-area: surname;
}

.cleaner-form-gender {
    grid-area: gender;
}

.cleaner-form-vendor {
    grid-area: vendor;
}

.cleaner-form-image {
    grid-area: image;
    justify-self: end;
    padding: 10px;
    text-align: end;
}

.cleaner-form-uploader {
    grid-area: uploader;
}

.cleaner-avatar {
    width: 128px;
    max-width: 128px;
    padding: 0 10px;
}

button#btn3, button#btn1 {
    height: 30px;
    margin: 15px 5px 0 5px;
    min-width: 116px;
}

.badge-quotes {
    color: #000;
    background-color: cyan;
}

.badge-bookings {
    color: #fff;
    background-color: rebeccapurple;
}

.small-box.quotes {
    background: cyan;
}

.small-box.bookings {
    background: rebeccapurple;
    color: white;
}

.e-multi-select-wrapper .e-chips {
    background-color: #0bc3ab;
    height: 26px;
}

.e-multiselect .e-multi-select-wrapper .e-chips .e-chipcontent {
    -webkit-text-fill-color: white;
}

.e-rowcell.quote {
    background-color: rebeccapurple;
}

.e-rowcell.quote-tact {
    background-color: coral;
}

.e-rowcell.bio {
    background-color: greenyellow;
}

.e-rowcell.mikonos {
    background-color: orange;
}

.e-rowcell.bid {
    background-color: cyan;
}

.is-tactical{
    background-color: orange;
}
.cl-btn-group {
    display: flex;
    justify-content: flex-end;
    margin: 20px;
}

.cleaner-form-checkbox {
    line-height: 40px;
}

    .cleaner-form-checkbox .e-checkbox-wrapper.e-wrapper {
        padding: 0 10px 0 0;
    }

.form-row-button {
    align-self: flex-end;
    padding: 5px;
}


@media (min-width:1000px) {
    .dialog-item {
        max-width: 30%;
        display: inline-block;
    }

    .specific-details-box .e-checkbox-wrapper.e-wrapper {
        width: 49%;
    }

    .specific-details-box .e-float-input.e-control-wrapper {
        width: 49%;
        margin-bottom: 15px;
    }

    .status-block .e-checkbox-wrapper.e-wrapper {
        width: 20% !important;
    }

    .status-block .e-float-input.e-control-wrapper {
        width: 39%;
    }

    .status-block-full .e-float-input.e-control-wrapper {
        width: 100% !important;
    }


    .card-status-bid-body {
        display: grid;
        grid-template-columns: 3fr 1fr;
    }

    .assigned-cleaners-box {
        width: 100%;
    }

    .assign-cleaners-btn-box {
        margin-top: 20px;
        margin-left: 20px;
    }

    .assign-block {
        display: flex;
    }
}

@media (max-width:1000px) {
    .offer-btns button {
        width: 45%;
        margin: 0 auto;
        margin-top: 20px;
        margin-right: 10px;
    }

    .card-status-bid-body.e-float-input.e-control-wrapper.e-valid-input {
        width: 100%;
    }
}
