.dd {
    max-width: 100%;
    background: #2b2b3a;
    border-radius: 12px;
    padding: 15px 20px 15px 40px; /* 左側留出空間給按鈕 */
    border: 1px solid #343447;
    color: #ffffff;
    position: relative;
}

.dd-list {
    padding-left: 0; /* 重置內縮，避免不必要的偏移 */
}

.dd-item {
    position: relative;
    margin-bottom: 8px;
}

.dd-handle {
    background-color: #383850;
    color: #ffffff;
    border-radius: 8px;
    padding: 12px 20px;
    border: 1px solid #454560;
    cursor: move;
    transition: background-color 0.2s ease, transform 0.2s ease;
    min-height: 120px;
    display: flex;
    align-items: center;
    position: relative;
}

    .dd-handle .btn {
        pointer-events: auto !important;
        z-index: 500 !important;
        position: relative;
    }

    .dd-handle:hover {
        background-color: #454560;
        transform: scale(1.02);
    }




/* 收合按鈕固定於父階層 */
.dd-item button[data-action="collapse"],
.dd-item button[data-action="expand"] {
    position: absolute;
    left: -30px; /* 始終維持於父層位置 */

    width: 28px;
    height: 28px;
    background-color: #4e4e6e;
    border-radius: 50%;
    font-size: 20px;
    line-height: 28px;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    border: none;
    z-index: 10;
}

    .dd-item button[data-action="collapse"]::before {
        content: "−";
    }

    .dd-item button[data-action="expand"]::before {
        content: "+";
    }

    .dd-item button[data-action="collapse"]:hover,
    .dd-item button[data-action="expand"]:hover {
        background-color: #6e6e8e;
    }

/* 調整內部子項目的縮進 */
.dd-list .dd-list {
    padding-left: 35px; /* 子階層往右邊縮排 */
}

/* 拖曳提示樣式 */
.dd-placeholder {
    background-color: rgba(255, 255, 255, 0.1);
    border: 2px dashed #6c757d;
    border-radius: 8px;
    height: 40px;
    margin-bottom: 8px;
}



/* Modal 黑暗主題與輸入框調整 */
.custom-dark-modal {
    background-color: #1f1f2e;
    color: #fff;
    border-radius: 10px;
    border: 1px solid #333;
    font-family: 'Orbitron', 'Noto Sans TC', sans-serif;
}

    .custom-dark-modal .modal-header,
    .custom-dark-modal .modal-footer {
        border-bottom: 1px solid #2e2e3e;
        background-color: #1f1f2e;
    }

    .custom-dark-modal .modal-footer {
        border-top: 1px solid #2e2e3e;
    }

    .custom-dark-modal .modal-body {
        font-size: 1rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .custom-dark-modal .form-control {
        background-color: #33334a;
        color: #ffffff;
        border: 1px solid #444460;
    }

        .custom-dark-modal .form-control:focus {
            border-color: #5a5a8f;
            background-color: #2b2b40;
            box-shadow: none;
        }

    .custom-dark-modal .btn-close {
        filter: invert(1);
    }

/* Custom Confirm Modal 樣式加強 */
#confirmActionModal .modal-content {
    background-color: #1f1f2e; /* 保持深色背景 */
    color: #ffffff; /* 字體顏色保持白色 */
    border: 1px solid #555570; /* 明顯的淺色邊框 */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.8); /* 加強陰影效果提升立體感 */
    border-radius: 10px; /* 圓角更加明顯 */
}

#confirmActionModal .modal-header {
    border-bottom: 1px solid #3a3a50; /* 標頭底線增加明顯性 */
    background-color: #2b2b3a; /* 標頭背景略有對比 */
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

#confirmActionModal .modal-title {
    font-weight: bold;
    font-size: 1.1rem;
    color: #fff; /* 標題明顯 */
}

#confirmActionModal .modal-body {
    padding: 20px; /* 大幅增加內文間距 */
    font-size: 1rem;
    line-height: 1.6; /* 行距加大更易讀 */
    text-align: center; /* 文字置中，增強美觀 */
    background-color: #232336; /* 內文區背景略深提升視覺區隔感 */
}

