/* ============================================================
   Weltkarte: Container, SVG-Stile, Länder-Hervorhebungen
   ============================================================ */

.dashboard-main {
    padding: 1.5rem 2rem 2.5rem;
}

.map-section {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.map-container {
    position: relative;
    align-self: center;
    width: 100%;
    max-width: min(100%, 64rem);
    background: var(--bg-panel);
    border: 1px solid var(--border);
    border-radius: 6px;
    overflow: hidden;
}

.map-container svg {
    display: block;
    width: 100%;
    height: auto;
}

.map-container svg.is-zoomed rect:first-of-type {
    cursor: zoom-out;
}

.map-ocean-stop--from { stop-color: var(--map-ocean-from); }
.map-ocean-stop--to   { stop-color: var(--map-ocean-to); }

.graticule {
    stroke: var(--map-grid);
    transition: stroke 0.2s ease;
}

.equator {
    stroke: var(--map-grid-strong);
    transition: stroke 0.2s ease;
}

.continent {
    fill: var(--map-land);
    stroke: var(--map-land-stroke);
    stroke-width: 0.6;
    stroke-linejoin: round;
    fill-rule: evenodd;
    cursor: pointer;
    transition: fill 0.2s ease, stroke 0.2s ease, fill-opacity 0.15s ease;
}

.continent:hover {
    fill-opacity: 0.75;
}

/* Heute angegriffen → blau */
.country-attacked {
    fill: #2a7fff;
    fill-opacity: 0.65;
    stroke: #5aadff;
    stroke-width: 0.8;
    cursor: pointer;
    transition: fill-opacity 0.15s ease;
}

.country-attacked:hover {
    fill-opacity: 0.9;
    stroke-width: 1.4;
}

/* Gerade im Tarpit → rot pulsierend */
.continent.country-tarpit {
    fill: #ff2222 !important;
    stroke: #ff5555;
    stroke-width: 1.2;
    cursor: default;
    animation: tarpit-pulse 1.2s ease-in-out infinite;
}

@keyframes tarpit-pulse {
    0%   { fill: #ff2222; fill-opacity: 1;   }
    50%  { fill: #ff4400; fill-opacity: 0.25; }
    100% { fill: #ff2222; fill-opacity: 1;   }
}