@import "fonts.css";
@import "tables.css";

.bg-primary{ background: var(--primary)!important; }
.bg-secondary{ background: var(--secondary)!important; }
.bg-third{ background: var(--third)!important; }
.bg-alternative{ background: var(--alternative)!important; }
.bg-sidebar{ background: var(--alternative)!important };
.bg-paper{ background: var(--paper-body)!important };
.bg-light {background-color: #cce7d0;}
.bg-warning-light {background: #FFCC29;}

.bg-primary a { color: white; }

.text-color-primary{ color: var(--primary)!important; }
.text-color-secondary{ color: var(--secondary)!important; }
.text-color-third{ color: var(--third)!important; }
.text-color-alternative{ color: var(--alternative)!important; }
.text-color-sidebar{ color: var(--sidebar-text)!important; }
.text-color-sidebar-dark{ color: var(--sidebar-text-dark)!important; }

.title-font-size-10{ font-size: .5em!important; }
.title-font-size-12{ font-size: .75em!important; }
.title-font-size-14{ font-size: 1em!important; }
.title-font-size-16{ font-size: 1.15em!important; }
.title-font-size-18{ font-size: 1.35em!important; }
.title-font-size-20{ font-size: 1.5em!important; }
.title-font-size-22{ font-size: 1.75em!important; }
.title-font-size-24{ font-size: 2em!important; }
.title-font-size-26{ font-size: 2.15em!important; }
.title-font-size-28{ font-size: 2.25em!important; }
.text-gold {
    color: palegoldenrod;
}
.border-color-primary{ border-color: var(--primary)!important; }
.border-color-secondary{ border-color: var(--secondary)!important; }
.border-color-third{ border-color: var(--third)!important; }
.border-color-alternative{ border-color: var(--alternative)!important; }
.border-strong {border-width: 4px!important;}
.custom-control-input:checked ~ .custom-control-label{
  color: var(--third);
}
.custom-control-input:checked ~ .custom-control-label::before{ 
  background-color: var(--third);
  border-color: var(--third);
}
button.btn, a.btn, input.btn {font-family: var(--heading-font);height: fit-content;font-size: 14px;    border-radius: 12px;}
.btn.btn-secondary{ background: var(--secondary); color: var(--primary);border-color: var(--secondary); }
.btn.btn-alternative{ background: var(--alternative); color: white;border-color: var(--alternative); }
.btn.btn-third{ background: var(--third); color: var(--header-light);border-color: var(--third); }
.btn.btn-icon {border-radius: 10px;box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%);}
.btn.btn-sm {  }
.btn{ border-radius: 5px}

.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: start;
  background: #00000014;
  /* opacity: 0.5; */
  z-index: 3050;}
  .loader img {
    max-width: 4em;
    background: white;
    border-radius: 80px;
    padding: 10px;
    margin: auto;
    -webkit-animation:spin .5s linear infinite;
    -moz-animation:spin .5s linear infinite;
    animation:spin .5s linear infinite;}
    @-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
    @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
    @keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }}

.shadow-xs  {box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);}
.shadow-sm  {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);}
.shadow {box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);}
.shadow-md  {box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);}
.shadow-lg  {box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);}
.shadow-xl  {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);}
.shadow-2xl {box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);}
.shadow-inner {box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);}
.shadow-outline {box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);}
.shadow-none  {box-shadow: none;}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: var(--primary);
  height: 36px;}

.product-thumbnail {
  width: 40px;
  height: 40px;
  display: flex;}
  .product-thumbnail img {
    display: block;
    margin: auto;}

@media (min-width: 768px){ .sidebar.toggled { transition:  all .4s; overflow: visible; width: 0 !important; display: none; } }

.pac-container{ z-index: 91827; }
.card .card-header {
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
}
.card .card-footer {
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
}
.card.disabled {
  opacity: 0.5;}
  .card.disabled:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 150;}
a.card:hover{ text-decoration: none; color: unset; }

.icon-primary{
  color: var(--primary);
  }

.alert.alert-app {
    background: var(--third);
    color: white;
    border: 0;
    border-radius: 20px;
    position: absolute;
    z-index: 9;
    top: 4em;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 40%;
    width: 100%;
    color: white;
}
.iti.iti--allow-dropdown {
    display: block;
    flex: 1;
}

.bell{
  display:block;
  width: 40px;
  height: 40px;
  font-size: 40px;
  margin:50px auto 0;
  color: #9e9e9e;
  -webkit-animation: ring 4s .7s ease-in-out infinite;
  -webkit-transform-origin: 50% 4px;
  -moz-animation: ring 4s .7s ease-in-out infinite;
  -moz-transform-origin: 50% 4px;
  animation: ring 4s .7s ease-in-out infinite;
  transform-origin: 50% 4px;
}