#confirmActionModal .modal-footer {
    border-top: 1px solid #3a3a50;
    background-color: #2b2b3a;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 12px 15px; /* 微調底部空間 */
}

    /* 確認與取消按鈕調整 */
    #confirmActionModal .modal-footer .btn-secondary {
        background-color: #5c5c77; /* 深色取消按鈕 */
        color: #ffffff;
        border-radius: 6px;
    }

        #confirmActionModal .modal-footer .btn-secondary:hover {
            background-color: #4a4a65;
        }

    #confirmActionModal .modal-footer .btn-warning {
        background-color: #ffc107; /* 黃色確認按鈕更突出 */
        color: #000;
        border-radius: 6px;
    }

        #confirmActionModal .modal-footer .btn-warning:hover {
            background-color: #e0a800;
            color: #000;
        }

/* 調整關閉按鈕顏色（白色） */
#confirmActionModal .btn-close {
    filter: invert(1);
    opacity: 0.7;
}

    #confirmActionModal .btn-close:hover {
        opacity: 1;
    }

/* Modal內文調整，加大字體、設定最小高度與垂直置中 */
#confirmActionModalBody {
    min-height: 100px; /* 設定內文最小高度，避免太小顯示不佳 */
    font-size: 18px; /* 字體大小明顯加大 */
    display: flex; /* 使用Flexbox進行垂直置中 */
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    text-align: center; /* 文字水平居中 */
    line-height: 1.8; /* 調整行距更加易讀 */
    padding: 25px; /* 調整內文間距更加舒適 */
}

/* 調整 Select2 整體風格與現有版型一致 */
.select2-container--default .select2-selection--single {
    background-color: #232336;
    border: 1px solid #393953;
    height: 45px;
    padding: 5px 12px;
    border-radius: 8px;
    color: #ffffff;
    font-size: 15px;
    display: flex;
    align-items: center;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #ffffff;
        line-height: 35px;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        border-color: #ffffff transparent transparent transparent;
    }

.select2-dropdown {
    background-color: #232336;
    border: 1px solid #393953;
    color: #ffffff;
    border-radius: 8px;
    overflow: hidden;
}

.select2-results__option {
    padding: 8px 15px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #448aff; /* 藍色突出 */
    color: #ffffff;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #393953; /* 已選取灰色 */
    color: #ffffff;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #393953;
    border: 1px solid #393953;
    color: #ffffff;
    border-radius: 6px;
    padding: 5px 10px;
}

    .select2-container--default .select2-search--dropdown .select2-search__field:focus {
        outline: none;
        border-color: #448aff;
    }

.select2-container--default .select2-results__option--selected {
    background-color: #393953;
    color: #ffffff;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    color: #ffffff;
    cursor: pointer;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
    color: #6c757d;
}

/* 修正下拉高度，防止過大 */
.select2-results__options {
    max-height: 250px;
}

.select2-container .selection {
    display: block !important;
    width: 100% !important;
}

.select2-container .select2-selection--single {
    width: 100% !important;
}

.select2-container.select2-container--default {
    width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 50%;
    width: 25px; /* 寬度增加一點，靠左 */
    right: 10px; /* 靠左一點 */
    display: flex;
    align-items: center;
    justify-content: center;
}

    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        border-width: 8px 6px 0 6px; /* 增加箭頭大小 */
        border-color: #ffffff transparent transparent transparent; /* 箭頭顏色 */
    }

/* Summernote 工具列恢復預設顏色 (白色背景、黑色文字)，並且不被你主題干擾 */
.note-editor .note-toolbar,
.note-editor .note-toolbar *,
.note-popover,
.note-popover *,
.note-modal,
.note-modal *,
.note-dropdown-menu,
.note-dropdown-menu *,
.note-btn,
.note-btn *,
.note-btn-group,
.note-btn-group * {
    color: #333 !important;
    background-color: #ffffff !important;
    border-color: #dae0e5 !important;
}

/* 實際編輯區維持你的深色版型 */
.note-editor.note-frame .note-editing-area .note-editable {
    background-color: #232336 !important;
    color: #ffffff !important;
    border-top: 1px solid #393953 !important;
}

/* Placeholder 顏色維持適合深色背景 */
.note-editor .note-placeholder {
    color: #6c757d !important;
}

/* 編輯區 scrollbar 維持深色主題 */
.note-editor.note-frame .note-editing-area .note-editable::-webkit-scrollbar {
    width: 8px;
}

.note-editor.note-frame .note-editing-area .note-editable::-webkit-scrollbar-track {
    background: #2c2c40;
}

.note-editor.note-frame .note-editing-area .note-editable::-webkit-scrollbar-thumb {
    background: #4a4a65;
    border-radius: 4px;
}

    .note-editor.note-frame .note-editing-area .note-editable::-webkit-scrollbar-thumb:hover {
        background: #606080;
    }

