wa-button[variant="brand"]{
    --wa-color-fill-loud: #3B369D;
    --wa-color-fill-normal: var(--wa-color-brand-fill-normal);
    --wa-color-fill-quiet: var(--wa-color-brand-fill-quiet);
    --wa-color-border-loud:#3B369D;
    --wa-color-border-normal: var(--wa-color-brand-border-normal);
    --wa-color-border-quiet: var(--wa-color-brand-border-quiet);
    --wa-color-on-loud: #fff;
    --wa-color-on-normal: var(--wa-color-brand-on-normal);
    --wa-color-on-quiet: var(--wa-color-brand-on-quiet);
}

::-webkit-scrollbar {
  width: 15px;
}

::-webkit-scrollbar-track {
  background: var(--wa-color-indigo-70);
}

::-webkit-scrollbar-thumb {
  background: var(--wa-color-indigo-50); 
  border-radius: 0px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--wa-color-indigo-20);
}


wa-button[variant="neutral"]{
    --wa-color-fill-loud: var(--wa-color-indigo-70);
    --wa-color-fill-normal: var(--wa-color-indigo-70);
    --wa-color-fill-quiet: var(---wa-color-indigo-70);
    --wa-color-border-loud: var(--wa-color-indigo-70);
    --wa-color-border-normal: var(--wa-color-brand-border-normal);
    --wa-color-border-quiet: var(--wa-color-brand-border-quiet);
    --wa-color-on-loud: var(--wa-color-indigo-30);
    --wa-color-on-normal: var(--wa-color-indigo-40);
    --wa-color-on-quiet: var(--wa-color-brand-on-quiet);
}

.page-container{
    background-color:var(--wa-color-indigo-30);
}

.page-contents{
    background-color:var(--wa-color-indigo-40);
}

.header{
    background: var(--wa-color-indigo-30);
}

.navbar{
    background-color: var(--wa-color-indigo-50);
}

.text-body{
    background-color: var(--wa-color-indigo-50);
    border:none;
    color:#fff!important;
}

.toast{
    background-color: var(--wa-color-indigo-60);
    color: var(--wa-color-indigo-30);
}

.toast-header{
    background-color: var(--wa-color-indigo-50);
    color:#fff;
}