/* ============================================
   Decanto Italy Map
   ============================================ */

/* Elementor imposta height:100%;max-height:100% inline su widget, colonne e
   sezioni, vincolando l'intera catena padre al di sopra della mappa. Serve
   coprire tutti i livelli della gerarchia Elementor altrimenti il documento
   considera il blocco finito prima della sua altezza reale, causando
   sovrapposizioni con il contenuto successivo. */
.elementor-section:has(.decanto-italy-map-wrap),
.elementor-container:has(.decanto-italy-map-wrap),
.e-con:has(.decanto-italy-map-wrap),
.e-con-inner:has(.decanto-italy-map-wrap),
.elementor-column:has(.decanto-italy-map-wrap),
.elementor-widget-wrap:has(.decanto-italy-map-wrap),
.elementor-element:has(.decanto-italy-map-wrap),
.elementor-widget-container:has(.decanto-italy-map-wrap),
.elementor-widget-shortcode:has(.decanto-italy-map-wrap),
.elementor-shortcode:has(.decanto-italy-map-wrap) {
    height: auto !important;
    max-height: none !important;
    /* align-self:flex-start previene lo stretch sull'asse trasversale del
       flex parent, forzando l'altezza naturale del contenuto.
       In flex-column (es. elementor-widget-wrap) l'asse trasversale è la
       LARGHEZZA, quindi serve width:100% per ripristinarla. */
    align-self: flex-start !important;
    width: 100% !important;
}

/* Layout */
.decanto-italy-map-wrap {
    display: flex;
    gap: 2rem;
    /* align-items: stretch (default) — le due colonne si pareggiano in altezza */
}

.decanto-italy-map-list {
    width: 50%;
    flex-shrink: 0;
}

.decanto-italy-map-svg {
    width: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* Region groups */
.region-group {
    margin-bottom: 1.5rem;
}

.region-group-title {
    color: #242e50;
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    border-bottom: 2px solid #242e50;
    padding-bottom: 0.4rem;
    margin: 0 0 0.6rem;
}

.region-group ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.region-group ul li {
    margin: 0;
    padding: 0;
}

.region-group ul li a {
    display: block;
    padding: 0.3rem 0;
    color: #444;
    text-decoration: none;
    font-size: 0.95rem;
    transition: color 0.2s;
}

.region-group ul li a:hover,
.region-group ul li.active a {
    color: #D13A38;
}

/* SVG: su desktop segue l'altezza del container (definita dal flex-stretch del wrapper).
   Su mobile viene sovrascritto sotto con width/height auto per sizing dalla viewBox. */
.decanto-italy-map-svg svg {
    width: auto;
    height: 100%;
    max-width: 100%;
    display: block;
    margin: 0 auto;
}

/* SVG paths — base (interactive regions) */
.decanto-italy-map-svg svg path {
    fill: #D13A38 !important;
    stroke: #fff !important;
    stroke-width: 1px;
    cursor: pointer;
    transition: fill 0.2s;
}

/* Non-interactive regions: Vatican, San Marino, Corsica, Malta */
.decanto-italy-map-svg svg path#VA,
.decanto-italy-map-svg svg path#SM,
.decanto-italy-map-svg svg path#FR-H,
.decanto-italy-map-svg svg path#MT {
    fill: #ccc !important;
    cursor: default;
    pointer-events: none;
}

/* Hover / active state */
.decanto-italy-map-svg svg path.hovered,
.decanto-italy-map-svg svg path.active {
    fill: #242e50 !important;
}

/* Tooltip */
.decanto-map-tooltip {
    position: absolute;
    background: #242e50;
    color: #fff;
    padding: 0.35rem 0.7rem;
    border-radius: 4px;
    font-size: 0.85rem;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s;
    white-space: nowrap;
    z-index: 10;
    transform: translate(-50%, calc(-100% - 8px));
}

.decanto-map-tooltip.visible {
    opacity: 1;
}

/* Mobile: mappa sopra, lista sotto, mappa più piccola e statica */
@media (max-width: 768px) {
    .decanto-italy-map-wrap {
        flex-direction: column-reverse;
        align-items: center;
    }

    .decanto-italy-map-list {
        width: 100%;
    }

    .decanto-italy-map-svg {
        width: 55%;
    }

    /* SVG si ridimensiona dalla viewBox — nessun JS necessario su mobile */
    .decanto-italy-map-svg svg {
        width: 100%;
        height: auto;
    }

    /* Nessuna interattività su mobile */
    .decanto-italy-map-svg svg path {
        pointer-events: none !important;
        cursor: default !important;
        transition: none !important;
    }

    .decanto-map-tooltip {
        display: none;
    }
}