.button{color:var(--neutral-30);border:1px solid var(--green-700);background:var(--green-700);cursor:pointer;border-radius:2rem;justify-content:center;align-items:center;gap:.5rem;height:2.5rem;padding:0 .75rem;font-size:.8rem;font-weight:500;transition:all .3s ease-out;display:flex;&:hover{background:var(--green-600);border-color:var(--green-600);scale:1.02}&:active{background:var(--green-800);border-color:var(--green-800);scale:.98}&:disabled{background:var(--neutral-150);border-color:var(--neutral-150);cursor:default;pointer-events:none}&:has(.loading-spinner){background:var(--neutral-300);cursor:default;pointer-events:none}&.neutral{background:var(--neutral-500);border-color:var(--neutral-500);&:hover{background:var(--neutral-600);border-color:var(--neutral-600)}&:active{background:var(--neutral-700);border-color:var(--neutral-700)}}&.red{background:var(--red-500);border-color:var(--red-500);&:hover{background:var(--red-600);border-color:var(--red-600)}&:active{background:var(--red-700);border-color:var(--red-700)}}&.yellow{background:var(--yellow-500);border-color:var(--yellow-500);&:hover{background:var(--yellow-600);border-color:var(--yellow-600)}&:active{background:var(--yellow-700);border-color:var(--yellow-700)}}&.blue{background:var(--blue-500);border-color:var(--blue-500);&:hover{background:var(--blue-600);border-color:var(--blue-600)}&:active{background:var(--blue-700);border-color:var(--blue-700)}}&.lightGreen{background:var(--green-500);border-color:var(--green-500);&:hover{background:var(--green-600);border-color:var(--green-600)}&:active{background:var(--green-700);border-color:var(--green-700)}}&.iconRight{padding-inline:1.25rem .75rem}&.iconLeft{padding-inline:.75rem 1.25rem}}.button.secondary{color:var(--green-700);border:1px solid var(--green-700);background:0 0!important;&:hover{border-color:var(--green-600);color:var(--neutral-30);background:var(--green-600)!important}&:active{color:var(--neutral-30);background:var(--green-800)!important;border-color:var(--green-800)!important}&:disabled{border-color:var(--neutral-150);color:var(--neutral-150);background:0 0}&.neutral{border-color:var(--neutral-500);color:var(--neutral-500);&:hover{border-color:var(--neutral-600);color:var(--neutral-30);background:var(--neutral-600)!important}&:active{color:var(--neutral-30);background:var(--neutral-700)!important;border-color:var(--neutral-700)!important}}&.white{border-color:var(--neutral-150);color:var(--neutral-500);background:var(--neutral-white)!important;&:hover{border-color:var(--neutral-400);color:var(--neutral-30);background:var(--neutral-400)!important}&:active{color:var(--neutral-30);background:var(--neutral-600)!important;border-color:var(--neutral-600)!important}&.active{color:var(--green-500);background:var(--green-50)!important;border-color:var(--green-500)!important;&:hover{border-color:var(--green-500);color:var(--green-500);background:var(--green-100)!important}&:active{border-color:var(--green-500);color:var(--neutral-30);background:var(--green-500)!important}}}&.red{border-color:var(--red-500);color:var(--red-500);&:hover{border-color:var(--red-600);color:var(--neutral-30);background:var(--red-600)!important}&:active{color:var(--neutral-30);background:var(--red-700)!important;border-color:var(--red-700)!important}}&.yellow{border-color:var(--yellow-500);color:var(--yellow-500);&:hover{border-color:var(--yellow-600);color:var(--neutral-30);background:var(--yellow-600)!important}&:active{color:var(--neutral-30);background:var(--yellow-700)!important;border-color:var(--yellow-700)!important}}&.blue{border-color:var(--blue-500);color:var(--blue-500);&:hover{border-color:var(--blue-600);color:var(--neutral-30);background:var(--blue-600)!important}&:active{color:var(--neutral-30);background:var(--blue-700)!important;border-color:var(--blue-700)!important}}&.lightGreen{border-color:var(--green-500);color:var(--green-500);&:hover{border-color:var(--green-600);color:var(--neutral-30);background:var(--green-600)!important}&:active{color:var(--neutral-30);background:var(--green-700)!important;border-color:var(--green-700)!important}}}.button.tertiary{color:var(--neutral-600);background:0 0;border:1px solid #0000;&:hover{border-color:var(--neutral-150);background:var(--neutral-150)}&:active{background:var(--neutral-400);border-color:var(--neutral-400);color:var(--neutral-30)}&:disabled{color:var(--neutral-150)}}.button.small{height:2rem;font-size:.75rem}.button.large{height:3rem;padding:0 1rem;font-size:.875rem;&.iconRight{padding-inline:1.5rem 1rem}&.iconLeft{padding-inline:1rem 1.5rem}}.loading-spinner{border:4px solid hsl(var(--c-neutral-white) / .3);border-left-color:var(--neutral-white);border-radius:50%;width:1.25rem;height:1.25rem;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){.button{height:3rem;font-size:.875rem}}