:root {
  --bs-kalicel-rojo: #fe0000 !important;
}

.pending-cell {
  color: var(--bs-warning);
}

.btn-baja {
  background-color: var(--bs-kalicel-rojo);
}

.btn-alta {
  background-color: var(--bs-success);
}

.btn-alta:hover {
  box-shadow: 1px 1px rgb(41, 147, 45);
  background-color: var(--bs-success) !important;
}

.btn-alta:hover {
  background-color: var(--bs-success);
  box-shadow: 1px 1px rgb(41, 147, 45);
}

.btn-baja:hover {
  box-shadow: 1px 1px rgb(241, 37, 37);
  background-color: var(--bs-kalicel-rojo);
}

.btn-alta:active {
  box-shadow: 0 0 0 0.25rem limegreen;
  border-color: lime;
  background-color: var(--bs-success);
}

.btn-baja:active {
  box-shadow: 0 0 0 0.25rem darkred;
  border-color: #990909;
  background-color: var(--bs-kalicel-rojo);
}

.btn-alta:active:focus {
  box-shadow: 0 0 0 0.25rem limegreen;
  border-color: lime;
  background-color: var(--bs-success);
}

.dropdown .dropdown-list .dropdown-header {
  background-color: var(--bs-kalicel-rojo) !important;
  border: 1px solid var(--bs-kalicel-rojo) !important;
  padding-top: .75rem;
  padding-bottom: .75rem;
  color: #fff;
}

.fas.fa-laugh-wink {
  color: var(--bs-kalicel-rojo) !important;
}

.sidebar-brand-icon.rotate-n-15 {
  background-color: #00ff00;
}

.div-botón-añadir, .div-vecino-botón-añadir {
  width: 50%;
  vertical-align: middle;
}

.container-personalizado {
  display: flex;
}

element.style {
  height: 100%;
}

.btn-baja {
  background-image: linear-gradient(144deg, #9f1212, #ee0505 50%, #e70a0a);
}

.btn-alta {
  background-image: linear-gradient(144deg, #24c835, #07f411 50%, #48a946);
}

.sidebar.sidebar-dark.accordion.bg-gradient-primary {
  background-image: linear-gradient(144deg, #430703, #bb0f0f 50%, #c91206) !important;
}

.submit-formulario {
  background-color: #8b0000;
}

.submit-formulario:hover {
  background-color: #e41c1c;
}

.status-pendiente, .status-listo, .status-entregado {
  color: white;
}

.btn-status {
  height: 100%;
}

.btn-status:has(.status-pendiente) {
  background-color: orangered;
  color: white;
  content: "Pendiente";
}

.btn-status:has(.status-pendiente):hover {
  background-color: green;
  color: white;
  content: "¡Listo!";
}

.btn-status:has(.status-listo) {
  background-color: green;
  color: white;
  content: "Listo";
}

.btn-status:has(.status-listo):hover {
  background-color: blue;
  color: white;
  content: "¡Entregado!";
}

.btn-status:has(.status-entregado) {
  background-color: blue;
  color: white;
  content: "¡Entregado!";
}

.btn-status:has(.status-entregado):hover {
  background-color: orangered;
  color: white;
}

details-comments {
  min-width: 400px !important;
}

a[data-bs-toggle="tab"].nav-link {
  color: var(--bs-kalicel-rojo) !important;
}

a[data-bs-toggle="tab"].nav-link:active {
  color: gray !important;
}

custom-bg {
  background-color: var(--bs-kalicel-rojo) !important;
}

@media (min-width: 768px) {
  .modal-dialog {
    max-width: 80% !important;
  }
}