html, body, #map { height: 100%; margin: 0; }
.leaflet-container { z-index: 0; }
/* ===== Boutons flottants ===== */
#toggleParcelsBtn,
#toggleSearchBtn {
position:absolute; bottom:15px;
background:#0078ff; color:#fff; border:none; border-radius:50%;
width:54px; height:54px; font-size:22px; text-align:center; line-height:54px;
cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.3);
z-index:3000; pointer-events:auto;
-webkit-tap-highlight-color: transparent;
}
#toggleParcelsBtn { right:15px; background:#0078ff; }
#toggleSearchBtn { right:80px; background:#28a745; }
/* ===== Panneaux ===== */
#savedParcelsPanel, #searchPanel {
position:absolute; bottom:80px;
background:rgba(255,255,255,.97); border:1px solid #ccc; border-radius:12px;
padding:10px; font-size:13px; display:none; z-index:-3000; pointer-events:auto;
backdrop-filter: blur(2px);
}
#savedParcelsPanel { right:15px; width:820px; max-height:75vh; overflow:auto; }
#searchPanel { right:80px; width:300px; max-height:260px; overflow:auto; }
/* ===== Tableau ===== */
.table-wrap { overflow-x:auto; }
table.parcels { width:100%; border-collapse:collapse; font-size:13px; }
table.parcels th, table.parcels td { border:1px solid #ddd; padding:6px 8px; vertical-align:top; white-space:nowrap; }
table.parcels th { background:#f5f5f7; text-align:left; user-select:none; }
table.parcels tbody tr:hover { background:#f9fbff; }
.actions-bar { margin:8px 0 4px; display:flex; gap:8px; }
.actions-bar button { padding:8px 12px; font-size:14px; border-radius:10px; }
.muted { color:#666; }
.sortable { cursor:pointer; }
.sort-ind { font-size:11px; color:#888; }
/* Liens in-table */
.linklike { color:#0d6efd; text-decoration:none; cursor:pointer; }
.linklike:hover { text-decoration:underline; }
/* ===== Modal ===== */
#editModalBackdrop{ position:fixed; inset:0; background:rgba(0,0,0,.4); display:none; z-index:4000; }
#editModal{
position:fixed; left:50%; top:50%; transform:translate(-50%,-50%);
width:340px; max-width:95vw; background:#fff; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.25);
display:none; z-index:4001; padding:14px;
font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}
#editModal h4{ margin:0 0 8px 0; font-size:16px; }
#editModal label{ display:block; font-size:12px; margin:8px 0 4px; color:#333; }
#editModal input{ width:100%; box-sizing:border-box; padding:10px; border:1px solid #ccc; border-radius:10px; font-size:15px; }
#editModal .actions{ margin-top:12px; text-align:right; display:flex; gap:8px; justify-content:flex-end; }
#editModal .actions button{ padding:10px 14px; border:none; border-radius:10px; font-size:15px; cursor:pointer; }
#editSaveBtn{ background:#0d6efd; color:#fff; } #editCancelBtn{ background:#e9ecef; }
/* ===== Responsive ===== */
@media (orientation: landscape) and (max-width: 900px) {
#savedParcelsPanel { left: 4vw; right: 4vw; width: auto; max-height: 70vh; }
}
@media (orientation: portrait) and (max-width: 700px) {
#savedParcelsPanel { left: 10px; right: 10px; width: auto; max-height: 70vh; }
#searchPanel { left: 10px; right: 10px; width: auto; max-height: 60vh; }
}
/* NEW: backdrops pour panneaux */
.panel-backdrop{
position:fixed; inset:0; background:rgba(0,0,0,.2); display:none; z-index:2999;
}
/*NEW Bouton de fermeture des panneaux */
.panel-close{
position:absolute; top:6px; right:8px;
background:transparent; border:none;
font-size:18px; line-height:1; cursor:pointer; color:#666;
}
.panel-close:hover{ color:#000; }
.panel-close:focus{ outline:2px solid #99c; outline-offset:2px; border-radius:6px; }
/* === Global search (from v12) === */
.global-search {
position: absolute; top: 14px; left: 50%; transform: translateX(-50%);
max-width: 90vw;
z-index: 3500; display: flex; gap: 8px; align-items: center;
background: rgba(255,255,255,98); border: 1px solid #ddd; border-radius: 999px;
box-shadow: 0 4px 16px rgba(0,0,0,12); padding: 8px 12px;
backdrop-filter: blur(4px);
}
.global-search input {
width: 320px; max-width: 65vw; border: none; outline: none; font-size: 15px; background: transparent;
flex: 1 1 auto;
text-align: left;
}
.global-search input:placeholder-shown {
text-align: center;
}
.global-search .btn {
border: none; background: #0d6efd; color: #fff; border-radius: 999px; padding: 8px 12px; cursor: pointer;
}
.global-search .clear {
border: none; background: transparent; color: #666; font-size: 18px; cursor: pointer; padding: 2px 6px;
}
/* Liste de suggestions */
.search-suggest {
position: absolute; top: 56px; left: 50%; transform: translateX(-50%);
z-index: 3501; width: 420px; max-width: 80vw; background: #fff; border: 1px solid #ddd; border-radius: 12px;
box-shadow: 0 10px 24px rgba(0,0,0,15); overflow: hidden; display: none;
}
.search-suggest .item {
padding: 10px 12px; cursor: pointer; font-size: 14px; display: flex; gap: 8px; align-items: flex-start;
}
.search-suggest .item:hover { background: #f6f8ff; }
.search-suggest .kind { font-weight: 600; font-size: 12px; color: #666; width: 68px; flex: 0 0 auto; }
.search-suggest .label { flex: 1 1 auto; }
@media (max-width: 600px) {
.global-search input { width: 56vw; }
.search-suggest { width: 90vw; }
}
/* Hide/ignore the 'kind' column if it still exists anywhere */
.search-suggest .kind { display: none !important; }
/* Make items a simple single-line block with good touch target */
.search-suggest .item {
display: block;
padding: 12px 14px;
font-size: 14px;
}
/* Hide/ignore the 'kind' column if it still exists anywhere */
.search-suggest .kind { display: none !important; }
/* Make items a simple single-line block with good touch target */
.search-suggest .item {
display: block;
padding: 12px 14px;
font-size: 14px;
}
/* Label spans full width */
.search-suggest .label {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Mobile: keep the search bar centered */
@media (max-width: 700px) {
.global-search {
left: 50% !important;
transform: translateX(-50%) !important;
right: auto !important;
max-width: 94vw; /* keep within screen edges */
}
.search-suggest {
left: 50% !important;
transform: translateX(-50%) !important;
width: 90vw; /* dropdown width on mobile */
max-width: 90vw;
}
}
/* === COMMUNE POPUP FIX v2: stronger overrides & cache-busting friendly === */
html body #searchPanel {
width: 520px !important;
max-height: 82vh !important;
overflow-y: auto !important;
left: auto !important;
right: 80px !important;
z-index: 3600 !important;
box-sizing: border-box;
}
@media (max-width: 640px) {
html body #searchPanel {
width: 94vw !important;
left: 50% !important;
right: auto !important;
transform: translateX(-50%) !important;
max-height: 84vh !important;
}
}
/* Ensure the row wrappers in the popup never clip the suggest list */
html body #searchPanel > div,
html body #searchPanel [style*="display:flex"],
html body #searchPanel [style*="display: flex"] {
overflow: visible !important;
}
/* Suggestion box only for the Commune field in the popup */
html body #searchPanel #communeNameSuggest {
position: static !important;
top: auto !important;
left: auto !important;
transform: none !important;
width: 100% !important;
max-width: 100% !important;
display: none;
background: #fff;
border: 1px solid #ccc;
border-top: none;
max-height: 340px !important;
overflow-y: auto !important;
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
border-radius: 0 0 10px 10px;
z-index: 3602 !important;
margin-top: -6px;
}
html body #searchPanel #communeNameSuggest .item { padding: 8px 10px; cursor: pointer; font-size: 14px; }
html body #searchPanel #communeNameSuggest .item:hover { background: #f5f7ff; }
/* Keep global search suggest on top (unrelated but prevent overlaps) */
html body .global-search { z-index: 3700 !important; }
html body .search-suggest { z-index: 3700 !important; }