.carousel {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 300px; /* 可以用 JS option 動態調整 */
}

.carousel-track {
    display: flex;
    transition: transform 0.5s ease;
    height: 100%;
}

.carousel-item {
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .carousel-item a {
        display: flex;
        justify-content: center;
        align-items: center;
        /*width: 100%;*/
        height: 100%;
    }

    .carousel-item img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        object-fit: contain;
        display: block;
    }


.carousel-controls {
    position: absolute;
    z-index:10;
    /*border:solid 5px red;*/
    bottom: 10px;
    right:30px;
    /*left: 50%;
    transform: translateX(-50%);*/
    display: flex;
    gap: 10px;
}

    .carousel-controls button {
        background: rgba(0,0,0,0.5);
        border: none;
        color: #fff;
        padding: 8px 12px;
        cursor: pointer;
        font-size: 1.2rem;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .carousel-controls button:focus {
            outline: 2px solid #fff;
            outline-offset: 2px;
        }

    .carousel-controls i {
        pointer-events: none; /* 防止 icon 接管點擊 */
    }