/* Snackbar Component */

.snackbar {
    position: fixed;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: #323232;
    color: #ffffff;
    padding: 0.875rem 1.5rem;
    border-radius: 8px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.3);
    z-index: 10000;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    max-width: 90%;
    opacity: 0;
    transition: bottom 0.3s ease, opacity 0.3s ease;
    font-size: 0.95rem;
}

.snackbar.show {
    bottom: 24px;
    opacity: 1;
}

/* Adjust for mobile to account for player controls */
@media (max-width: 767px) {
    .snackbar {
        max-width: calc(100% - 2rem);
        font-size: 0.9rem;
        padding: 0.75rem 1.25rem;
    }

    .snackbar.show {
        bottom: 120px; /* Above player controls */
    }
}

/* Adjust for desktop with sidebar */
@media (min-width: 768px) {
    .snackbar {
        left: calc(50% + 130px); /* Offset by half of sidebar width */
    }
}

.snackbar-message {
    flex: 1;
}