/* Estilos para celdas en tabla */

.cell-text td {
  font-size: 13px !important;
}

.cell-text tfoot td, .cell-text thead th {
  font-size: 13.5px !important;
}

.cell-text td .row span {
  font-size: 20px !important;
}

.cell-text td .row .col.cell-quant {
  width: 20%;
  height: 100%;
  padding: 0px !important;
  margin: 4px 0px;
}

.cell-text td .row .col.cell-modify-quant {
  width: 80% !important;
  height: 100%;
  /*padding: 0px !important;*/
}

.cell-text td .row .col.cell-modify-quant button {
  width: 30px !important;
  font-size: 2px !important;
  padding: 0px !important;
  margin: -17px !important;
  height: 24px !important;
}

.more-button, .more-button:hover {
  background-color: var(--bs-success);
  border-top-left-radius: 120px;
  border-top-right-radius: 120px;
  margin-bottom: 1px !important;
}

.less-button, .less-button:hover {
  background-color: var(--bs-red);
  border-bottom-left-radius: 120px;
  border-bottom-right-radius: 120px;
  margin-top: 1px !important;
}

.less-button, .more-button {
  /*border-radius: 20px;*/
  /*border-top-left-radius: 120px;*/
  /*border-top-right-radius: 120px;*/
  width: 100% !important;
}

.cell-text td > .row {
  width: 100% !important;
  /*padding: 3px !important;*/
  /*display: block !important;*/
}

.img-container {
  height: 100% !important;
  margin: -6px;
}

.barcode-img {
  width: 100% !important;
  height: 100% !important;
  /*margin: 0px !important;*/
}

.adapt-row {
  margin-left: 0px !important;
  margin-right: 0px !important;
  width: 100% !important;
}

.mini-image {
  width: 100% !important;
  height: auto;
  border-radius: 10% !important;
}

.article-icon {
  padding: 1px !important;
  max-width: 50px !important;
}

.barcode-container {
  width: 100% !important;
  padding: 0px !important;
}

.dynamic-detail-link {
  padding: 0px !important;
  width: 100% !important;
}

.main-branding-background-color {
  background-color: #29a3a3 !important;
}

.main-branding-text-color {
  color: #29a3a3 !important;
}

.bg-gradient-primary {
  background-color: #29a3a3;
  background-image: linear-gradient(180deg, #29a3a3 10%, #086e88 100%);
  background-size: cover;
}

.down-button, .up-button {
  width: 100% !important;
  border-color: #095252 !important;
}

.down-button {
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;
  background-color: white;
  color: #29a3a3;
}

.down-button:hover {
  background-color: rgba(41,163,163,0.17);
  color: #29a3a3;
}

.up-button {
  border-top-right-radius: 30px;
  border-top-left-radius: 30px;
  background-color: #29a3a3;
}

.up-button:hover {
  background-color: #5ce1e1;
}

.gray-span {
  background-color: var(--bs-gray-400);
  border-radius: 12px;
}

.more-quant-button, .less-quant-button {
  /*height: 50% !important;*/
  /*width: 50% !important;*/
  /*font-size: 16px;*/
}

.delete-button {
  background-color: red !important;
  border-radius: 15px !important;
  color: var(--bs-gray-300);
}

.center-placeholder::placeholder {
  text-align: center;
}

#dataTable table#dataTable th, #dataTable table#dataTable td {
  vertical-align: middle;
}