#logo a:hover {
    background-position: right -6px;
    text-decoration: none;
}

.loader {
  width: 90px;
  height: 14px;
  box-shadow: 0 3px 0 #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Center the loader */
  z-index: 9999;
  clip-path: inset(-40px 0 -5px);
  display: none;
}

.loader:before {
  content: "";
  position: absolute;
  inset: auto calc(50% - 17px) 0;
  height: 50px;
  --g: no-repeat linear-gradient(#ccc 0 0);
  background: var(--g), var(--g), var(--g), var(--g);
  background-size: 16px 14px;
  animation:
    l7-1 2s infinite linear,
    l7-2 2s infinite linear;
}

@keyframes l7-1 {
  0%,
  100% {
    background-position: 0 -50px, 100% -50px;
  }
  17.5% {
    background-position: 0 100%, 100% -50px, 0 -50px, 100% -50px;
  }
  35% {
    background-position: 0 100%, 100% 100%, 0 -50px, 100% -50px;
  }
  52.5% {
    background-position: 0 100%, 100% 100%, 0 calc(100% - 16px), 100% -50px;
  }
  70%,
  98% {
    background-position: 0 100%, 100% 100%, 0 calc(100% - 16px), 100% calc(100% - 16px);
  }
}

@keyframes l7-2 {
  0%,
  70% {
    transform: translate(0);
  }
  100% {
    transform: translate(200%);
  }
}
.overlay {
  position: fixed; /* Cover entire screen */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Dark translucent background */
  z-index: 9998; /* Ensure overlay appears behind loader */
  display: none; /* Initially hidden */
}

/* Pintar rojo los select2 que tienen error en la clase */
.select2-container.error {
    border: 1px solid red;
}
/* Pintar rojo los imput que tienen error en la clase */
input.error {
    border: 1px solid red;
}