.provider-state-map {
    --provider-state-map-default: #6f9c76;
    --provider-state-map-border: #fff;

    width: 100%;
    max-width: 21rem;
    margin: 0 auto;
    overflow: hidden;
}

.provider-state-map svg {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.provider-state-map svg [id^="BR-"] {
    fill: var(--provider-state-map-default) !important;
    stroke: var(--provider-state-map-border) !important;
    stroke-width: .35 !important;
    stroke-linejoin: round;
}

.provider-state-map svg #BR-AC { fill: var(--provider-state-map-AC, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-AL { fill: var(--provider-state-map-AL, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-AM { fill: var(--provider-state-map-AM, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-AP { fill: var(--provider-state-map-AP, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-BA { fill: var(--provider-state-map-BA, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-CE { fill: var(--provider-state-map-CE, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-DF { fill: var(--provider-state-map-DF, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-ES { fill: var(--provider-state-map-ES, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-GO { fill: var(--provider-state-map-GO, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-MA { fill: var(--provider-state-map-MA, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-MG { fill: var(--provider-state-map-MG, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-MS { fill: var(--provider-state-map-MS, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-MT { fill: var(--provider-state-map-MT, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-PA { fill: var(--provider-state-map-PA, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-PB { fill: var(--provider-state-map-PB, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-PE { fill: var(--provider-state-map-PE, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-PI { fill: var(--provider-state-map-PI, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-PR { fill: var(--provider-state-map-PR, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-RJ { fill: var(--provider-state-map-RJ, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-RN { fill: var(--provider-state-map-RN, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-RO { fill: var(--provider-state-map-RO, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-RR { fill: var(--provider-state-map-RR, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-RS { fill: var(--provider-state-map-RS, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-SC { fill: var(--provider-state-map-SC, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-SE { fill: var(--provider-state-map-SE, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-SP { fill: var(--provider-state-map-SP, var(--provider-state-map-default)) !important; }
.provider-state-map svg #BR-TO { fill: var(--provider-state-map-TO, var(--provider-state-map-default)) !important; }

:root[data-front-theme="dark"] .provider-state-map,
:root[data-bs-theme="dark"] .provider-state-map {
    --provider-state-map-border: #000;
}