/*
Theme Name: FIPO login
Theme URI: https://weblogic-studio.com
Author: Weblogic
Author URI: https://weblogic-studio.com
Description: FIPO cloud blagajna
Version: 1.0.0
Text Domain: fipo
*/

/** single klijent **/

.klijent-sidebar {
  box-shadow: 0px 1px 15px 1px rgba(113, 106, 202, 0.08);
  width: 25%;
  margin-right: 1%;
}

.karticasadrzaja {
    box-shadow: 0px 1px 15px 1px rgba(113, 106, 202, 0.08);
}

.klijent-content {
  width: 75%;
}



.crveni {
  background: rgba(255, 0, 0, 0.6);
}

.m-datatable.m-datatable--default > .m-datatable__table > .m-datatable__body .m-datatable__row.crveni  > .m-datatable__cell > span {
   color: #fff;
}

.m-datatable.m-datatable--default > .m-datatable__table > .m-datatable__body .m-datatable__row.crveni  > .m-datatable__cell.broj > span > a {
   color: #fff;
}

.crveni .btn.m-btn--hover-accent:not(.btn-secondary):not(.btn-outline-light) i {
  color: #fff;
}



.zuti {
  background: rgba(255, 165, 0, 0.6);
}

.m-datatable.m-datatable--default > .m-datatable__table > .m-datatable__body .m-datatable__row.zuti  > .m-datatable__cell > span {
   color: #fff;
}

.m-datatable.m-datatable--default > .m-datatable__table > .m-datatable__body .m-datatable__row.zuti  > .m-datatable__cell.broj > span > a {
   color: #fff;
}

.zuti .btn.m-btn--hover-accent:not(.btn-secondary):not(.btn-outline-light) i {
  color: #fff;
}


.gumbilijevo {
  flex-grow: 2;
}

.izvjestajmodal {
    width:500px;
}

.klijent-content > .card-body {
    box-shadow: 0px 1px 15px 1px rgba(113, 106, 202, 0.08);
    margin-bottom:25px;
}

.izlazniracun-naslov, .napomenaizvjestaji {
  margin-bottom: 15px;
  display:block;
}

.nazivklijenta {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}

.malinaziv {
  text-transform: uppercase;
  font-size: 12px;
  margin-bottom: 5px;
  display: block;
}

.uredipodatke {
  text-align: center;
}


.nazivstavke {
  text-transform: none;
  font-size: 14px;
  margin-bottom: 5px;
  display: block;
  font-weight: 600;
  margin-top:25px;
}

.detaljikupca-content {
  margin-top: 35px;
}


.m-brand{
    width: 250px;
    background: none;
}
#m_header_nav{
    width: 1%!important;
}
#m_quicksearch{
    width: 190px!important;
}
.m-header--fixed .m-body{
    padding-top: 80px!important;
}
.admin-bar{
    padding-top: 32px;
}
form .error{
    font-size: 11px;
    color: red;
}

.m-login__logo img {
  width: 100%;
  height: auto;
  max-width: 240px;
}

.naslovpolja {
  padding-left: 30px;
  display: block;
  margin-top: 20px;
  position: inherit;
  font-weight:500;
}

.minitext {
  display: block;
  padding-left: 30px;
  font-size: 11px;
}

#invoice_name[readonly] {
  background: #fafafa;
}

