/* comenzi dashboard styling */
:root {
    --pauza-de-dulce-primary-hover: #ced9bd;
}

/* start common */
ol,
ul {
    margin: 0;
}

.clear {
    display: block;
    clear: both;
}

form {
    display: inline-block;
}

.form-control {
    border: 1px solid #ced4da;
    border-radius: 5px;
    font-weight: 600;
    color: #000;
}

.form-select {
    padding: .375rem 2.25rem .375rem .75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

body.modal-open {
    overflow: hidden;
}

body.modal-open::before {
    content: " ";
    position: fixed;
    background-color: color(srgb 0 0 0 / 0.5);
    z-index: 11;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.mt-2 {
    margin-top: 15px;
}

.pointer {
    cursor: pointer;
}

[data-viewport=mobile] {
    display: none;
}

/* end common */

.sidebar {
    background-color: #fff;
    bottom: 0;
    position: fixed;
    top: 0;
    transition: all .2s ease;
    width: 250px;
    z-index: 10;
}

.sidebar.closed {
    width: 50px;
}

[data-viewport=mobile].sidebar {
    display: none;
}

.sidebar ul {
    list-style-type: none
}

.sidebar .dropdown-menu {
    padding: 0;
    margin: 0;
}

.sidebar .dropdown-menu {
    height: 0;
    overflow: hidden;
    transition: linear .2s;
}

.sidebar.closed .dropdown-menu {
    transition: none;
}

.sidebar.closed .dropdown-menu.show {
    display: none;
}

.sidebar .dropdown-menu.show[data-viewport=dropdown-asteptare] {
    height: 135px;
}

.sidebar .dropdown-menu.show[data-viewport=dropdown-acceptate] {
    height: 270px;
}

.sidebar .dropdown-menu.show[data-viewport=dropdown-livrari] {
    height: 135px;
}

.sidebar .dropdown-menu li a {
    padding: 15px;
    display: block;
    font-size: 15px;
    background-color: #eeeeee;
}

.sidebar.closed .sidebar-menu li:hover .dropdown-menu li a {
    padding: 17px 20px 17px 20px;
}

.sidebar .dropdown-menu li a.selected {
    background-color: #fff;
    color: #e37f7d;
}

.sidebar-inner {
    position: relative;
    height: 100%
}

.sidebar-logo {
    border-bottom: 1px solid #e6ecf5;
    border-right: 1px solid #e6ecf5;
    line-height: 0;
    padding: 0 20px;
    transition: all .2s ease;
    height: 75px;
}

.sidebar-logo a {
    display: inline-block;
    width: 100%
}

.sidebar.closed .sidebar-logo {
    padding: 0;
}

.sidebar.closed .sidebar-logo a {
    width: 48px;
    overflow: hidden;
}

.sidebar.closed .sidebar-logo a .logo {
    width: 110px;
}

.sidebar-logo a .logo {
    background-position: center left;
    background-repeat: no-repeat;
    display: inline-block;
    margin: 0 auto;
    display: block;
}

.sidebar-logo a .logo img {
    height: 50px;
    width: auto;
    display: block;
    margin: 13px auto;
}

.sidebar.closed .sidebar-logo a .logo img {
    height: 38px;
    margin: 18px auto;
}

.sidebar-logo a .logo-text {
    color: #313435;
    text-align: center;
    margin-top: 15px;
}

.sidebar-logo .mobile-toggle {
    display: none;
    float: right;
    font-size: 18px;
    line-height: calc(65px - 1px)
}

.sidebar-logo .mobile-toggle a {
    color: #72777a
}

@media screen and (max-width: 991px) {
    .sidebar-logo .mobile-toggle {
        display: inline-block
    }
}

@media screen and (min-width: 992px)and (max-width: 1439px) {
    .sidebar-logo .mobile-toggle {
        display: none
    }
}

.sidebar-menu {
    border-right: 1px solid #e6ecf5;
    /* height: calc(100vh - 65px); */
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative
}

.sidebar.closed .sidebar-menu {
    border-right: none;
}

.sidebar-menu::before,
.sidebar-menu::after {
    content: " ";
    display: table
}

.sidebar-menu::after {
    clear: both
}

.sidebar-menu .dropdown-toggle::after {
    display: none
}

.sidebar-menu .sidebar-link.actived::before {
    background: #2196f3;
    border-radius: 50%;
    content: "";
    display: block;
    height: 8px;
    left: -4px;
    position: absolute;
    top: calc(50% - 4px);
    width: 8px
}


.sidebar-menu li {
    position: relative;
}

.sidebar-menu li.dropdown .arrow {
    font-size: 10px;
    line-height: 40px;
    position: absolute;
    right: 30px;
    transition: all .05s ease-in
}

@media screen and (max-width: 991px) {
    .sidebar-menu li.dropdown .arrow {
        right: 25px
    }
}

.sidebar-menu li.dropdown.open>a {
    color: #313435
}

.sidebar-menu li.dropdown.open>a .icon-holder {
    color: #0f9aee
}

.sidebar-menu li.dropdown.open>a>.arrow {
    transform: rotate(90deg)
}

.sidebar-menu li.dropdown.open>.dropdown-menu {
    display: block
}

.sidebar-menu li.dropdown.open>.dropdown-menu .dropdown-menu {
    padding-left: 20px
}

.sidebar-menu li.dropdown.open>.dropdown-menu .arrow {
    line-height: 25px
}

.sidebar-menu li a {
    color: #72777a;
    transition: all .3s ease
}

.sidebar.closed .sidebar-menu li a {
    transition: none;
}

.sidebar-menu li a.active,
.sidebar-menu li a:focus {
    -webkit-text-decoration: none;
    text-decoration: none;
}

.sidebar-menu li a:hover {
    color: #e37f7d;
    background-color: #fff;
}

.sidebar-menu li a:hover .icon-holder,
.sidebar-menu li a:focus .icon-holder {
    color: #0f9aee
}

.sidebar-menu>li.dropdown ul.dropdown-menu {
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0;
    border: 0;
    box-shadow: none;
    float: none;
    position: relative;
    width: 100%;
    padding: 0;
    text-indent: 30px;
}

.sidebar-menu>li.dropdown ul.dropdown-menu>li>a {
    display: block;
    padding: 10px 15px;
    font-size: 16px;
    height: 45px;
    line-height: 45px;
    text-indent: 5px;
}

.dropdown-menu a:hover,
.sidebar-menu>li.dropdown ul.dropdown-menu>li>a:focus {
    background-color: #cdd9bc;
    color: #313435;
}

.sidebar-link.active {
    background-color: #cdd9bc;
}

.sidebar-menu>li.dropdown ul.dropdown-menu>li.actived a {
    color: #313435
}

.sidebar-menu>li>a {
    display: block;
    font-size: 15px;
    font-weight: 500;
    padding: 20px 30px;
    position: relative;
    white-space: nowrap
}

.sidebar.closed .sidebar-menu>li>a {
    padding: 25px 25px;
}

.sidebar-menu>li>a.selected {
    background-color: #f9f9f9;
}

.sidebar-menu>li>a.selected::before {
    content: " ";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #e56061;
}

.sidebar-menu>li>a:after {
    content: " ";
    width: calc(100% - 40px);
    height: 1px;
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #e1e1e1;
}


.sidebar.closed .sidebar-menu>li>a:after {
    display: none;
}

.sidebar-menu>li>a .menu-icon {
    position: absolute;
    left: 10px;
    font-size: 18px;
    display: inline-block;
    width: 20px;
    text-align: center;
}

.sidebar.closed .sidebar-menu>li>a .menu-icon {
    left: 14px;
    top: 18px;
}


.sidebar-menu>li>a .label {
    padding-left: 10px;
}

.sidebar.closed .sidebar-menu>li>a .label {
    display: none;
}

.sidebar-menu>li>a.selected .menu-icon {
    color: #e9807e;
}

.sidebar-menu [data-viewport=dropdown-navigation] {
    float: right;
    transition: linear .2s;
}

.sidebar.closed .sidebar-menu [data-viewport=dropdown-navigation] {
    display: none;
}

.sidebar-menu [data-viewport=dropdown-navigation].opened {
    transform: rotateZ(90deg);
}

.sidebar-menu>li>a .icon-holder {
    border-radius: 6px;
    display: inline-block;
    font-size: 17px;
    height: 35px;
    left: 0;
    line-height: 35px;
    margin-right: 14px;
    position: relative;
    text-align: center;
    transition: all .3s ease;
    width: 35px
}

.sidebar-menu>li>a.dropdown-toggle .title {
    font-size: 16px;
    font-weight: 600;
}

.page-container {
    padding-left: 250px;
    transition: all .2s ease;
    background-color: color-mix(in srgb, #f8f9fa 90%, #000);
    margin-top: 65px;
}


.header {
    background-color: #fff;
    box-shadow: 6px 1px 10px #a3a3a3;
    display: block;
    margin-bottom: 0;
    padding: 0;
    position: fixed;
    transition: all .2s ease;
    width: calc(100% - 250px);
    z-index: 9;
    top: 0;
}

.header .header-container {
    height: 75px;
}

.header .dropdown-menu {
    background: var(--c-bkg-card);
    border: 1px solid var(--c-border)
}

[data-viewport=logged-user-dropdown] {
    position: absolute;
    width: 100%;
    border-radius: 5px;
    box-shadow: 0px 2px 5px #ccc;
}

[data-viewport=logged-user-dropdown] li a {
    display: block;
    font-size: 14px;
    padding: 10px;
    background-color: #fff;
}

.header .nav-left>li>a,
.header .nav-right>li>a {
    color: var(--c-text-base)
}

.header .nav-left>li>a:hover,
.header .nav-left>li>a:focus,
.header .nav-right>li>a:hover,
.header .nav-right>li>a:focus {
    color: var(--c-primary)
}

.dropdown-header {
    display: block;
    padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-dropdown-header-color);
    white-space: nowrap
}

/* start header */

.nav-right {
    float: right;
}

.nav-right,
.header .ul li {
    list-style-type: none;
}

.header-container[data-viewport=mobile] {
    display: none;
}

.header .avatar {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    overflow: hidden;
    float: left;
    margin-right: 10px;
}

.header .username {
    font-size: 14px;
    line-height: 45px;
}

.header .username .icon {
    float: right;
    font-size: 18px;
    margin-left: 10px;
    cursor: pointer;
    position: relative;
    top: 12px;
}

.header .username .icon:hover {
    color: #000;
}

.header .user-container {
    margin-top: 15px;
    margin-right: 25px;
    position: relative;
    float: right;
}

.toggle-menu-container {
    text-align: right;
    padding: 20px 25px 20px 20px;
}

.sidebar.closed .toggle-menu-container {
    text-align: center;
    padding: 20px 25px 10px 15px;
}

.toggle-menu-container .icon {
    font-size: 20px;
    color: #000;
    cursor: pointer;
}

.search-container {
    position: relative;
    floaT: right;
    margin-top: 20px;
    margin-right: 25px;
    min-width: 300px;
}

.search-container input {
    width: calc(100% - 33px);
    border-radius: 5px 0 0 5px;
    padding-right: 35px;
}

.search-container [data-action=search] {
    position: absolute;
    right: 0;
    top: 0;
    padding: 9px;
    background-color: #e56061;
    border-radius: 0 5px 5px 0;
    color: #fff;
    cursor: pointer;
    transition: all .2s;
}

.search-container [data-action=remove-input-search] {
    position: absolute;
    right: 39px;
    top: 5px;
    background-color: #e56061;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    transition: all .2s;
    padding: 5px;
    font-size: 14px;
    width: 15px;
    height: 15px;
    text-align: center;
    line-height: 16px;
}

.search-container [data-action=remove-input-search]:hover,
.search-container [data-action=search]:hover {
    background-color: #c53030;
}

.nav-left {
    float: left;
}

.header-container .nav-left {
    padding: 21px 15px 15px 25px;
}

.header-menu li {
    float: left;
}

.header-menu li a {
    display: block;
    height: 76px;
    text-align: center;
    line-height: 70px;
    padding-left: 20px;
    padding-right: 20px;
    transition: all .3s;
}

.header-menu li a.active {
    color: #000;
}

.header-menu li a:hover,
.header-menu li a.selected {
    background-color: #cdd9bc;
}

.sidebar.closed .sidebar-menu li:hover .dropdown-menu {
    display: block !important;
    height: auto !important;
    position: absolute;
    top: 0;
    left: 50px;
    min-width: max-content;
    box-shadow: 1px 2px 3px #b7b7b7;
}

.sidebar.closed .sidebar-menu li:hover .dropdown-menu:before {
    font-family: "Font Awesome 6 Free";
    content: "\f0da";
    position: absolute;
    font-size: 55px;
    z-index: 1;
    font-weight: bold;
    color: #fff;
    top: -6px;
    left: -16px;
}

/* end header */

/* start main */

main.main {
    position: absolute;
    width: calc(100% - 250px);
    height: calc(100% - 75px);
    background-color: #e7e7e7;
    bottom: 0;
    right: 0;
    overflow-y: auto;
    transition: all .3s;
}

.page-container.extended {
    padding-left: 50px;
}

.page-container.extended .header,
.page-container.extended main.main {
    width: calc(100% - 50px);
}

.main .container {
    width: calc(100% - 50px);
    margin: 20px 0 0 25px;
    border-radius: 5px;
}

.comenzi li {
    min-height: 150px;
}

/* end main */

/* start order */

.orders-wrapper:after,
.orders-wrapper .top-bar:after {
    clear: both;
    content: " ";
    display: block;
}

.orders-wrapper .top-bar .title {
    margin-bottom: 15px;
    margin-top: 15px;
}

.orders-wrapper .top-bar .title h3 i {
    margin-left: 10px;
    margin-right: 10px;
}

.orders-wrapper .top-bar .title h3 {
    font-size: 20px;
}

.orders-wrapper .comenzi {
    /* position: absolute;
    width: calc(100% - 25px);
    height: calc(100% - 140px);
    overflow-y: auto;
    top: 30px; */
}

.orders-wrapper .comenzi:after {
    clear: both;
    content: " ";
    display: block;
}

.orders-wrapper .comenzi.has-margin {
    margin-top: 20px;
    width: calc(100% - 275px);
    float: right;
}

.orders-wrapper .comenzi .no-orders {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
    padding: 14px;
    border-radius: 5px;
    text-align: center;
    display: block;
    font-weight: bold;
}

.orders-wrapper .comenzi.no-pagination {
    height: calc(100% - 70px);
}

.orders-wrapper .order-item {
    background-color: #fff;
    margin-bottom: 20px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0px 2px 5px #b5b5b5;
    width: calc(100% - 40px);
}

/* .orders-wrapper .order-item:nth-of-type(2n+2) {
    margin-right: 0;
} */

.orders-wrapper .order-item.personalizata {
    background-color: #f3f9e8;
}

.order-item .order-header:after {
    content: " ";
    display: block;
    clear: both;
}

.order-item .order-header .order-no-container {
    float: left;
    position: relative;
}

.order-item .order-header .order-price-container {
    float: right;
}

.order-item .order-header .order-price {
    font-size: 20px;
    float: right;
    padding: 7px;
    line-height: 20px;
}

.order-item .order-header .order-price-container.has_details .order-price {
    padding: 0;
}

.order-item .order-header .order-number {
    float: left;
    font-size: 20px;
    padding: 7px;
    line-height: 20px;
}

.order-item .order-header .order-number.manual {
    color: red !important;
}

.order-item .order-header .order-number.personalizata {
    border-radius: 5px;
    color: #2f2f2f;
}



.order-item .order-header .comanda-personalizata {
    display: inline-block;
    padding: 5px;
    font-size: 14px;
    border-radius: 5px;
    font-weight: 600;
    min-width: 100px;
    text-align: center;
    color: #fff;
    background-color: #ed4a47;
    border: 1px solid #ff5c59;
    position: absolute;
    left: 85px;
    font-size: 12px;
    top: -4px;
}

.order-body {
    margin-top: 10px;
    border-top: 1px solid #d9d9d9;
    padding-top: 15px;
}

.order-body .client-details {
    float: left;
    width: 40%;
}

.order-body .client-details .client-name,
.order-body .client-details .client-email,
.order-body .client-details .client-phone {
    font-size: 14px;
    margin-left: 10px;
    margin-top: 10px;
}

.order-body .client-details .order-date {
    font-size: 14px;
    margin-left: 10px;
    margin-top: 0;
}

.order-body .client-details .order-date i,
.order-body .client-details .client-email i,
.order-body .client-details .client-phone i,
.order-body .client-details .client-name i {
    margin-right: 5px;
}

[data-viewport=client-phone-value] a {
    border-bottom: 1px dotted #3333f7;
    color: #3333f7;
    border-width: 2px;
}

.order-header .order-date {
    float: left;
    padding: 10px;
    font-size: 14px;
}

.order-header .order-date i {
    margin-right: 3px;
}

.order-body .order-details {
    position: relative;
}

.order-header .order-status {
    float: left;
    padding: 10px;
    font-size: 14px;
    border-radius: 5px;
    font-weight: 600;
    min-width: 100px;
    text-align: center;
}


.order-header .order-personalizata {
    margin-left: 15px;
    background-color: #e98280;
    color: #fff;
    float: left;
    font-size: 14px;
    border-radius: 5px;
    padding: 10px;
}

.order-body .order-products {
    float: right;
    position: relative;
    vertical-align: middle;
    font-size: 14px;
    width: 60%;
}


.order-body .order-products .delivery-date {
    text-align: right;
    font-weight: bold;
    color: #2f6ccb;
}

.order-body .order-products .delivery-details {
    text-align: right;
    color: #7c7c7c;
    margin-top: 10px;
}

.order-body .order-products .delivery-details [data-viewport=delivery-time] {
    color: red;
    font-weight: 600;
}

.order-body .order-products .delivery-date i {
    margin-right: 5px;
}

.order-body .order-products .delivery-details .row-delivery {
    color: #2f6ccb;
}

.order-body .order-products .order-detail-row {
    margin-top: 10px;
    text-align: right;
    line-height: 16px;
    font-size: 13px;
}


.order-header .order-price-container.has_details .invoice-details {
    position: relative;
    top: 5px;
}

.order-body .invoice-details:after {
    clear: both;
    content: " ";
    display: block;
}

.order-header .invoice-details .paid-status,
.order-header .invoice-details .invoice-status {
    float: right;
    padding: 3px 0 5px 15px;
    font-size: 12px;
    border-radius: 5px;
    font-weight: 600;
    text-align: center;
}

.order-header .invoice-details .paid-status.platita,
.order-header .invoice-details .invoice-status.facturata {
    color: #00bd31;

}

.order-header .invoice-details .paid-status.neplatita,
.order-header .invoice-details .invoice-status.nefacturata {
    color: #d62727;
}


.order-status.primita {
    color: #fff;
    background-color: #467f38;
    border: 1px solid #098d00;
}

.order-status.procesare {
    color: #664d03;
    background-color: #fff3cd;
    border: 1px solid #ffecb5;
}

.order-status.respinsa {
    color: #842029;
    background-color: #f8d7da;
    border: 1px solid #f5c2c7;
}

.order-status.c_confirmata,
.order-status.confirmata {
    color: #0f5132;
    background-color: #d1e7dd;
    border: 1px solid #badbcc;
}

.order-status.productie {
    color: #fff;
    background-color: #c39500;
    border: 1px solid #e1a700;
}

.order-status.completa {
    color: #084298;
    background-color: #cfe2ff;
    border: 1px solid #b6d4fe;
}

.order-status.anulata {
    color: #842029;
    background-color: #f8d7da;
    border: 1px solid #f5c2c7;
}

.order-status.livrata {
    color: #141619;
    background-color: #d3d3d4;
    border: 1px solid #bcbebf;
}

.order-status.facturata {
    color: #910000;
    background-color: #ff7878;
    border: 1px solid #bcbebf;
}

.order-status.platita {
    color: #0a8300;
    background-color: #a3efa6;
    border: 1px solid #08bd00;
}


.order-status-wrap.disabled .order-status {
    opacity: .4;
    cursor: not-allowed;
}



.order-footer {
    margin-top: 10px;
    border-top: 1px solid #d9d9d9;
    padding-top: 15px;
    position: relative;
}

.order-item.personalizata .order-body,
.order-item.personalizata .order-footer {
    border-top: 1px solid #7d7d7d;
}

[data-viewport=order-details] {
    background-color: transparent;
    border: none;
    cursor: pointer;
    margin: 0 auto;
    font-size: 14px;
    font-family: inherit;
    font-weight: 600;
    margin-top: 10px;
}

[data-viewport=order-delete] {
    border: none;
    cursor: pointer;
    margin: 0 auto;
    font-size: 15px;
    font-family: inherit;
    font-weight: 600;
    background-color: transparent;
    padding: 10px;
    border-radius: 5px;
    color: #f44336;
    padding: 0;
    transition: all .2s;
}

[data-viewport=order-details]:hover {
    text-decoration: underline;
}

[data-viewport=order-delete]:hover {
    color: #d62727;
}

.total-display {
    width: calc(100% - 280px);
    float: right;
    padding: 20px 0 20px 20px;
    text-align: left;
}

.pagination {
    display: block;
    margin: 0 auto;
    text-align: center;
    width: calc(100% - 275px);
    float: right;
}

.pagination:after {
    clear: both;
    content: " ";
    display: block;
}

.pagination a {
    padding: 10px;
    background-color: #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 32px;
    font-weight: 700;
    margin-right: 10px;
}

.pagination a i {
    line-height: 30px;
}

.pagination a:hover {
    background-color: var(--pauza-de-dulce-primary-hover);
}

.pagination .next {
    float: right;
}

.pagination .prev {
    float: left;
}

.pagination span {
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 32px;
    padding: 10px;
    margin-right: 10px;
    background-color: #dddddd;
    font-weight: 700;
    border-radius: 50%;
}

.pagination span i {
    position: relative;
    top: 8px;
}

/* end order */

.filter-wrap {
    width: 250px;
    float: left;
    margin-top: 20px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0px 2px 5px #b5b5b5;
}



.filtru-container {
    padding: 3px 5px 5px 15px;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
    line-height: 27px;
    /* float: right; */
    font-weight: 600;
}


.calendar-view-container {
    margin-right: 15px;
    color: #000;
    display: inline-block;
    margin-left: 10px;
}

.orders-wrapper.calendar .top-bar {
    display: inline-block;
}

.orders-wrapper.calendar .filter-wrap {
    width: 100%;
    box-shadow: none;
    margin-top: 15px;
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s;
}

.orders-wrapper.calendar .filter-wrap.opened {
    max-height: 400px;
    margin-bottom: 20px;
}

.orders-wrapper.calendar .filter-wrap .filtru-container {
    display: inline-block;
}

.orders-wrapper.calendar .filter-wrap .filtru-container .items {
    float: right;
}

.orders-wrapper.calendar .filtru-container .item label {
    margin-left: 0;
}

.orders-wrapper.calendar .filtru-container select {
    margin-left: 0;
}

.orders-wrapper.calendar .filtru-container .item {
    margin-right: 10px;
    width: auto;
    min-width: 200px;
}


.sort-container {
    /* float: right; */
    padding: 10px 0 10px 15px;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
}

.sort-container select {
    font-size: 14px;
    font-weight: 600;
    margin-top: 10px;
}

.filtru-container select {
    font-size: 14px;
    font-weight: 600;
    margin-left: 5px;
    display: block;
    width: 100%;
}

.sort-container .label select option {
    color: #333;
}

.sort-container .label {
    display: inline-block;
    margin-top: 5px;
    margin-right: 5px;
}

.filtru-container .label {
    margin-top: 5px;
    margin-right: 10px;
    font-weight: normal;
    display: block;
}

.filtru-container .items {
    border-radius: 5px;
    /* float: right; */
    position: relative;
    top: -5px;
}

.filtru-container .items:after {
    content: " ";
    display: block;
    clear: both;
}

.filtru-container .item {
    float: left;
    padding: 5px 0 5px 0;
    width: 100%;
}

[data-viewport=filtru-livrata] {
    position: relative;
    top: 4px;
}

.filtru-container .item,
.filtru-container .item input,
.filtru-container .item label {
    cursor: pointer;
    color: #333;
}

.filtru-container .item label {
    margin-left: 7px;
}

.filter-dropdown-container {
    display: inline-block;
    width: calc(100% - 50px);
}

.orders-wrapper.calendar .filter-dropdown-container {
    width: calc(100% - 30px);
}

.filtru-container .item input {
    position: relative;
    top: 1px;
}

.btn-vezi-calendar,
[data-viewport=btn-calendar],
[data-viewport=btn-lista] {
    background-color: #ec6262;
    border: 1px solid #c53030;
    font-size: 14px;
    border-color: transparent;
    padding: 6px;
    border-radius: 5px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    color: #fff;
    transition: all .2s;
}

.btn-vezi-calendar {
    margin-left: 10px;
    color: #fff !important;
    display: inline-block;
    position: relative;
    top: 0;
    line-height: 18px;
}

.btn-vezi-calendar i,
[data-viewport=btn-calendar] i,
[data-viewport=btn-lista] i {
    font-size: 16px;
    float: left;
    width: 25px;
    text-align: center;
    margin-right: 5px;
}


.btn-vezi-calendar:hover,
[data-viewport=btn-calendar]:hover,
[data-viewport=btn-lista]:hover {
    background-color: #c53030;
}

[data-viewport=btn-report] {
    background-color: #007bff;
    border: 1px solid #007bff;
    font-size: 14px;
    border-color: transparent;
    padding: 6px;
    border-radius: 5px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    color: #fff;
    transition: all .2s;
    margin-right: 5px;
}


[data-viewport=add-order] {
    color: #084298;
    background-color: #cfe2ff;
    border: 1px solid #b6d4fe;
    font-size: 14px;
    border-color: transparent;
    padding: 6px;
    border-radius: 5px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    transition: all .2s;
}

[data-viewport=add-order]:hover {
    background-color: #9bbff5;
}

[data-viewport=add-order] i {
    float: left;
    margin-right: 5px;
}

button.disabled {
    opacity: .5;
    cursor: not-allowed;
}

/* start modal */

.modal-dialog {
    height: 700px;
    width: 1100px;
    background-color: #fff;
    z-index: 11;
    display: block;
    position: fixed;
    top: calc(50% - 350px);
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 5px;
    box-shadow: 0px 3px 10px #535353;
}

.modal-dialog .modal-header {
    padding: 20px;
    border-bottom: 1px solid #dbdbdb;
}

.modal-dialog .modal-title {
    font-size: 20px;
    display: inline-block;
}

.modal-title.manual {
    color: red;
}

.modal-dialog .modal-header i.fa-times {
    float: right;
    font-size: 22px;
    color: #000;
    cursor: pointer;
}

.modal-dialog .modal-body {
    padding: 20px;
    overflow-y: auto;
    overflow-y: auto;
    max-height: 520px;
    box-shadow: 0px 5px 10px #e1e1e1;
}

.modal-dialog .modal-body.manual {
    max-height: 510px;
}

.modal-dialog .modal-body:after {
    content: " ";
    clear: both;
    display: block;
}

.modal-dialog .modal-footer {
    padding: 20px;
    text-align: right;
}

.modal-dialog button {
    border-color: transparent;
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
    margin-left: 10px;
    font-family: inherit;
    font-weight: 600;
    color: #333;
}

.modal-dialog button.btn-secondary {
    background-color: #eee;
}

.modal-prompt button.btn-primary,
.modal-dialog button.btn-primary {
    background-color: #ced9bd;
}

.modal-prompt .btn-primary {
    position: relative;
}

.modal-prompt .btn-primary .lds-ring {
    top: -3px;
    left: -45px;
}

.modal-dialog button.btn-danger {
    background-color: #ec6262;
    border: 1px solid #d62727;
    color: #fff;
    transition: all .2s;
}

.modal-dialog button.btn-danger:hover {
    background-color: #d62727;
}

.modal-dialog [data-action=delete-order] {
    float: left;
    background-color: transparent !important;
    color: #333 !important;
    border: none !important;
    padding: 0;
    margin-top: 10px;
    font-size: 14px;
}

.modal-dialog [data-action=delete-order]:hover {
    text-decoration: underline;
}

.modal-dialog button.loading {
    position: relative;
}

.modal-dialog button.loading .lds-ring {
    left: 20px;
    top: -3px;
}

.order-no-container .lds-ring {
    top: -2px;
    right: -25px;
    left: unset;
}

.modal-dialog button.loading .value {
    visibility: hidden;
}

.edit-mode .form-control {
    margin-top: 10px;
}

.edit-mode select.form-control {
    height: 39px;
}

.form-control {
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 5px;
    font-size: 14px;
}

.form-control:focus {
    outline: none;
}

.form-control.edited {
    color: red;
}

[disabled].form-control {
    color: #999;
}



/* start modal prompt */

.modal-prompt {
    height: 200px;
    width: 500px;
    background-color: #fff;
    display: block;
    position: fixed;
    top: calc(50% - 100px);
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 5px;
    box-shadow: 0px 3px 10px #535353;
    z-index: 12;
}

.modal-prompt .modal-header {
    padding: 20px;
    border-bottom: 1px solid #dbdbdb;
}

.modal-prompt .modal-title {
    font-size: 20px;
    display: inline-block;
}

.modal-prompt .modal-header i.fa-times {
    float: right;
    font-size: 22px;
    color: #000;
    cursor: pointer;
}

.modal-prompt .modal-body {
    padding: 20px;
    overflow-y: auto;
    overflow-y: auto;
}

.modal-prompt .modal-body:after {
    content: " ";
    clear: both;
    display: block;
}

.modal-prompt .modal-footer {
    padding: 20px;
    text-align: right;
}

.modal-prompt button {
    border-color: transparent;
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
    margin-left: 10px;
    font-family: inherit;
    font-weight: 600;
    color: #333;
}


/* end modal prompt */


/* start modal status notes */

.modal-dialog .modal-status-notes {
    top: calc(50% - 280px);
    height: 545px;
}

.modal-dialog .modal-status-notes .modal-body {
    box-shadow: none;
}

.modal-status-notes {
    height: 500px;
    width: 500px;
    background-color: #fff;
    z-index: 11;
    display: block;
    position: fixed;
    top: calc(50% - 350px);
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 5px;
    box-shadow: 0px 3px 10px #535353;
}

.modal-status-notes .modal-content {
    padding: 20px;
}

.modal-status-notes .modal-header [data-type=status-list-note] {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 20px;
    color: 888;
    cursor: pointer;
}

.modal-status-notes .modal-body {
    margin-top: 20px;
}

.modal-status-notes .modal-body textarea {
    width: 100%;
    min-height: 375px;
    height: 375px;
    max-height: 375px;
    overflow-y: auto;
    max-width: 100%;
    min-width: 100%;
}

.modal-status-notes .modal-footer {
    margin-top: 15px;
    text-align: right;
}

.modal-status-notes [data-type=status-list-note][data-action=save] {
    position: relative;
}

.modal-status-notes [data-type=status-list-note][data-action=save] .lds-ring {
    left: -50px;
    top: -3px;
}

.modal-status-notes [data-type=status-list-note][data-action=save].disabled {
    opacity: .5;
    cursor: not-allowed;
}

/* end modal status notes */


/* start modal client details */

.client-details-container .editable-item {
    display: inline-block;
    position: relative;
}

.client-details-container .editable-item.extra-info {
    width: calc(100% - 20px);
    line-height: 20px;
}

.billing-details-wrapper.edit-mode .client-details-container .editable-item.nume_firma,
.billing-details-wrapper.edit-mode .client-details-container .editable-item.billing-adresa {
    display: block;
}

.billing-details-wrapper.edit-mode .client-details-container .editable-item.nume_firma input,
.billing-details-wrapper.edit-mode .client-details-container .editable-item.billing-adresa input {
    display: block;
    width: 75%;
}

.client-details-container .editable-item.extra-info textarea,
.client-details-container .editable-item.mesaj-personalizat textarea {
    max-width: 420px;
    max-height: 100px;
    min-height: 50px;
    min-width: 420px;
}


.client-details-container .editable-item.notes textarea {
    min-width: 450px;
    max-height: 130px;
    min-height: 130px;
}

.client-details-container .editable-item.notes textarea[disabled] {
    background-color: #f8f8f8;
}

.client-details-container .editable-item.first-name,
.client-details-container .editable-item.last-name {
    max-width: 200px;
}

.client-details-container .editable-item.billing-oras,
.client-details-container .editable-item.phone,
.client-details-container .editable-item.certificat-conformitate {
    margin-left: 15px;
}

.client-details-container .editable-item.billing-last-name input,
.client-details-container .editable-item.last-name input {
    margin-left: 15px;
}

.client-details-container .editable-item.ora-livrare,
.client-details-container .editable-item.oras-livrare {
    margin-left: 10px;
}

.client-details-container {
    padding-left: 10px;
}

.client-details-container .editable-item .label {
    display: block;
    font-size: 14px;
    color: #888;
}

.client-details-container .editable-item .value {
    padding: 10px 0px 10px 0px;
    color: #000;
}

.client-details-container .editable-item.phone .value a {
    border-bottom: 1px dotted #3333f7;
    color: #3333f7;
    border-width: 2px;
}

.client-details-container .editable-item.data-eveniment .value {
    color: #2f6ccb;
    font-weight: bold;
}

.client-details-container .editable-item .value.no-value:after {
    content: "N/A";
    color: #888
}

.client-details-container .editable-item.adresa-livrare {
    width: calc(100% - 50px);
}

.client-details-container input[name=adresa_livrare] {
    width: 100%;
}

.client-details-container .editable-item.data-eveniment #ui-datepicker-div {
    position: absolute !important;
    left: 0 !important;
    top: 60px !important;
}

.order-table .editable,
.notes-details-header .editable,
.client-details-header .editable,
.delivery-details-header .editable {
    position: absolute;
    right: -30px;
    color: #000;
    top: 6px;
    padding: 5px;
    border-radius: 5px;
    cursor: pointer;
}

.order-table .editable {
    right: -28px;
    top: -7px;
    text-indent: 0;
}

.notes-details-wrapper .editable:hover,
.order-table .editable:hover,
.client-details-header .editable:hover,
.delivery-details-header .editable:hover {
    background-color: #dfdfdf;
}

.notes-details-wrapper .notes-details-header {
    display: inline-block;
    position: relative;
}

.delivery-details-wrapper:before {
    position: absolute;
    width: 1px;
    height: 100%;
    background-color: #ccc;
    content: " ";
    top: 10px;
    right: 10px;
}

.billing-details-wrapper .client-details-header,
.delivery-details-wrapper .delivery-details-header,
.client-details-wrapper .client-details-header {
    margin-bottom: 20px;
}

.billing-details-wrapper .client-details-header h5,
.notes-details-wrapper .notes-details-header h5,
.client-details-wrapper .client-details-header h5 {
    font-size: 18px;
    padding: 10px;
    display: inline-block;
}

.client-details-wrapper {
    margin-top: 25px;
}

.billing-details-wrapper .client-details-header,
.client-details-wrapper .client-details-header,
.delivery-details-wrapper .delivery-details-header {
    display: inline-block;
    position: relative;
}

.delivery-details-wrapper .delivery-details-header h5 {
    font-size: 18px;
    padding: 10px;
}

.delivery-details-wrapper {
    float: left;
    width: calc(50% - 30px);
    position: relative;
}

.billing-details-wrapper {
    float: right;
    width: 50%;
    position: relative;
    margin-top: 25px;
}

.billing-details-wrapper:before {
    height: 125%;
    width: 1px;
    position: absolute;
    background-color: #ccc;
    content: " ";
    left: -40px;
    top: 10px;
}

.client-details-wrapper {
    float: left;
    width: calc(50% - 30px);
    position: relative;
}

.notes-details-wrapper {
    width: 50%;
    position: relative;
    float: right;
}

.order-status-item .paid-container,
.status-table .paid-container {
    position: relative;
    background-color: #fff;
    padding: 5px;
    top: 1px;
    width: 150px;
    border-radius: 5px;
    font-size: 14px;
}

.order-status-item .paid-container .paid-type,
.status-table .paid-container .paid-type {
    margin-bottom: 10px;
    margin-top: 5px;
}

.status-table .paid-container .label {}

.order-status-item .paid-container .value,
.status-table .paid-container .value {
    font-weight: 600;
    margin-top: 5px;
}

[data-viewport=payment-date].error {
    border-color: red;
}

.separator {
    background-color: #ccc;
}

.separator.horizontal {
    height: 1px;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* end modal client details */

/* end modal */


/* start status list */

[data-viewport=status-list-item] {
    display: inline-block;
    position: relative;
    margin-left: 10px;
}

[data-viewport=status-list-item] .lds-ring {
    left: 126px;
    top: -3px;
}

[data-viewport=status-list-item] .dropdown-container {
    position: absolute;
    background-color: #fff;
    z-index: 1;
    width: 100%;
    box-shadow: 1px 1px 3px #838383;
    border-radius: 5px;
    top: 38px;
}

[data-viewport=status-list-item] .dropdown-container .item {
    font-size: 14px;
    cursor: pointer;
    position: relative;
}

[data-viewport=status-list-item] .dropdown-container .item.old-status:after {
    width: calc(100% - 10px);
    height: 1px;
    background-color: #aaa;
    position: absolute;
    content: " ";
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
}

[data-viewport=status-list-item] .dropdown-container .item:hover {
    background-color: #eee;
}

[data-viewport=status-list-item] .dropdown-container .item .status-label {
    padding: 10px;
}

[data-viewport=status-list-item] .dropdown-container .item .status-label i {
    margin-right: 3px;
}


[data-viewport=status-list-item] .editable {
    float: right;
    cursor: pointer;
    padding-left: 5px;
}


[data-viewport=status-list-item].disabled .editable {
    cursor: not-allowed;
}


/* end status list */

/* start user list view */
.user-assign-container {
    float: right;
    position: relative;
}

.created-by-container {
    text-align: right;
    font-size: 14px;
    margin-top: 10px;
    margin-right: 15px;
    float: right;
}

.updated-by {
    font-size: 14px;
}

.created-by-container .updated-by.has-both {
    display: block;
    margin-top: 3px;
}

.modal-title.manual .greyed {
    color: #888;
}

.user-assign-container .lds-ring {
    position: absolute;
    float: left;
    left: -50px;
    top: -2px;
}

.user-assign-container .label {
    margin-right: 10px;
    font-size: 14px;
}

.user-assign-container .user-assigned {
    padding: 10px 10px 10px 10px;
    font-size: 14px;
    border-radius: 5px;
    font-weight: 600;
    min-width: 100px;
    text-align: center;
    display: inline-block;
    position: relative;
    background-color: #eee;
    border: 1px solid #eee;
    color: #333;
}

.user-assign-container .user-assigned.unassigned {
    min-width: 130px;
}

.user-assign-container .user-assigned span {
    padding-right: 15px;
}

.user-assign-container .user-assigned.unassigned {
    background-color: #eee;
    border: 1px solid #eee;
}

.user-assign-container .user-assigned.disabled {
    opacity: .4;
    cursor: not-allowed;
}

.user-assign-container .user-assigned .editable {
    position: absolute;
    right: 5px;
    color: #000;
    top: 5px;
    padding: 5px;
    border-radius: 5px;
    cursor: pointer;
}

.user-assign-container .user-assigned.disabled .editable:hover {
    color: #000;
}

.user-assign-container .user-assigned .editable:hover {
    color: #777;
}

/* end user list view 


/* start login */

.login-container {
    width: 300px;
    min-height: 385px;
    margin: 0 auto;
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    position: absolute;
    top: calc(50% - 190px);
    left: 0;
    right: 0;
    box-shadow: 0px 3px 8px #979797;
}

.login-container .logo-container {
    width: 150px;
    margin: 0 auto;
    padding-bottom: 20px;
}

.login-container .title h2 {
    font-size: 24px;
    text-align: center;
}

.login-container .form-container {
    width: 250px;
    margin: 20px auto;
}

.login-container .form-container p {
    display: block;
    margin-bottom: 20px;
}

.login-container .form-container label {
    margin-bottom: 10px;
    display: block;
    font-weight: 600;
    font-size: 14px;
}

.login-container .btn-login {
    background-color: rgb(229, 96, 97);
    color: rgb(255, 255, 255);
    padding: 9px;
    border: navajowhite;
    border-radius: 5px;
    font-size: 14px;
    width: 100%;
    font-weight: 600;
    cursor: pointer;
}

.login-container .form-control {
    min-width: 225px;
}

.login-container .login-error {
    color: #cb2e2e;
    font-size: 14px;
    background-color: #ffc8c8;
    padding: 10px;
    border-radius: 5px;
    font-family: 'Rubik';
}

/*end login */

/* start gallery */

#order-attachment-form {
    position: relative;
}

#order-attachment-form .lds-ring {
    right: -30px;
    left: unset;
    top: -1px;
}

#order-attachments-list li {
    position: relative;
}

#order-attachments-list .delete-attachment {
    position: relative;
}

#order-attachments-list .delete-attachment .lds-ring {
    right: -30px;
    left: unset;
    top: -5px;
}


/* end gallery */


/* animation loading */

.lds-ring {
    display: inline-block;
    position: absolute;
    width: 25px;
    height: 25px;
    z-index: 111;
    top: 5px;
    left: 150px;
}

.order-footer [data-viewport=order-details] .lds-ring {
    position: relative;
    width: auto;
    height: auto;
    z-index: 111;
    top: -12px;
    left: 0;
    padding-right: 0;
    float: right;
    margin-right: -30px;
}

.mini-prajituri .lds-ring {
    top: 34px;
    left: 83px;
}

.eltdf-shopping-cart-dropdown .lds-ring {
    top: -12px;
    left: unset;
    right: 2px;
}

.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 25px;
    height: 25px;
    margin: 8px;
    border: 4px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #afc297 transparent transparent transparent;
}


.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}

.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}

.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}

@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* end modal */