/* Shared primary commerce CTA. Adopted explicitly; never styles secondary actions. */
:root {
    --commerce-primary-bg: var(--primary-color);
    --commerce-primary-text: #fff;
    --commerce-primary-shadow: 0 10px 30px rgba(0,168,255,.18);
}
.commerce-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--commerce-cta-gap,12px);
    border: 0;
    border-radius: var(--commerce-cta-radius,16px);
    background: var(--commerce-primary-bg);
    color: var(--commerce-primary-text);
    font-family: inherit;
    font-weight: 700;
    letter-spacing: normal;
    box-shadow: none;
    cursor: pointer;
    transition: var(--transition);
}
.commerce-primary > svg { width: 22px; height: 22px; flex: 0 0 auto; color: inherit; }
.commerce-primary:hover:not(:disabled):not([aria-busy="true"]) {
    background: var(--commerce-primary-bg);
    box-shadow: var(--commerce-primary-shadow);
    filter: brightness(1.05);
    transform: translateY(-2px);
}
.commerce-primary:focus-visible { outline: 2px solid var(--primary-color); outline-offset: 4px; }
.commerce-primary:active:not(:disabled):not([aria-busy="true"]) { background: var(--commerce-primary-bg); transform: translateY(0); }
.commerce-primary:disabled {
    background: #262626;
    color: #a8a8a8;
    opacity: 1;
    box-shadow: none;
    filter: none;
    transform: none;
    cursor: not-allowed;
}
.commerce-primary[aria-busy="true"] {
    background: var(--commerce-primary-bg);
    color: var(--commerce-primary-text);
    opacity: 1;
    box-shadow: none;
    filter: none;
    transform: none;
    cursor: wait;
}
@media (prefers-reduced-motion: reduce) { .commerce-primary { transition: none; } .commerce-primary:hover:not(:disabled) { transform: none; } }