.btn {
font-size: var(--font-body-m);
font-weight: 500;
line-height: 1.4;
min-height: 44px;
border-radius: var(--vstts-radius);
padding: 10px 24px;
display: inline-flex;
align-items: center;
justify-content: center !important;
text-align: center;
text-decoration: none;
transition:
background-color 0.2s ease,
border-color 0.2s ease,
color 0.2s ease;
cursor: pointer;
}
.btn.btn-primary {
background-color: var(--vstts-accent-primary);
border: 1.5px solid var(--vstts-accent-primary);
color: var(--vstts-text-inverse);
}
.btn.btn-primary:hover {
background-color: var(--vstts-accent-hover);
border-color: var(--vstts-accent-hover);
color: var(--vstts-text-inverse);
}
.btn.btn-primary:disabled {
background-color: var(--vstts-accent-disabled);
border-color: var(--vstts-accent-disabled);
color: var(--vstts-text-inverse);
cursor: not-allowed;
opacity: 1;
}
.btn.btn-secondary {
background-color: transparent;
border: 1.5px solid var(--vstts-accent-primary);
color: var(--vstts-accent-primary);
}
.btn.btn-secondary:hover {
background-color: var(--vstts-bg-base-02);
border-color: var(--vstts-accent-hover);
color: var(--vstts-accent-hover);
}
.btn.btn-secondary:disabled {
background-color: transparent;
border-color: var(--vstts-accent-disabled);
color: var(--vstts-accent-disabled);
cursor: not-allowed;
opacity: 1;
}