.commonListBox {
    flex: 1;
    height: 100%;
    // overflow-y: scroll;

    overflow-x: hidden;
    font-size: 14px;
    color: #2f3238;
    display: flex;
    flex-direction: column;
    min-height: 0;
    // 移除 Tab 焦点时的黄色边框
    outline: none;
    &:focus {
        outline: none;
    }
    p {
        margin: 0;
    }
    .commonListTitle {
        font-weight: 500;
        padding: 16px 0 10px 16px;
        line-height: 17px;
        font-size: 12px;
    }
    .commonList {
        flex: 1;
        overflow-y: overlay;
        padding-bottom: 10px;
        .commonListCheckAll {
            padding-left: 16px;
            line-height: 50px;
        }
        .commonListCheck {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding-left: 16px;
            cursor: pointer;

            .partnerView {
                padding: 0 15px 0 5px;
                color: #298dff;
                &.disabled {
                    color: #a8adb3;
                    cursor: not-allowed;
                }
            }
        }
    }
    .ant-checkbox-wrapper {
        display: flex !important;
        align-items: center;
        flex: 1;
        // 移除 Tab 焦点时的边框
        &:focus,
        &:focus-visible {
            outline: none;
        }

    }
    .ant-checkbox-input {
        outline: none !important;
        box-shadow: none !important;
    }
    // 非高亮行：任意 hover/focus 下 checkbox 都不出现蓝色，仅高亮行显示蓝色（解决键盘操作时鼠标所在项蓝框）
    .commonListCheck:not(.highlighted) .ant-checkbox .ant-checkbox-inner,
    .commonListCheck:not(.highlighted) .ant-checkbox:hover .ant-checkbox-inner,
    .commonListCheck:not(.highlighted) .ant-checkbox-input:focus + .ant-checkbox-inner,
    .commonListCheck:not(.highlighted) .ant-checkbox-input:focus-visible + .ant-checkbox-inner {
        border-color: #d9d9d9 !important;
        box-shadow: none !important;
    }
    .ant-checkbox-inner {
        border-radius: 100% !important;
    }

    .ant-checkbox-disabled .ant-checkbox-inner::after {
        border-color: #f5f5f5 !important;
    }

    .ant-checkbox-checked::after {
        border: none;
    }
}

.commonItem, .commonItemShort {
    display: flex;
    height: 44px;
    box-sizing: content-box;
    align-items: center;
    padding: 6px 0;

    .commonPic {
        margin-right: 8px;
        margin-left: 4px;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: inline-block;
        background: #fff;
    }
    .commonNameContent {
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: center;

        // width: 188px;
        .commonNameBox {
            display: flex;
            align-items: center;
            max-width: 240px;

            .commonName {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                font-size: 13px;
                display: inline-block;
                vertical-align: middle;
            }
            .departmentTagBox {
                width: 49px;
                padding-right: 15px;
                display: flex;
                padding-top: 1px;
            }
            .tagIcon {
                height: 16px;
                min-width: 32px;
                border-radius: 3px;
                margin-left: 4px;
            }
            .owner {
                width: 42px;
                margin-left: 4px;
                color: #999;
                font-size: 12px;
                margin-top: 2px;
                flex-shrink: 0;
            }
        }

        .commonCount {
            font-size: 12px;
            font-weight: 400;
            color: #a8adb3;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
    }
    .userOrg {
        min-width: 240px;
        display: block;
        font-size: 12px;
        font-weight: 400;
        color: #a8adb3;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
.commonItemShort {
    .commonNameContent {
        width: 195px;
    }
    .userOrg{
        width: 195px;
    }
}
.highlighted {
    background-color: rgba(246, 247, 250, 1);
    .ant-checkbox .ant-checkbox-inner,
    .ant-checkbox:hover .ant-checkbox-inner {
        border-color: #326fef !important;
    }
}

// ==================== A-Z 字母联系人列表 ====================
// 外层容器
.alphabetContactListWrapper {
    flex: 1;
    display: flex;
    position: relative;
    min-height: 0;
    overflow: hidden;
    // 移除 Tab 焦点时的边框
    outline: none;
    &:focus {
        outline: none;
    }
}

.alphabetContactList {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    font-size: 14px;
    color: #2f3238;
    // 移除 Tab 焦点时的边框
    outline: none;
    &:focus {
        outline: none;
    }
    &::-webkit-scrollbar {
        display: none;
    }
    .commonListCheckAll {
        padding-left: 16px;
        line-height: 50px;
    }

    // 字母分组区域
    .letterSection {
        .letterHeader {
            padding: 6px 16px;
            font-size: 12px;
            font-weight: 600;
            background-color: #fff;
            color: #666;
            position: sticky;
            top: 0;
            z-index: 10;
        }

        .contactItem {
            display: flex;
            align-items: center;
            padding-left: 16px;
            cursor: pointer;

            .ant-checkbox-wrapper {
                display: flex !important;
                align-items: center;
                flex: 1;
            }
        }
    }

    // Checkbox 样式
    .ant-checkbox-wrapper {
        // 移除 Tab 焦点时的边框
        &:focus,
        &:focus-visible {
            outline: none;
        }
    }
    .ant-checkbox-inner {
        border-radius: 100% !important;
    }

    // Tab 焦点时不改变 checkbox 边框颜色
    .ant-checkbox-input:focus + .ant-checkbox-inner {
        border-color: #d9d9d9;
    }

    .ant-checkbox-disabled .ant-checkbox-inner::after {
        border-color: #f5f5f5 !important;
    }

    .ant-checkbox-checked::after {
        border: none;
    }
}
.ant-checkbox-input:hover, .ant-checkbox-inner::after {
    border: none;
}

// 右侧字母锚点导航 - 悬浮定位在列表右侧
.alphabetAnchorNav {
    position: absolute;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4px 0;
    user-select: none;
    z-index: 20;

    .anchorItem {
        width: 14px;
        height: 14px;
        line-height: 14px;
        text-align: center;
        font-size: 10px;
        color: #999;
        cursor: pointer;
        border-radius: 50%;
        transition: all 0.15s ease;

        &.active {
            color: #326fef;
            font-weight: 700;
        }
    }
}
