﻿@media (min-width: 992px) {
    .admin .table {
        font-size: 12px;
    }

    .portalsMenu {
        display: none !important;
    }
    /*CONTACT POAGE*/
    .contact-lable {
        padding-left: 1px;
    } 
    .contact-long-lable {
        padding-right: 1px;
    }
}

@media (max-width: 480px) {
    .navbar-brand img {
        max-width: 120px;
        margin-top: 7px;
    }
    .invoice-details-link {
        font-size: 12px;
    }
 
}

@media (max-width: 479px) {
    .portalsMenu, .ace-nav {
        display: inline-block !important;
    }

}

.step-content .step-pane:not(.active) {
    display: none;
}

.signup-box .wizard {
    background-color: #eee;
    -webkit-box-shadow: 2px 2px 5px #888888;
    -ms-box-shadow: 2px 2px 5px #888888;
    box-shadow: 2px 2px 5px #888888;
}

/** Re-style file input*/
.bootstrap-filestyle .btn {
    border-width: 1px;
}


/*Panels*/


.panel-blue {
    border-color: #6fb3e0;
}

    .panel-blue > .panel-heading {
        border-color: #6fb3e0;
        color: white;
        background-color: #6fb3e0;
    }

    .panel-blue > a {
        color: #6fb3e0;
    }

        .panel-blue > a:hover {
            color: #4f99c6;
        }

.panel-darkblue {
    border-color: #2c5976;
}

    .panel-darkblue > .panel-heading {
        border-color: #2c5976;
        color: white;
        background-color: #2c5976;
    }

    .panel-darkblue > a {
        color: #2c5976;
    }

        .panel-darkblue > a:hover {
            color: #4f99c6;
        }

.panel-green {
    border-color: #87b87f;
}

    .panel-green > .panel-heading {
        border-color: #87b87f;
        color: white;
        background-color: #87b87f;
    }

    .panel-green > a {
        color: #87b87f;
    }

        .panel-green > a:hover {
            color: #629b58;
        }

.panel-red {
    border-color: #d15b47;
}

    .panel-red > .panel-heading {
        border-color: #d15b47;
        color: white;
        background-color: #d15b47;
    }

    .panel-red > a {
        color: #d15b47;
    }

        .panel-red > a:hover {
            color: #b74635;
        }

.panel-yellow {
    border-color: #ffb752;
}

    .panel-yellow > .panel-heading {
        border-color: #ffb752;
        color: white;
        background-color: #ffb752;
    }

    .panel-yellow > a {
        color: #ffb752;
    }

        .panel-yellow > a:hover {
            color: #e59729;
        }


a.summary-link {
    color: #fff;
    font-size: 110%;
}

    a.summary-link .fa-3x {
        position: relative;
        left: -30px;
    }

    a.summary-link div {
        font-size: 115%;
    }

.list-link .pull-left {
    font-size: 110%;
}

.list-link .pull-right {
    font-size: 115%;
}

.summary .panel-footer {
    background-color: #fff;
}

/*Auto Complete*/
.bc-wrapper {
    position: relative;
}

    .bc-wrapper .bc-menu {
        position: absolute;
        z-index: 1000;
        width: 100%;
        display: none;
    }

.input-group .bc-wrapper .bc-menu {
    top: 38px;
}

.bc-wrapper .list-group-item {
    padding: 5px;
}

    .bc-wrapper .list-group-item:hover {
        background: #4f99c6;
        color: #ffffff;
    }


    /*color-profile update/ social media*/
.well-container {
    display: flex;
    flex-direction: column;
}
.end-btn {
    align-self: flex-end;
}
.btn-xs {
    font-size: 12px;
}
.btn-create {
    justify-content: end;
}

.dropzone {
    border: 1px solid rgba(34, 36, 38, 0.15);
    border-radius: .28571429rem;
}

    .dropzone .dz-preview {
        margin: 0;
    }

        .dropzone .dz-preview .dz-image {
            border-radius: 0;
        }

            .dropzone .dz-preview .dz-image img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }

    .dropzone .dz-details {
        display: none;
    }

