/* ===================================================
   VCTier - icon-fix.css  (SVG icons — no blend needed)
   =================================================== */

/* Tab & nav icons */
.tab-icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
}
.discord-chip img { filter: brightness(10); }

/* ── Tier chip icon ─────────────────────────────────
   SVG đã trong suốt sẵn, chỉ cần vòng tròn màu viền
   Bỏ hoàn toàn background gradient đen/xám
   ─────────────────────────────────────────────────── */
.tier-chip-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    overflow: visible !important;
}
.tier-chip-icon img {
    width: 22px !important;
    height: 22px !important;
    object-fit: contain !important;
    mix-blend-mode: normal !important;
    filter: none !important;
}

/* Badge drop-shadow only — NO background */
.badge-ht1 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(255,100,50,.7))  !important; }
.badge-ht2 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(240,180,30,.7))  !important; }
.badge-ht3 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(255,220,50,.6))  !important; }
.badge-ht4 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(80,220,100,.6))  !important; }
.badge-ht5 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(50,200,160,.6))  !important; }
.badge-lt1 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(255,100,50,.7))  !important; }
.badge-lt2 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 5px rgba(240,180,30,.7))  !important; }
.badge-lt3 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 4px rgba(100,180,255,.6)) !important; }
.badge-lt4 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 4px rgba(150,130,255,.6)) !important; }
.badge-lt5 .tier-chip-icon { background: transparent !important; border: none !important; box-shadow: none !important; filter: drop-shadow(0 0 3px rgba(120,130,160,.5)) !important; }

/* Player modal tier icons */
.pm-tier-icon {
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: transparent !important;
    border: none !important;
    overflow: visible;
}
.pm-tier-icon img {
    width: 24px; height: 24px; object-fit: contain;
    mix-blend-mode: normal !important;
    filter: none !important;
}
.pm-tier-chip.badge-ht1 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(255,100,50,.7));  }
.pm-tier-chip.badge-ht2 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(240,180,30,.7));  }
.pm-tier-chip.badge-ht3 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(255,220,50,.6));  }
.pm-tier-chip.badge-ht4 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(80,220,100,.6));  }
.pm-tier-chip.badge-ht5 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(50,200,160,.6));  }
.pm-tier-chip.badge-lt1 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(255,100,50,.7));  }
.pm-tier-chip.badge-lt2 .pm-tier-icon { filter: drop-shadow(0 0 5px rgba(240,180,30,.7));  }
.pm-tier-chip.badge-lt3 .pm-tier-icon { filter: drop-shadow(0 0 4px rgba(100,180,255,.6)); }
.pm-tier-chip.badge-lt4 .pm-tier-icon { filter: drop-shadow(0 0 4px rgba(150,130,255,.6)); }
.pm-tier-chip.badge-lt5 .pm-tier-icon { filter: drop-shadow(0 0 3px rgba(120,130,160,.5)); }
.pm-tier-icon.empty { opacity: .25 !important; filter: none !important; }

/* Avatar player — không blend */
.tier-player-avatar img,
.player-avatar,
.pm-avatar-wrap img,
.search-result-avatar img,
.player-bust {
    mix-blend-mode: normal !important;
    filter: none !important;
}

.ctrl-btn svg { mix-blend-mode: normal !important; }
.ctrl-btn { isolation: isolate !important; background-clip: padding-box; }

/* ===================== CIRCULAR TIER CHIPS - HARD OVERRIDE ===================== */
/* Đây là khung tròn mới, không bị ảnh hưởng bởi rules cũ */
.tier-chip-circle {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
    width: 46px !important;
    flex-shrink: 0 !important;
}
.tier-chip-circle-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2.5px solid #3a9fbf !important;
    background: rgba(15, 25, 50, 0.9) !important;
    box-shadow: 0 0 0 1px rgba(60,160,200,0.15) !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    filter: none !important;
}
.tier-chip-circle-icon img {
    width: 22px !important;
    height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: contain !important;
    display: block !important;
    mix-blend-mode: normal !important;
    filter: none !important;
    background: transparent !important;
    flex-shrink: 0 !important;
}
.tier-chip-empty .tier-chip-circle-icon {
    border: 2px dashed rgba(255,255,255,0.15) !important;
    background: rgba(255,255,255,0.02) !important;
    box-shadow: none !important;
}
.tier-chip-empty .tier-chip-circle-icon img {
    opacity: 0.2 !important;
    filter: grayscale(1) !important;
}
.tier-chip-circle-label {
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: 0.3px !important;
    color: #7ecfff !important;
    white-space: nowrap !important;
    background: rgba(10,20,40,0.9) !important;
    padding: 2px 7px !important;
    border-radius: 6px !important;
    margin-top: 1px !important;
    border: 1px solid rgba(100,180,255,0.2) !important;
    display: block !important;
}
.tier-chip-empty .tier-chip-circle-label {
    color: rgba(255,255,255,0.25) !important;
    background: transparent !important;
    border-color: transparent !important;
}
/* Badge classes không override circle */
.badge-ht1 .tier-chip-circle-icon,
.badge-ht2 .tier-chip-circle-icon,
.badge-ht3 .tier-chip-circle-icon,
.badge-ht4 .tier-chip-circle-icon,
.badge-ht5 .tier-chip-circle-icon,
.badge-lt1 .tier-chip-circle-icon,
.badge-lt2 .tier-chip-circle-icon,
.badge-lt3 .tier-chip-circle-icon,
.badge-lt4 .tier-chip-circle-icon,
.badge-lt5 .tier-chip-circle-icon {
    background: rgba(15, 25, 50, 0.9) !important;
    border: 2.5px solid #3a9fbf !important;
    box-shadow: 0 0 6px rgba(58,159,191,0.3) !important;
    filter: none !important;
}

/* Fix avatar màu xanh trong tier tables */
img.avatar {
    mix-blend-mode: normal !important;
    filter: none !important;
}