button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button {
    box-shadow: var(--shadow-button);
    text-decoration: none;  /* In case of links */
    background-color: var(--color-button);
    color: var(--color-button-text) !important;
    cursor: pointer;
    border: var(--border-button);
    min-height: var(--height-button);
    padding: var(--padding-button);
    display: flex;
    width: fit-content;
    align-items: center;
    justify-content: center;
    gap: var(--gap-button);
    border-radius: var(--radius-button);
    font: var(--button-font);
    transition: var(--transitions-button);
}

iconify-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1em;
}

:is(button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button)::selection {
    /* Can select text in buttons, but selection won't appear to make it less disturbing */
    background: transparent;
    user-select: auto;
}

:is(button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button).button-flat {
    border: var(--border-flat-button);
    border-radius: var(--radius-flat-button);
    background-color: transparent;
    color: var(--color-flat-button-text) !important;
    box-shadow: var(--shadow-flat-button);
}

:is(button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button):hover {
    border: var(--border-button-hover);
    box-shadow: var(--shadow-button-hover);
    background-color: var(--color-button-hover);
    color: var(--color-flat-button-hover-text);
}

:is(button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button):is(.button-flat, .button-neutral):hover {
    border: var(--border-flat-button-hover);
    box-shadow: var(--shadow-flat-button-hover);
    background-color: var(--color-flat-button-hover);
    color: var(--color-flat-button-hover-text);
}

:is(button, .button, input[type=button], input[type=submit], input[type=reset], input[type="file"]::file-selector-button).button-neutral {
    color: inherit !important;
}

.button-round {
    border-radius: var(--radius-round-button);
    min-height: var(--size-round-button);
    min-width: var(--size-round-button);
    margin: var(--margin-round-button);
    padding: var(--padding-round-button);
}

.fab {
    max-height: var(--size-round-button);
    max-width: var(--size-round-button);
}