button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
    all: unset;
    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 38px;
    padding: 8px 16px;

    font-size: 14px;
    font-weight: 500;
    line-height: 1;

    color: #ffffff;
    background-color: #2563eb;

    border-radius: 8px;
    cursor: pointer;
    user-select: none;

    transition: background-color 150ms ease,
    box-shadow 150ms ease,
    transform 120ms ease,
    opacity 120ms ease;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover {
    background-color: #1d4ed8;
}

button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
    transform: translateY(1px);
}

button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
input[type="reset"]:focus-visible {
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.25);
}

button:disabled,
input[type="submit"]:disabled,
input[type="button"]:disabled,
input[type="reset"]:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

form button,
form input[type="submit"],
form input[type="button"],
form input[type="reset"] {
    max-width: 100%;
}