/* button.css — pattern: action affordance.
   States: rest, hover, active, focus-visible, disabled, loading.
   Variants: primary, secondary, ghost, danger.
   Touch target: minimum 44x44 (WCAG 2.5.5).  See FSE_UI.md → Button. */

.biq-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--biq-space-2);
    min-height: var(--biq-touch-target);
    padding: var(--biq-space-2) var(--biq-space-4);
    border: 1px solid transparent;
    border-radius: var(--biq-radius-md);
    background: transparent;
    color: var(--biq-color-text-primary);
    font-family: var(--biq-font-body);
    font-size: var(--biq-fs-md);
    font-weight: var(--biq-fw-medium);
    line-height: var(--biq-lh-tight);
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    transition:
        background-color var(--biq-duration-fast) var(--biq-ease-standard),
        border-color var(--biq-duration-fast) var(--biq-ease-standard),
        color var(--biq-duration-fast) var(--biq-ease-standard),
        box-shadow var(--biq-duration-fast) var(--biq-ease-standard);
}

.biq-btn:disabled,
.biq-btn[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.55;
}

.biq-btn[aria-busy="true"] {
    cursor: progress;
    opacity: 0.85;
}

/* Primary */
.biq-btn--primary {
    background: var(--biq-color-action);
    color: var(--biq-color-action-on);
    border-color: var(--biq-color-action);
}
.biq-btn--primary:hover:not(:disabled) {
    background: var(--biq-color-action-hover);
    border-color: var(--biq-color-action-hover);
}
.biq-btn--primary:active:not(:disabled) {
    background: var(--biq-color-action-pressed);
    border-color: var(--biq-color-action-pressed);
}

/* Secondary */
.biq-btn--secondary {
    background: var(--biq-color-surface-raised);
    color: var(--biq-color-text-primary);
    border-color: var(--biq-color-border-strong);
}
.biq-btn--secondary:hover:not(:disabled) {
    background: var(--biq-color-surface-sunk);
}

/* Ghost */
.biq-btn--ghost {
    background: transparent;
    color: var(--biq-color-text-primary);
    border-color: transparent;
}
.biq-btn--ghost:hover:not(:disabled) {
    background: var(--biq-color-surface-sunk);
}

/* Danger */
.biq-btn--danger {
    background: var(--biq-color-danger);
    color: var(--biq-color-action-on);
    border-color: var(--biq-color-danger);
}
.biq-btn--danger:hover:not(:disabled) {
    background: var(--biq-color-danger-strong);
    border-color: var(--biq-color-danger-strong);
}

/* Sizes */
.biq-btn--sm { min-height: var(--biq-space-7); padding: var(--biq-space-1) var(--biq-space-3); font-size: var(--biq-fs-sm); }

/* --lg — substantial primary CTA (Session 2G).  Larger padding,
   semibold weight, shadow-md baseline that lifts on hover.  Used on
   the marketing landing's hero + final-CTA buttons; the visual weight
   is part of the field-credibility pitch — these are buttons that look
   like they survive being pressed by gloved hands. */
.biq-btn--lg {
    min-height: var(--biq-space-8);
    padding: var(--biq-space-4) var(--biq-space-7);
    font-size: var(--biq-fs-lg);
    font-weight: var(--biq-fw-semibold);
    box-shadow: var(--biq-shadow-md);
}
.biq-btn--lg:hover:not(:disabled) { box-shadow: var(--biq-shadow-lg); }
.biq-btn--lg:active:not(:disabled) { box-shadow: var(--biq-shadow-sm); }

/* Block */
.biq-btn--block { width: 100%; }

/* Loading spinner — uses currentColor so each variant tints correctly */
.biq-btn__spinner {
    width: var(--biq-space-4);
    height: var(--biq-space-4);
    border-radius: var(--biq-radius-pill);
    border: 2px solid currentColor;
    border-right-color: transparent;
    animation: biq-btn-spin var(--biq-duration-slow) linear infinite;
}

@keyframes biq-btn-spin {
    to { transform: rotate(360deg); }
}