/* radio.css — pattern: mutually exclusive choice.
   States: rest, hover, focus, checked, disabled.
   See FSE_UI.md → Radio. */

.biq-radio {
    display: inline-flex;
    align-items: flex-start;
    gap: var(--biq-space-3);
    min-height: var(--biq-touch-target);
    padding: var(--biq-space-2) 0;
    cursor: pointer;
    user-select: none;
    color: var(--biq-color-text-primary);
}

.biq-radio__input {
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
    width: var(--biq-space-5);
    height: var(--biq-space-5);
    margin: 0;
    background: var(--biq-color-surface-raised);
    border: 1px solid var(--biq-color-border-strong);
    border-radius: var(--biq-radius-pill);
    cursor: pointer;
    display: inline-grid;
    place-content: center;
    transition:
        background-color var(--biq-duration-fast) var(--biq-ease-standard),
        border-color var(--biq-duration-fast) var(--biq-ease-standard);
}

.biq-radio__input:hover:not(:disabled) { border-color: var(--biq-color-action); }

.biq-radio__input:focus-visible {
    outline: 0;
    box-shadow: var(--biq-focus-ring);
}

.biq-radio__input:checked {
    border-color: var(--biq-color-action);
    border-width: 2px;
}

.biq-radio__input:checked::before {
    content: "";
    width: var(--biq-space-3);
    height: var(--biq-space-3);
    border-radius: var(--biq-radius-pill);
    background: var(--biq-color-action);
}

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

.biq-radio__label { line-height: var(--biq-lh-snug); padding-top: 2px; }