/*
 * Shared frontend/editor controls. WordPress owns enabled element-button colours;
 * the theme owns native submit fallback, geometry and interaction states.
 */
button,
input[type="button"],
input[type="submit"] {
    border-radius: 0;
    cursor: pointer;
}

/* Primary controls only: information buttons retain their component sizing. */
:where(.wp-element-button, .wp-block-button__link, .wp-block-file__button),
button:where(:not([type]), [type="submit" i]),
input[type="button"],
input[type="submit"] {
    min-block-size: 44px;
}

.wp-element-button,
.wp-block-button__link,
.wp-block-file__button {
    border-radius: 0;
}

/* Inherited by nested labels/spans, independently of hover and focus. */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-element-button,
.wp-block-button__link,
.wp-block-file__button {
    --bpv-text-selection-bg: var(--bpv-ui-button-selection-bg);
    --bpv-text-selection-text: var(--bpv-ui-button-selection-text);
}

input[type="submit"] {
    padding: calc(0.667em + 2px) calc(1.333em + 2px);
    border: 0;
    background-color: var(--bpv-ui-button-bg);
    color: var(--bpv-ui-button-text);
    line-height: inherit;
    text-decoration: none;
}

input[type="submit"]:where(:hover),
.wp-element-button:where(:hover) {
    border-color: var(--bpv-ui-button-hover-border);
    background-color: var(--bpv-ui-button-hover-bg);
    color: var(--bpv-ui-button-hover-text);
}

/* Preserve the complete inset fill used by Gutenberg outline Buttons. */
.wp-element-button:where(:hover) {
    box-shadow: inset 0 0 0 100vmax var(--bpv-ui-button-hover-bg);
}

.is-style-outline:where(:hover) {
    color: var(--bpv-ui-button-hover-text);
}

input[type="submit"]:where(:focus-visible),
.wp-element-button:where(:focus-visible) {
    outline: 2px solid var(--bpv-ui-active);
    outline-offset: 3px;
}

input[type="submit"]:where(:active),
.wp-element-button:where(:active) {
    border-color: var(--bpv-ui-button-pressed-border);
    background-color: var(--bpv-ui-button-pressed-bg);
    color: var(--bpv-ui-button-pressed-text);
}

.wp-element-button:where(:active) {
    box-shadow: inset 0 0 0 100vmax var(--bpv-ui-button-pressed-bg);
}

.is-style-outline:where(:active) {
    color: var(--bpv-ui-button-pressed-text);
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

@media (forced-colors: active) {
    input[type="submit"],
    .wp-element-button {
        border: 2px solid ButtonText;
        background: ButtonFace;
        color: ButtonText;
        box-shadow: none;
    }

    input[type="submit"]:where(:focus-visible),
    .wp-element-button:where(:focus-visible) {
        outline-color: Highlight;
    }
}