#map-container { height: 300px; width: 100%; border-radius: 12px; z-index: 1;}

/* Nhắm trực tiếp vào thẻ ảnh bên trong marker */
.gps-marker img {
    filter: hue-rotate(120deg) brightness(1.2) !important;
}

.selected-marker img {
    filter: hue-rotate(260deg) saturate(2) !important;
}

/* Hiệu ứng nhấp nháy cho toàn bộ khung marker GPS */
.gps-marker {
    animation: pulse-animation 2s infinite;
}

@keyframes pulse-animation {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.8; }
    100% { transform: scale(1); opacity: 1; }
}

/* Lớp phủ toàn màn hình */
.spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(255, 255, 255, 0.1); /* Nền trắng mờ */
    backdrop-filter: blur(0.5px); /* Hiệu ứng làm mờ nội dung phía sau thử từ 2px-8px*/
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Luôn nằm trên cùng */
    pointer-events: all; /* Ngăn tương tác với bên dưới */
}

/* Vòng xoay sang trọng */
.premium-loader {
    width: 30px;
    height: 30px;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border-top-color: #1a73e8; /* Màu xanh hiện đại hoặc màu thương hiệu của bạn */
    animation: spin 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}