
/* HIỆU ỨNG KHI DI CHUỘT VÀO */
.gimy-tag-item:hover {
    background: #d90429 !important; /* Đổi sang đỏ đô thương hiệu */
    color: #ffffff !important;
    border-color: #ff4d6d !important;
    box-shadow: 0 0 12px rgba(217, 4, 41, 0.5) !important; /* Phát sáng nhẹ khi hover */
    transform: translateY(-2px) !important;
}

/* Tối ưu Mobile */
@media screen and (max-width: 768px) {
    .tag-container-bottom { padding: 20px 10px !important; }
    .gimy-tag-item { padding: 6px 12px !important; font-size: 12px !important; }
}


/* Container vùng chạm */
.touch-controls {
    position: absolute;
    top: 0; left: 0; width: 100%; height: calc(100% - 45px);
    display: flex; z-index: 99; pointer-events: none;
}

.touch-area { flex: 1; pointer-events: auto; display: flex; align-items: center; justify-content: center; }
.center-gap { flex: 1.5; pointer-events: none; }

/* Nút mặc định */
.touch-area span {
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    width: 55px; height: 55px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: bold;
    border: 1px solid rgba(255, 255, 255, 0.3);
    opacity: 0; /* Mặc định ẩn */
    transition: opacity 0.4s ease;
    pointer-events: none;
}

/* HIỆN NÚT KHI CÓ CLASS show-controls */
.fluid_video_wrapper.show-controls .touch-area span {
    opacity: 0.8 !important;
}

/* Khi bấm vào nút (Feedback) */
.touch-area.active span {
    background: #ff0000 !important;
    transform: scale(1.2);
    opacity: 1 !important;
}