#mapa-paraguay {
    width: 100%;
    height: auto;
    display: block;
}


/* ============================================================
   DEPARTAMENTOS
   ============================================================ */

.departamento {
    /**fill: #d0d7de;**/
    fill: #FAF2EF;
    stroke: #132a13;
    stroke-width: 1.2px;
    cursor: pointer;

    transition:
    fill 0.2s ease,
    stroke-width 0.2s ease;
}

.sucursal {
    /*fill: #90a955;*/
    fill: #C8D4AA;
    stroke-width: 1px;
}


.departamento:hover {
    /*fill: #90a955;*/
    fill:#d1d7de;
    stroke-width: 1px;
}

.sucursal:hover{
    /*fill: #7BB03B ;*/
    fill: #8DB600;
}




svg#mapa-paraguay{
    height: inherit;
    width: 100%;
    display: block;
}



.nombre-departamento { 
    font-family: Arial, sans-serif; 
    font-size: 14px; 
    font-weight: 600; 
    fill: #333; 
    pointer-events: none; 
    user-select: none; 
}

image.logo-suc.logo-central {
    y: 650;
    x: 360;
}

    
/* ============================================================
   SUCURSALES
   ============================================================ */

.sucursales {
    pointer-events: none;
}


.pin {
    pointer-events: all;
    cursor: pointer;
}


.pin-halo {
    fill: rgba(220, 53, 69, 0.25);

    animation:
    pulsar-pin 2s infinite;
}


.pin-core {
    fill: #dc3545;
    stroke: #ffffff;
    stroke-width: 2px;
}


.pin:hover .pin-core {
    r: 8;
}

.label-dpto{
    fill: #59636e;
}
.leyenda {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 8px;
  color: #59636e;
  font-size: 13px;
}
.leyenda span { display: inline-flex; align-items: center; gap: 7px; }
.muestra { display: inline-block; width: 15px; height: 15px; border-radius: 3px; border: 1px solid #fff; box-shadow: 0 0 0 1px #d7dce2; }
.distrito-normal { background: #e3e7ec; }
.distrito-sucursal { background: #78b83f; }
.pin-muestra { width: 12px; height: 12px; border-radius: 50%; background: #dc3545; border: 2px solid #fff; box-shadow: 0 0 0 1px #dc3545; }


@keyframes pulsar-pin {

    0% {
        opacity: 0.8;
        transform: scale(0.8);
    }

    50% {
        opacity: 0.3;
        transform: scale(1.4);
    }

    100% {
        opacity: 0.8;
        transform: scale(0.8);
    }

}


/* ============================================================
   TOOLTIP
   ============================================================ */

   #tooltip-mapa {

    position: absolute;

    display: none;

    background: white;

    padding: 8px 12px;

    border-radius: 6px;

    box-shadow:
    0 4px 15px rgba(0, 0, 0, 0.15);

    font-size: 13px;

    pointer-events: none;

    z-index: 1000;

}

@media (max-width: 768px) {
    
    svg#mapa-paraguay{
        height: inherit;
        width: 100%;
        display: block;
    }

    .nombre-departamento{
        font-size: 1em;
    }

    /*.label-dpto{
        fill: #ffffff;
        stroke: #000;
        stroke-width: 6px;
        paint-order: stroke fill;
        stroke-linejoin: round;
        font-size: 1.3em;
    }*/

    .label-dpto{
        fill: #59636e;
        font-size: 1.2em;
        font-weight: 600;
    }

}