.stores-list {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 8px;
}

.store-item {
    padding: 15px;
    border-bottom: 1px solid #dee2e6;
    transition: background-color 0.3s ease;
}

.store-item:nth-child(even) {
    background-color: #f8f9fa;
}

.store-item:hover {
    background-color: #e9ecef;
}

.store-item:last-child {
    border-bottom: none;
}

.store-name {
    font-weight: 600;
    color: #212529;
    margin-bottom: 8px;
}

.store-address {
    color: #6c757d;
    margin-bottom: 5px;
}

.store-phone {
    color: #6c757d;
    font-size: 0.9em;
}

.google-maps-link {
    color: #bd1f17;
    text-decoration: none;
    font-weight: 500;
}

.google-maps-link:hover {
    color: #a01a14;
    text-decoration: underline;
}

.phone-icon, .map-icon {
    margin-right: 5px;
}

.selected-state-info {
    background: #fdf2f2;
    padding: 10px;
    border-radius: 5px;
    border-left: 4px solid #bd1f17;
}

@media (max-width: 768px) {
    .brazil-map {
        height: 250px;
    }

    .store-locator-map {
        margin-bottom: 30px;
    }
}

/*MAPA*/
#map {
    display: none;
}

#map .state {
    cursor: pointer;
}

#map .state .shape {
    cursor: pointer;
    -width: 0;
}

#map .state .label_icon_state {
    fill: #fff;
    font-family: Arial;
    font-size: 11px;
    line-height: 12px;
    font-weight: normal;
}

#map .state .label_state {
    display: none;
    font-family: Arial;
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
}

#map .state:hover .label_state,
#map .state.hover .label_state {
    display: block;
}

#map .model-green .state .shape {
    fill: #171717;
}

#map .model-green .state .icon_state {
    fill: #bd1f17;
}

#map .model-green .state .label_icon_state {
    fill: #fff;
}

#map .model-green .state .label_state {
    fill: #666;
}

#map .model-green .state:hover .shape,
#map .model-green .state.hover .shape {
    fill: #bd1f17;
}

#map .model-green .state:hover .icon_state,
#map .model-green .state.hover .icon_state {
    fill: #ccc;
}

#map .model-orange .state .shape {
    fill: #fd7132;
}

#map .model-orange .state .icon_state {
    fill: #6cb361;
}

#map .model-orange .state .label_icon_state {
    fill: #fff;
}

#map .model-orange .state .label_state {
    fill: #666;
}

#map .model-orange .state:hover .shape,
#map .model-orange .state.hover .shape {
    fill: #c93f04;
}

#map .model-orange .state:hover .icon_state,
#map .model-orange .state.hover .icon_state {
    fill: #10592f;
}

#map .model-darkgreen .state .shape {
    fill: #366823;
}

#map .model-darkgreen .state .icon_state {
    fill: #2779c6;
}

#map .model-darkgreen .state .label_icon_state {
    fill: #fff;
}

#map .model-darkgreen .state .label_state {
    fill: #666;
}

#map .model-darkgreen .state:hover .shape,
#map .model-darkgreen .state.hover .shape {
    fill: #4a8c31;
}

#map .model-darkgreen .state:hover .icon_state,
#map .model-darkgreen .state.hover .icon_state {
    fill: #5a95ce;
}
svg#map {
    transform: scale(0.8);
}
/* end MAPA */

/* Estilos para cidades com lojas */
.has-stores {
    background-color: #fdf2f2 !important;
    color: #bd1f17 !important;
    font-weight: 600 !important;
}

.has-stores:hover {
    background-color: #fce8e8 !important;
}

/* Loading state para select de cidades */
#cidade:disabled {
    background-color: #f8f9fa;
    color: #6c757d;
}

/* Animação de loading */
@keyframes pulse {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

.loading {
    animation: pulse 1.5s ease-in-out infinite;
}

/* Estado selecionado no mapa - maior especificidade */
#map .model-green .state.selected .shape {
    fill: #bd1f17 !important;
    stroke: #a01a14 !important;
    stroke-width: 3px !important;
}

#map .model-green .state.selected .icon_state {
    fill: #fff !important;
}

#map .model-green .state.selected .label_icon_state {
    fill: #fff !important;
    font-weight: bold !important;
}

/* Garantir que estados não selecionados voltem ao normal */
#map .model-green .state:not(.selected) .shape {
    fill: #171717 !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

#map .model-green .state:not(.selected) .icon_state {
    fill: #bd1f17 !important;
}

#map .model-green .state:not(.selected) .label_icon_state {
    fill: #fff !important;
    font-weight: normal !important;
}