/**
 * 案件管理 - 關係客戶拖曳排序樣式
 */
 .drag-handle {
        cursor: grab;
        margin-right: 5px;
    }
    .drag-handle:active {
        cursor: grabbing;
    }
    .drag-handle:hover {
        background-color: #f0f0f0;
    }
    .sortable-ghost {
        opacity: 0.5;
        background-color: #e9f7fe !important;
        border: 1px dashed #007bff !important;
    }
    .sortable-chosen {
        background-color: #f1f8ff;
        box-shadow: 0 0 10px rgba(0,123,255,0.2);
    }
    .sortable-drag {
        opacity: 0.8;
        transform: rotate(1deg);
    }
    /* 優化關聯客戶區塊樣式 */
    .customer-block {
        transition: all 0.2s ease;
        border-radius: 5px;
        padding: 5px;
    }
    .customer-block:hover {
        background-color: #f8f9fa;
    }

/* 拖曳區域高亮樣式 */
.sortable-ghost {
    background-color: rgba(52, 152, 219, 0.1) !important;
    border: 2px dashed #3498db !important;
}

/* 被選中拖曳的元素 */
.sortable-chosen {
    background-color: rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2) !important;
    transform: scale(1.01);
    z-index: 9999;
}

/* 拖曳時的元素樣式 */
.sortable-drag {
    opacity: 0.8;
    background-color: #fff !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15) !important;
}

/* 拖曳把手樣式 */
.drag-handle {
    cursor: move;
    cursor: -webkit-grabbing;
}

/* 主要客戶區域拖曳時高亮 */
#contact_id_block.sortable-ghost {
    background-color: rgba(46, 204, 113, 0.1) !important;
    border: 2px dashed #2ecc71 !important;
}

/* 當主要客戶區塊被拖曳時提供提示 */
#contact_id_block.sortable-chosen:before {
    content: "拖曳到關聯客戶區域進行交換";
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    z-index: 1000;
}

/* 當關聯客戶被拖曳到主要客戶區域時提供提示 */
.customer-block.sortable-chosen:before {
    content: "放開進行交換";
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    z-index: 1000;
}

/* 排序提示icon */
.swap-hint {
    cursor: help;
    margin-left: 5px;
    font-size: 14px;
}

/* 主要客戶區域的相對定位 */
#contact_id_block {
    position: relative;
}

/* 拖曳把手的位置調整 */
#contact_id_block .drag-handle {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 10;
}

/* 關聯客戶區塊的相對定位 */
.customer-block {
    position: relative;
}