/* Voice input (recorder, status page, review). Only tokens (--hv-*), no new colours. */

/* The recorder buttons are real <button>s (not links as in the static prototype). */
button.hv-record-start,
button.hv-rec-btn__core {
    padding: 0;
    border: 0;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
    -webkit-touch-callout: none;
}

button.hv-record-start {
    color: var(--hv-ink);
}

button.hv-record-start:hover {
    background: var(--hv-amber-300);
}

button.hv-record-start:focus-visible,
button.hv-rec-btn__core:focus-visible {
    outline: 3px solid var(--hv-ink);
    outline-offset: -8px;
}

.hv-voice__recorder {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--hv-space-4);
}

.hv-voice__recorder [hidden] {
    display: none !important;
}

.hv-voice__colony {
    flex: 1;
    min-width: 0;
}

.hv-voice__audio {
    width: 100%;
    min-width: 0;
}

/* A candidate choice: a whole-row submit button that looks like the prototype's link card. */
.hv-voice__pick {
    margin: 0;
}

button.hv-row--pick {
    width: 100%;
    border: 0;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.hv-voice__group {
    display: flex;
    flex-direction: column;
    gap: var(--hv-space-2);
}

.hv-voice__remove {
    display: flex;
    align-items: center;
    gap: var(--hv-space-2);
    min-height: 44px;
    color: var(--hv-ink-muted);
    font-size: var(--hv-text-sm);
}

.hv-voice__remove input {
    width: 22px;
    height: 22px;
}

.hv-voice__details > summary {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 14px;
    cursor: pointer;
    font-weight: 700;
}

.hv-voice__flag {
    color: var(--hv-warn-fg);
    font-size: var(--hv-text-sm);
    font-weight: 700;
}

.hv-voice__number {
    max-width: 120px;
    text-align: center;
}

.hv-voice__line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--hv-space-3);
}

.hv-voice__facts {
    margin: 0;
    padding: 0;
    list-style: none;
}