/* ============================================ */
/* Golden Theme Audio Player Styles             */
/* ============================================ */

/* Audio Player Container */
.golden-audio-player {
    background: linear-gradient(145deg, #f9f0d0, #f5e6b0);
    border: 2px solid #c9a84c;
    border-radius: 16px;
    box-shadow: 0 4px 15px rgba(201, 168, 76, 0.3);
    padding: 1rem;
    transition: all 0.3s ease;
}

.golden-audio-player:hover {
    box-shadow: 0 6px 25px rgba(201, 168, 76, 0.4);
}

/* Music Icon */
.golden-music-icon {
    color: #c9a84c;
}

/* Audio Title */
.golden-audio-title {
    color: #8b7536;
    font-size: 1rem;
}

/* Golden Buttons Base */
.golden-btn {
    border: none;
    border-radius: 50px;
    padding: 8px 20px;
    font-weight: 500;
    font-size: 0.9rem;
    color: #fff;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(201, 168, 76, 0.3);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.golden-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(201, 168, 76, 0.5);
    color: #fff;
}

.golden-btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(201, 168, 76, 0.3);
}

.golden-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.4);
}

/* Play Button */
.golden-btn-play {
    background: #c9a84c;
}

.golden-btn-play:hover {
    background: #d4b85a;
}

.golden-btn-play:active {
    background: #b8953e;
}

/* Replay Button */
.golden-btn-replay {
    background: #d4b85a;
}

.golden-btn-replay:hover {
    background: #dec46e;
}

.golden-btn-replay:active {
    background: #c9a84c;
}

/* Stop Button */
.golden-btn-stop {
    background: #b8953e;
}

.golden-btn-stop:hover {
    background: #c9a84c;
}

.golden-btn-stop:active {
    background: #a07d32;
}

/* Progress Container */
.golden-progress {
    height: 8px;
    background: #f0e4c4;
    border-radius: 10px;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    margin-top: 4px;
    transition: all 0.3s ease;
}

.golden-progress:hover {
    height: 10px;
    background: #e8d8b0;
}

/* Progress Bar */
.golden-progress-bar {
    background: linear-gradient(90deg, #d4b85a, #c9a84c);
    border-radius: 10px;
    height: 100%;
    transition: width 0.1s linear;
    position: relative;
}

/* Progress Bar Glow Effect */
.golden-progress-bar::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.3));
    border-radius: 10px;
}

/* Time Text */
.golden-time-text {
    color: #8b7536;
    font-size: 0.85rem;
    font-weight: 500;
}

/* Responsive Adjustments */
@media (max-width: 576px) {
    .golden-audio-player {
        padding: 0.75rem;
    }
    
    .golden-btn {
        padding: 6px 14px;
        font-size: 0.8rem;
    }
    
    .golden-audio-title {
        font-size: 0.85rem;
    }
    
    .golden-music-icon {
        font-size: 1.5rem;
    }
}

@media (max-width: 450px) {
    .golden-audio-player .d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }
    
    .golden-audio-player .d-flex .d-flex {
        justify-content: center !important;
    }
    
    .golden-btn {
        flex: 1;
        padding: 6px 10px;
        font-size: 0.75rem;
    }
}