#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;
}