:root {
  --primary: #b31d15 !important;
  --white: #ffffff !important;
  --marketing: #df8823 !important;
  --logistica: #4f81ff !important;
  --administracion: #00ba59 !important;
  --comercial: #d0170d !important;
  --industrial: #9279ff !important;
  --negocios: #ecbd00 !important;
  --business: #de799b !important;
  --finanzas: #4f81ff !important;
}
/* Colores de fondo */
.bg-primary-aden {
  background-color: var(--primary) !important;
}

.bg-blocked {
  background-color: #f8423f !important;
}

.bg-disabled {
  background-color: #9fb3ff !important;
}

.bg-mkt {
  background-color: var(--marketing) !important;
}
.bg-logistica {
  background-color: var(--logistica) !important;
}
.bg-comercial {
  background-color: var(--comercial) !important;
}
.bg-industrial {
  background-color: var(--industrial) !important;
}

.bg-administracion {
  background-color: var(--administracion) !important;
}

.bg-negocios {
  background-color: var(--negocios) !important;
}

.bg-business {
  background-color: var(--business) !important;
}

.bg-finanzas {
  background-color: var(--finanzas) !important;
}

.bg-green {
  background-color: #3bd39c !important;
}

.text-blocked {
  color: #f8423f !important;
}

.red {
  color: #cc1f2f !important;
}

.grey {
  color: #616161 !important;
}

.red-bg {
  background-color: #cc1f2f !important;
}

.red-soft-bg {
  background-color: #fff7f7 !important;
}

.green {
  color: #3bd39c !important;
}

.green-bg {
  background-color: #3bd39c !important;
}

.green-soft-bg {
  background-color: #f7fffc !important;
}

.yellow {
  color: #e0bd28 !important;
}

.yellow-bg {
  background-color: #e0bd28 !important;
}

.yellow-soft-bg {
  background-color: #fffef7 !important;
}
/* Colores de texto */

.w-text {
  color: #ffffff;
}
/* Botones */
.btn-aden {
  background-color: white;
  padding: 10px;
  text-align: center;
  border: 0.5px solid black;
  border-radius: 5px;
  transition: 0.1s all;
}
.btn-aden:hover {
  -webkit-box-shadow: -1px 8px 5px -10px rgba(77, 77, 77, 1) !important;
  -moz-box-shadow: -1px 8px 5px -10px rgba(77, 77, 77, 1) !important;
  box-shadow: -1px 8px 5px -10px rgba(77, 77, 77, 1) !important;
  transition: 0.1s all;
}
.btn-primary-inline {
  border: 0.5px solid var(--primary) !important;
  color: var(--primary) !important;
}
.btn-mkt-inline {
  border: 0.5px solid var(--marketing) !important;
  color: var(--marketing) !important;
}

.btn-administracion-inline {
  border: 0.5px solid var(--administracion) !important;
  color: var(--administracion) !important;
}
.btn-industrial-inline {
  border: 0.5px solid var(--industrial) !important;
  color: var(--industrial) !important;
}
.btn-comercial-inline {
  border: 0.5px solid var(--comercial) !important;
  color: var(--comercial) !important;
}
.btn-logistica-inline {
  border: 0.5px solid var(--logistica) !important;
  color: var(--logistica) !important;
}

.btn-negocios-inline {
  border: 0.5px solid var(--negocios) !important;
  color: var(--negocios) !important;
}

.btn-business-inline {
  border: 0.5px solid var(--business) !important;
  color: var(--business) !important;
}

.btn-finanzas-inline {
  border: 0.5px solid var(--finanzas) !important;
  color: var(--finanzas) !important;
}
/* Defaults */
.main-shadow {
  box-shadow: 0px 8px 24px -4px rgba(24, 39, 75, 0.08),
    0px 6px 12px -6px rgba(24, 39, 75, 0.12);
}

.shadow-100 {
  box-shadow: 0px 4px 4px -2px rgba(24, 39, 75, 0.08),
    0px 2px 4px -2px rgba(24, 39, 75, 0.12);
}

.shadow-200 {
  box-shadow: 0px 8px 8px -4px rgba(24, 39, 75, 0.08),
    0px 4px 6px -4px rgba(24, 39, 75, 0.12);
}

.main-radius {
  border-radius: 20px;
}

.main-border {
  border: 1px solid #f1f1f1;
}
/* Tarjetas */
.card-aden,
.card-aden-plain {
  position: relative;
  width: 100%;
  min-height: 200px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 8px 24px -4px rgba(24, 39, 75, 0.08);
  box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12);
  position: relative;
  padding: 30px;
  transition: 0.5s all;
  border-radius: 20px;
}

.card-aden:hover {
  background-color: #ecf0ff;
  transition: 0.5s all;
}
/* Badge */
.badge {
  width: 100px;
  color: white;
  border-radius: 15px;
  padding: 1px 5px;
  min-width: min-content;
  max-width: 250px;
  font-size: 0.6rem;
  font-weight: 600;
  display: flex;
  justify-content: center;
}
.subtitle {
  color: rgb(116, 116, 116);
  font-weight: 400;
}
.icon-social {
  font-size: 16px;
  color: rgb(116, 116, 116);
}

/*HOME*/

.mat-toolbar {
  z-index: 10;
}
.chat {
  z-index: 99999999999999999999999999999 !important;
}

.splash-screen {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  background-color: #ffffff;
}

.spinner {
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 14px;
  height: 14px;
  background-color: var(--primary);

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}

@keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}