.autoplay-panel {
    position: fixed;
    bottom: 60px;
    
    /* Centrerings-logik för fixed element: */
    left: 50%;
    transform: translateX(-50%);
    
    width: 75%; 
    max-width: 800px;

    background-color: rgba(0, 0, 0, 0.80);
    color: white;
    padding: 30px 20px; /* Snyggare skrivsätt för top/bottom och left/right */
    border-radius: 20px; 
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 10000;
    box-shadow: 0px 20px 40px rgba(3, 0, 0, 0.95);
    border: 1px solid #aaa; 
}

.autoplay-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

#autoplay-status {
    font-weight: normal;
    font-size: 1rem;
    color: #fff;
    text-transform: uppercase;
}

#autoplay-count {
    font-size: 1rem;
    color: #fff;
    padding-top: 20px;
}

.autoplay-buttons {
    display: flex;
    flex-direction: column;
    gap: 20px; 
    /* margin-left: 10px; */
}

/* Basstil för knapparna med avrundade hörn */
.btn-autoplay {
    width: 110px;
    height: 50px;
    border: 1px solid #bbb; /* Tunn vit kant */
    color: white;
    font-size: 0.9rem;
    font-weight: normal;
    text-transform: uppercase;
    cursor: pointer;
    /* Avrundade hörn för knapparna */
    border-radius: 20px; 
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 1.5px;
}

/* Grön bakgrund för Skip */
.btn-skip {
    background-color: #128212;
}

/* Röd bakgrund för Stop */
.btn-stop {
    background-color: #bb1212;
}

/* Hover-effekt för lite extra responsivitet */
.btn-autoplay:hover {
    filter: brightness(1.2);
    transform: translateY(-1px);
}

.btn-autoplay:active {
    transform: translateY(1px);
}

html {
    scroll-behavior: smooth;
}