/* Base layout */
.tm-wrap, .tm-wrap * { box-sizing: border-box; }
.tm-wrap { max-width:1200px; margin:0 auto; padding:0 16px; overflow-x:hidden; }
.tm-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:10px 0 8px; }

/* Hide any external search bar—map uses only the in-map magnifying glass */
.tm-searchbar, #tm-search, .tm-toolbar .tm-search-input { display:none !important; }

#tm-map { position:relative; width:100%; height:62vh; min-height:360px; border-radius:10px; overflow:hidden; }

/* Safe-area custom properties */
:root{
  --tm-safe-top: env(safe-area-inset-top, 0px);
  --tm-safe-right: env(safe-area-inset-right, 0px);
  --tm-safe-bottom: env(safe-area-inset-bottom, 0px);
  --tm-safe-left: env(safe-area-inset-left, 0px);
}

/* Draw “Finish shape” — base style (hidden by default) */
.tm-finish-draw{
  position:absolute;
  top:8px; left:50%; transform:translateX(-50%);
  z-index:10000; display:none;
  background:#fff; color:#111; border:1px solid #d0d0d0;
  padding:8px 12px; border-radius:8px; font-size:14px; line-height:1;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  cursor:pointer; user-select:none;
}
.tm-finish-draw.show{ display:inline-block; }
.tm-finish-draw:active{ transform:translateX(-50%) translateY(1px); }

/* Buttons */
.tm-btn { background:#eee; border:1px solid #ddd; padding:6px 10px; border-radius:6px; cursor:pointer; }
.tm-btn:disabled{ opacity:.5; cursor:default; }

.tm-summary{ display:flex; align-items:center; justify-content:space-between; margin:8px 2px; }
.tm-pager{ display:flex; align-items:center; gap:8px; }

/* In-map geocoder (magnifying glass only) */
.leaflet-control-geocoder {
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
  border-radius: 10px;
  overflow: hidden;
  max-width: min(420px, calc(100% - 12px));
}
.leaflet-control-geocoder .leaflet-control-geocoder-icon {
  width: 38px; height: 38px; background-size: 20px 20px;
}
.leaflet-control-geocoder-expanded { width: min(420px, calc(100% - 12px)); }
.leaflet-control-geocoder-form input { height: 38px; font-size: 16px; padding: 0 10px; }
.leaflet-control-geocoder-alternatives { max-width: 100%; overflow: auto; }

/* Table (desktop) */
.tm-table-wrap{ width:100%; overflow-x:hidden; }
.tm-table{ width:100%; border-collapse:collapse; table-layout:fixed; }
.tm-table th, .tm-table td{ padding:10px 12px; border-top:1px solid rgba(0,0,0,.08); vertical-align:top; text-align:left; }
.tm-table th{ font-weight:700; }
@media (min-width:821px){
  .tm-table th:nth-child(1), .tm-table td:nth-child(1){ width:28%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tm-table th:nth-child(2), .tm-table td:nth-child(2){ width:42%; }
  .tm-table th:nth-child(3), .tm-table td:nth-child(3){ width:14%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tm-table th:nth-child(4), .tm-table td:nth-child(4){ width:16%; }
  .tm-table td:nth-child(4) a{ display:inline-block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
}

/* Mobile cards & control placement */
@media (max-width:820px){
  .tm-wrap{ padding:0 8px; }
  #tm-map{ height:58vh; }

  /* Zoom bottom-left to avoid geocoder overlap and safe-area cutoffs */
  .leaflet-bottom.leaflet-left .leaflet-control-zoom {
    margin: 8px;
    margin-bottom: calc(8px + var(--tm-safe-bottom));
    margin-left: calc(8px + var(--tm-safe-left));
  }

  /* Geocoder top-right; respect safe-area */
  .leaflet-top.leaflet-right .leaflet-control-geocoder{
    right:calc(6px + var(--tm-safe-right)); left:auto; width:auto; max-width:min(420px, calc(100% - 12px));
  }
  .leaflet-control-geocoder-expanded{ width:min(420px, calc(100% - 12px)) !important; }

  /* Card list */
  .tm-table thead{ display:none; }
  .tm-table, .tm-table tbody, .tm-table tr, .tm-table td{ display:block; width:100%; }
  .tm-table tr{ margin:12px 0; padding:12px 10px; border:1px solid rgba(0,0,0,.08); border-radius:12px; }
  .tm-table td{ display:flex; gap:10px; align-items:flex-start; padding:8px 6px; border:none; }
  .tm-table td::before{ content: attr(data-label) ": "; flex:0 0 auto; font-weight:700; opacity:.85; }
  .tm-table td.tm-name-value{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .tm-table td.tm-address-value{ display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
  .tm-table td.tm-country-value,
  .tm-table td.tm-website-value{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tm-table td.tm-website-value a{ display:inline-block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:break-all; }
}

/* Bubble/cluster cosmetics */
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large{ background:transparent; }
.marker-cluster div{ background:#f2f2f2; border:2px solid #ddd; color:#222; font-weight:700; border-radius:999px; box-shadow:0 1px 3px rgba(0,0,0,.25); }
.tm-bubble{ filter: drop-shadow(0 1px 2px rgba(0,0,0,.25)); }
.tm-popup{ line-height:1.3; font-size:14px; }

/* Polygon loading message */
.tm-shape-loading{
  background: rgba(0,0,0,.85);
  color:#fff;
  padding:6px 10px;
  border-radius:8px;
  font-size:13px;
  box-shadow:0 2px 8px rgba(0,0,0,.35);
}

/* Mini fullscreen control (bottom-right) */
.leaflet-bottom.leaflet-right .tm-fs-wrap {
  margin: 8px;
  margin-right: calc(8px + var(--tm-safe-right));
  margin-bottom: calc(8px + var(--tm-safe-bottom));
}
.tm-fs-btn{
  width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid #ddd; border-radius:6px;
  box-shadow:0 2px 8px rgba(0,0,0,.12); cursor:pointer; text-decoration:none;
}
.tm-fs-btn svg{ width:18px; height:18px; display:block; }

/* Red "searched address" pin (divIcon) */
.tm-search-pin{ display:flex; align-items:center; justify-content:center; }
.tm-search-pin .dot{
  width:18px; height:18px; border-radius:999px; background:#e22; border:2px solid #fff;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
}