@-webkit-keyframes ring {
  0% { -webkit-transform: rotateZ(0); }
  1% { -webkit-transform: rotateZ(30deg); }
  3% { -webkit-transform: rotateZ(-28deg); }
  5% { -webkit-transform: rotateZ(34deg); }
  7% { -webkit-transform: rotateZ(-32deg); }
  9% { -webkit-transform: rotateZ(30deg); }
  11% { -webkit-transform: rotateZ(-28deg); }
  13% { -webkit-transform: rotateZ(26deg); }
  15% { -webkit-transform: rotateZ(-24deg); }
  17% { -webkit-transform: rotateZ(22deg); }
  19% { -webkit-transform: rotateZ(-20deg); }
  21% { -webkit-transform: rotateZ(18deg); }
  23% { -webkit-transform: rotateZ(-16deg); }
  25% { -webkit-transform: rotateZ(14deg); }
  27% { -webkit-transform: rotateZ(-12deg); }
  29% { -webkit-transform: rotateZ(10deg); }
  31% { -webkit-transform: rotateZ(-8deg); }
  33% { -webkit-transform: rotateZ(6deg); }
  35% { -webkit-transform: rotateZ(-4deg); }
  37% { -webkit-transform: rotateZ(2deg); }
  39% { -webkit-transform: rotateZ(-1deg); }
  41% { -webkit-transform: rotateZ(1deg); }

  43% { -webkit-transform: rotateZ(0); }
  100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
  0% { -moz-transform: rotate(0); }
  1% { -moz-transform: rotate(30deg); }
  3% { -moz-transform: rotate(-28deg); }
  5% { -moz-transform: rotate(34deg); }
  7% { -moz-transform: rotate(-32deg); }
  9% { -moz-transform: rotate(30deg); }
  11% { -moz-transform: rotate(-28deg); }
  13% { -moz-transform: rotate(26deg); }
  15% { -moz-transform: rotate(-24deg); }
  17% { -moz-transform: rotate(22deg); }
  19% { -moz-transform: rotate(-20deg); }
  21% { -moz-transform: rotate(18deg); }
  23% { -moz-transform: rotate(-16deg); }
  25% { -moz-transform: rotate(14deg); }
  27% { -moz-transform: rotate(-12deg); }
  29% { -moz-transform: rotate(10deg); }
  31% { -moz-transform: rotate(-8deg); }
  33% { -moz-transform: rotate(6deg); }
  35% { -moz-transform: rotate(-4deg); }
  37% { -moz-transform: rotate(2deg); }
  39% { -moz-transform: rotate(-1deg); }
  41% { -moz-transform: rotate(1deg); }

  43% { -moz-transform: rotate(0); }
  100% { -moz-transform: rotate(0); }
}

@keyframes ring {
  0% { transform: rotate(0); }
  1% { transform: rotate(30deg); }
  3% { transform: rotate(-28deg); }
  5% { transform: rotate(34deg); }
  7% { transform: rotate(-32deg); }
  9% { transform: rotate(30deg); }
  11% { transform: rotate(-28deg); }
  13% { transform: rotate(26deg); }
  15% { transform: rotate(-24deg); }
  17% { transform: rotate(22deg); }
  19% { transform: rotate(-20deg); }
  21% { transform: rotate(18deg); }
  23% { transform: rotate(-16deg); }
  25% { transform: rotate(14deg); }
  27% { transform: rotate(-12deg); }
  29% { transform: rotate(10deg); }
  31% { transform: rotate(-8deg); }
  33% { transform: rotate(6deg); }
  35% { transform: rotate(-4deg); }
  37% { transform: rotate(2deg); }
  39% { transform: rotate(-1deg); }
  41% { transform: rotate(1deg); }

  43% { transform: rotate(0); }
  100% { transform: rotate(0); }
}

.card.card-stats {
  margin-bottom: 1em;
  max-width: 200px;
    border-radius: 20px;}
  .card.card-stats .card-body {
    padding: 1em 0em;}
  .card.card-stats .card-text {
    text-align: center;
    font-size: 100%;
    font-family: var(--heading-black);
    color: var(--third);}
  .card.card-stats .card-title {
    font-size: 1em;
    text-align: center;
    color: #524e53;
    margin-bottom: 0.5em;
    font-family: var(--heading-font);}

.sidebar .nav-item ul {
    display: none;}
.sidebar .nav-item.active ul {
    display: block;
    list-style: none;
    padding-bottom: 0;
    padding-left: 38px;
    padding-top: 7px;
}
.sidebar .nav-item.active ul li.nav-item.active a.nav-sublink {
    font-family: 'Poppins SemiBold';
}
  .sidebar .nav-item.active ul li a {
    color: var(--primary);
    font-size: 14px;
    font-family: 'Poppins Light';
}
  .sidebar .nav-item.active ul li {
    margin-bottom: 8px;
  }
  .sidebar-dark .nav-item.active ul .nav-item.active .nav-sublink
  {
    color:  #ffffff;
    font-weight: bold;
  }