/* 修正 Summernote 圖片 Popover UI 樣式 */
.note-popover.popover {
    background-color: #ffffff !important;
    border: 1px solid #dae0e5 !important;
}

    .note-popover.popover .popover-content .btn,
    .note-popover.popover .popover-content .dropdown-toggle,
    .note-popover.popover .popover-content .dropdown-menu > li > a {
        color: #333 !important;
        background-color: #ffffff !important;
        border-color: #dae0e5 !important;
    }

        .note-popover.popover .popover-content .btn:hover,
        .note-popover.popover .popover-content .dropdown-toggle:hover,
        .note-popover.popover .popover-content .dropdown-menu > li > a:hover {
            background-color: #f0f0f0 !important;
        }



/* Select2 已選擇標籤背景與邊框 */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #4e556a; /* 保留：標籤背景色 */
    border-color: #4e556a; /* 保留：標籤邊框色 */
    color: #fff; /* 保留：標籤文字色 */
}

/* Select2 下拉選單項目滑鼠移入時的背景色 */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #58627c; /* 保留：滑鼠移入背景色 */
    color: #fff; /* 保留：滑鼠移入文字色 */
}

/* Select2 已選擇項目的背景色 */
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #4e556a; /* 保留：已選擇項目背景色 */
    color: #fff; /* 保留：已選擇項目文字色 */
}

/* 修正 Select2 多選框的主題一致性 */

/* 背景顏色調整 */
.select2-container--default .select2-selection--multiple {
    background-color: #33334a !important; /* 與輸入框一致的深色背景 */
    border-color: #444460 !important; /* 邊框顏色 */
    color: #ffffff !important; /* 文字顏色 */
}

    /* 標籤背景顏色和邊框 */
    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #393953 !important; /* 標籤背景色 */
        border-color: #454560 !important; /* 標籤邊框色 */
        color: #ffffff !important; /* 標籤文字色 */
    }

    /* 標籤刪除按鈕顏色 */
    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        color: #ffffff !important; /* 標籤刪除按鈕顏色 */
    }

    /* placeholder文字顏色 */
    .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
        color: #999999 !important; /* placeholder 文字顏色 */
    }

/* 下拉項目背景顏色 */
.select2-dropdown {
    background-color: #33334a !important; /* 下拉區塊背景色 */
    border-color: #444460 !important; /* 下拉區塊邊框色 */
}

/* 下拉選項 hover 與已選擇樣式 */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #58627c !important; /* 滑鼠移入背景色 */
    color: #ffffff !important; /* 滑鼠移入文字色 */
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #4e556a !important; /* 已選擇項目背景色 */
    color: #ffffff !important; /* 已選擇項目文字色 */
}

/* 搜尋框背景顏色 */
.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #393953 !important; /* 搜尋框背景色 */
    border-color: #454560 !important; /* 搜尋框邊框色 */
    color: #ffffff !important; /* 搜尋框文字色 */
}

    /* 搜尋框聚焦邊框色 */
    .select2-container--default .select2-search--dropdown .select2-search__field:focus {
        border-color: #5a5a8f !important; /* 搜尋框聚焦邊框色 */
    }


/* 還原操作按鈕黃色主題 */
.dropdown-toggle {
    background-color: #ffc107 !important; /* 原本黃色背景 */
    color: #000 !important; /* 黑色字體 */
    border: none; /* 移除邊框 */
    transition: background-color 0.2s ease;
}

    .dropdown-toggle:hover,
    .dropdown-toggle:focus {
        background-color: #e0a800 !important; /* 滑鼠移入較深黃色 */
        color: #000 !important;
    }

/* 維持下拉選單的深色風格 */
.dropdown-menu {
    background-color: #2b2b3a;
    border-radius: 8px;
    border: 1px solid #343447;
    color: #ffffff;
    padding: 5px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.dropdown-item {
    color: #ffffff;
    padding: 8px 20px;
    transition: background-color 0.2s ease;
    cursor: pointer; /* ⭐️ 新增手指游標 */
}

    .dropdown-item:hover,
    .dropdown-item:focus {
        background-color: #393953;
        color: #ffffff;
    }

    .dropdown-item.text-muted {
        color: #6c757d !important;
        cursor: not-allowed !important; /* ⭐️ 明確設定禁止游標 */
        background-color: transparent !important;
    }

.badge.bg-secondary {
    background-color: #6c757d !important;
    font-size: 0.9em;
    border-radius: 4px;
    color: #fff !important;
    padding: 8px 12px;
}

.dd-no-drag .dd-handle {
    cursor: not-allowed !important;
    background-color: #4a4a5f !important;
    color: #aaa !important;
    opacity: 0.7;
}


.dd-handle > .dd-btns {
    pointer-events: auto;
}

.dd-btns .btn {
    pointer-events: auto;
    position: relative;
}

.dd-no-drag .dd-handle:hover {
    background-color: #4a4a5f !important;
    transform: none !important;
}


#ECPayPayment .ecpay-pay-list-wrap {
    background: #202136 !important;
    border-radius: 16px !important;
    padding: 28px 28px 12px 28px !important;
    margin-bottom: 20px;
    box-shadow: 0 4px 32px #0008;
    border: 1.5px solid #27294a;
}

