/* ============================================================
   wc-button — generic legacy button (not used in the main flow).
   ============================================================ */

wc-button .wc-button {
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    background: var(--color-surface);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
    cursor: pointer;
    text-align: center;
    transition: all 200ms ease;
    border: 1px solid color-mix(in srgb, var(--color-border) 20%, transparent);
    font-weight: 500;
    letter-spacing: 0.025em;
}

wc-button .wc-button:hover {
    background: var(--color-surface-hover);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}

wc-button .wc-button:active {
    transform: scale(0.98);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}