.sidebar .nav-item {
    position: relative;
    margin-bottom: 1px;
}
.navbar-nav {
    background: white;
}
.sidebar .nav-item .nav-link:hover, .sidebar .nav-item.active .nav-link {
    background: #a5e59f;
    border-radius: 10px;
    color: var(--primary);
}
.sidebar .nav-item.active .nav-link i, .sidebar .nav-item.active .nav-link, .sidebar .nav-item:hover .nav-link {
    opacity: 1;
}

.sidebar .nav-item .nav-link i, .sidebar .nav-item .nav-link {
    opacity: 0.6;
}
.sidebar .nav-item .nav-link {
    display: block;
    width: 100%;
    text-align: left;
    padding: 7px 5px 7px 9px;
    font-family: 'Poppins Light';
}
.sidebar .sidebar-heading {
    padding: 5px 0 11px 0;
    text-transform: none!important;
    font-size: 12px;
    font-family: 'Poppins Regular';
    font-weight: unset;
}


.sidebar-dark .nav-item .nav-link i, 
.sidebar-dark .nav-item ul li i {
  color: rgba(255, 255, 255, 0.7);
  font-size: 18px;
  width: 30px;
  text-align: center;}
.sidebar .nav-item .nav-link span {
    font-size: 14px;
    display: inline;}
.sidebar .nav-item.active .nav-link {
    font-family: 'Poppins Bold';
}
.checkbox-button .checkbox-button-input:checked ~ .checkbox-button-label {
    background: var(--third);
    color: white;
}
.checkbox-button .checkbox-button-label {
    display: block;
    text-align: center;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 0;
    border-radius: 10px;
    cursor: pointer;
    padding: 0 5px;
    font-size: 10px;
    margin-top: 0;
}
.checkbox-button .checkbox-button-input {
    position: absolute;
    opacity: 0;
}
.checkbox-button {
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 95px;
}
.checkbox-button .checkbox-button-label:before {
    content: '';
    height: 95px;
    width: 100%;
    top: 0;
    position: absolute;
    left: 0;
    border: 1px solid lightgray;
    border-radius: 10px;
}
.badge.badge-md {
    font-family: 'Poppins Bold';
    color: white;
    padding: 3px 7px;
    border-radius: 10px;
}

.badge-success {
    color: #fff;
    background-color: #43a047;
}
.dropdown-toggle::before{content: unset!important;}
.dropdown-item.disabled, .dropdown-item:disabled {color: #c3c3c3;}  
#wrapper #content-wrapper {
    background-color: #f5f5f5;}
.on-paper .form-control {
    border: 0;
    border-radius: 10px;
}
.on-paper .input-group-text {
    background: white;
    border: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}
.card {
    border-radius: 20px;
}
.card-link {
    cursor: pointer;
}
.card-link:hover {
    background: #f2fff1;
    border-color: #f2fff1;
}
label {
    display: inline-block;
    font-size: 12px;
    margin-top: 0.5em;
    margin-bottom: 0.25em;
}
.input-group-text{font-size: 14px;}

#myTab .nav-item .nav-link i {
    margin-right: 5px;
}
#myTab .nav-item .nav-link {
    font-size: 14px;
    padding: 10px;
}
.nav-tabs .nav-link.active {color: var(--primary);
    background-color: #fff;
    border: none;
    border-radius: 10px;}
.nav-tabs .nav-link {
    color: #a1a1a1;
}
.nav-tabs .nav-link:hover { border:  0; }
.modal-content {
    border-radius: 14px;
}
a:hover {
    color: unset;
    text-decoration: unset;
}
.badge.badge-box {
    background: #00cd0040;
    font-size: 15px;
    height: 30px;
    width: 30px;
    padding: 7px;
    color: var(--primary);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: var(--primary);
    height: unset;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -2px rgb(0 0 0 / 5%)!important;
}
.nav-pills .nav-link {
    border-radius: 9px;
    font-size: 14px;
    padding: 5px 12px;
    height: unset;
    line-height: 18px;
}

.navigatorWrong a {
  color: white;
  text-decoration: underline;
}
.navigatorWrong img {
  max-width: 20px;
}
.navigatorWrong {
  position: fixed;
  bottom: 0;
  width: 100%;
  text-align: center;
  background: var(--alternative);
  color: white;
  padding: 5px 0;
}
.input-group > .input-group-append > .btn { height: 100%; }

.color-selector .custom-control-inline.color-three .custom-control-label {
    background: #D3AA5C;
}

.color-selector .custom-control-inline.color-two .custom-control-label {
    background: #80AD3C;
}

.color-selector .custom-control-inline.color-one .custom-control-label {
    background: #2980B9;
}
.color-selector .custom-control-label {
    width: 20px;
    height: 20px;
    background: #F0F0F0;
    border-radius: 5px;
}