#ECPayPayment .ecpay-pay-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 18px;
}

    #ECPayPayment .ecpay-pay-list span,
    #ECPayPayment .ecpay-pl-type {
        background: #28294a !important;
        color: #eee !important;
        padding: 10px 20px;
        border-radius: 6px;
        font-weight: 500;
        font-size: 16px;
        cursor: pointer;
        transition: background 0.2s, color 0.2s;
    }

        #ECPayPayment .ecpay-pay-list span:hover,
        #ECPayPayment .ecpay-pl-act .ecpay-pl-type {
            background: #7a61ff !important;
            color: #fff !important;
        }

#ECPayPayment .ecpay-pl-act {
    border: 2.5px solid #7a61ff;
    background: #23254d !important;
}

#ECPayPayment .ecpay-pl-intro {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    background: #ffe066; /* 溫和的亮黃色 */
    border-radius: 8px;
    padding: 8px 16px;
    box-shadow: 0 1px 8px 0 rgba(255,224,102,0.05);
    letter-spacing: 1px;
    /* 可視覺強化，也可加個陰影或border看你需求 */
}

#ECPayPayment .ecpay-pl-content {
    padding: 20px 14px;
    background: #232437 !important;
    border-radius: 9px;
    border: 1px solid #353569 !important;
    color: #c8d1ff;
}

#ECPayPayment .ecpay-select-input.ecpay-cit-item.ecpay-col-a-100,
#ECPayPayment select,
#ECPayPayment input,
#ECPayPayment .ecpay-cit-item {
    background: #1a1a2f !important;
    color: #f4f4fa !important;
    border: 1.5px solid #33345e !important;
    border-radius: 6px;
    font-size: 15px;
    padding: 8px 12px;
    margin-bottom: 10px;
}

#ECPayPayment .ecpay-pl-note-box,
#ECPayPayment .ecpay-pnb-title,
#ECPayPayment .ecpay-pnb-list,
#ECPayPayment .ecpay-pnb-list li {
    background: transparent !important;
    color: #888ab6 !important;
    border: none !important;
}

#ECPayPayment .ecpay-red {
    color: #ff4974 !important;
    font-weight: bold;
}

#ECPayPayment .ecpay-card-status-line,
#ECPayPayment .ecpay-card-status-line span {
    color: #c2c5ef !important;
    background: none !important;
}

#ECPayPayment .ecpay-cit-title,
#ECPayPayment .ecpay-pl-content label {
    color: #bbc6ec !important;
    font-weight: 600;
}

@media (max-width: 768px) {
    #ECPayPayment .ecpay-pay-list {
        flex-direction: column;
    }

    #ECPayPayment .ecpay-cit-item-box {
        flex-direction: column;
    }

        #ECPayPayment .ecpay-cit-item-box .ecpay-cit-item {
            min-width: 100%;
        }
}
#paymentModal .modal-content {
    background: #191929 !important;
    color: #fff !important;
    border-radius: 18px;
    border: 2px solid #232346;
    box-shadow: 0 6px 48px #000c;
}

#paymentModal .modal-header {
    background: #191929 !important;
    border: none;
    border-radius: 18px 18px 0 0;
    color: #fff !important;
}

#paymentModal .modal-title {
    color: #f9f6ff !important;
    font-weight: 700;
    font-size: 1.35rem;
    letter-spacing: 1px;
}

#paymentModal .form-control {
    background: #232437 !important;
    color: #fff !important;
    border: 1.5px solid #393b70 !important;
}

#paymentModal label {
    color: #9ba2c8 !important;
}

#ECPayPayment .ecpay-select-tab select {
    background: #23233a;
    color: #fff;
    border: 1px solid #444;
}
#ECPayPayment .ecpay-select-input .ecpay-select-tab {
    background: transparent !important;
}