﻿#cdsMainLayout {
    position: relative;
    z-index: 9999;
}

#fixedDiv {
    width: 20%; /* 固定宽度 */
    height: 100%; /* 充满整个高度 */
    position: absolute; /* 绝对定位 */
    top: 0; /* 固定在顶部 */
    left: 0; /* 固定在左侧 */
    background-color: #fff; /* 白色背景 */
    z-index: 10; /* 提高层级 */
}

#rightDiv {
    height: 100%; /* 充满整个高度 */
    padding-left: 20%; /* 留出左侧固定宽度的空间 */
}

#transparentDiv {
    border-radius: 5px;
    background-color: rgba(255, 255, 255,0.8); /* 0.6是 透明色*/
    border: 1px solid rgba(255, 255, 255, 0.8);
    position: absolute;
    bottom: 0%;
    width: 100%;
    height: 33%;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    font-size: 24px;
    font-weight: bold;
    padding-left: 20%;
}

    #transparentDiv.two-columns {
        /* 如果有兩種類型，左右排列 */
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap; /* 避免換行 */
    }

    #transparentDiv .left, #transparentDiv .right {
        /* 左右兩邊的顯示樣式 */
        flex: 1;
        text-align: center; /* 或根據需要調整對齊方式 */
    }

.fixedButtonContainer {
    position: fixed;
    bottom: 20px; /* 調整距離底部的距離 */
    right: 20px; /* 調整距離右側的距離 */
    z-index: 3; /* 確保在圖片之上 */
    display: flex;
    flex-direction: row;
}

.fixedButton {
    /*background-color: #007bff;  按鈕的背景顏色 */
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
    margin-right: 10px; /* 調整按鈕之間的間距 */
}

    .fixedButton:last-child {
        margin-right: 0; /* 最後一個按鈕不要右邊距 */
        margin-left: auto; /* 將最後一個按鈕靠右對齊 */
    }

    .fixedButton:hover {
        background-color: #0056b3; /* 按鈕的懸停顏色 */
    }

#linkDeviceWrap {
    position: fixed;
    top: 75%; /* 設定垂直置中 */
    right: 5%; /* 設定水平置中 */
    transform: translate(10%, -50%); /* 使用 transform 屬性來精確置中 */
}

#btnHidelinkDevice {
    width: 100px;
    height: 50px;
    color: #fff;
    background-color: #262629;
}

.divColumn {
    flex-direction: column; /* 垂直排列 */
}

.standby-image {
    width: 100%; /* 讓待機圖寬度自適應 */
    height: 100%; /* 高度自動，保持比例 */
    /*object-fit: cover;*/ /*保持圖片比例並填滿容器 */
    /*object-fit: contain;*/ /* 避免裁剪圖片 */
}

.carousel-image {
    width: 100%; /* 讓輪播圖寬度自適應 */
    height: 100%; /* 高度自動，保持比例 */
    /*object-fit: cover;*/ /* 保持圖片比例並填滿容器 */
    /*object-fit: contain;*/ /* 避免裁剪圖片 */
    /*object-fit: fill;*/ /* 讓圖片變形以填滿容器 */
}