/*images*/
.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
    display: block;
    max-width: 100%;
    height: auto;
}

/*panel*/
.panel {
    margin-bottom: 20px;
    margin-top: 8px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 1px rgb(0 0 0 / 5%);
}
.panel-default {
    border-color: #ddd;
}
.panel-default>.panel-heading {
    background-color: #f5f5f5;
    border-color: #ddd;
}
.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.panel-body {
    padding: 15px;
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}
.form-control, select {
    border-radius: 8px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    color: #858585;
    background-color: #fff;
    border: 1px solid #d5d5d5;
}

/*Form*/
.well {
    min-height: 20px;
    padding: 19px;
    margin: 0 8px;
    margin-bottom: 20px;
    background-color: var(--mf-gray-bg);
    border: 1px solid #e3e3e3;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
}
.shipping-btn {
    width: fit-content;
    position: absolute;
    right: 0;
    margin: 24px;
}
.create-invoice-title {
    position: relative;
}
@media (max-width: 575.98px) {
    .create-invoice-title {
    }
}
.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    color: #555;
    text-align: center;
    border-radius: 4px;
}
.bank-details-label {
    padding-right: 5px !important;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.form-horizontal .form-group {
    margin-right: -15px;
    margin-left: -15px;
}

.form-group {
    padding: 0.5rem;
}
.col-dir {
    flex-direction: column;
}

.row > * {
    margin-left: 0;
    margin-right: 0;
}

.page-header h1 {
    font-size: 30px;
}


.form-control-static {
    padding-top: 6px;
}

.number {
    max-width: 150px;
}

.modal-body .bold-label .form-group > div.col-sm-8:not(.col-md-4) {
    padding-top: 0;
}
.input-group .bootstrap-select {
    z-index: 4;
}

.bold {
    font-weight: 600 !important;
}

.vscroll {
    overflow-y: auto;
}

.max-height100 {
    max-height: 100px;
}

.max-height150 {
    max-height: 150px;
}

.max-height200 {
    max-height: 200px;
}


.debit {
    color: #b90707
}

.credit {
    color: #0e7e0b
}

.awaiting-balance .title {
    font-size: 12px;
    display: block;
    line-height: 12px;
    margin-top: 10px;
}

.awaiting-balance .value {
    font-size: 22px !important;
}

.awaiting-balance {
    font-weight: bold;
    line-height: 40px;
    box-shadow: #555 10px 0 inset;
    box-shadow: rgba(0, 0, 0, 0.2) 0 10px 10px inset;
}

    .awaiting-balance a {
        color: #fff;
    }

.menu-min .awaiting-balance {
    display: none;
}

.box {
    border-top: solid 5px #6fb3e0;
    padding: 20px;
}

    .box .row {
        line-height: 30px;
        margin-top: 3px;
        margin-bottom: 3px;
    }

    .box .row:not(:last-child) {
        border-bottom: solid 1px #e3e3e3;
    }

.form-horizontal .radio-inline:first-child {
    padding-left: 0;
}

.ltr {
    direction: ltr;
    text-align: right;
}

.label-green {
    background-color: #008000;
    color: #fff;
    min-width: 50px;
    font-weight: 700;
    display: inline-block;
    padding: 3px;
}

.label-yallow {
    background-color: #f1c500;
    color: #fff;
    min-width: 50px;
    font-weight: 700;
    display: inline-block;
    padding: 3px;
}

.hide-check .datatable-check {
    display: none;
}

.hide-action .datatable-action {
    display: none;
}


/**Floating Action Button**/

.actionfly-fab {
    display: inline-block;
    height: 40px;
    width: 50px;
    line-height: 36px;
    vertical-align: middle;
    text-decoration: none;
    text-align: center;
    transition: .2s ease-out;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12), 0 3px 1px -2px rgba(0,0,0,.2);
    cursor: pointer;
    color: #fff;
}

    .actionfly-fab:hover {
        border-color: black;
        border-width: 1px;
        border-style: dotted;
        background-color: #5ea5ce !important;
        box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
    }


