/* --- 1. HIỆU ỨNG RUNG GẮT 1.3X --- */
@keyframes cpm-extreme-shake {
    0% { transform: scale(1) rotate(0); }
    12% { transform: scale(1.3) rotate(-10deg); }
    24% { transform: scale(1.3) rotate(10deg); }
    36% { transform: scale(1.3) rotate(-10deg); }
    48% { transform: scale(1.3) rotate(10deg); }
    60% { transform: scale(1) rotate(0); }
    100% { transform: scale(1) rotate(0); }
}

/* --- 2. CẤU TRÚC KHUNG CHỐNG CO NỀN --- */
.cpm-main-container {
    pointer-events: none;
    display: block !important;
    position: fixed !important;
}

.cpm-block { 
    margin-bottom: 7px !important; /* Khoảng cách sát nhau 50% */
    pointer-events: auto; 
    display: block !important;
    width: 100% !important;
}

.cpm-action-link { 
    display: inline-flex !important; /* Đảm bảo nền bao phủ toàn bộ */
    align-items: center !important; 
    text-decoration: none !important; 
    border: none !important;
    width: fit-content !important;
}

/* --- 3. FIX ICON 30PX & TRIỆT TIÊU VIỀN TRẮNG --- */
.cpm-icon-box {
    width: 44px !important; 
    height: 44px !important;
    min-width: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important; /* Xóa viền trắng cho Messenger/Zalo */
    border: none !important;
    box-shadow: none !important;
    z-index: 10;
}

/* Riêng Type 1 cần nền trắng tròn bao icon */
.cpm-mode-1 .cpm-icon-box {
    background: #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
}

.cpm-icon-box img { 
    width: 30px !important; 
    height: 30px !important; 
    min-width: 30px !important;
    max-width: 30px !important;
    object-fit: contain !important;
    animation: cpm-extreme-shake 2.2s cubic-bezier(.36,.07,.19,.97) both infinite;
}

/* --- 4. FIX MẤT NỀN MESSENGER (cpm-bg-blue-light) --- */
.cpm-text-box {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    padding: 8px 20px 8px 25px !important;
    margin-left: -20px !important; /* Đè lên icon cho Type 1 */
    z-index: 5;
    border-radius: 0 40px 40px 0 !important;
    display: block !important; /* Đảm bảo luôn hiển thị nền */
}

/* ĐỊNH NGHĨA MÀU NỀN - FIX LỖI CO NỀN */
.cpm-bg-orange { background: #f39c12 !important; }
.cpm-bg-red { background: #e74c3c !important; }
.cpm-bg-blue { background: #0180c7 !important; }

/* FIX RIÊNG CHO MESSENGER ĐANG MẤT NỀN */
.cpm-bg-blue-light { 
    background: #2e62f0 !important; /* Màu xanh Messenger */
}

/* --- 5. ĐIỀU CHỈNH TYPE 3 (ZALO/MESS) THANH MẢNH --- */
.cpm-mode-3 .cpm-action-link {
    background: #2e62f0 !important;
    border-radius: 10px !important;
    padding-right: 15px !important;
}

.cpm-mode-3 .cpm-text-box {
    margin-left: 0 !important;
    padding: 8px 10px !important;
    background: transparent !important; /* Dùng nền của action-link */
}