/* Outil « Voir son plan sur Google Earth » (scripts/blocks/plan-google-earth.mjs, assets/js/tools/plan-google-earth-ui.js) */
.pge-tool { max-width: 1040px; display: grid; gap: 1.2rem; container: pge / inline-size; min-width: 0; }
.pge-tool * { min-width: 0; }
.pge-tool .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pge-tool .note { margin: 0; }
.pge-step { display: flex; align-items: center; gap: .7rem; font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); margin: .6rem 0 0; }
.pge-step span { flex: none; display: inline-grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--ink); color: #fff; font: 600 .95rem/1 var(--mono); }
.pge-step:focus { outline: none; }
.pge-step:focus-visible { outline: 3px solid var(--copper); outline-offset: 3px; }

/* Onglets */
.pge-modes { display: inline-flex; flex-wrap: wrap; gap: 4px; background: var(--sand); border-radius: 22px; padding: 4px; justify-self: start; max-width: 100%; }
.pge-modes button { font: inherit; font-weight: 650; border: 0; background: none; padding: .6rem 1.1rem; border-radius: 999px; cursor: pointer; color: var(--text); }
.pge-modes button[aria-selected="true"] { background: var(--ink); color: #fff; }
.pge-modes button:focus-visible { outline: 3px solid var(--copper); outline-offset: 2px; }

.pge-tool .form { gap: 1rem; }
.pge-intro { margin: 0; }
.pge-opt { font-weight: 400; color: var(--muted); }
.pge-tool .hint { margin: 0; }
.pge-err { margin: 0; color: #b3261e; font-size: .88rem; font-weight: 600; }
.pge-err:empty { display: none; }
:root[data-theme="dark"] .pge-err { color: #ffb4ab; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pge-err { color: #ffb4ab; } }
.pge-res .pge-err { color: #ffb4ab; }
.pge-tool [aria-invalid="true"] { border-color: #b3261e !important; box-shadow: inset 0 0 0 1px #b3261e; }
.pge-tool button:focus-visible, .pge-tool a:focus-visible, .pge-tool summary:focus-visible, .pge-tw:focus-visible, .pge-out:focus-visible { outline: 3px solid var(--copper); outline-offset: 2px; }
.pge-out:focus { outline: none; }
.pge-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.pge-tool .btn { cursor: pointer; font: inherit; font-weight: 650; max-width: 100%; white-space: normal; text-align: start; }
.pge-tool .btn:disabled { opacity: .55; cursor: progress; }
.pge-tool .form .btn.ghost, .pge-tool .btn.ghost { color: var(--text); border: 1px solid var(--input-line); padding: .7rem 1.1rem; background: transparent; }
.pge-tool .btn.ghost:hover { border-color: var(--copper); }
.pge-tool .btn.ghost[aria-pressed="true"] { background: var(--ink); color: #fff; border-color: var(--ink); }
.pge-help summary, .pge-tool details > summary { cursor: pointer; font-weight: 650; }
.pge-help[open] { display: grid; gap: .6rem; }
.pge-help ul { margin: 0; padding-inline-start: 1.2rem; display: grid; gap: .35rem; }
.pge-help p { margin: 0; }
.pge-tool fieldset { border: 1px solid var(--line); border-radius: 12px; padding: .7rem .9rem .9rem; margin: 0; display: grid; gap: .8rem; }
.pge-tool legend { font-weight: 650; padding-inline: .3rem; }
.pge-grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .8rem 1rem; }

/* Dépôt de fichier */
.pge-drop { display: grid; gap: .4rem; border: 2px dashed var(--input-line); border-radius: 14px; padding: .9rem 1rem; }
.pge-drop.over { border-color: var(--copper); background: var(--sand); }
.pge-msg p { margin: 0; }
.pge-msg:empty { display: none; }
.pge-busy { display: flex; align-items: center; gap: .6rem; font-weight: 600; }
.pge-spin { width: 1.1rem; height: 1.1rem; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--copper-ink); animation: pge-spin .9s linear infinite; }
@keyframes pge-spin { to { transform: rotate(360deg); } }

/* Aperçu CSV et tableaux clairs */
.pge-tw { overflow-x: auto; border-radius: 10px; border: 1px solid var(--line-d); }
.pge-tw-l { border-color: var(--line); }
.pge-tab { width: 100%; border-collapse: collapse; font-size: .86rem; overflow-wrap: normal; }
.pge-tab caption { text-align: start; font-weight: 650; padding: .6rem .8rem; color: #fff; }
.pge-tab-l caption { color: var(--text); }
.pge-tab th, .pge-tab td { padding: .45rem .8rem; text-align: end; border-top: 1px solid var(--line-d); white-space: nowrap; font-family: var(--mono); font-weight: 400; }
.pge-tab-l th, .pge-tab-l td { border-top-color: var(--line); text-align: start; }
.pge-tab th[scope="row"], .pge-tab thead th:first-child, .pge-tab .pge-tl { text-align: start; }
.pge-tab .pge-tl { font-family: var(--sans); white-space: normal; min-width: 6rem; }
.pge-tab thead th { font-family: var(--sans); font-weight: 650; font-size: .78rem; color: rgba(236, 234, 255, .8); white-space: normal; }
.pge-tab-l thead th { color: var(--muted); }

/* Saisie manuelle */
.pge-pts-head, .pge-pt { display: grid; grid-template-columns: 2rem minmax(4rem, .7fr) 1fr 1fr minmax(4rem, .6fr) minmax(4rem, .6fr) auto; gap: .5rem; align-items: center; }
.pge-pts-head { font-size: .8rem; font-weight: 650; color: var(--muted); }
.pge-pts { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.pge-num { font-family: var(--mono); font-size: .85rem; color: var(--muted); text-align: center; }
.pge-f { display: block; font-weight: 400; }
.pge-fl { display: none; font-size: .78rem; font-weight: 650; color: var(--muted); }
.pge-tool .form .pge-pt input { padding: .6rem .7rem; }
.pge-row-act { display: inline-flex; gap: .3rem; }
.pge-row-act button { font: inherit; width: 2.4rem; height: 2.4rem; border-radius: 10px; border: 1px solid var(--input-line); background: var(--surface); color: var(--text); cursor: pointer; display: inline-grid; place-items: center; }
.pge-row-act button:disabled { opacity: .4; cursor: default; }
.pge-pt .pge-err { grid-column: 2 / -1; }
@container pge (max-width: 46rem) {
  .pge-pts-head { display: none; }
  .pge-pt { grid-template-columns: 2rem 1fr 1fr; border: 1px solid var(--line); border-radius: 12px; padding: .6rem; }
  .pge-pt .pge-fl { display: block; margin-bottom: .2rem; }
  .pge-pt .pge-f:nth-of-type(1) { grid-column: 2 / -1; }
  .pge-pt .pge-f:nth-of-type(2) { grid-column: 1 / 3; }
  .pge-row-act { grid-column: 1 / -1; justify-content: flex-end; }
  .pge-pt .pge-err { grid-column: 1 / -1; }
}
@container pge (max-width: 22rem) {
  .pge-pt { grid-template-columns: 2rem 1fr; }
  .pge-pt .pge-f { grid-column: 1 / -1 !important; }
}

/* Résumé, calques, détection */
.pge-sum { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: .6rem 1.2rem; }
.pge-sum dt { font-size: .8rem; color: var(--muted); font-weight: 650; }
.pge-sum dd { margin: 0; overflow-wrap: anywhere; }
.pge-laylist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: .4rem .8rem; max-height: 22rem; overflow: auto; }
.pge-laylist .chk { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-weight: 400; }
.pge-sw { width: 1rem; height: 1rem; border-radius: 4px; background: var(--c); border: 1px solid var(--text); flex: none; }
.pge-ln { font-weight: 650; overflow-wrap: anywhere; }
.pge-lc { color: var(--muted); font-size: .85rem; }
.pge-cands { margin: 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
.pge-cands li { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; padding: .5rem .8rem; }
.pge-cands .btn { padding: .45rem .9rem !important; font-size: .9rem; }
.pge-detect p { margin: 0 0 .5rem; }
.pge-warn-box { border-inline-start: 4px solid var(--copper-ink); background: var(--sand); border-radius: 8px; padding: .8rem 1rem; }
.pge-warn-box p { margin: 0; }
.pge-warn { margin: 0; padding: .8rem 1rem; list-style: none; border-inline-start: 4px solid var(--copper-l); background: rgba(224, 153, 92, .12); border-radius: 8px; display: grid; gap: .4rem; font-size: .92rem; }
.pge-warn li::before { content: "⚠ "; }
.pge-warn-l { border-inline-start-color: var(--copper-ink); background: var(--sand); }

/* Calage */
.pge-calage[hidden], .pge-names[hidden], .pge-csvmap[hidden] { display: none; }
.pge-plan { margin: 0; display: grid; gap: .4rem; }
.pge-plansvg { width: 100%; height: auto; max-height: 460px; border: 1px solid var(--line); border-radius: 12px; cursor: crosshair; display: block; }
.pge-plan-bg { fill: var(--surface); }
.pge-plan-g path { fill: none; stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.pge-pm { fill: var(--copper-btn); stroke: #fff; stroke-width: 2; }
.pge-pmt { fill: #fff; font: 700 11px var(--mono); }
.pge-pairs { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.pge-pair.active fieldset { border-color: var(--copper); box-shadow: 0 0 0 2px var(--copper) inset; }
.pge-pair-grid { display: grid; grid-template-columns: minmax(6rem, .5fr) 1fr 1fr; gap: .8rem 1rem; align-items: start; }
.pge-pair-src, .pge-pair-dst { display: grid; gap: .5rem; }
.pge-sub { margin: 0; font-weight: 650; font-size: .88rem; color: var(--muted); }
.pge-pair-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .6rem; }
.pge-pair-res { margin: 0; font-size: .88rem; font-family: var(--mono); }
.pge-pair-res:empty { display: none; }
.pge-tag { font-size: .78rem; font-weight: 650; background: var(--sand); color: var(--copper-ink); padding: .1rem .5rem; border-radius: 999px; }
@container pge (max-width: 44rem) { .pge-pair-grid { grid-template-columns: 1fr; } }
.pge-method { border: 0 !important; padding: 0 !important; }

/* Carte */
.pge-mapbox { display: grid; gap: .6rem; }
.pge-mapbox[hidden] { display: none; }
.pge-pickmsg { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.pge-pickmsg[hidden] { display: none; }
.pge-map { position: relative; height: clamp(320px, 62vh, 560px); border-radius: var(--radius); border: 1px solid var(--line); overflow: hidden; background: var(--sand); z-index: 0; }
.pge-map.picking { cursor: crosshair; box-shadow: 0 0 0 3px var(--copper); }
.pge-map:focus-visible { outline: 3px solid var(--copper); outline-offset: 2px; }
.pge-cross { position: absolute; inset: 50% auto auto 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; z-index: 500; pointer-events: none; }
.pge-cross::before, .pge-cross::after { content: ""; position: absolute; background: #0b0d22; box-shadow: 0 0 0 1px #fff; }
.pge-cross::before { inset: 12px 0 auto 0; height: 2px; } .pge-cross::after { inset: 0 auto 0 12px; width: 2px; }
.pge-tool .leaflet-container { font: inherit; font-size: .8rem; }
.pge-tool .leaflet-control-attribution a { color: #0b4a8b; }
.pge-tool .leaflet-control-layers { color: #191b33; }
.pge-tt { background: rgba(255, 255, 255, .92); color: #191b33; border: 0; box-shadow: 0 1px 3px rgba(0, 0, 0, .35); font: 600 11px var(--mono); padding: 1px 5px; }
.pge-tt::before { display: none; }
.pge-lbl { background: none; border: 0; }
.pge-lbl span { display: inline-block; white-space: nowrap; font: 600 11px var(--sans); text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 3px #fff; transform: translate(-2px, -50%); }
.pge-cp { display: grid !important; place-items: center; border-radius: 50%; background: #9c5a2a; color: #fff; border: 2px solid #fff; font: 700 12px/1 var(--mono); box-shadow: 0 1px 4px rgba(0, 0, 0, .5); }
.pge-pop { margin: 0; color: #191b33; }

/* Résultat (carte sombre) */
.pge-out:empty, .pge-cal-out:empty { display: none; }
.pge-cal-out:focus { outline: none; }
.pge-res { background: var(--ink); color: #eeecff; border-radius: 14px; padding: clamp(1.1rem, .8rem + 1.5vw, 1.8rem); display: grid; gap: 1rem; overflow-wrap: anywhere; }
.pge-res > * { margin: 0; }
.pge-res .pge-rt { font-size: 1.15rem; color: #fff; }
.pge-res .zn { font-family: var(--mono); font-size: .8rem; color: var(--copper-l); }
[dir="rtl"] .pge-res .zn { font-family: var(--sans); }
.pge-units { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: .6rem 1.2rem; margin: 0; }
.pge-units dt { font-size: .8rem; color: rgba(236, 234, 255, .75); }
.pge-units dd { margin: 0; font-family: var(--mono); font-size: 1.02rem; }
.pge-res p { font-size: .92rem; }
.pge-res .hint { color: rgba(236, 234, 255, .75); font-size: .82rem; }
.pge-res .pge-h { font-size: 1.05rem; margin: 0; color: #fff; }
.pge-res .pge-warn li { color: #eeecff; }
.pge-x, .pge-help { display: grid; gap: .7rem; border-top: 1px solid var(--line-d); padding-top: 1rem; }
.pge-x > *, .pge-help > * { margin: 0; }
.pge-ge { margin: 0; padding-inline-start: 1.3rem; display: grid; gap: .3rem; font-size: .9rem; }
.pge-tool .pge-res .btn.ghost { color: #eeecff; border: 1px solid rgba(236, 234, 255, .5); }
.pge-res .btn.ghost:hover { border-color: var(--copper-l); background: rgba(255, 255, 255, .06); }
.pge-res .btn:focus-visible, .pge-res .pge-tw:focus-visible { outline-color: var(--copper-l); }
.pge-print-head, .pge-print-foot { display: none; }
.pge-store { display: flex; flex-wrap: wrap; gap: .4rem .8rem; align-items: center; }
.pge-clear-all { font: inherit; font-size: .85rem; background: none; border: 1px solid var(--input-line); color: var(--text); border-radius: 999px; padding: .35rem .9rem; cursor: pointer; }

@media (prefers-reduced-motion: reduce) { .pge-tool * { transition: none !important; animation: none !important; } }
.a11y-rm .pge-tool * { transition: none !important; animation: none !important; }

/* Impression : seul le résultat est imprimé, en noir sur blanc */
@media print {
  body * { visibility: hidden !important; }
  .pge-out, .pge-out * { visibility: visible !important; }
  .pge-out { position: absolute; inset: 0 0 auto 0; }
  .pge-res { background: #fff !important; color: #000 !important; padding: 0; border-radius: 0; }
  .pge-res *, .pge-res .zn, .pge-res .hint, .pge-units dt, .pge-tab thead th, .pge-tab caption, .pge-res .pge-h, .pge-res .pge-rt { color: #000 !important; }
  .pge-tab th, .pge-tab td, .pge-tw, .pge-help, .pge-x { border-color: #999 !important; }
  .pge-tw { overflow: visible; }
  .pge-tab th, .pge-tab td { white-space: normal; }
  .pge-warn { background: none; border-color: #000; }
  .pge-x, .pge-help { display: none !important; }
  .pge-print-head { display: block; border-bottom: 2px solid #000; padding-bottom: .4rem; }
  .pge-print-head p { margin: 0; } .pge-print-t { font-weight: 700; font-size: 1.2rem; }
  .pge-print-foot { display: block; border-top: 1px solid #000; padding-top: .4rem; font-size: .8rem; }
  .pge-units, .pge-tab tr { break-inside: avoid; }
}