.actionfly-btn-main {
    margin-left: 4px;
}

.actionfly-btn-sm {
    margin-right: 5px;
}

.actionfly-menu {
    list-style: none;
    float: right;
}
    .actionfly-menu li {
        display: inline-block;
    }


.scale-transition {
    transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
}

    .scale-transition.scale-out {
        transform: scale(0);
        transition: transform 0.2s !important;
    }

    .scale-transition.scale-in {
        transform: scale(1);
    }

.mf_tooltip {
    position: relative;
    display: inline-block;
}

    .mf_tooltip .mf_text {
        visibility: hidden;
        width: 120px;
        background-color: black;
        color: white;
        text-align: left;
        border-radius: 6px;
        padding: 2px;
        position: absolute;
        z-index: 1;
        bottom: 115%;
        left: 50%;
        margin-left: -60px;
    }

.mf_text {
    word-wrap: break-word !important;
    white-space: normal;
    text-align: center !important;
}

.mf_tooltip .mf_text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
}

.mf_tooltip:hover .mf_text {
    visibility: visible;
}

.product-list-thumb {
    max-width: 50px;
    max-height: 50px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 29px;
    margin-top: 8px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        background-color: white;
        transition: .4s;
        height: 15px;
        width: 15px;
        left: 1px;
        bottom: 2.5px;
    
    }

    .qr-frame {
        display: flex;
        flex-direction: row;
    }
    .hidden {
        display: none;
    }
   
    .currency-dropdown-list {
        z-index: unset !important;
    }
/*UPLOADER STYLE*/


/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.colorTheme {
    height: 50px;
}

.disabled {
    opacity: 0.65;
    pointer-events: none;
}

.cursor-not-allowed {
    cursor: not-allowed !important;
}


 
@media (min-width: 768px) {
    .modal-xl {
        width: 80% !important;
    }
    .space-around {
        padding-inline-start: 3rem;
    }
    .divider {
        margin: 15px 0 30px;
    }
}

@media (max-width: 767.98px) {
    .space-around {
        margin-inline-start: 1.5rem;
        padding-inline-end: 4.5rem;
    }
    .divider {
        margin: 15px 0 30px;
    }
}
@media (min-width: 575.98px) and (max-width: 768px) {
    .profile-image-section {
        width: unset;
    }
}

/*----------INTERNAL PAGES menuitem FIX ------------------*/
.breakLine {
    word-break: break-all !important;
}
.create-btn {
    margin-top: 7px;
}

.table {
    --bs-table-striped-bg: #f9f9f9;
}



.dataTables_wrapper .col-sm-6,
.dataTables_wrapper .col-sm-12,
.dataTables_wrapper .col-sm-7,
.dataTables_wrapper .col-sm-5,
#rolesAndNotifications .col-md-6 {
    padding-right: 0px;
    padding-left: 0px;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin: 2px;
    white-space: nowrap;
}
.pagination > .disabled > a {
    color: #777;
}
.well {
    margin-left: 0;
    margin-right: 0;
    margin-top: 4px;
}
table.dataTable {
border-left: 1px solid var(--bs-border-color);
}
a {
    text-decoration-line: none;
}
table.table-bordered {
    border-collapse: collapse !important;
}
#batch-invoice-tabs + .tab-content {
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373;
}
.label-inline {
    display: inline-block;
}
.align-end {
    text-align: end;
}
a {
    cursor: pointer;
}
.end-btn {
    text-align: end;
}
.input-group {
    flex-wrap: nowrap;
}
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
}

/*------------ Transactions Report Download Buttons  -------*/
@media only screen and (min-width: 768px) {
    .download-close {
        display: none;
    }

    .download-open {
        display: block;
    }
}

.download-menu-item {
    color: #333;
    padding: 8px 12px;
    font-size: 12px;
    width: max-content;
}

    .download-menu-item:hover {
    }