/* 音声ファイル表示エリア */
.audio-area {
    margin: 0 auto;
	padding: 0 0 50px; 
}

.audio-area .ttl-m {
    margin-bottom: 20px;
}

.audio-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.audio-item {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid var(--gray);
}

.audio-item audio {
    width: 100%;
    margin: 10px 0;
}

/* 音声プレーヤーの三点リーダーメニューを非表示 */
.audio-item audio::-webkit-media-controls-overflow-button {
    display: none;
}

/* ダウンロードボタンを非表示 */
.audio-item audio::-webkit-media-controls-download-button {
    display: none;
}

/* 再生速度ボタンを非表示 */
.audio-item audio::-webkit-media-controls-playback-rate-button {
    display: none;
}

/* オーバーフローメニュー全体を非表示 */
.audio-item audio::-webkit-media-controls-overflow-menu-button {
    display: none;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .audio-area {
		padding: 0 20px;
		margin: 0 auto 50px;
    }
    
    .audio-area .ttl-m {
        margin-bottom: 20px;
    }
    
    .audio-list {
        gap: 15px;
    }
    
    .audio-item {
        padding: 15px;
    }
}

/* 音声アップロード用スタイル */
.audio-container {
    position: relative;
}

.audio-container .dragover {
    background-color: #e3f2fd;
    border-color: #2196f3;
}

.audio-preview {
    background: #f8f9fa;
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    margin: 10px 0;
}

.audio-preview audio {
    width: 100%;
    margin-bottom: 10px;
}

.audio-preview p {
    margin: 5px 0;
    font-size: 14px;
    color: #666;
}

.audio-preview .btn {
    margin-top: 10px;
}