/* =========================================================
   TOUR FILTER — CANONICAL FINAL
   Назначение:
   - единая капсула
   - сегменты внутри
   - фиксированная геометрия
   ========================================================= */

.tour-filter-count{
  margin-left:12px;
  font-size:14px;
  color:var(--color-muted);
  align-self:center;
  white-space:nowrap;
}

/* =========================================================
   1️⃣ WRAP / POSITIONING
   Центрирование относительно страницы
   ========================================================= */

.tour-filter-wrap{
  display:flex;
  justify-content:center;
  width:100%;
  
  
}






/* =========================================================
   2️⃣ MAIN CAPSULE
   Общая оболочка фильтра
   ========================================================= */

.tour-filter{
  display:flex;
  align-items:center;

  background:#2b2b2b;
  border-radius:999px;

  padding:6px;
  gap:0;

  min-width:620px;              /* фикс геометрии */
}


/* =========================================================
   3️⃣ SEGMENTS (pill внутри капсулы)
   ========================================================= */

.tour-filter-pill{
  position:relative;
  display:flex;
  align-items:center;

  height:48px;
  padding:0 48px 0 20px;

  color:#fff;
  background:transparent;
  border-radius:0;

  font-weight:600;
  white-space:nowrap;
}


/* --- разделители между сегментами --- */
.tour-filter-pill:not(:last-of-type)::after{
  content:'';
  position:absolute;
  right:0;
  top:8px;
  bottom:8px;

  width:1px;
  background:rgba(255,255,255,0.15);
}


/* =========================================================
   4️⃣ SEGMENT CONTENT
   ========================================================= */

/* label */
.pill-label{
  pointer-events:none;
}

/* arrow */
.pill-arrow{
  position:absolute;
  right:16px;

  width:28px;
  height:28px;
  border-radius:50%;

  background:rgba(255,255,255,0.12);

  display:flex;
  align-items:center;
  justify-content:center;

  opacity:0.8;
  
    pointer-events:none;   /* ← ВОТ ОНО */
}


/* =========================================================
   5️⃣ NATIVE SELECT (invisible)
   ========================================================= */

.tour-filter-pill select{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}

.tour-filter-pill select:disabled{
  cursor:default;
}


/* =========================================================
   6️⃣ SUBMIT BUTTON
   ========================================================= */

.tour-filter-submit{
  height:44px;
  padding:0 26px;

  border:none;
  border-radius:999px;

  background:#ff8a00;
  color:#000;

  font-weight:700;
  cursor:pointer;

  margin-left:6px;
}

.tour-filter-submit:disabled{
  opacity:0.5;
  cursor:default;
}


/* =========================================================
   7️⃣ RESET LINK (если используется)
   ========================================================= */

.tour-filter-reset{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}

.tour-filter-reset,
.tour-filter-reset:hover,
.tour-filter-reset:focus,
.tour-filter-reset:active{
  color:#000;
  text-decoration:none;
}

.tour-filter-reset:hover{
  color:#fff;
}


/* =========================================================
   8️⃣ HEADER
   ========================================================= */

.tour-filter-head{
  text-align:center;
  margin-bottom:var(--space-6);
}

.tour-filter-title{
  margin:0;
}


/* =========================================================
   9️⃣ ANCHOR OFFSET
   ========================================================= */

#tour-filter{
  scroll-margin-top:160px;
}


/* =========================================================
   Медиа блок
   ========================================================= */



@media (max-width: 768px){

  .tour-filter-wrap{
    padding-left:calc(var(--space-4) + env(safe-area-inset-left));
    padding-right:calc(var(--space-4) + env(safe-area-inset-right));
    

  }

  .tour-filter{
    min-width:0;
    width:100%;
    flex-wrap:wrap;
    border-radius:20px;

margin-left:auto;
  margin-right:auto;

    box-sizing:border-box; /* ← ВОТ ОН, КЛЮЧ */
  }

  .tour-filter-pill{
    flex:1 1 100%;
    justify-content:space-between;
  }

  .tour-filter-submit,
  .tour-filter-reset{
    width:100%;
    margin-left:0;
    margin-top:8px;
  }

}

@media (max-width: 768px){

  .tour-filter-container{
    padding-left:var(--space-4);
    padding-right:var(--space-4);
  }

  .tour-filter-wrap{
    padding-left:0;
    padding-right:0;
  }

  .tour-filter{
    width:100%;
    margin:0 auto;
    box-sizing:border-box;
  }

}