:root{
  --bg:#f7f7f3;
  --card:#fff;
  --ink:#17211e;
  --muted:#7a827f;
  --brand:#176c54;
  --line:#e7e8e3;
  --soft:#edf5f1;
  --shadow:0 8px 28px rgba(22,55,45,.055);
}

html,body{
  margin:0;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden;
  background:var(--bg);
}
html{direction:rtl}
body{
  color:var(--ink);
  font-family:Tahoma,Arial,sans-serif;
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
}
*,*::before,*::after{box-sizing:border-box}
img,video,svg{max-width:100%}
button,input,select{font:inherit}

.discovery-shell{
  width:100%;
  max-width:820px;
  min-width:0;
  margin:0 auto;
  padding:0 16px calc(106px + env(safe-area-inset-bottom));
}
.discovery-shell>*{min-width:0;max-width:100%}

.discovery-head{
  position:sticky;
  top:0;
  z-index:8;
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 0 12px;
  border-bottom:1px solid var(--line);
  background:rgba(247,247,243,.96);
  backdrop-filter:blur(12px);
}
.discovery-head .back{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  text-decoration:none;
  box-shadow:0 4px 14px rgba(0,0,0,.025);
}
.discovery-head>div{min-width:0;flex:1 1 auto}
.discovery-head b{display:block;font-size:20px;line-height:1.5}
.discovery-head small{display:block;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.8;white-space:normal;overflow-wrap:anywhere}

.search-panel{
  width:100%;
  min-width:0;
  margin:14px 0 12px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--card);
  box-shadow:var(--shadow);
}
.search-box{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 10px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  overflow:hidden;
}
.search-box>span,.search-box>button{flex:0 0 auto}
.search-box input{
  flex:1 1 0;
  width:0;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  padding:12px 4px;
  color:var(--ink);
  font-size:16px;
  direction:rtl;
  text-align:right;
}
.search-box button{border:0;background:transparent;color:var(--muted);font-size:24px;line-height:1;cursor:pointer}

.suggestions{
  width:100%;
  min-width:0;
  margin-top:8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.suggestions a{
  min-width:0;
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:11px 12px;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  text-decoration:none;
}
.suggestions a:last-child{border-bottom:0}
.suggestions span,.suggestions small{min-width:0;overflow-wrap:anywhere}
.suggestions small{color:var(--muted)}

.vertical-tabs{
  width:100%;
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0;
  padding:12px 0 4px;
  overflow:visible;
}
.vertical-tabs button{
  flex:0 0 auto;
  max-width:100%;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--ink);
  padding:8px 13px;
  white-space:nowrap;
  cursor:pointer;
}
.vertical-tabs button.active{background:var(--brand);border-color:var(--brand);color:#fff}

.filters{
  width:100%;
  min-width:0;
  margin:10px 0 12px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfcfa;
  overflow:hidden;
}
.filters summary{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  list-style:none;
  cursor:pointer;
  color:var(--brand);
  font-weight:700;
}
.filters summary::-webkit-details-marker{display:none}
.filters summary::before{content:'⌄';flex:0 0 auto;font-size:18px;line-height:1;transform:rotate(0deg)}
.filters[open] summary::before{transform:rotate(180deg)}
.reset-filters{
  margin-inline-start:auto;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#a63e3e;
  padding:5px 8px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.reset-filters[hidden]{display:none!important}
.filter-grid{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.filter-grid label{min-width:0;display:grid;gap:6px}
.filter-grid label>span{min-width:0;color:var(--muted);font-size:12px;line-height:1.7;padding-inline:2px;overflow-wrap:anywhere}
.filter-grid input,.filter-grid select{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:0;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  padding:11px 10px;
  direction:rtl;
  text-align:right;
}
.primary{
  display:block;
  width:100%;
  min-width:0;
  border:0;
  border-radius:14px;
  background:var(--brand);
  color:#fff;
  padding:12px 14px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}

.start-content{
  width:100%;
  min-width:0;
  display:grid;
  gap:12px;
}
.start-content>div{
  width:100%;
  min-width:0;
  max-width:100%;
  padding:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--card);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.start-content h2,.group-head h2{margin:0 0 10px;font-size:17px;line-height:1.6}
.chips{
  width:100%;
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  overflow:visible;
}
.chip{
  max-width:100%;
  min-width:0;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--ink);
  padding:8px 12px;
  cursor:pointer;
  white-space:normal;
  overflow-wrap:anywhere;
}

.destination-strip{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:0;
  padding:0;
  overflow:visible;
}
.destination-card{display:block;min-width:0;max-width:100%;color:#fff;text-decoration:none}
.destination-card-media{
  position:relative;
  width:100%;
  min-width:0;
  max-width:100%;
  aspect-ratio:4/5;
  border-radius:16px;
  background:var(--soft);
  overflow:hidden;
  display:grid;
  place-items:center;
}
.destination-card-media img{width:100%;height:100%;object-fit:cover}
.destination-fallback{font-size:36px;color:var(--brand)}
.destination-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.72) 100%)}
.destination-title{position:absolute;inset:auto 10px 10px;display:grid;gap:2px;min-width:0}
.destination-title b,.destination-title small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.destination-title b{font-size:14px}.destination-title small{font-size:10px;opacity:.9}

