.amap-wrapper {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-areas:
        "top top top"
        "left map right"
        "bottom bottom bottom";
    grid-template-columns: 100px 1fr 100px; /* Aumentado ligeramente para banderas anchas */
    grid-template-rows: auto 1fr auto;
    gap: 15px;
    align-items: center; 
}

.amap-global-svg {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 10;
}

.amap-connector {
    stroke: #ccc; 
    stroke-width: 1px; 
    transition: all 0.3s ease; 
    opacity: 0.3;
}

.amap-connector.active {
    stroke: #D32F2F; 
    stroke-width: 2px; 
    opacity: 1;
}

.amap-zone {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 20;
}

.amap-zone-top, .amap-zone-bottom {
    grid-area: top;
    flex-wrap: wrap;
    justify-content: center;
}

.amap-zone-bottom {
    grid-area: bottom;
}

.amap-zone-left {
    grid-area: left;
    flex-direction: column;
    align-items: center;
}

.amap-zone-right {
    grid-area: right;
    flex-direction: column;
    align-items: center;
}

.amap-grid-item {
    position: relative;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80px;
    text-align: center;
}

/* Contenedor invisible para la bandera */
.amap-logo-box {
    width: 60px;
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 6px;
    transition: transform 0.2s;
    z-index: 25;
}

.amap-grid-item:hover .amap-logo-box {
    transform: scale(1.1);
}

/* Estilo para la bandera completa */
.amap-flag-img {
    width: 100%;
    height: auto;
    display: block;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Sombra sutil para despegar del fondo */
    border-radius: 2px; /* Redondeado casi imperceptible para calidad */
}

.amap-no-img {
    font-size: 14px;
    color: #999;
}

.amap-ally-name {
    font-size: 10px;
    color: #444; 
    line-height: 1.2; 
    font-weight: 600;
}

.amap-map-section {
    grid-area: map;
    position: relative;
    width: 100%;
    z-index: 5;
}

/* Tooltip nativo de jsVectorMap */
.jvm-tooltip {
    z-index: 9999 !important;
}

@media (max-width: 768px) {
    .amap-wrapper {
        grid-template-areas: "top" "map" "left" "right" "bottom";
        grid-template-columns: 1fr;
    }
}