/* ============================================================
   Carte interactive des dolmens et menhirs d'Aveyron
   Police : Arial (héritée du site). Palette : tokens critical.css.
   ============================================================ */

.mt-page-header {
    padding-top: var(--space-4);
}
.mt-page-header h1 {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    color: var(--color-stone);
    margin: 0 0 .4rem;
}
.mt-page-header p {
    color: #555;
    font-size: .95rem;
    max-width: 70ch;
    margin: 0 0 1rem;
}
.mt-page-header p a { color: #2d7a3a; }

.megaliths-tool {
    max-width: var(--container-max);
    margin: 0 auto 2rem;
    padding-inline: var(--space-4);
}

.megaliths-tool .mt-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6) var(--space-8);
    margin: 1rem 0 1.4rem;
    padding: var(--space-4) var(--space-6);
    background: var(--color-mist);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}
.megaliths-tool .mt-stat { text-align: left; }
.megaliths-tool .mt-stat .n {
    display: block; font-size: 1.6rem; font-weight: bold; line-height: 1;
    font-variant-numeric: tabular-nums;
}
.megaliths-tool .mt-stat .l {
    display: block; margin-top: .3rem; font-size: .72rem; letter-spacing: .04em;
    text-transform: uppercase; color: #666;
}
.megaliths-tool .mt-stat.dolmen .n { color: var(--color-forest); }
.megaliths-tool .mt-stat.menhir .n { color: var(--color-ochre); }

.megaliths-tool .mt-toolbar {
    display: flex; flex-wrap: wrap; gap: .6rem; align-items: center;
    margin-bottom: 1.2rem;
}
.megaliths-tool .mt-search {
    flex: 1 1 220px; min-width: 0;
    border: 1px solid var(--color-border); border-radius: var(--radius-md);
    padding: .55rem .8rem; font: inherit; font-size: .92rem; color: var(--color-stone);
}
.megaliths-tool .mt-search:focus { outline: 2px solid var(--color-forest); outline-offset: 1px; }

