* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    font: 14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: #1f2a24;
}

.toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: #2b3a34;
    color: #fff;
}

.toolbar__title {
    font-size: 15px;
}

.btn {
    padding: 6px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: #3f7a34;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
}

.btn:hover {
    background: #356a2c;
}

.btn:disabled {
    opacity: 0.6;
    cursor: default;
}

.status {
    font-size: 13px;
}

.toolbar__toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    cursor: pointer;
}

#map {
    height: 62vh;
    min-height: 340px;
}

/* Koordinaten-Anzeige (EPSG:25832) */
.coords-box {
    padding: 4px 8px;
    font: 13px/1.4 system-ui, sans-serif;
    color: #1f2a24;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}

/* Ergebnisliste */
.results {
    padding: 14px;
}

.results__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 8px;
}

.results__title {
    margin: 0;
    font-size: 16px;
}

.summary {
    font-size: 13px;
    color: #555;
}

.summary b {
    color: #1f2a24;
}

.table-wrap {
    overflow-x: auto;
}

.rtable {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.rtable th,
.rtable td {
    padding: 6px 8px;
    border-bottom: 1px solid #e3e3e3;
    text-align: left;
    vertical-align: top;
}

.rtable th {
    background: #f4f6f4;
}

.rtable tbody tr:hover {
    background: #f8fbf7;
}

.rtable__empty td {
    color: #888;
    text-align: center;
    padding: 16px;
}

.row--approx {
    background: #fff5e6;
}

.row--approx:hover {
    background: #ffeccd;
}

.row--nomatch {
    background: #fdeaea;
}

.row--nomatch:hover {
    background: #fbdcdc;
}

.rtable tr[data-has-marker="1"] {
    cursor: pointer;
}

.badge {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.badge--exact {
    background: #e3f4e1;
    color: #2e7d32;
}

.badge--approx {
    background: #ffe6c2;
    color: #a35b00;
}

.badge--nomatch {
    background: #f8d2d2;
    color: #b3261e;
}

.hint {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: #a35b00;
}

.row--nomatch .hint {
    color: #b3261e;
}

/* Popup */
.popup b {
    color: #2b3a34;
}

.popup__warn {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed #e0a94b;
    color: #a35b00;
}

/* Dauerhaftes Standort-Label auf der Karte */
.leaflet-tooltip.sperr-label {
    padding: 2px 6px;
    font-size: 11px;
    line-height: 1.2;
    color: #1f2a24;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid #999;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    white-space: nowrap;
}

.leaflet-container.labels-hidden .leaflet-tooltip.sperr-label {
    display: none;
}

/* ── Datenerfassung / Digitalisierung ───────────────────────── */
.btn--active {
    background: #b3261e;
}

.btn--active:hover {
    background: #9c211a;
}

.btn--ghost {
    background: transparent;
    border: 1px solid #cfd8d3;
    color: #1f2a24;
}

.btn--ghost:hover {
    background: #eef2ef;
}

.capture-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 240px;
}

.capture-form__label {
    font-weight: 600;
    font-size: 13px;
}

.capture-form__text {
    width: 100%;
    resize: vertical;
    font: inherit;
    padding: 6px 8px;
    border: 1px solid #cfd8d3;
    border-radius: 6px;
}

.capture-form__coords {
    font-size: 12px;
    color: #555;
}

.capture-form__actions {
    display: flex;
    gap: 8px;
}

.capture-form__msg {
    font-size: 12px;
    min-height: 1em;
}

.popup__coords {
    margin-top: 6px;
    font-size: 12px;
    color: #555;
}

.popup__muted {
    color: #888;
    font-style: italic;
}