/* --- RENKLER & GENEL DEĞERLER --- */
:root {
  --primary-light: #3858E9;
  --primary-dark: #00C6FF;
  --bg-light: #f8fafc;
  --bg-dark: #0f172a;
  --text-light: #222;
  --text-dark: #e2e8f0;
  --card-light: #fff;
  --card-dark: #1e293b;
  --shadow-light: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-dark: 0 4px 12px rgba(0,0,0,0.4);
  --gradient: linear-gradient(135deg, var(--primary-light), var(--primary-dark));

  --footer-height: 44px;
}

*{box-sizing:border-box;}

body{
  font-family:'Segoe UI',sans-serif;
  margin:0;
  background:var(--bg-light);
  color:var(--text-light);
  display:flex;
  flex-direction:column;
  height:100vh;
  transition:.3s;
}

.dark-mode{
  background:var(--bg-dark);
  color:var(--text-dark);
}

/* HEADER – slim */
#header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:var(--gradient);
  padding:8px 14px;
  box-shadow:var(--shadow-light);
}

#header h2{
  color:#fff;
  font-size:18px;
  font-weight:600;
  margin:0;
  cursor:pointer;
}

#themeToggle{
  background:rgba(255,255,255,.15);
  border:none;
  color:#fff;
  font-size:18px;
  border-radius:50%;
  width:32px;
  height:32px;
  cursor:pointer;
}
#themeToggle:hover{background:rgba(255,255,255,.25);}

/* FİLTRELER – sadece arama + büyük ARA butonu (yan yana) */
.filters{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  padding:6px 12px;
  background:var(--card-light);
  box-shadow:var(--shadow-light);
  align-items:center;
}

.dark-mode .filters{
  background:var(--card-dark);
  box-shadow:var(--shadow-dark);
}

.filters input,
.filters select{
  padding:10px 12px;
  border-radius:7px;
  border:1px solid #ccd1d9;
  font-size:14px;
}

#searchBox{
  padding-right:40px;
  width:100%;
}

/* Ara butonunu biraz daha geniş yaptık */
.filters button{
  padding:10px 28px;      /* 24 -> 28 */
  border-radius:7px;
  border:none;
  font-size:15px;
  font-weight:700;
  background:var(--gradient);
  color:#fff;
  cursor:pointer;
  white-space:nowrap;
  min-width:130px;        /* 100 -> 130 */
}

/* Mikrofon butonu (input içinde) */
.searchWrap{position:relative;display:flex;align-items:center;}
#micBtn{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  border:none;
  background:transparent;
  width:26px;
  height:26px;
  cursor:pointer;
  display:none;
  padding:0;
  align-items:center;
  justify-content:center;
}
#micBtn svg{width:22px;height:22px;display:block;}
#micBtn.listen svg path{fill:#00C6FF;}
#searchBox.listen{
  outline:none;
  border-color:#0ea5e9;
  box-shadow:0 0 0 3px rgba(14,165,233,.25);
}

/* HARİTA + LİSTE */
#map{
  flex:1 1 auto;
  height:auto;
  min-height:220px;
  transition:.25s ease;
  background:var(--bg-light);
}
.dark-mode #map{
  background:var(--bg-dark);
}
#results{
  display:none;
  flex:1 1 auto;
  background:var(--card-light);
  box-shadow:var(--shadow-light);
  overflow-y:auto;
  padding:10px;
  padding-bottom:calc(var(--footer-height) + 12px);
  transition:.25s ease;
}
#results.locked{
  overflow-y:hidden; /* Harita kartı açıkken liste sabit */
}
.dark-mode #results{background:var(--card-dark);}

/* SONUÇ KARTI */
.result{
  position:relative;
  background:rgba(56,88,233,0.07);
  margin-bottom:10px;
  padding:14px 10px 10px 10px;
  border-radius:10px;
  transition:.2s;
  border:1px solid rgba(56,88,233,0.18);
}
.dark-mode .result{
  background:rgba(15,23,42,0.88);
  border-color:rgba(148,163,184,0.75);
}
.result:hover{
  transform:scale(1.01);
  background:rgba(56,88,233,0.1);
}
.result strong{
  font-size:15px;
  display:block;
  margin-bottom:4px;
  padding-right:130px;
  line-height:1.25;
}

