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

    .fulfillment__toggle .inputToggle {
        margin: 0 20px;
    }
    @media (max-width: 768px){
        .fulfillment__toggle .inputToggle {
            margin: 0 10px;
        }
    }

.fulfillment__salonBox svg,
.fulfillment__iiaaBox svg {
    fill: #ECECEC;
    width: 70px;
}
@media (max-width: 768px){
    .fulfillment__salonBox svg,
    .fulfillment__iiaaBox svg {
        width: 50px;
    }
}

.fulfillment__salonBox,
.fulfillment__iiaaBox {
    padding: 20px;
    border: 5px solid #ECECEC;
    border-radius: 10px;
}
@media (max-width: 768px){
    .fulfillment__salonBox,
    .fulfillment__iiaaBox {
        padding: 5px;
    }
}

.fulfillment--salon .fulfillment__salonBox,
.fulfillment--iiaa .fulfillment__iiaaBox {
    border-color: #A1E6E0;
    transition: .4s;
}

    .fulfillment--salon .fulfillment__salonBox svg,
    .fulfillment--iiaa .fulfillment__iiaaBox svg {
        fill: #59807C;
        transition: .4s;
    }

.details--salon,
.details--iiaa {
    display: none;
}

.fulfillment--salon .details--salon,
.fulfillment--iiaa .details--iiaa {
    display: block;
    -webkit-animation: fade-in 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.15s both;
    animation: fade-in 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.15s both;
}

.settings__fulfillment {
    display: flex;
    flex-wrap: wrap;
}

.settings__section {
    padding: 40px 0;
    border-bottom: 3px solid #D8D8D8;
}

    .settings__section:last-of-type {
        border: none;
    }

    .settings__section > h3 {
        display: block;
        width: 100%;
        margin-bottom: 20px;
    }

    .settings__section h3:not(:first-of-type) {
        margin-top: 40px;
    }

.fulfillment__details {
    flex-basis: 50%;
    flex-grow: 1;
    /*margin-left: 40px;*/
}

.settings__loyalty {
    position: relative;
}

    .settings__loyalty .inputToggle {
        position: absolute;
        top: 42px;
        right: 0;
    }

@media (max-width: 768px) {
    .settings__loyalty .inputToggle {
        position: relative;
        margin-left: 70px;
        top: 0;
    }
}

.settings__therapists .therapist {
    display: flex;
    padding: 4px 0;
    margin: 3px 0;
}

.settings__therapists > h3 .button {
    float: right;
}

.settings__therapists > h3 {
    margin-bottom: 36px;
}

.settings__therapists .button {
    min-width: 58px;
}

.therapist__name {
    flex-grow: 1;
    color: #676E73;
    font-size: 18px;
    font-weight: 400;
}

.settings__deliveryContainer,
.addeditTherapist {
    max-height: 0px;
    overflow: hidden;
    transition: 0.5s all ease-in-out;
    opacity: 0;
}

    /*.settings__deliveryContainer .settings__delivery {*/
    /*    border-bottom: 3px solid #D8D8D8 !important;*/
    /*}*/

    .settings__deliveryContainer.active,
    .addeditTherapist.active {
        max-height: 500px;
        opacity: 1;
    }

        .addeditTherapist.active.edit .button.delete {
            display: block !important;
        }





#fulfillmentToggle .toggleSlider {
    margin-top: 0;
    margin-left: 0;
}

#salonships:disabled + span {
    opacity: 0.2;
}


#SkinConcerns > div {
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
    border-bottom: 1px solid #ccc;
}
#SkinConcerns.toggles p {
    margin-bottom: 0;
}

#ProductProperties > div {
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
    border-bottom: 1px solid #ccc;
}
#ProductProperties.toggles p {
    margin-bottom: 0;
}

#MedicalCautions > div {
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
    border-bottom: 1px solid #ccc;
}
#MedicalCautions.toggles p {
    margin-bottom: 0;
}

/*#PartnerProducts {*/
/*    display: flex;*/
/*}*/

.section-actions {
    position: relative;
    padding: 1rem 0;
    text-align: right;
}

.additional-information-actions {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-top: 25px;
}
    .additional-information-actions .bordered-btn.del {
        margin: 0;
    }