.result-status{width:100%;min-width:0;min-height:28px;padding:8px 2px;color:var(--muted)}
.discovery-results{width:100%;min-width:0;display:grid;gap:18px}
.result-group{width:100%;min-width:0;display:grid;gap:10px}
.group-head{width:100%;min-width:0;display:flex;justify-content:space-between;align-items:center;gap:10px}
.group-head>*{min-width:0}.group-head button{flex:0 0 auto;border:0;background:transparent;color:var(--brand);cursor:pointer}
.result-grid{width:100%;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.result-card{min-width:0;max-width:100%;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);overflow:hidden;text-decoration:none}
.result-media{position:relative;aspect-ratio:4/3;background:var(--soft);display:grid;place-items:center;overflow:hidden}
.result-media img,.result-media video{width:100%;height:100%;object-fit:cover}
.video-badge{position:absolute;inset:auto 10px 10px auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.55);color:#fff;font-size:13px}
.result-media.media-failed::after{content:'تصویر در دسترس نیست';color:var(--muted);font-size:11px}
.result-media .fallback{font-size:34px;color:var(--brand)}
.result-body{min-width:0;padding:10px}.result-body b,.result-body small{display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.result-body small{margin-top:5px;color:var(--muted)}
.result-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px;color:var(--muted);font-size:11px}
.empty{width:100%;min-width:0;border:1px dashed var(--line);border-radius:18px;background:#fff;padding:26px;text-align:center;color:var(--muted)}
.result-card[href*='/locations/'] .result-media{aspect-ratio:16/10}.result-card[href*='/locations/'] .result-body b{font-size:15px}

.bottom-nav{
  position:fixed;
  z-index:30;
  left:12px;
  right:12px;
  bottom:max(10px,env(safe-area-inset-bottom));
  width:auto;
  min-width:0;
  max-width:none;
  transform:none;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;
  padding:9px 6px;
  border:1px solid var(--line);
  border-radius:26px;
  background:rgba(255,255,255,.97);
  box-shadow:0 10px 35px rgba(0,0,0,.10);
}
.bottom-nav a{min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;color:#747d79;text-align:center;text-decoration:none;font-size:13px}
.bottom-nav svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bottom-nav small{display:block;max-width:100%;margin-top:2px;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bottom-nav a.active{color:var(--brand)}

@media (max-width:640px){
  .discovery-shell{padding-inline:12px;padding-bottom:calc(102px + env(safe-area-inset-bottom))}
  .discovery-head{gap:10px;padding-top:10px}
  .discovery-head .back{flex-basis:40px;width:40px;height:40px;border-radius:13px}
  .discovery-head b{font-size:19px}.discovery-head small{font-size:11.5px}
  .search-panel{margin-top:12px;padding:12px;border-radius:20px}
  .vertical-tabs{gap:7px;padding-top:10px}.vertical-tabs button{padding:7px 11px;font-size:13px}
  .filter-grid{grid-template-columns:1fr}
  .start-content>div{padding:12px;border-radius:18px}
  .destination-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .destination-title b{font-size:13px}
  .result-grid{gap:8px}
  .result-body{padding:8px}.result-body b{font-size:13px}.result-body small{font-size:11px}
}

@media (max-width:340px){
  .discovery-shell{padding-inline:10px}
  .search-panel{padding:10px}
  .vertical-tabs button{padding:7px 10px;font-size:12px}
  .destination-strip{grid-template-columns:1fr 1fr}
  .bottom-nav{left:8px;right:8px;padding-inline:3px}.bottom-nav small{font-size:9.5px}
}

@media (min-width:760px){
  .bottom-nav{left:50%;right:auto;width:680px;transform:translateX(-50%)}
}