/* Minification failed. Returning unminified contents.
(42,21): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(45,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(46,26): run-time error CSS1039: Token not allowed after unary operator: '-white'
(52,36): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(84,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(95,25): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(98,36): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(99,30): run-time error CSS1039: Token not allowed after unary operator: '-white'
(328,32): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
(339,22): run-time error CSS1039: Token not allowed after unary operator: '-bg-header'
(340,35): run-time error CSS1039: Token not allowed after unary operator: '-white'
(369,25): run-time error CSS1039: Token not allowed after unary operator: '-Text-color-dark'
(377,25): run-time error CSS1039: Token not allowed after unary operator: '-Text-color-dark'
(383,25): run-time error CSS1039: Token not allowed after unary operator: '-Text-color-dark'
(385,43): run-time error CSS1039: Token not allowed after unary operator: '-icon-green-01'
 */
#unlobby-title {
    display: none;
}

#un-lobby {
    flex-direction: column;
}

/*#region 遊戲分類樣式 */
.promo-tab {
    display: flex;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
}
ul.navtab {
    display: inline-block;
    width: 900px;
    padding: 0;
    margin: 10px 0 30px;
}

    ul.navtab li {
        float: left;
        text-align: center;
        display: inline-block;
        height: 49px;
        margin-bottom: 18px;
        margin-right: 15px;
        min-width: 200px;
        padding: 0 10px;
        color: #fff;
        font-size: 20px;
        line-height: 47px;
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 25px;
/*        padding: 8px 20px;*/
        font-weight: 600;
        text-transform: uppercase;
        position: relative;
        color: var(--icon-green-01, #0289A1);
        text-align: center;
        box-shadow: -1px -3.9px 4.8px 0.3px rgba(2, 11, 32, 0.3);
        border: 1px solid var(--icon-green-01, #0289A1);
        background: var(--white, #FFF);
    }

        ul.navtab li.tab,
        ul.navtab li:hover {
            color: #fff;
            border: 1px solid var(--icon-green-01, #0289A1);
            background: radial-gradient(60.58% 41.35% at 50% -19.09%, #FFFDE8 0%, rgba(255, 253, 232, 0.00) 100%), radial-gradient(59.19% 59.19% at 50% 50%, rgba(61, 139, 255, 0.00) 0%, rgba(35, 86, 164, 0.60) 100%), linear-gradient(179deg, #92CAA3 1.07%, #02869E 59.85%);
            background-blend-mode: normal, soft-light, normal;
            box-shadow: 0 2px 2px 0 #999A9C;
            margin-right: 15px;
        }
button.btn-promo-progress {
    display: inline-block;
    height: 47px;
    margin-right: 10px;
    margin-bottom: 30px;
    min-width: 200px;
    padding: 0 10px;
    color: #fff;
    font-size: 20px;
    line-height: 47px;
    align-items: center;
    border-radius: 35px;
    border: 2px solid #D39848;
    background: linear-gradient(180deg, #FFC270 -2.59%, #D89B4A 46.68%, #907037 98.19%);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
}

.promotion-module-action {
    height: 55px;
    display: flex;
}

    .promotion-module-action .promotion-module-apply-btn {
        flex: 1;
        height: 100%;
        font-size: 16px;
        border: 1px solid var(--icon-green-01, #0289A1);
        background: radial-gradient(60.58% 41.35% at 50% -19.09%, #FFFDE8 0%, rgba(255, 253, 232, 0.00) 100%), radial-gradient(59.19% 59.19% at 50% 50%, rgba(61, 139, 255, 0.00) 0%, rgba(35, 86, 164, 0.60) 100%), linear-gradient(179deg, #92CAA3 1.07%, #02869E 59.85%);
        background-blend-mode: normal, soft-light, normal;
        box-shadow: 0 2px 2px 0 #999A9C;
        color: #fff;
        border-radius: 12px;
        z-index: 1;
    }

        .promotion-module-action .promotion-module-apply-btn.join-status-3,
        .promotion-module-action .promotion-module-apply-btn.apply-cutom-promo-btn {
            color: var(--icon-green-01, #0289A1);
            text-align: center;
            box-shadow: -1px -3.9px 4.8px 0.3px rgba(2, 11, 32, 0.3);
            border: 1px solid var(--icon-green-01, #0289A1);
            background: var(--white, #FFF);
        }
        /*#endregion 遊戲分類樣式 */
        .category-item {
            display: grid;
            grid-template-columns: repeat(3,1fr);
            gap: 20px;
        }

            .category-item.isLogin {
                row-gap: 90px;
            }

                .category-item.isLogin .promotion-module-action {
                    width: 90%;
                    gap: 5px;
                    position: absolute;
                    bottom: -61px;
                }


/*#region 優惠區塊 */
ul.discount {
    position: relative;
    font-size: 0;
    width: 482px;
    height: 304px;
    padding: 20px;
    border: none;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
    display:flex;
    justify-content: center;
    align-items: center;
}
    ul.discount::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        /*            background: url(/CdnRedirect/Web.Portal/DN025-01.Portal/Content/Views/Shared/images/promotion_bg.png) no-repeat center / contain;*/
        background: url(/Content/Views/Shared/images/promotion_bg.png) no-repeat center;
        background-size: contain;
        pointer-events: none;
    }

    ul.discount > li {
        width: 100%;
        height: 100%;
    }

        ul.discount > li:first-child {
        }
        ul.discount > li.promotion-wrapper > .promotion-img {
            width: 100%;
            height: 100%;
        }

        ul.discount > li:first-child > img,
        ul.discount > li.promotion-wrapper > .promotion-img > img {
            width: 100%;
            height: 100%;
            max-width: 482px;
            max-height: 304px;
            /*                object-fit: contain;*/
        }
        ul.discount > li.promotion-wrapper > .promotion-img > .fake-img {
            width: 100%;
            height: 204px;
            background: #ccc;
        }

        /*優惠內文顏色*/
        ul.discount > li.content {
            color: #999;
            text-align: justify;
            overflow-x: auto;
        }

li.content img {
    /*li.content padding多少  就要margin負多少 */
}

li.content h3 {
}

li.content h4 {
}

li.content h5 {
}

li.content p {
}

li.content dd {
    margin-left: 0;
}

li.content table {
    width: 100%;
}

    li.content table tr,
    li.content table th,
    li.content table td {
        line-height: 2em;
        text-align: center;
    }

    li.content table th {
    }

li.content ol {
    padding-left: 20px;
    list-style-type: decimal;
}

li.content ul {
    padding-left: 20px;
    list-style-type: disc;
}

li.content ol li {
}

li.content .highlight {
    color: #f00;
}

/*#endregion 優惠區塊 */

.promotion-detail-modal .promotion-content {
    max-height: 80vh;
    overflow: auto;
}

    .promotion-detail-modal .promotion-content::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .promotion-detail-modal .promotion-content::-webkit-scrollbar-track {
        background: rgba(32,187,228,.2);
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
    }

    .promotion-detail-modal .promotion-content::-webkit-scrollbar-thumb {
        background-color: #20bbe4;
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        height: 10px;
    }

    .promotion-detail-modal .promotion-content::-webkit-scrollbar-corner {
        background: #0b1e3e;
    }

.promotion-detail-modal .action-btn-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 15px;
    gap: 15px;
}

    .promotion-detail-modal .action-btn-wrap .action-btn {
        border: none;
        padding: 8px 20px;
        color: #fff;
        background: #14d5c3;
        border-color: #14d5c3;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        -moz-transition: all .4s;
        -o-transition: all .4s;
        -webkit-transition: all .4s;
        transition: all .4s;
    }

        .promotion-detail-modal .action-btn-wrap .action-btn:hover {
            -moz-transform: scale(1.1);
            -ms-transform: scale(1.1);
            -o-transform: scale(1.1);
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
        }

        .promotion-detail-modal .action-btn-wrap .action-btn:active {
            -moz-transform: scale(.9);
            -ms-transform: scale(.9);
            -o-transform: scale(.9);
            -webkit-transform: scale(.9);
            transform: scale(.9);
        }

    .promotion-detail-modal .action-btn-wrap .promotion-module-apply-btn {
        border: none;
        padding: 8px 20px;
        color: #fff;
        background: #14d5c3;
        border-color: #14d5c3;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        -moz-transition: all .4s;
        -o-transition: all .4s;
        -webkit-transition: all .4s;
        transition: all .4s;
    }

.promotionModuleModal .action-btn-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .promotionModuleModal .action-btn-wrap .action-btn {
        padding: 8px 20px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        color: #fff;
        border: 1px solid var(--icon-green-01, #0289A1);
        background: radial-gradient(60.58% 41.35% at 50% -19.09%, #FFFDE8 0%, rgba(255, 253, 232, 0.00) 100%), radial-gradient(59.19% 59.19% at 50% 50%, rgba(61, 139, 255, 0.00) 0%, rgba(35, 86, 164, 0.60) 100%), linear-gradient(179deg, #92CAA3 1.07%, #02869E 59.85%);
        background-blend-mode: normal, soft-light, normal;
        box-shadow: 0 2px 2px 0 #999A9C;
    }
/* --- 自定義活動-進度申請 --- */
.promo-progress-modal.modal .modal-header {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px 25px;
    background: var(--bg-header, linear-gradient(190deg, #4AA9A2 7.48%, #0289A1 92.22%));
    border-bottom: 2px solid var(--white);
}
.promo-progress-modal.modal .close-btn {
    position: absolute;
    right: 5px;
    width: 50px;
    height: 50px;
    display: block;
    color: #fff;
    cursor: pointer;
    border: none;
    transition: color 0.3s ease;
    /*            background: url('/CdnRedirect/Web.Portal/DN025-01.Portal/Content/Views/Shared/images/announcement-dialog/close.png') no-repeat center;*/
    background: url('/CdnRedirect/Web.Portal/DN025-01.Portal/Content/Views/Shared/images/announcement-dialog/close.png') no-repeat center;
    background-size: contain;
}
.promo-progress-modal.modal .close-btn i {
    display: none;
}
    /* 1. 篩選 Tabs (Filter Tabs) */
    ul.cp-filter-tabs {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0 0 15px 0;
    }

        ul.cp-filter-tabs li {
            padding: 10px 15px;
            color: var(--Text-color-dark, #5D6B67);
            cursor: pointer;
            font-size: 16px;
            position: relative;
            font-weight: 500;
        }

        ul.cp-filter-tabs li:hover {
            color: var(--Text-color-dark, #5D6B67);
            font-weight: bold;
        }

        /* 選中狀態 */
        ul.cp-filter-tabs li.active {
            color: var(--Text-color-dark, #5D6B67);
            font-weight: bold;
            border-bottom: 2px solid var(--icon-green-01, #0289A1);
        }


/* 2. 列表容器 */
.cp-progress-list {
    max-height: 600px;
    overflow-y: auto;
    scrollbar-width: auto;
    scrollbar-color: #5085C3 #0b162a;
}

.no-data-msg {
    text-align: center;
    padding: 40px;
    color: #aaa;
    font-size: 16px;
}

/* 3. 單筆項目 (Item) */
.cp-progress-item {
    margin-bottom: 12px;
    border-radius: 6px;
    overflow: hidden;
    transition: all 0.3s;
}

/* --- Header (未展開列) --- */
.cp-item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 15px;
    cursor: pointer;
    background-color: #5085C3; /* 藍灰色底 */
    color: #fff;
    font-size: 14px;
    border-radius: 6px; /* 預設圓角 */
}

/* 當展開時，Header 下方直角化，以接合 Body */
.cp-progress-item.is-expanded .cp-item-header {
    border-radius: 6px 6px 0 0;
    background-color: #5085C3;
}

.cp-item-header:hover {
    filter: brightness(1.1);
}

/* Header 內部欄位配置 */
.cp-item-header .col-left {
    flex: 2; /* 佔較多空間 */
    display: flex;
    align-items: center;
}

.cp-item-header .col-middle {
    flex: 1;
    text-align: right;
    padding-right: 15px;
}

.cp-item-header .col-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

/* 文字樣式 */
.date-label {
    color: #ccc;
    margin-right: 5px;
}

.amount-text {
    font-size: 15px;
    color: #fff;
}

/* 狀態文字顏色 (霓虹感) */
.status-text {
    font-size: 14px;
}

.st-pending {
    color: #7BEBB3; /* (申請中) */
}

.st-approved {
    color: #fff; /* (已核准) */
}

.st-rejected {
    color: #FF9FDE; /* (已拒絕) */
}

/* 箭頭 Icon */
.toggle-icon i {
    color: #fff;
    font-size: 12px;
    transition: transform 0.3s;
}

/* --- Body (展開詳細內容) --- */
.cp-item-body {
    background-color: #162D58;
    border-top: none;
    border-radius: 6px 0 6px 0;
    padding: 15px 10px;
    color: #e0e0e0;
    font-size: 14px;
}

/* 表格化排版 */

.detail-table {
    display: flex;
    flex-direction: column;
    border: 1px solid #BAC6D4;
    border-bottom: none; /* 避免最後一個 row 的 border-bottom 重疊變粗 */
}

.detail-row {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid #BAC6D4; /* 橫向分隔線 */
    padding: 0; /* 移除 Row 的 padding，改在 Cell 裡面設定 */
    min-height: 35px;
}

    .detail-row:last-child {
        border-bottom: 1px solid #BAC6D4;
    }

/* 欄位名稱 (左) */
.dt-label {
    width: 120px; /* 稍微加寬一點，避免文字太擠 */
    flex-shrink: 0;
    color: #CCE9FF;
    text-align: right;
    /* 邊框與內距設定 */
    border-right: 1px solid #BAC6D4; /* 直向分隔線 */
    padding: 10px; /* 讓文字與邊框保持距離 */
    margin: 0; /* 移除 margin，確保邊框緊貼 */
    display: flex;
    align-items: flex-start; /* 文字靠上對齊 */
    justify-content: flex-end; /* 文字靠右對齊 */
}

/* 欄位值 (右) */
.dt-value {
    flex-grow: 1;
    color: #CCE9FF;
    word-break: break-all;
    padding: 10px; /* 內距要跟 label 一樣，視覺才會整齊 */
    line-height: 1.5; /* 增加行高，讓多行文字易讀 */
}

/* --- 自定義活動-表單申請 --- */
.modal.promo-progress-modal .modal-dialog {
    width: 600px;
}
.modal.promo-progress-modal.in input {
    width: auto;
    height: auto;
    margin: auto;
}
.modal.promo-progress-modal .loading {
    padding: 15px;
    margin-bottom: 20px;
}

    .modal.promo-progress-modal .loading .icon {
        margin-right: 10px;
    }

.modal.promo-progress-modal.in input {
    width: auto;
    height: auto;
    margin: auto;
}
.modal.promo-progress-modal.in .btn-submit {
    width: 100%;
    display: flex;
    height: 40px;
    margin-bottom: 15px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    color: #fff;
    border-radius: 40px;
    background: linear-gradient(0deg, #248EA8 3.34%, #75D7E0 95.91%);
}
.cp-tabs {
    border-bottom: 2px solid #365075; /* 深色底線 */
    margin-bottom: 15px;
    padding-left: 0;
}

    .cp-tabs li {
        color: #8faabf;
        cursor: pointer;
        font-size: 16px;
        padding: 10px 20px;
        flex: 1;
        margin-right: 0;
        text-align: center;
        position: relative;
        transition: color 0.3s;
    }

        .cp-tabs li:hover {
            color: #fff;
        }

        .cp-tabs li.active {
            color: #69FFFF; /* 亮藍色文字 */
            font-weight: bold;
            border-bottom: none; /* 移除舊樣式 */
        }
            /* 亮藍色 Active 底線 */
            .cp-tabs li.active::after {
                content: '';
                position: absolute;
                bottom: -2px;
                left: 0;
                width: 100%;
                height: 2px;
                background-color: #69FFFF;
                box-shadow: 0 0 8px #69FFFF; /* 發光效果 */
            }

/* 2. 資訊標題區 (Info Header) */
.cp-info-header {
    margin: 25px 0 20px 0;
}

.info-row {
    margin: 8px 0;
    font-size: 16px;
}

.info-label {
    color: #fff;
}

.info-val {
    color: #fff;
    margin-left: 5px;
}

/* 3. 表單通用 (Form) */
.cp-form-group {
    margin-bottom: 25px;
}

/* Label 樣式 */
.cp-label {
    display: block;
    color: #fff; /* 較暗的藍色文字 */
    font-size: 16px;
}

    .cp-label.required::before {
        content: '*';
        color: #69FFFF; /* 亮藍色星號 */
        margin-right: 4px;
    }

/* --- Input Line Style (底線輸入框) --- */
.modal.in input.cp-input-line {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid #fff; /* 預設灰藍色底線 */
    color: #fff;
    font-size: 16px;
    outline: none;
    transition: border-color 0.3s;
    border-radius: 0;
}
    .modal.in input.cp-input-line::placeholder {
        color: #fff;
    }
    .cp-input-line:focus {
        border-bottom-color: #69FFFF; /* Focus 時變亮藍色 */
    }

/* Radio & Checkbox (維持預設，僅調整文字顏色) */
.cp-radio-group, .cp-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.radio-label, .check-label {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    color: #fff;
    font-size: 14px;
    margin-right: 0; /* 用 gap 控制間距，若瀏覽器不支援 gap 可改為 margin-right: 15px */
    white-space: nowrap; /* 防止單個選項文字斷行 */
}

    /* 輸入框微調 */
    .radio-label input, .check-label input {
        margin-right: 8px;
        transform: scale(1.1);
        margin-top: 0; /* 修正對齊 */
    }
.opt-text {
    margin-left: 5px;
}
/* --- Upload Zone (上傳區塊) --- */
.upload_zone.dark-zone {
    margin-top: 10px;
    width: 150px;
    height: 150px;
    border: 1px dashed #84C5E9; /* 深藍色虛線 */
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.3s;
    position: relative;
    overflow: hidden;
}


.upload-msg {
    display: flex;
    flex-direction: column;
    text-align: center;
    color: #84C5E9;
}

    .upload-msg i {
        font-size: 32px;
        margin-bottom: 8px;
        color: #84C5E9; /* Icon 亮色 */
    }

.upload-txt {
    font-size: 13px;
}

.preview-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}

/* --- Captcha (驗證碼) --- */
.cp-input-group.captcha-group {
    display: flex;
    align-items: flex-end; /* 對齊底部 */
    justify-content: space-between;
}

.captcha-group .cp-input-line {
    flex: 1;
    margin-right: 20px;
}

.cp-captcha-box {
    display: flex;
    align-items: center;
    padding: 5px 10px;
    margin-bottom: 2px;
    border-bottom: 1px solid #fff;
}

.captcha-img-wrap {
    height: 30px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

    .captcha-img-wrap img {
        height: 100%;
        width: auto;
    }

.btn-refresh {
    background: transparent;
    border: none;
    color: #fff;
    margin-left: 10px;
    cursor: pointer;
    font-size: 16px;
    padding: 0;
}

    .btn-refresh:hover {
        color: #69FFFF;
        transform: rotate(180deg);
        transition: transform 0.5s;
    }

/* --- Submit Button (提交按鈕) --- */
.cp-action-footer {
    margin-top: 40px;
    text-align: center;
}

.cp-submit-btn {
    width: 100%;
    max-width: 300px; /* 控制按鈕最大寬度 */
    padding: 12px 0;
    background: linear-gradient(90deg, #2b8c9e 0%, #4facfe 100%); /* 藍綠漸層 */
    border: none;
    border-radius: 25px; /* 圓角按鈕 */
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 234, 255, 0.3);
    transition: all 0.3s;
}

    .cp-submit-btn:hover {
        filter: brightness(1.1);
        transform: translateY(-2px);
    }

    .cp-submit-btn:disabled {
        background: #555;
        cursor: not-allowed;
        box-shadow: none;
    }