.result .num{
  position:absolute;
  top:6px;
  right:10px;
  background:var(--primary-light);
  color:#fff;
  font-weight:bold;
  font-size:13px;
  border-radius:50%;
  width:24px;
  height:24px;
  text-align:center;
  line-height:24px;
  box-shadow:0 2px 6px rgba(0,0,0,0.2);
}

/* Liste arka planını rating'e göre soft yap */
.result.res-r1{
  background:rgba(248,113,113,.08);
  border-color:rgba(248,113,113,.35);
}
.dark-mode .result.res-r1{
  background:rgba(127,29,29,.7);
  border-color:rgba(254,202,202,.7);
}
.result.res-r2{
  background:rgba(196,181,253,.10);
  border-color:rgba(196,181,253,.4);
}
.dark-mode .result.res-r2{
  background:rgba(88,28,135,.7);
  border-color:rgba(233,213,255,.7);
}
.result.res-r3{
  background:rgba(250,204,21,.10);
  border-color:rgba(250,204,21,.45);
}
.dark-mode .result.res-r3{
  background:rgba(113,63,18,.7);
  border-color:rgba(254,243,199,.7);
}
.result.res-r4{
  background:rgba(59,130,246,.10);
  border-color:rgba(59,130,246,.45);
}
.dark-mode .result.res-r4{
  background:rgba(30,64,175,.7);
  border-color:rgba(191,219,254,.7);
}
.result.res-r5{
  background:rgba(34,197,94,.10);
  border-color:rgba(34,197,94,.45);
}
.dark-mode .result.res-r5{
  background:rgba(22,101,52,.7);
  border-color:rgba(187,247,208,.7);
}

/* YILDIZ / PUAN ROZETİ */
.ratingTag{
  position:absolute;
  top:8px;
  right:42px;
  display:flex;
  align-items:center;
  gap:4px;
  font-size:11px;
  padding:2px 6px;
  border-radius:999px;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
  cursor:pointer;
}
.ratingTag .starIcon{font-size:13px;}
.ratingTag .ratingCount{opacity:.85;}

