/* --- PleasureMapPrice: Core Map Stylesheet --- */
html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  overflow: hidden;
  position: fixed;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif;
  background: #0f172a;
}

#map { 
  width: 100%; 
  height: 100vh; 
  height: -webkit-fill-available; 
  position: absolute; 
  top: 0;
  left: 0;
  background: #f0f7ff; 
  touch-action: none; 
}

/* --- SVG描画をGPUで加速させ、Canvas以上のキレを実現 --- */
.leaflet-zoom-animated path {
  will-change: transform, stroke-width, fill-opacity !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* 描画のブレを防止 */
svg.leaflet-zoom-animated {
  mix-blend-mode: normal !important;
}

/* --- Canvas最適化 --- */
.leaflet-container canvas {
  display: block !important;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* 編集中のカーソル指定 */
.circle-editing #map {
  cursor: crosshair !important;
}

/* 重なり順制御 */
.leaflet-popup-pane, .leaflet-tooltip-pane { z-index: 65000 !important; }
.leaflet-popup { z-index: 65001 !important; }

/* UI基本デザイン */
.search-box-wrapper {
  position: absolute; 
  top: 10px; 
  left: 10px; 
  z-index: 5000;
  width: 260px; 
  height: 44px; 
  display: flex; 
  align-items: center; 
  background: white; 
  padding: 0 10px; 
  border-radius: 22px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); 
  box-sizing: border-box;
}

.search-main-input { 
  flex: 1; 
  border: none; 
  outline: none; 
  font-size: 14px; 
  padding: 0 8px; 
  font-family: inherit; 
  min-width: 0; 
  background: transparent; 
  height: 100%;
}

.search-icon-btn, 
.search-gps-btn, 
#search-clear-btn { 
  cursor: pointer; 
  color: #5f6368; 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  flex-shrink: 0; 
  width: 34px; 
  height: 34px; 
  border-radius: 50%; 
  transition: background 0.2s; 
  line-height: 0; 
  margin: 0 2px;
}

.search-icon-btn:hover, 
.search-gps-btn:hover, 
#search-clear-btn:hover { background: #f1f3f4; }
#search-clear-btn { color: #999; display: none; } 
.search-box-wrapper svg { display: block; }

.map-moving .leaflet-pane { 
  visibility: visible !important; 
  pointer-events: none; 
}

/* --- ささやかなゴールド明滅 --- */
.custom-pulse {
  z-index: 100000 !important;
}