.product-image-actions {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-top: 25px;
}

    .product-image-actions .bordered-btn.del {
        margin: 0;
    }



.variantimages {
    display: flex;
    flex-direction: column;
}
.variant-images h3 {
    margin-top: 1rem;
}
    .variantimages .image-content {
        display: flex;
        flex-direction: row;
    }
    .variantimages .image-src {
        flex: 1;
        align-self: center;
        text-align: center;
        padding: 0.5rem;
    }

    .variantimages .image-src img{
        max-width: 100%;
    }
    .variantimages .image-details {
        flex: 1;
        align-self: center;
    }

.variant-images .add-image {
    position: relative;
    top: auto;
    right: auto;
}
.variant-images .actions {
    padding: 1rem 0;
    text-align: right;
}


/*.prescribing-options h3 {*/
/*    margin-top: 1rem;*/
/*}*/
/*.prescribing-options-actions {*/
/*    display: flex;*/
/*    margin-top: 1rem;*/
/*}*/

/*    .prescribing-options-actions .bordered-btn.add {*/
/*        position: relative;*/
/*        top: auto;*/
/*        right: auto;*/
/*    }*/

/*.prescribing-option {*/
/*    display: flex;*/
/*    flex-direction: row;*/
/*    height: 40px;*/
/*    border-bottom: 1px solid #ccc;*/
/*    align-items: center;*/
/*    justify-content: space-between;*/
/*}*/


/*.prescribing-options-actions input::placeholder { */
/*    color: #A6A6A6;*/
/*    opacity: 0.8; */
/*}*/



.product-list-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}
    .product-list-actions .bordered-btn.add {
        position: relative;
        top: auto;
        right: auto;
    }





.export-container {
    margin: 1rem 0;
    text-align: right;
}


.filter-options {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.filter-column {
    display: flex;
    flex-direction: column;
}

.filter-item-container {
    margin-bottom: 1rem;
}

    .filter-item-container  input {
        background: none;
        padding-left: 0;
        border: 1px solid #BFBFBF;
        outline: none;
        width: 100%;
        margin-top: 10px;
    }
    .filter-item-container select {
        background: none;
        padding-left: 0;
        border: 1px solid #BFBFBF;
        outline: none;
        width: 100%;
        margin-top: 10px;
    }

.filter-item-container .filter-item-body.body-2-col {
    display: flex;
    flex-direction: row;
}

.filter-item-container .with-label input {
    margin-top: 0;
}

.head-option h2 {
    margin-bottom: 0;
}
.head-option:hover {
    cursor: pointer;
}

.newvoucher {
    height: 100%;
    max-height: 0;
    margin-top: 0;
    overflow: hidden;
}

.newvoucher.hide {
    overflow: hidden;
    max-height: 0;
    margin-top: 0;
    animation: hideNewVoucher .2s ease-in-out;
}

.newvoucher.show {
    max-height: 300px; /* This should be larger than the fully expanded height */
    margin-top: 40px;
    animation: showNewVoucher .2s ease-in-out;
}

@keyframes hideNewVoucher {
    0% { max-height: 300px; margin-top: 40px; } /* This should match the value on .newvoucher.show */
    100% { max-height: 0; margin-top: 0; } /* This should match the value on .newvoucher.hide */
}

@keyframes showNewVoucher {
    0% { max-height: 0; margin-top: 0; } /* This should match the value on .newvoucher.hide */
    100% { max-height: 300px; margin-top: 40px; } /* This should match the value on .newvoucher.show */
}

.filter-options-container {
    height: 100%;
    max-height: 0;
    margin-top: 0;
    overflow: hidden;
}

.filter-options-container.hide {
    overflow: hidden;
    max-height: 0;
    margin-top: 0;
    animation: hideVoucherFilters .2s ease-in-out;
}

.filter-options-container.show {
    max-height: 400px;
    margin-top: 40px;
    animation: showVoucherFilters .2s ease-in-out;
}

@keyframes hideVoucherFilters {
    0% { max-height: 400px; margin-top: 40px; }
    100% { max-height: 0; margin-top: 0; }
}

@keyframes showVoucherFilters {
    0% { max-height: 0; margin-top: 0; }
    100% { max-height: 400px; margin-top: 40px; }
}

.head-option h2 i {
    width: 14px;
    height: 14px;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    display: block;
    position: absolute;
    right: 30px;
    top: 30px;
    transform: rotate(45deg);
    transition: 0.2s all;
    transform-origin: 12px 10px;
}

.head-option h2.active i {
    transform: rotate(-135deg);
}

.voucher-table-header {
    margin: 1rem 0;
}

.voucher-table-header strong {
    font-weight: bold;
}

.order__orderedBy a,
.order__salon a {
    color: #6B6C6E;
}
    .order__orderedBy a:hover,
    .order__salon a:hover {
        cursor: pointer;
        border-bottom: 1px solid #6B6C6E;
    }


.details__info  a {
    color: #6B6C6E;
}
    .details__info a:hover {
        cursor: pointer;
        border-bottom: 1px solid #6B6C6E;
    }

.no-results p{
    text-align: center;
    font-size: 1.5rem;
    margin-top: 2rem;
}


.sql-log-table {
    
}
    .sql-log-table td {
        border: 1px solid #d4d4d4;
        padding: 5px;
    }
    th.command-column,
    td.command-column {
        white-space: normal;
        word-break: break-all;
        word-wrap: break-word;
        width: 40%;
    }
th.parameters-column,
td.parameters-column {
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word;
    width: 30%;
}

.delete-button-container {
    float: right;
}

.salon-admin-actions {
    display: flex;
    justify-content: space-between;
}

#promotionsmanager table tr td{
    opacity: 0.5;
}
#promotionsmanager table tr td.view,
#promotionsmanager table tr.active td {
    opacity: 1;
}
/* removing ability to delete variants and products */
.product__variant .additional-information-actions .bordered-btn.del,
#ProductDetails > div > a.del {
	display:none;
}


