/* voice-input.css v1.0.0 - microphone button inside the wish boxes */
.fs-voice-wrap {
    position: relative;
    display: block;
    width: 100%;
}
textarea.fs-voice-field,
input.fs-voice-field {
    padding-right: 48px !important;
}
.fs-voice-btn {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--border-color, rgba(255, 255, 255, 0.22));
    border-radius: 50%;
    background: var(--bg-secondary, rgba(0, 0, 0, 0.55));
    color: var(--text-secondary, rgba(255, 255, 255, 0.85));
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
input.fs-voice-field + .fs-voice-btn {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
}
.fs-voice-btn:hover {
    color: var(--accent-primary, #c9a24b);
    border-color: var(--accent-primary, #c9a24b);
}
.fs-voice-btn:focus-visible {
    outline: none;
    box-shadow: var(--fs-focus-ring, 0 0 0 2px var(--accent-primary, #c9a24b));
}
.fs-voice-btn.is-listening {
    color: #fff;
    border-color: #e5484d;
    background: #e5484d;
    animation: fs-voice-pulse 1.4s ease-out infinite;
}
@keyframes fs-voice-pulse {
    0% { box-shadow: 0 0 0 0 rgba(229, 72, 77, 0.55); }
    70% { box-shadow: 0 0 0 10px rgba(229, 72, 77, 0); }
    100% { box-shadow: 0 0 0 0 rgba(229, 72, 77, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .fs-voice-btn.is-listening { animation: none; }
}
@media (pointer: coarse) {
    .fs-voice-btn { width: 44px; height: 44px; right: 8px; bottom: 8px; }
}
.fs-voice-status {
    margin: 6px 0 0;
    color: var(--text-secondary, rgba(255, 255, 255, 0.75));
    font-size: var(--text-sm, 13px);
    line-height: 1.4;
}
.fs-voice-status[hidden] { display: none; }
.fs-voice-status.is-error { color: var(--error-color, #ff8a8a); }
.lander-wish .fs-voice-status { color: rgba(255, 255, 255, 0.8); }
.lander-wish .fs-voice-btn {
    background: rgba(0, 0, 0, 0.55);
    border-color: rgba(255, 255, 255, 0.3);
    color: rgba(255, 255, 255, 0.9);
}
