.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 8px 12px;

    border: none;
    border-radius: 999px;

    font-family: 'Hanken', sans-serif;
    font-size: 12px;
    font-weight: 400;

    text-decoration: none;
    cursor: pointer;
    text-transform: uppercase;

    transition: transform 0.15s ease, opacity 0.15s ease;
}


.button_icon_left {
    margin-left: -1px;
}

.button_icon_right {
    margin-right: -1px;
}


.button_confirm {
    background: var(--highlight);
    border: 2px solid var(--highlight);
    color: var(--highlight_icon);
}

.button_confirm:hover {
    background: var(--highlight);
    border: 2px solid var(--highlight);
    color: var(--highlight_icon);
    transform: translateY(-1px);
    opacity: 0.9;
}

.button_cancel {
    background: transparent;
    border: 2px solid var(--page_text);
    color: var(--page_text) !important;
    opacity:.7;
}

.button_cancel:hover {
    background: transparent;
    border: 2px solid var(--page_text);
    color: var(--page_text);
    transform: translateY(-1px);
    opacity: 1;
}

.button_settings {
    border: 2px solid var(--highlight);
    color: var(--highlight_icon);
    background: var(--highlight);
}

.button_settings:hover {
    transform: translateY(-1px);
    opacity: 0.9;
}