.brand-filters ul {
    list-style: none;
    margin: 0 0 25px 0;
    padding: 0;
    display: flex;
}
    .brand-filters ul li {
        position: relative;
        position: relative;
        padding-left: 60px;
        padding-right: 30px;
    }
        .brand-filters ul li:first-child {
            padding-left: 0;
            font-weight: bold;
        }
        .brand-filters ul li .switch {
            right: initial;
            left: 5px;
            top: 2px;
        }



.properties-list ul.brands-filter {
    height: auto;
    list-style: none;
    padding: 0;
    overflow: hidden;
    display: flex;
}

    .properties-list ul.brands-filter li {
        margin: 5px;
        padding: 7px 50px 7px 5px;
        background: #f6f6f7;
        display: flex;
        align-items: center;
        position: relative;
        flex: 1;
    }


#productpickerpopup ul.brands-filter {
    height: auto;
    list-style: none;
    padding: 0;
    overflow: hidden;
    display: flex;
    margin-top: 40px;
    margin-bottom: 10px;
}

    #productpickerpopup ul.brands-filter li {
        margin: 5px;
        padding: 7px 50px 7px 5px;
        background: #f6f6f7;
        display: flex;
        align-items: center;
        position: relative;
        flex: 1;
    }
        #productpickerpopup ul.brands-filter li label {
            right: 8px;
        }

        #productpickerpopup .modal__main {
            margin-top: 0;
            max-height: calc(100vh - 225px);
        }





.salon__topTherapists ol {
    padding-left: 0px;
    counter-reset: item;
    list-style-type: none;
    display: table;
    width: 100%;
}

    .salon__topTherapists ol li {
        display: table-row;
    }

        .salon__topTherapists ol li:before {
            content: counter(item) " ";
            counter-increment: item;
            margin-right: 10px;
            position: absolute;
        }

.salon__topTherapists ul {
    padding-left: 0px;
}

    .salon__topTherapists ul li {
        list-style-type: none;
    }

.salon__topTherapists .therapistName {
    width: 50%;
    padding-right: 20px;
    display: table-cell;
    padding-left: 20px;
}

@media (max-width: 768px) {
    .salon__topTherapists .therapistName {
        width: auto;
    }
}

.salon__topTherapists .therapistValue {
    display: table-cell;
    padding-left: 16px;
}



.salon__stats {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}