.pulse-container {
  width: 8px;
  height: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.pulse-ring {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1.5px solid #FFD700;
  box-shadow: 0 0 5px #FFD700;
  box-sizing: border-box;
  transform-origin: center center;
  animation: pulse-gold-subtle 1.2s ease-out 2;
  opacity: 0;
}

@keyframes pulse-gold-subtle {
  0% { transform: scale(0.2); opacity: 1; }
  100% { transform: scale(var(--max-scale, 2.5)); opacity: 0; }
}

.filter-container { 
  position: absolute; 
  top: 60px; 
  left: 10px; 
  z-index: 3100; 
  background: white; 
  width: 260px; 
  max-height: calc(100vh - 100px); 
  border-radius: 12px; 
  box-shadow: 0 6px 20px rgba(0,0,0,0.18); 
  display: none; 
  flex-direction: column; 
}
.filter-container.active { display: flex; }
.filter-content { padding: 15px; overflow-y: auto; overflow-x: visible; position: relative; box-sizing: border-box; }

.search-suggest-box { 
  position: absolute; 
  top: 100%; 
  left: 0; 
  width: 100%; 
  background: white; 
  border: 1px solid #dadce0; 
  z-index: 10000; 
  max-height: 200px; 
  overflow-y: auto; 
  display: none; 
  box-shadow: 0 4px 12px rgba(0,0,0,0.2); 
  border-radius: 0 0 8px 8px; 
  box-sizing: border-box; 
}
.suggest-item { padding: 12px 15px; cursor: pointer; border-bottom: 1px solid #f1f3f4; font-size: 13px; color: #3c4043; line-height: 1.4; box-sizing: border-box; }
.suggest-item:hover { background: #f8f9fa; color: #1a73e8; }

#all-filters-display { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 15px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.tag-card { display: inline-flex; align-items: center; background: #f1f3f4; color: #3c4043; padding: 4px 12px; border-radius: 16px; font-size: 11px; font-weight: 500; border: 1px solid #dadce0; cursor: pointer; white-space: nowrap; margin: 2px; transition: all 0.2s ease; }
.tag-card:hover { background: #d93025; color: white; border-color: #d93025; }

.mini-num-input { width: 100%; padding: 6px; border: 1px solid #ddd; border-radius: 4px; font-size: 11px; outline: none; box-sizing: border-box; }
.km-btn { flex: 1; padding: 8px 0; background: white; border: 1px solid #ddd; border-radius: 6px; font-size: 11px; font-weight: bold; color: #333; cursor: pointer; transition: all 0.2s; min-width: 0; }
.km-btn:active { background: #e8f0fe; transform: scale(0.95); }

.step-btn { width: 30px; height: 30px; background: white; border: 1px solid #ddd; border-radius: 50%; font-size: 16px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #1a73e8; font-weight: bold; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.step-btn:active { background: #f0f0f0; transform: scale(0.9); }

.rich-btn-group { display: flex; background: #f1f3f4; padding: 3px; border-radius: 8px; margin-bottom: 15px; gap: 2px; }
.mode-tab { flex: 1; text-align: center; padding: 8px 4px; font-size: 11px; font-weight: bold; cursor: pointer; border-radius: 6px; color: #5f6368; }
.mode-tab.active { background: white; color: #1a73e8; box-shadow: 0 1px 3px rgba(0,0,0,0.15); }

.rich-action-btn { width: 100%; padding: 12px; border-radius: 8px; font-size: 12px; font-weight: bold; cursor: pointer; border: 1px solid #dadce0; margin-bottom: 8px; display: flex; justify-content: center; align-items: center; gap: 8px; box-sizing: border-box; }
.suzuki-toggle-btn { background: #181b39; color: white; border: none; }
.suzuki-toggle-btn.off { background: #dee2e6; color: #495057; }
#cannibalToggle.active { background: #9c27b0 !important; color: white !important; border-color: #7b1fa2 !important; }
button#areaLabelRichBtn.active { background: #e28743 !important; color: white !important; border-color: #c97538 !important; }

.preset-toggle-btn { width: 100%; padding: 10px; background: #e8f0fe; color: #1a73e8; border-radius: 8px; font-size: 11px; font-weight: bold; cursor: pointer; border: 1px solid #c2e7ff; margin-top: 10px; display: flex; justify-content: center; align-items: center; gap: 6px; box-sizing: border-box; }
.preset-panel { display: none; padding: 12px; background: #f8f9fa; border-radius: 8px; margin-top: 8px; border: 1px solid #eee; box-sizing: border-box; width: 100%; }
.preset-panel.active { display: block; }
.preset-row { display: flex; align-items: center; gap: 5px; margin-bottom: 8px; width: 100%; box-sizing: border-box; }
.delete-btn { cursor: pointer; color: #d93025; padding: 6px; border-radius: 6px; background: #fee8e6; border: none; display: flex; align-items: center; }

.area-label { background: white !important; border: 1px solid #999 !important; border-radius: 4px !important; padding: 2px 8px !important; font-size: 10px; font-weight: bold; color: #333; white-space: nowrap !important; text-align: center; pointer-events: none !important; width: auto !important; height: auto !important; box-shadow: 0 2px 4px rgba(0,0,0,0.2); }
.report-table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 11px; }
.report-table th, .report-table td { text-align: left; padding: 5px 0; border-bottom: 1px solid #eee; }
.report-table td { font-weight: bold; text-align: right; }
.area-link-btn { color: #1a73e8; cursor: pointer; text-decoration: underline; font-weight: bold; }

#stat-counter { position: absolute; bottom: 20px; left: 10px; z-index: 3000; background: rgba(255, 255, 255, 0.9); padding: 4px 12px; border-radius: 15px; font-size: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
#tier-legend, #sales-legend { position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 2500; background: rgba(255, 255, 255, 0.95); padding: 6px 12px; border-radius: 0 0 12px 12px; display: none; align-items: center; gap: 10px; font-size: 10px; border: 1px solid #ddd; border-top: none; font-weight: bold; }
.cannibal-circle { mix-blend-mode: multiply; }

.reset-rich-btn { width: 100%; padding: 10px; margin-bottom: 15px; border-radius: 8px; border: 1px solid #fecaca; background: #fef2f2; color: #dc2626; font-size: 11px; font-weight: bold; cursor: pointer; display: flex; justify-content: center; align-items: center; gap: 6px; transition: all 0.2s ease; box-sizing: border-box; }
.reset-rich-btn:active { background: #fee2e2; transform: translateY(1px); }

.filter-item-row { display: flex; align-items: center; margin-bottom: 8px; border-bottom: 1px solid #f1f3f4; padding-bottom: 4px; position: relative; }
.filter-label-text { width: 70px; font-size: 10px; font-weight: bold; color: #777; flex-shrink: 0; }
.search-input { flex: 1; border: none; padding: 6px 4px; font-size: 12px; outline: none; background: transparent; }
.search-input:focus { background: #f8f9fa; }

details[name="filter-acc"] { border-bottom: 1px solid #eee; margin-bottom: 5px; }
summary { font-size: 11px; font-weight: bold; cursor: pointer; padding: 10px 0; outline: none; color: #1a73e8; list-style: none; display: flex; align-items: center; }
summary::-webkit-details-marker { display: none; }
summary::before { content: '▶'; font-size: 8px; margin-right: 8px; transition: transform 0.2s; }
details[open] summary::before { transform: rotate(90deg); }
#filterFieldsBox { padding: 5px 0 10px 0; }

.ch-btn { font-size: 10px; padding: 8px 0; border: 1px solid #ddd; border-radius: 4px; background: white; cursor: pointer; font-weight: bold; text-align: center; }
.ch-btn.active { background: #1a73e8; color: white; border-color: #1a73e8; }

@keyframes pulseSuzuki {
  0%, 100% { filter: drop-shadow(0 0 0px transparent); stroke-width: 2.5px; }
  50% { filter: drop-shadow(0 0 var(--glow-b, 12px) #FFD700); stroke-width: var(--glow-w, 8px); }
}
@keyframes goldPulseEffect {
  0% { filter: drop-shadow(0 0 2px #FFD700); stroke-width: 1px; stroke: #fff; }
  50% { filter: drop-shadow(0 0 15px #FFD700); stroke-width: 10px; stroke: #FFD700; }
  100% { filter: drop-shadow(0 0 2px #FFD700); stroke-width: 1px; stroke: #fff; }
}

.highlight-pin {
  animation: goldPulseEffect 0.8s ease-in-out infinite !important;
  z-index: 99999 !important;
  pointer-events: none;
}

#zoom-display { position: absolute; top: 10px; right: 10px; z-index: 5000; background: rgba(255,255,255,0.85); padding: 5px 10px; border-radius: 4px; font-size: 11px; font-weight: bold; pointer-events: none; }

.ranking-row { transition: background-color 0.1s ease; }
.ranking-row:hover { background-color: #e6f7ff !important; }

#areaBookmarkList::-webkit-scrollbar { width: 4px; }
#areaBookmarkList::-webkit-scrollbar-thumb { background: #ffd591; border-radius: 4px; }

.long-press-loader { position: absolute; z-index: 10000; width: 40px; height: 40px; border: 3px solid rgba(26, 115, 232, 0.2); border-top: 3px solid #1a73e8; border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%) scale(0.5); opacity: 0; transition: transform 0.2s ease-out; }
.long-press-loader.active { animation: lp-rotate 1.0s linear forwards; opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
@keyframes lp-rotate { 0% { transform: translate(-50%, -50%) scale(0.8) rotate(0deg); } 100% { transform: translate(-50%, -50%) scale(1.2) rotate(360deg); } }

/* 都道府県・追加日カード選択 */
.pref-card { padding: 6px 12px; border: 1px solid #dadce0; border-radius: 16px; cursor: pointer; font-size: 12px; background: #fff; color: #3c4043; transition: all 0.2s ease; user-select: none; }
.pref-card:hover { background: #f1f3f4; }
.pref-card.selected { background: #1a73e8; color: white; border-color: #1a73e8; font-weight: bold; box-shadow: 0 2px 4px rgba(26,115,232,0.3); }
.region-group { margin-bottom: 15px; }
.region-title { font-size: 12px; font-weight: bold; color: #1a73e8; border-bottom: 2px solid #e8f0fe; margin-bottom: 8px; padding-bottom: 4px; cursor: pointer; display: flex; align-items: center; gap: 6px; }

.date-card { padding: 8px 16px; border: 1px solid #dadce0; border-radius: 20px; cursor: pointer; font-size: 14px; background: #fff; color: #3c4043; transition: all 0.2s ease; user-select: none; display: inline-block; margin-bottom: 8px; font-weight: bold; }
.date-card:hover { background: #fff7e6; border-color: #ffd591; }
.date-card.selected { background: #fa8c16; color: white; border-color: #fa8c16; box-shadow: 0 2px 6px rgba(250,140,22,0.4); }

#mobile-debug-box { display: none !important; }

/* Classic UI Fixed (Modern UI elements suppressed) */
#modern-ui-toggle,
.ui-switcher-pill,
#ui-switcher-pill,
#cs-btn-modern,
#cs-btn-classic,
#btn-ui-modern,
#btn-ui-classic,
#modern-bg-orbs {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
