<div class="recording-section">
    <div class="recording-controls">
        <button type="button" class="btn btn-danger" id="startRecording">
            <i class="fa fa-microphone"></i> 开始录音
        </button>
        <button type="button" class="btn btn-secondary" id="stopRecording" style="display: none;">
            <i class="fa fa-stop"></i> 停止录音
        </button>
        <button type="button" class="btn btn-primary" id="playRecording" style="display: none;">
            <i class="fa fa-play"></i> 播放
        </button>
        <button type="button" class="btn btn-warning" id="pauseRecording" style="display: none;">
            <i class="fa fa-pause"></i> 暂停
        </button>
        <button type="button" class="btn btn-secondary" id="clearRecording" style="display: none;">
            <i class="fa fa-trash"></i> 清除
        </button>
        <button type="button" class="btn btn-success" id="uploadRecording" style="display: none;">
            <i class="fa fa-upload"></i> 上传
        </button>
    </div>
    <div class="recording-status" id="recordingStatus" style="display: none;">
        <div class="recording-indicator"></div>
        <span id="recordingStatusText">准备录音...</span>
        <span id="recordingTime">00:00</span>
    </div>
    <div class="recording-player" id="recordingPlayer" style="display: none;">
        <div class="audio-progress-container">
            <div class="audio-progress" id="audioProgress">
                <div class="audio-progress-bar" id="audioProgressBar"></div>
                <div class="audio-progress-handle" id="audioProgressHandle"></div>
            </div>
        </div>
        <div class="audio-time-info">
            <span id="currentTime">00:00</span>
            <span class="time-separator">/</span>
            <span id="totalTime">00:00</span>
        </div>
    </div>
</div>