/* Custom classes for styling elements on a page, such as links */

.horizontal-wrapper {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: flex-start;
}

.primary-action {
    background: var(--color-primary-1);
    padding: 0.8em;
    color: var(--color-background-1);
    text-decoration-line: unset;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    border-color: var(--color-primary-1);
    box-sizing: border-box;
}

.secondary-action {
    border-width: 1px;
    border-style: solid;
    border-color: var(--color-primary-1);
    padding: 0.8em;
    text-decoration-line: unset;
    border-radius: 4px;
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .horizontal-wrapper {
        flex-direction: column;
    }
}