#pogoda_carousel {
    visibility   : hidden;
    position     : relative;
    width        : 160px;
    height       : 160px;
    margin-top   : -10px;
    margin-bottom: 5px;
    margin-left  : 5px;
    margin-right : -5px;
    perspective  : 1200px;
    /* Ważne dla efektu 3D */
}

#pogoda_slides {
    position       : relative;
    width          : 100%;
    height         : 100%;
    transform-style: preserve-3d;
    /* Ważne dla efektu 3D */
}

#pogoda_slides ul {
    list-style: none;
    margin    : 0;
    padding   : 0;
    width     : 100%;
    height    : 100%;
}

#pogoda_slides .slide {
    position            : absolute;
    top                 : 0;
    left                : 0;
    width               : 100%;
    height              : 100%;
    display             : flex;
    justify-content     : center;
    align-items         : center;
    /* Stan początkowy  : niewidoczny i obrócony */
    opacity             : 0;
    transform           : rotateY(-90deg);
    transition          : transform 1.5s ease-in-out, opacity 1s ease-in-out;
}

#pogoda_slides .slide.active {
    /* Stan aktywny: widoczny i wyprostowany */
    opacity  : 1;
    transform: rotateY(0deg);
    z-index  : 2;
}