/* ============================================================
 * GoYatchify — Voice Input mic button
 * ============================================================ */
.gy-voice-wrap {
    display: block;
    position: relative;
    width: 100%;
}

/* The mic sits in the top-right corner, clear of the resize handle */
.gy-voice-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #e2e6ea;
    border-radius: 50%;
    background: #fff;
    color: #0b1f6f;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(11,31,111,.12);
    transition: background .18s, color .18s, border-color .18s, transform .12s;
}
.gy-voice-btn:hover {
    background: #f2f7ff;
    border-color: #cfe0ff;
    color: #0073ff;
}
.gy-voice-btn:active { transform: scale(.94); }

/* Single-line inputs: center the mic vertically */
.gy-voice-wrap > input.gy-voice-target ~ .gy-voice-btn,
input[data-voice] + .gy-voice-btn {
    top: 50%;
    transform: translateY(-50%);
}

/* Give textareas a little right padding so text never hides behind the mic */
.gy-voice-wrap > textarea { padding-right: 48px !important; }

/* Listening state — red pulse */
.gy-voice-btn.is-listening {
    background: #e11d48;
    border-color: #e11d48;
    color: #fff;
    animation: gy-voice-pulse 1.4s ease-out infinite;
}
.gy-voice-btn.is-listening:hover {
    background: #be123c;
    border-color: #be123c;
    color: #fff;
}
@keyframes gy-voice-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(225,29,72,.45); }
    70%  { box-shadow: 0 0 0 8px rgba(225,29,72,0); }
    100% { box-shadow: 0 0 0 0 rgba(225,29,72,0); }
}

/* Permission denied */
.gy-voice-btn.is-denied {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}