[v-cloak] {
  display: none;
}

header
{
  background-color: #0071d1;
}

header img.logo
{
  max-height: 30px;
}

ul.none
{
  list-style-type: none
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

#widget #messages
{
  height: 520px;
  overflow: auto;
}

#widget #messages .alert-primary
{
  text-align: left;
}

#widget #messages .alert-secondary
{
  text-align: right;
}

#widget form button
{
  background-color: #0071d1;
}

#widget .alert small, #widget .alert p
{
  margin-bottom: 0;
}

@media (min-width: 768px) {
  #widget #messages h1, #widget #messages h2, #widget #messages h3, #widget #messages h4, #widget #messages p, #widget #messages a, #widget #messages ul, #widget #messages span
  {
    font-size: 0.9rem;
  }
}

#widget .loader {
  width: 30px;
  aspect-ratio: 2;
  --_g: no-repeat radial-gradient(circle closest-side,#052c65 90%,#0000);
  background: 
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: l3 1s infinite linear;
}
@keyframes l3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

/* Estilo general del scrollbar */
#widget ::-webkit-scrollbar {
  width: 12px; /* Ancho del scrollbar */
  height: 12px; /* Altura del scrollbar para scroll horizontal */
}

/* Estilo del "thumb" (parte que se arrastra) */
#widget ::-webkit-scrollbar-thumb {
  background: #888; /* Color del thumb */
  border-radius: 6px; /* Bordes redondeados */
}

/* Estilo del "track" (parte que se desplaza) */
#widget ::-webkit-scrollbar-track {
  background: #f1f1f1; /* Color del track */
  border-radius: 6px; /* Bordes redondeados */
}

/* Hover para el thumb */
#widget ::-webkit-scrollbar-thumb:hover {
  background: #555; /* Color del thumb cuando se pasa el ratón */
}