.ratingTag.r1{background:rgba(248,113,113,.18);color:#b91c1c;}
.ratingTag.r1 .starIcon{color:#ef4444;}
.dark-mode .ratingTag.r1{background:rgba(248,113,113,.35);color:#fee2e2;}

.ratingTag.r2{background:rgba(196,181,253,.22);color:#5b21b6;}
.ratingTag.r2 .starIcon{color:#7c3aed;}
.dark-mode .ratingTag.r2{background:rgba(196,181,253,.35);color:#ede9fe;}

.ratingTag.r3{background:rgba(250,204,21,.22);color:#854d0e;}
.ratingTag.r3 .starIcon{color:#eab308;}
.dark-mode .ratingTag.r3{background:rgba(250,204,21,.35);color:#fef9c3;}

.ratingTag.r4{background:rgba(59,130,246,.24);color:#1d4ed8;}
.ratingTag.r4 .starIcon{color:#3b82f6;}
.dark-mode .ratingTag.r4{background:rgba(59,130,246,.35);color:#bfdbfe;}

.ratingTag.r5{background:rgba(34,197,94,.22);color:#166534;}
.ratingTag.r5 .starIcon{color:#22c55e;}
.dark-mode .ratingTag.r5{background:rgba(34,197,94,.35);color:#bbf7d0;}

/* Telefon satırı */
.phoneText{font-size:13px;color:#333;margin-top:6px;}
.dark-mode .phoneText{color:#ddd;}

/* MESAFE + DURUM SATIRI */
.metaLine{
  margin-top:4px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:6px;
}

.distanceLine{
  font-size:12px;
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  flex:1 1 auto;
}
.distanceLine span{
  white-space:nowrap;
}

.statusBox{
  min-width:120px;
  padding:4px 6px;
  border-radius:8px;
  border:1px solid rgba(148,163,184,.7);
  background:rgba(255,255,255,.7);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.dark-mode .statusBox{
  background:rgba(15,23,42,.92);
  border-color:rgba(148,163,184,.9);
}

.statusMain{
  font-size:12px;
  font-weight:700;
  text-align:center;
}
.statusCountdown{
  font-size:11px;
  margin-top:2px;
  text-align:center;
  opacity:.9;
}
.status-open{color:#16a34a;}
.status-closed{color:#dc2626;}
.status-unknown{color:#6b7280;}

/* BUTONLAR – eşit genişlik, yazı küçük + kalın */
.actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
  justify-content:space-between;
}
.actions a{
  background:var(--gradient);
  color:#fff;
  text-decoration:none;
  padding:6px 8px;
  border-radius:6px;
  font-size:12px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:1 1 0;
  min-width:0;
}
.actions a span{display:inline-block;}
.actions a:hover{opacity:.9;}
.callBtn{display:none;}

.actions .bizBtn{background:#16a34a;}
.bizIcon{
  width:16px;
  height:16px;
  margin-right:6px;
  flex-shrink:0;
}
.bizIcon .shop-body{fill:#e5e7eb;}
.bizIcon .shop-door{fill:#0f172a;}
.actions a.callBtn{background:#16a34a;}

/* FOOTER */
#footer{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  height:var(--footer-height);
  background:var(--gradient);
  padding:4px 10px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  z-index:8000;
}
#footer button{
  padding:6px 10px;
  border-radius:9px;
  border:none;
  font-size:13px;
  font-weight:700;
  color:#3858E9;
  background:#fff;
  cursor:pointer;
  transition:.18s;
}
#footer button:hover{background:#3858E9;color:#fff;}

/* KONUM İZNİ UYARISI (mobil) */
#geoPrompt{
  position:fixed;
  left:0;
  right:0;
  bottom:calc(var(--footer-height) + 8px);
  z-index:8500;
  display:none;
  justify-content:center;
  padding:0 10px;
}
#geoPrompt.show{display:flex;}
.geoPromptInner{
  max-width:460px;
  width:100%;
  border-radius:12px;
  padding:10px 12px;
  background:rgba(15,23,42,.95);
  color:#e5e7eb;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  font-size:13px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.geoPromptTitle{font-weight:600;font-size:14px;}
.geoPromptButtons{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.geoPromptButtons button{
  flex:0 0 auto;
  border:none;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
}
#geoEnableBtn{background:#22c55e;color:#022c22;}
#geoLaterBtn{background:#e5e7eb;color:#111827;}
.dark-mode .geoPromptInner{background:rgba(15,23,42,.97);color:#e5e7eb;}
.dark-mode #geoLaterBtn{background:#0f172a;color:#e5e7eb;}

/* USER ICON */
.userOverlayRoot{
  position:absolute;
  transform:translate(-50%,-100%);
}
.userGlow{
  position:absolute;
  left:50%;
  top:100%;
  width:40px;
  height:40px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  animation:glowPulse 2.2s ease-in-out infinite;
  box-shadow:0 0 18px 8px rgba(56,88,233,0.55);
}
.userIcon{
  width:54px;
  height:54px;
  background:url("/user-icon.png") center/cover no-repeat;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.45));
}
@keyframes glowPulse{
 0%{opacity:.95;box-shadow:0 0 18px 8px rgba(56,88,233,.55);}
 60%{opacity:.35;box-shadow:0 0 26px 14px rgba(56,88,233,.12);}
100%{opacity:.95;box-shadow:0 0 18px 8px rgba(56,88,233,.55);}
}

/* InfoWindow – harita kartı */
.infobox{
  font-family:'Segoe UI',sans-serif;
  font-size:13px;
  max-width:300px;
  padding:10px 12px 12px 12px;
  border-radius:12px;
  box-shadow:0 4px 16px rgba(0,0,0,.4);
  margin:4px !important;
  position:relative;
  border:1px solid rgba(15,23,42,.25);
  border-bottom-width:3px; /* alt border belirgin olsun */
}
.infobox b{
  color:#ffffff;
  display:block;
  margin-bottom:4px;
  font-size:14px;
  font-weight:700;
  text-shadow:0 1px 2px rgba(15,23,42,.6);
}
.dark-mode .infobox b{
  color:#ffffff;
  text-shadow:0 1px 3px rgba(15,23,42,.9);
}

/* rating'e göre kart arka plan */
.lightBox.info-r1{background:rgba(248,113,113,.96);border:1px solid rgba(185,28,28,.95);color:#111827;}
.darkBox.info-r1{background:rgba(127,29,29,.96);border:1px solid rgba(254,202,202,.9);}
.lightBox.info-r2{background:rgba(196,181,253,.96);border:1px solid rgba(91,33,182,.9);color:#111827;}
.darkBox.info-r2{background:rgba(88,28,135,.96);border:1px solid rgba(233,213,255,.9);}
.lightBox.info-r3{background:rgba(250,204,21,.96);border:1px solid rgba(113,63,18,.9);color:#111827;}
.darkBox.info-r3{background:rgba(113,63,18,.96);border:1px solid rgba(254,243,199,.9);}
.lightBox.info-r4{background:rgba(59,130,246,.96);border:1px solid rgba(30,64,175,.9);color:#f9fafb;}
.darkBox.info-r4{background:rgba(30,64,175,.96);border:1px solid rgba(191,219,254,.9);}
.lightBox.info-r5{background:rgba(34,197,94,.96);border:1px solid rgba(22,101,52,.9);color:#f9fafb;}
.darkBox.info-r5{background:rgba(22,101,52,.96);border:1px solid rgba(187,247,208,.9);}
.lightBox{background:#e5edf9;color:#1f2937;border:1px solid #d1d5db;}
.darkBox{background:#020617;color:#e2e8f0;border:1px solid #334155;}

.addrLine{margin-top:4px;margin-bottom:3px;}

/* X butonu + numara */
.infoClose{
  position:absolute;
  top:6px;
  right:8px;
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.6);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:bold;
  background:rgba(15,23,42,.10);
  color:#020617;
}
.infoClose:hover{background:rgba(15,23,42,.18);}
.dark-mode .infoClose{
  background:rgba(15,23,42,.9);
  color:#e5e7eb;
  border-color:rgba(148,163,184,.9);
}
.dark-mode .infoClose:hover{background:rgba(15,23,42,1);}

.infoNumBadge{
  position:absolute;
  top:6px;
  right:34px;
  width:18px;
  height:18px;
  border-radius:999px;
  background:#2563eb;
  color:#fff;
  font-size:10px;
  font-weight:700;
  text-align:center;
  line-height:18px;
  box-shadow:0 2px 6px rgba(15,23,42,.45);
}
.dark-mode .infoNumBadge{background:#22c55e;}

/* Google InfoWindow container */
.gm-style .gm-style-iw-c{
  padding:0 !important;
  border-radius:14px !important;
  box-shadow:none !important;
  background:transparent !important;
}
.gm-style .gm-style-iw-d{
  overflow:visible !important;
  background:transparent !important;
}
.gm-style .gm-style-iw-c > div{margin:0 !important;}
.gm-style .gm-ui-hover-effect{display:none !important;}

/* Foto satırı – 3 foto tam otursun */
.photoRow{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:4px;
  margin-top:6px;
}
.placePhoto{
  width:100%;
  aspect-ratio:1/1;
  border-radius:6px;
  object-fit:cover;
  cursor:pointer;
}

/* FOTO MODAL + SLIDER */
.photoModal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.75);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.photoModal.show{display:flex;}
.photoModalInner{
  position:relative;
  max-width:90vw;
  max-height:90vh;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
  background:#000;
  touch-action:none; /* pinch & pan JS ile */
}
.photoModalInner img{
  display:block;
  max-width:100%;
  max-height:90vh;
  transform-origin:center center;
  position:relative;
  z-index:1;
}

/* Slider navigasyon */
.photoNav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:32px;
  height:48px;
  border-radius:6px;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  font-weight:bold;
  background:rgba(15,23,42,.7);
  color:#f9fafb;
}
.photoNav:hover{background:rgba(15,23,42,.95);}
.photoNav.prev{left:6px;}
.photoNav.next{right:6px;}

.photoModalClose{
  position:absolute;
  top:8px;
  right:8px;
  width:32px;
  height:32px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-size:18px;
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(248,250,252,.9);
  color:#0f172a;
  z-index:5;
}
.dark-mode .photoModalClose{
  background:rgba(15,23,42,.9);
  color:#e5e7eb;
}
.photoModalClose:hover{transform:scale(1.05);}

/* YORUM MODALI */
.reviewModal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.75);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9998;
}
.reviewModal.show{display:flex;}
.reviewModalInner{
  position:relative;
  max-width:420px;
  width:100%;
  max-height:80vh;
  border-radius:12px;
  padding:12px 14px 14px 14px;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
  background:#020617;
  color:#e5e7eb;
  overflow-y:auto;
  border:1px solid rgba(148,163,184,.55);
}

/* Light mode için daha yumuşak arka plan */
body:not(.dark-mode) .reviewModalInner{
  background:#f9fafb;
  color:#0f172a;
  border-color:rgba(148,163,184,.6);
}
body:not(.dark-mode) .reviewItem{
  background:#e5edf9;
}
body:not(.dark-mode) .reviewSummary{
  color:#4b5563;
}

/* rating'e göre soft arka plan – göz yormayan tonlar */
.reviewModalInner.rm-r1{
  border-color:rgba(248,113,113,.6);
  box-shadow:0 16px 40px rgba(248,113,113,.25);
}
.reviewModalInner.rm-r2{
  border-color:rgba(196,181,253,.7);
  box-shadow:0 16px 40px rgba(196,181,253,.25);
}
.reviewModalInner.rm-r3{
  border-color:rgba(250,204,21,.7);
  box-shadow:0 16px 40px rgba(250,204,21,.25);
}
.reviewModalInner.rm-r4{
  border-color:rgba(59,130,246,.7);
  box-shadow:0 16px 40px rgba(59,130,246,.25);
}
.reviewModalInner.rm-r5{
  border-color:rgba(34,197,94,.7);
  box-shadow:0 16px 40px rgba(34,197,94,.25);
}

.reviewModalClose{
  position:absolute;
  top:8px;
  right:10px;
  width:28px;
  height:28px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-size:16px;
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.24);
  color:inherit;
}
.reviewModalClose:hover{background:rgba(15,23,42,.35);}

.reviewTitle{
  font-size:15px;
  font-weight:700;
  margin-bottom:6px;
  padding-right:36px;
  color:inherit;
}

.reviewSummary{
  font-size:13px;
  margin-bottom:8px;
  opacity:.9;
  color:#e5e7eb;
}

.reviewList{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.reviewItem{
  padding:8px 10px;
  border-radius:8px;
  background:rgba(15,23,42,.85);
}
.reviewModalInner.rm-r1 .reviewItem{background:rgba(248,113,113,.10);}
.reviewModalInner.rm-r2 .reviewItem{background:rgba(196,181,253,.10);}
.reviewModalInner.rm-r3 .reviewItem{background:rgba(250,204,21,.10);}
.reviewModalInner.rm-r4 .reviewItem{background:rgba(59,130,246,.10);}
.reviewModalInner.rm-r5 .reviewItem{background:rgba(34,197,94,.10);}

.reviewHead{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-bottom:4px;
  font-size:12px;
}
.reviewAuthor{
  font-weight:600;
}
.reviewRating{
  font-weight:700;
}
.reviewTime{
  opacity:.75;
}
.reviewText{
  font-size:13px;
  line-height:1.4;
}
.reviewEmpty{
  font-size:13px;
  opacity:.9;
}

/* Google'da yorum yaz alanı – sağda buton */
.reviewWrite{
  margin-top:10px;
  font-size:12px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
}
.reviewWriteText{
  opacity:.8;
}
.reviewWriteBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 12px;
  border-radius:999px;
  background:var(--gradient);
  color:#fff;
  font-weight:600;
  font-size:12px;
  text-decoration:none;
  box-shadow:0 6px 18px rgba(15,23,42,.35);
}
.reviewWriteBtn span:first-child{
  margin-right:4px;
}
.reviewWriteBtn:hover{
  opacity:.95;
}

/* Mobilde navigasyon butonları biraz küçülsün */
@media (max-width:768px){
  .photoNav{
    width:28px;
    height:40px;
    font-size:20px;
  }
}

/* MOBİL */
@media (max-width:768px){
  :root{
    --footer-height:36px;
  }

  .filters{
    grid-template-columns:1fr auto;
    grid-template-areas:"search btn";
  }
  .searchWrap{grid-area:search;width:100%;}
  #searchBtn{grid-area:btn;width:100%;}

  #searchBox{
    width:100%;
    font-size:15px;
    padding:10px 40px 10px 12px;
  }
  #map{min-height:180px;}

  #footer{padding:3px 8px;}
  #footer button{padding:4px 8px;font-size:12px;}

  #results{
    padding-bottom:calc(var(--footer-height) + 12px);
    max-height:330px;
  }
}