input {
    margin: 4px 2px;
    padding: 1px 5px;
    line-height: 1.6;
    background: var(--color-secondary);
    color: var(--color-text-primary);
    border: 1px solid transparent;
    text-align: center;
    font-weight: 600;
    border-radius: 4px;
    font-size: 14px;
}

label {
    font-weight: 600;
    padding-left: 5px;
    cursor: pointer;
}

.btn-main {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 12px 3px 12px;
    border-radius: 4px;
    background-color: var(--color-secondary);
    color: var(--color-text-primary);
    font-weight: 600;
    min-width: 80px;
    height: 32px;
    border: 0;
    font-family: inherit;
    cursor: pointer;
}

/* Bootstrap button:focus не должен оставлять системную рамку после нажатия. */
button:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible),
[role="menuitem"]:focus:not(:focus-visible) {
    outline: none;
}

/* Возврат из окна может наследовать неверный :focus-visible от прошлого элемента. */
@media (forced-colors: none) {
    :root[data-vvt-input="pointer"] :is(button, [role="button"], [role="menuitem"], a[href], summary):focus {
        outline: none;
    }
}

:root[data-vvt-input="keyboard"] :is(button, [role="button"], [role="menuitem"], a[href], summary):focus:not(:focus-visible) {
    outline: 2px solid var(--vvt-input-status-color, var(--vvt-accent, var(--color-complementary, #f0b90b)));
    outline-offset: -2px;
}

input:focus-visible, button:focus-visible, [role="button"]:focus-visible {
    outline: 2px solid var(--color-complementary);
    outline-offset: 3px;
}

@media (max-width: 1049.98px), (pointer: coarse) {
    .btn-main, .dropdown > .title, .menu-item[role="button"] { min-height: 44px; }
    .dropdown > .title { display: inline-flex; align-items: center; }
    input:not([type="checkbox"]):not([type="radio"]) { min-height: 44px; font-size: 16px; max-width: 100%; }
}