.megaliths-tool .mt-chip {
    display: inline-flex; align-items: center; gap: .45rem;
    border: 1px solid var(--color-border); background: #fff;
    border-radius: var(--radius-full); padding: .45rem .85rem .45rem .65rem;
    font-size: .82rem; cursor: pointer; color: #666; font: inherit;
}
.megaliths-tool .mt-chip .dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.megaliths-tool .mt-chip[aria-pressed="true"] { color: var(--color-stone); border-color: currentColor; background: var(--color-mist); }
.megaliths-tool .mt-chip.dolmen[aria-pressed="true"] { color: var(--color-forest); }
.megaliths-tool .mt-chip.menhir[aria-pressed="true"] { color: var(--color-ochre); }
.megaliths-tool .mt-chip.mh .dot { background: #7a5a00; }
.megaliths-tool .mt-chip.dolmen .dot { background: var(--color-forest); }
.megaliths-tool .mt-chip.menhir .dot { background: var(--color-ochre); }
.megaliths-tool .mt-chip.located .dot { background: #999; }

.megaliths-tool .mt-layout {
    display: grid; grid-template-columns: 320px 1fr; gap: var(--space-4);
    align-items: start;
}
@media (max-width: 820px) { .megaliths-tool .mt-layout { grid-template-columns: 1fr; } }

.megaliths-tool .mt-panel {
    background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-md);
}

.megaliths-tool .mt-list-panel { display: flex; flex-direction: column; height: 620px; }
@media (max-width: 820px) { .megaliths-tool .mt-list-panel { height: 400px; order: 2; } }
.megaliths-tool .mt-list-head {
    padding: .7rem .85rem; border-bottom: 1px solid var(--color-border);
    font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #666;
    display: flex; justify-content: space-between; flex: none;
}
.megaliths-tool .mt-list { overflow-y: auto; flex: 1; }
.megaliths-tool .mt-item {
    display: flex; align-items: flex-start; gap: .55rem;
    width: 100%; text-align: left; background: none; border: none;
    border-bottom: 1px solid #f0ebe0; padding: .6rem .85rem; cursor: pointer;
    color: var(--color-stone); font: inherit; font-size: .86rem;
}
.megaliths-tool .mt-item:hover { background: var(--color-mist); }
.megaliths-tool .mt-item[aria-current="true"] { background: #eaf3ea; }
.megaliths-tool .mt-item.menhir[aria-current="true"] { background: #fbeee0; }
.megaliths-tool .mt-item .dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; flex: none; }
.megaliths-tool .mt-item .dot.dolmen { background: var(--color-forest); }
.megaliths-tool .mt-item .dot.menhir { background: var(--color-ochre); }
.megaliths-tool .mt-item.unmapped .dot { background: none; border: 1.4px dashed #999; }
.megaliths-tool .mt-item .meta { min-width: 0; }
.megaliths-tool .mt-item .nm { display: block; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.megaliths-tool .mt-item .cm { display: block; color: #666; font-size: .78rem; }
.megaliths-tool .mt-item .mh-tag { color: #7a5a00; font-size: .72rem; margin-left: .4rem; }
.megaliths-tool .mt-item .nl-tag { color: #888; font-size: .72rem; margin-left: .4rem; font-style: italic; }
.megaliths-tool .mt-empty { padding: 1.4rem .85rem; color: #666; font-size: .86rem; }

.megaliths-tool .mt-map-panel { padding: .8rem; position: relative; }
.megaliths-tool .mt-map-wrap { width: 100%; aspect-ratio: 776 / 837; overflow: hidden; border-radius: var(--radius-sm); }
.megaliths-tool svg.mt-svg { width: 100%; height: 100%; display: block; background: #eef2ea; cursor: grab; touch-action: none; }
.megaliths-tool svg.mt-svg.is-panning { cursor: grabbing; }
.megaliths-tool .mt-outline { fill: var(--color-mist); stroke: #a8987d; stroke-width: 1.1; vector-effect: non-scaling-stroke; stroke-opacity: .7; }
.megaliths-tool .mt-river { fill: none; stroke: #7fa3ad; stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; opacity: .8; }
.megaliths-tool .mt-river.major { stroke-width: 2.4; opacity: .95; }

.megaliths-tool .mt-town { pointer-events: none; }
.megaliths-tool .mt-town .town-dot { fill: #7a7060; }
.megaliths-tool .mt-town .town-label { font-family: var(--font-body); font-size: 11px; fill: #6b6252; font-weight: bold; }

.megaliths-tool .mt-pt { cursor: pointer; outline: none; }
.megaliths-tool .mt-pt-inner { transition: transform .1s ease; }
.megaliths-tool .mt-pt circle.core { transition: r .12s ease; }
.megaliths-tool .mt-pt.dolmen circle.core { fill: var(--color-forest); stroke: #fff; stroke-width: 1; }
.megaliths-tool .mt-pt.menhir circle.core { fill: var(--color-ochre); stroke: #fff; stroke-width: 1; }
.megaliths-tool .mt-pt circle.ring { fill: none; stroke: #7a5a00; stroke-width: 1.6; opacity: .9; }
.megaliths-tool .mt-pt:hover circle.core { r: 5.5; }
.megaliths-tool .mt-pt:focus-visible circle.core { stroke: var(--color-forest); stroke-width: 2; }
.megaliths-tool .mt-pt .pin { display: none; }
.megaliths-tool .mt-pt.active circle.core, .megaliths-tool .mt-pt.active circle.ring { display: none; }
.megaliths-tool .mt-pt.active .pin { display: block; filter: drop-shadow(0 2px 3px rgba(44,36,22,.35)); }
.megaliths-tool .mt-pt.dolmen .pin-body { fill: var(--color-forest); }
.megaliths-tool .mt-pt.menhir .pin-body { fill: var(--color-ochre); }
.megaliths-tool .mt-pt.active.mh .pin-body { stroke: #7a5a00; stroke-width: 2; }
.megaliths-tool .mt-pt.active:focus-visible .pin-body { stroke: #1a4a7a; stroke-width: 2.5; }
.megaliths-tool .mt-pt .pin-dot { fill: #fff; }

.megaliths-tool .mt-legend {
    position: absolute; left: 20px; bottom: 20px;
    background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-sm);
    padding: .5rem .75rem; font-size: .72rem; color: #666;
    display: flex; gap: .85rem; box-shadow: var(--shadow-sm);
}
.megaliths-tool .mt-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.megaliths-tool .mt-legend .dot { width: 8px; height: 8px; border-radius: 50%; }
.megaliths-tool .mt-legend .dot.dolmen-dot { background: var(--color-forest); }
.megaliths-tool .mt-legend .dot.menhir-dot { background: var(--color-ochre); }
.megaliths-tool .mt-legend .dot.mh-dot { background: none; border: 1.5px solid #7a5a00; }

.megaliths-tool .mt-zoom {
    position: absolute; right: 20px; bottom: 20px;
    display: flex; flex-direction: column;
    background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm); overflow: hidden;
}
.megaliths-tool .mt-zoom button {
    width: 32px; height: 32px; border: none; background: none; cursor: pointer;
    font-size: 1rem; color: var(--color-stone); font: inherit; line-height: 1;
    border-bottom: 1px solid var(--color-border);
}
.megaliths-tool .mt-zoom button:last-child { border-bottom: none; }
.megaliths-tool .mt-zoom button:hover { background: var(--color-mist); }
.megaliths-tool .mt-zoom-reset { font-size: .6rem !important; }

.megaliths-tool .mt-note {
    margin-top: 1rem; font-size: .78rem; color: #666; line-height: 1.55;
}
.megaliths-tool .mt-note a { color: #2d7a3a; }

/* Modale de detail */
.mt-modal-backdrop {
    position: fixed; inset: 0; background: rgba(26,26,26,.5);
    display: flex; align-items: center; justify-content: center;
    padding: 20px; z-index: 200;
}
.mt-modal-backdrop[hidden] { display: none; }
.mt-modal {
    background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    width: 100%; max-width: 440px; max-height: min(560px, 84vh);
    overflow-y: auto; padding: 1.3rem 1.3rem 1.1rem; position: relative;
}
.mt-modal-close {
    position: absolute; top: 10px; right: 10px;
    width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--color-border);
    background: var(--color-mist); color: #666; cursor: pointer;
    font-size: 1.05rem; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.mt-modal-close:hover { color: var(--color-stone); }
.mt-modal h2 { font-size: 1.25rem; margin: 0 22px .3rem 0; color: var(--color-stone); }
.mt-modal .mt-sub { color: #666; font-size: .86rem; margin: 0 0 1rem 0; }
.mt-modal dl { display: grid; grid-template-columns: auto 1fr; gap: .5rem .9rem; margin: 0; font-size: .86rem; }
.mt-modal dt { color: #666; }
.mt-modal dd { margin: 0; }
.mt-modal a { color: #2d7a3a; }
.mt-modal .mt-maps-link { font-size: .78rem; color: #888; }
.mt-badge {
    display: inline-block; font-size: .68rem; text-transform: uppercase; letter-spacing: .04em;
    padding: .15rem .55rem; border-radius: var(--radius-full); background: #fff8e0; color: #7a5a00;
}
