/*
navbar personalizada en:
http://work.smarchal.com/twbscolor/

*/
:root {
  --bs-success-rgb: 56, 142, 60;
  --bs-body-font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.btn-success {
  --bs-btn-bg: #4caf50;
  --bs-btn-border-color: #4cae4c;
  --bs-btn-hover-bg: #5cb85c;
  --bs-btn-hover-border-color: #4cae4c;
  --bs-btn-active-bg: #4caf50;
  --bs-btn-active-border-color: #4cae4c;
  --bs-btn-disabled-bg: #4caf50;
  --bs-btn-disabled-border-color: #4cae4c;
}

.table.table-striped > thead > tr {
  --bs-table-bg: #c8efca;
  --bs-table-border-color: #b5cdb5;
  color: var(--bs-table-color);
  border-color: var(--bs-table-border-color);
}
.navbar .navbar-brand {
  color: #f7f7f7;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #e8f5e9;
}
.navbar .navbar-text {
  color: #f7f7f7;
}
.navbar .navbar-nav > li > a {
  color: #f7f7f7;
}
.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus {
  color: #e8f5e9;
}
.navbar .navbar-nav > .active > a,
.navbar .navbar-nav > .active > a:hover,
.navbar .navbar-nav > .active > a:focus {
  color: #e8f5e9;
  background-color: #4caf50;
}
.navbar .navbar-nav > .open > a,
.navbar .navbar-nav > .open > a:hover,
.navbar .navbar-nav > .open > a:focus {
  color: #e8f5e9;
  background-color: #4caf50;
}
.navbar .navbar-toggle {
  border-color: #4caf50;
}
.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
  background-color: #4caf50;
}
.navbar .navbar-toggle .icon-bar {
  background-color: #f7f7f7;
}
.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #f7f7f7;
}
.navbar .navbar-link {
  color: #f7f7f7;
}
.navbar .navbar-link:hover {
  color: #e8f5e9;
}

@media (max-width: 767px) {
  .navbar .navbar-nav .open .dropdown-menu > li > a {
    color: #f7f7f7;
  }
  .navbar .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #e8f5e9;
  }
  .navbar .navbar-nav .open .dropdown-menu > .active > a,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #e8f5e9;
    background-color: #4caf50;
  }
}

.thumb-name {
    font-weight: bold;
    display: block;
}
.stock-counter {
    opacity: 0.8;
    position: absolute;
    margin-top: 5px;
    right: 21px;
}
.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777;
    border-radius: 10px;
}

.low-stock-alert {
    opacity: 0.8;
    position: absolute;
    margin-top: 5px;
    left: 21px;
    color: red;
}
.item-quantity {
    font-size: 40px;
}
.current-stock {
    font-size: 16px;
    font-weight: bold;
}
.item-number {
    font-size: 20px;
}
.item-title {
    font-size: 23px;
    font-weight: bold;
}
.item-price {
    font-size: 23px;
    font-weight: bold;
	color: #388e3c;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #3c763d;
    border-color: #ccc;
}
a {
	color: #3c763d;
}

#loader {
  display: flex;
  justify-content: center;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}