.textarea-wrapper {
    position: relative;
    width: 100%;
}

.textarea-wrapper textarea {
    width: 100%;
    padding-right: 55px !important;   /* space for mic button */
    min-height: 120px;
}

/* MIC BUTTON UI */
.mic-inside-btn {
    position: absolute;
    bottom: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 50%;
    background: #ffffff; /* same color kept */
    box-shadow: 0 2px 5px rgba(0,0,0,0.25);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

/* ICON SIZE */
.mic-inside-btn img {
    width: 22px;
    height: 22px;
    pointer-events: none;
}

/* STOP ICON HIDDEN INITIALLY */
.stop-icon { display: none; }

/* RECORDING STATE */
.mic-inside-btn.recording { background:#ff3b30; }
.mic-inside-btn.recording .mic-icon { display:none; }
.mic-inside-btn.recording .stop-icon { display:block; filter:brightness(0) invert(1); }

/* LOADING SPINNER */
.loader {
    display:none;
    width:22px; height:22px;
    border:3px solid #ccc;
    border-top-color:#000;
    border-radius:50%;
    animation:spin 0.8s linear infinite;
}

/* SHOW LOADER ONLY WHILE PROCESSING */
.mic-inside-btn.processing img { display:none!important; }
.mic-inside-btn.processing .loader { display:block; }

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

/* TIMER ABOVE MIC BUTTON */
#recordTimer {
    position:absolute;
    bottom:60px;        /* moved above icon */
    right:20px;
    font-size:13px;
    font-weight:bold;
    color:#ff4444;
    display:none;
}