.m-header--fixed.m-header--minimize-off .m-header{
    height: auto!important;
}
.m-header--fixed.m-header--minimize-on .m-header .m-header__bottom {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.m-datatable__pager-info .m-datatable__pager-size, .m-datatable__pager-info .m-datatable__pager-detail{
    float: left;
}
.delete-popup{
    position: absolute;
    left: 30px;
}
.no-table{
    min-height: 300px;
    font-size: 14px;
    padding: 20px 0;
}
.modal .modal-content .modal-header .close{
    min-height: 17px;
    cursor: pointer;
}

.form-control.outofstock{
    background-color: #fce4e4;
    border-color: #cc0033;
    color: #cc0033;
}
.form-control.outofstock + .sufix{
    color: #cc0033;
}

.has-popup{
    position: relative;
}
.has-popup button.absolute{
    position: absolute!important;
    top: 0;
    right: 0;
    width: 37.7px;
    height: 37.7px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.has-popup input:focus + button.absolute{
    border-left-color: #716aca;
}
.has-popup .sufix{
    position: absolute;
    top: 0;
    right: 0;
    width: 37.7px;
    height: 37.7px;
    line-height: 37.7px;
    text-align: center;
    color: #999;
}
.client-popup{
    position: absolute;
    width: 100%;
    top: 0;
    padding: 5px;
    border: solid 1px #ededed;
    background: #f8f8f8;
    z-index: 2;
}
.client-popup .box{
    width: 100%;
    max-height: 300px;
    min-height: 200px;
    overflow-y: scroll;
    margin-top: 5px;
    padding: 5px 0;
    border: solid 1px #ebedf2;
    border-radius: 3px;
    background: #fff;
}
.client-popup .client{
    display: block;
    padding: 5px 15px;
}
.client-popup .not-found{
    font-size: 13px;
    padding: 5px 10px;
}
.product-popup{
    position: absolute;
    width: 100%;
    top: 0;
    padding: 5px;
    border: solid 1px #ededed;
    background: #f8f8f8;
    z-index: 2;
}
.product-popup .box{
    width: 100%;
    max-height: 300px;
    min-height: 200px;
    overflow-y: scroll;
    margin-top: 5px;
    padding: 5px 0;
    border: solid 1px #ebedf2;
    border-radius: 3px;
    background: #fff;
}
.product-popup .table{
    display: table;
    width: 100%;
}
.product-popup .slc-product{
    display: table-row;
}
.product-popup .slc-product span{
    display: table-cell;
    padding: 10px 15px;
    color: #121212;
}
.product-popup .table .slc-product span{
    border-top: solid 1px #eee;
}
.product-popup .slc-product span.slc-title{
    font-weight: 500;
}
.product-popup .not-found{
    font-size: 13px;
    padding: 5px 10px;
}

.products .product{
    position: relative;
    margin-bottom: 10px;
    padding: 20px;
    border: solid 1px #ededed;
    background: #fafafa;
}
.products .product .delete{
    position: absolute;
    right: 10px;
    top:10px;
    cursor: pointer;
}
.products .price{
    font-size: 28px;
    margin-left: 5px;
}
.custom-select{
    cursor: pointer;
}
.align-right{
    text-align: right;
}
.strong{
    font-weight: 500;
}
.image-box{
    position: relative;
    display: inline-block;
}
.uploaded-image{
    margin-top: 10px;
    max-height: 150px;
}
.image-box.uploading .uploaded-image{
    opacity: 0.2;
}
.image-box.uploading::after{
    display: block;
    position: absolute;
    content: '';
    width: 30px;
    height: 30px;
    top: 50%;
    left: 50%;
    margin-top: -15px;
    margin-left: -15px;
    background: url(images/loading.gif);
}
.m-header .m-header__bottom{
    margin-top: 0!important;
    background: #4e1b9a !important;
}

.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon {
  color: #fff;
}
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text {
    color: #fff;
}

.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-icon {
  color: #fff;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.m-topbar__user-profile > .m-nav__link .m-topbar__welcome {
 color: #fff;
}

.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__hor-arrow {
  color: #fff;
}

.status-popup{
    position: absolute;
    margin-top: -25px;
    padding: 25px;
    padding-bottom: 15px;
    border: solid 1px #ededed;
    background: #fff;
    z-index: 999;
    max-width: 240px;
}
.status-popup .close{
    position: absolute;
    top: 2.5px;
    right: 2.5px;
}
.status-popup a{
    display: block;
    margin-bottom: 5px;
}

.m-widget24 .m-widget24__item .m-widget24__stats span{
    font-size: 14px;
}
.m-datatable__row.year-month td{
    position: relative;
    padding-top: 20px!important;
    padding-bottom: 15px!important;
    text-align: center;
}
.m-datatable__row.year-month td::before{
    display: block;
    position: absolute;
    content: '';
    top: 60%;
    left: 40px;
    right: 40px;
    height: 1px;
    background: #f4f3fb;
}
.m-datatable__row.year-month .date-label{
    position: absolute;
    font-size: 13px;
    background: #fff;
    padding: 0 20px;
    color: #575962!important;
    left: 50%;
    top: 60%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin-left: -30px;
}
.m-datatable__row.m-datatable__row--even.year-month .date-label{
    background: #fbfbfe;
}
.m-datatable__row.year-month .date-label .month{
    text-transform: capitalize;
}

.m-login.m-login--1 .m-login__aside {
  width:50% !important;
  padding: 0 !important;;
  margin: 0 auto !important;;
}

.m-login.m-login--1 .m-login__wrapper {
  overflow: hidden;
  max-width: 400px;
  width:100%;
  margin: 0 auto;
}

.m-stack.m-stack--desktop {
  position: relative;
}


.m-stack.m-stack--desktop.m-stack--hor > .m-stack__item {
  display: table-cell;
  vertical-align: middle;
}


.m-login.m-login--1 .m-login__wrapper .m-login__form .m-form__group .form-control {
  border: 1px solid #d1cfdc;
  padding: 1rem;
    padding-left: 1rem;
  margin-top: 0.1rem;
  border-radius: 25px;
  padding-left: 30px;
}

.m-login.m-login--1 .m-login__wrapper .m-login__form .m-form__group .form-control.m-login__form-input--last{

  border: 1px solid #d1cfdc;
  padding: 1rem;
    padding-left: 1rem;
  margin-top: 0.1rem;
  border-radius: 25px;
  padding-left: 30px;
}

.poljelabel {
  font-weight: 400;
  display: block;
  margin-bottom: 10px;
  margin-top: 20px;
}

.m-login.m-login--1 .m-login__wrapper .m-login__form .m-login__form-action .btn {
  display: inline-block;
  text-align: center;
  padding: 1.2rem 3rem;
  box-shadow: none;
  width: 100%;
  border-radius: 25px;
  background: #4e1b9a !important;
  text-transform: uppercase;
  font-size: 14px;
}

.m-stack.m-stack--desktop {
  display: table;
  table-layout: fixed;
}

.m-login__title {
  font-weight: 600;
  font-size: 32px !important;
  text-align: left !important;
  letter-spacing: -2px;
}

  @media (min-width: 1400px){
.m-container.m-container--responsive.m-container--xxl {
  width: 1500px;
}
}

@media all and (max-width:1279px){
    #m_quicksearch{
        display: none;
    }
}

  @media (min-width: 992px){
.modal-lg {
  max-width: 1200px;
}
}

@media all and (min-width:993px) and (max-width:1279px){
    .m-brand{
        width: 180px;
    }
    .m-header-menu .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text{
        font-size: 1rem;
    }
    .m-header-menu .m-menu__nav > .m-menu__item{
        padding: 0 15px;
    }
    .m-header-menu{
        display: table;
    }
    .m-brand .m-brand__tools{
        display: none!important;
    }
}
@media all and (min-width:993px) and (max-width:1132px){
    .m-brand{
        width: 160px;
    }
    .m-header-menu .m-menu__nav > .m-menu__item{
        padding: 0 10px;
    }
    .m-topbar .m-topbar__nav.m-nav > .m-nav__item.m-topbar__user-profile > .m-nav__link .m-topbar__username{
        font-size: 0.9rem;
    }
    .m-topbar .m-topbar__nav.m-nav > .m-nav__item.m-topbar__user-profile > .m-nav__link .m-topbar__welcome{
        font-size: 0.9rem;
    }
}

@media all and (max-width:992px){
    .m-header .m-header__bottom{
        height: auto!important;
    }
    
    .m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-icon {
  color: #333 !important;
}

.m-brand .m-brand__tools .m-brand__toggler span {
  background: #fff;
}

.m-dropdown.m-dropdown--mobile-full-width.m-dropdown--align-center > .m-dropdown__wrapper, .m-dropdown.m-dropdown--mobile-full-width > .m-dropdown__wrapper {
  max-width: 300px;
  margin: 0 auto;
  left: 50%;
  right: 50%;
  transform: translate(-50%,0%);
}

.m-brand .m-brand__tools .m-brand__toggler span::before, .m-brand .m-brand__tools .m-brand__toggler span::after {
  background: #fff;
}

#m_aside_header_menu_mobile_toggle {
  position: fixed;
  right: 25px;
  top: 20px;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.m-dropdown {
  position: absolute;
  right: 70px;
  top: 8px;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.m-topbar__user-profile > .m-nav__link .m-topbar__username {
  color: #fff;
}

.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon {
  color: #716aca !important;
}

.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text {
  color: #333 !important;
}

.m-aside-header-menu-mobile .m-menu__nav > .m-menu__item > .m-menu__heading .m-menu__link-text, .m-aside-header-menu-mobile .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text {
  font-weight: 400;
  font-size: 1.2rem !important;
  text-transform: initial;
}
    
    .m-login__signin {
  padding-left: 10%;
  padding-right: 10%;
}


    .tekstdesno {
        display:none !important;
    }
    
    .m-login.m-login--1 .m-login__aside {
  width: 100% !important;
}
    .m-stack.m-stack--desktop.m-stack--ver > .m-stack__item {
        display: table-cell;
        vertical-align: top;
        width: 100%;
        height: 100%;
        background: none!Important;
    }
    .m-header--fixed-mobile .m-topbar{
        top: 0%;
    }
    .m-topbar{
        background: none;
    }
    #m_header_nav{
        width: 0px!important;
    }
    .modal-dialog{
        max-width: 90%!important;
    }
}
@media all and (max-width:768px) {
.m-dropdown.m-dropdown--mobile-full-width.m-dropdown--align-center > .m-dropdown__wrapper, .m-dropdown.m-dropdown--mobile-full-width > .m-dropdown__wrapper {
  max-width: 300px;
  margin: 0 auto;
  left: 50%;
  right: 50%;
  transform: translate(-50%,0%);
}
}
@media all and (max-width:479px){
    .col-2{
        flex: 0 0 30%;
        max-width: 30%;
    }
}
@media all and (max-width:379px){
    #m_header_topbar {
        right: 0;
        top: 70px;
        height: auto !important;
        background: #fff;
        padding: 5px 20px;
    }
}