/* Gemeinsames Aktionsdesign, aus der wollBot-Zeitraumwahl uebernommen. */
.button {
    min-width: 0;
    min-height: 44px;
    padding: 0.5rem 0.85rem;

    border: 1px solid var(--color-border);
    border-radius: var(--radius-small);
    background: var(--color-dark);
    color: var(--color-surface);

    font: inherit;
    text-align: center;
    overflow-wrap: anywhere;
    cursor: pointer;
    font-weight: 600;
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.button:hover:not(:disabled) {
    background-color: var(--color-button-hover);
}

.button:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

.button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.button--secondary { background: var(--color-surface); color: var(--color-dark); }
.button--secondary:hover:not(:disabled) { background: var(--color-surface-hover); }
.button:active:not(:disabled) { box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.12); }