
/* === WooCommerce Archive Filter (Букинг) === */
.bf-filter{position:relative; z-index:5; background:linear-gradient(90deg, rgba(241,244,255,.6), rgba(255,255,255,.6)); backdrop-filter:saturate(140%) blur(4px); border-radius:14px; padding:10px 14px; margin:18px auto; display:flex; align-items:center; gap:14px; border:1px solid rgba(0,0,0,.06)}
.bf-filter__item{display:flex; align-items:center; gap:10px; padding:10px 14px; background:#fff; border-radius:12px; box-shadow:0 1px 1px rgba(0,0,0,.02); border:1px solid rgba(0,0,0,.06); cursor:pointer; min-height:44px}
.bf-filter__item:focus{outline:2px solid #ff2d55; outline-offset:2px}
.bf-filter__dates,.bf-filter__guests{flex:1 1 46%}
.bf-filter__search{flex:0 0 auto}
.bf-filter__label{display:block; font-size:12px; color:#6b7280; line-height:1}
.bf-filter__value{font-size:15px; font-weight:600; color:#111827}
.bf-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border-radius:999px; border:none; background:#ff2d55; color:#fff; font-weight:700; cursor:pointer}
.bf-btn:hover{filter:brightness(.95)}
.bf-search-icon{width:16px;height:16px;display:inline-block;border-radius:50%;border:2px solid #fff; position:relative}
.bf-search-icon::after{content:""; position:absolute; right:-5px; bottom:-5px; width:8px; height:2px; background:#fff; transform:rotate(45deg); border-radius:1px}

/* Popovers */
.bf-popover{position:absolute; top:calc(100% + 10px); left:0; right:0; margin:auto; max-width:840px; background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:16px; box-shadow:0 20px 50px rgba(0,0,0,.12); padding:16px; display:none}
.bf-popover--visible{display:block}

/* Calendar */
.bf-cal{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.bf-cal__month{padding:8px}
.bf-cal__head{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
.bf-cal__title{font-weight:700}
.bf-cal__grid{display:grid; grid-template-columns:repeat(7,1fr); gap:6px; font-size:13px}
.bf-cal__dow{color:#6b7280; text-align:center}
.bf-cal__day{height:34px; display:flex; align-items:center; justify-content:center; border-radius:10px; cursor:pointer; user-select:none}
.bf-cal__day--muted{color:#9ca3af; cursor:default}
.bf-cal__day--inrange{background:#eef2ff}
.bf-cal__day--start,.bf-cal__day--end{background:#111827; color:#fff}
.bf-cal__controls{display:flex; align-items:center; justify-content:space-between; margin-top:10px}
.bf-chip{padding:8px 10px; border-radius:999px; border:1px solid #e5e7eb; background:#fff; cursor:pointer; font-size:13px}
.bf-reset{background:#111827; color:#fff; border:none; padding:10px 14px; border-radius:10px}

/* Guests */
.bf-guests{display:grid; grid-template-columns:1fr; gap:12px}
.bf-row{display:flex; align-items:center; justify-content:space-between; background:#f9fafb; border:1px solid #e5e7eb; padding:12px; border-radius:12px}
.bf-row__label{font-weight:600}
.bf-ctrl{display:flex; align-items:center; gap:12px}
.bf-num{min-width:24px; text-align:center}
.bf-minus,.bf-plus{width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:#fff; border:1px solid #e5e7eb; cursor:pointer}
.bf-switch{position:relative; width:46px; height:26px}
.bf-switch input{display:none}
.bf-switch .bf-slider{position:absolute; inset:0; background:#e5e7eb; border-radius:999px; transition:all .2s}
.bf-switch .bf-slider::after{content:""; position:absolute; left:3px; top:3px; width:20px; height:20px; background:#fff; border-radius:50%; transition:all .2s; box-shadow:0 1px 2px rgba(0,0,0,.15)}
.bf-switch input:checked + .bf-slider{background:#10b981}
.bf-switch input:checked + .bf-slider::after{transform:translateX(20px)}
.bf-done{background:#111827; color:#fff; border:none; padding:10px 14px; border-radius:10px; width:100%; font-weight:700}

@media (max-width:900px){
  .bf-popover{left:10px; right:10px}
  .bf-cal{grid-template-columns:1fr}
}


/* Centered one-line filter */
.bf-filter-wrap{display:flex; justify-content:center; padding:14px 12px;}
.bf-filter{max-width:980px; justify-content:center; flex-wrap:nowrap; margin:0 auto;}
@media (max-width:980px){
  .bf-filter{max-width:100%; overflow-x:auto; scrollbar-width:thin;}
}


/* Layout: make items in one row inside the FORM */
.wc-filter-form{display:flex; align-items:center; gap:14px; justify-content:center; flex-wrap:nowrap; white-space:nowrap}
.bf-filter__item{white-space:nowrap}
.bf-filter__dates,.bf-filter__guests,.bf-filter__search{flex:0 0 auto}
.bf-filter__dates{min-width:260px}
.bf-filter__guests{min-width:240px}
.bf-filter__search{min-width:98px}

/* Calendar sizing / overflow fixes */
.bf-popover{overflow:hidden; width:auto; max-width:900px}
.bf-cal{gap:12px}
.bf-cal__month{width:320px; box-sizing:border-box}
.bf-cal__grid{grid-template-columns:repeat(7, minmax(34px, 1fr)); box-sizing:border-box}
.bf-cal__day{min-width:34px}





/* === b3: layout and components (CLEAN) === */
.b3-full{position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; width:100vw}
.b3-grid{
  display:grid;
  grid-template-columns:220px minmax(0,1fr) minmax(360px,40vw);
  grid-template-areas:'sidebar list map';
  align-items:start;
}
.b3-sidebar{grid-area:sidebar; padding:16px}
.b3-list{grid-area:list; padding:16px; background:#F1F3FB}
.b3-map{grid-area:map; padding:16px}
.b3-map-inner{min-height:520px; background:#fff}
.b3-items{display:grid; grid-template-columns:1fr; gap:12px}

/* Card (desktop): image fixed 268x200, center wide, right narrow 140 */
.b3-card{
  display:grid;
  grid-template-columns:268px minmax(0,1fr) 140px;
  gap:0;
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  align-items:stretch;
}
.b3-media{position:relative; width:268px; height:200px; overflow:hidden; border-top-left-radius:10px; border-bottom-left-radius:10px}
.b3-slider{position:absolute; inset:0}
.b3-slide{position:absolute; inset:0; opacity:0; transition:opacity .35s ease}
.b3-slide.is-active{opacity:1; z-index:1}
.b3-slide img{width:100%; height:100%; object-fit:cover; display:block}
.b3-arrow{position:absolute; top:50%; transform:translateY(-50%); border:none; background:rgba(0,0,0,.45); color:#fff; width:34px; height:34px; border-radius:999px; cursor:pointer; z-index:2}
.b3-prev{left:8px} .b3-next{right:8px}

.b3-main{min-width:0; padding:12px 16px; overflow:hidden; word-break:break-word; overflow-wrap:anywhere}
.b3-author{font-size:14px; font-weight:500; margin-bottom:4px}
.b3-title{display:block; font-size:18px; font-weight:700; color:#111827; text-decoration:none; margin-bottom:8px}
.b3-title:hover{text-decoration:underline}
.b3-meta{display:flex; align-items:center; gap:8px; color:#6A6F72; font-size:16px; margin-bottom:8px; flex-wrap:wrap}
.b3-location{display:flex; align-items:center; gap:8px; font-size:14px; font-weight:500; color:#111827}

.b3-aside{position:relative; min-width:140px; display:flex; justify-content:center; align-items:center; text-align:center}
.b3-aside__divider{position:absolute; left:0; top:12px; bottom:12px; width:1px; background:#E5E7EB}
.b3-pricebox{padding:12px 10px; width:100%}
.b3-price{font-weight:700; font-size:18px; margin-bottom:4px}
.b3-price-sub{font-size:12px; color:#6b7280}

/* === <=1030px: sidebar hidden, map on top, vertical cards === */
@media (max-width:1030px){
  .b3-sidebar{display:none}
  .b3-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      'map'
      'list';
  }
  .b3-map-inner{max-height:450px; height:450px}
  .b3-card{grid-template-columns:1fr}
  .b3-media{width:100%; height:200px}
  .b3-aside__divider{display:none}
  .b3-aside{min-width:0; justify-content:center}
}


/* === New breakpoints === */

/* <=1600px: media width 220px, center grows */
@media (max-width:1600px){
  .b3-card{ grid-template-columns:220px minmax(0,1fr) 140px; }
  .b3-media{ width:220px; height:200px; }
}

/* <=1400px: hide sidebar from grid, show drawer toggle; list + map in 2-cols */
@media (max-width:1400px){
  .bf-open-sidebar{ display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border-radius:8px; border:1px solid #e5e7eb; background:#fff; color:#111827; }
  .b3-grid{
    grid-template-columns: 1fr minmax(360px,40vw);
    grid-template-areas: 'list map';
  }
  /* Convert sidebar to drawer */
  .b3-sidebar{
    position:fixed; z-index:1001; top:0; left:0;
    width:300px; max-width:85vw; height:100vh; background:#fff;
    transform:translateX(-105%);
    transition:transform .28s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,.15);
    padding:16px;
  }
  #b3-root.sidebar-open .b3-sidebar{ transform:translateX(0); }
  .b3-sidebar-dimmer{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:1000; }
  #b3-root.sidebar-open .b3-sidebar-dimmer{ display:block; }
}

/* <=1280px: vertical cards, map on top */
@media (max-width:1050px){
  .b3-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      'map'
      'list';
  }
  .b3-map-inner{ max-height:450px; height:450px; }
  .b3-card{ grid-template-columns:1fr; }
  .b3-media{ width:100%; height:200px; }
  .b3-aside__divider{ display:none; }
  .b3-aside{ min-width:0; justify-content:center; }
}
/* Show the sidebar button only when sidebar is hidden from grid */
@media (min-width:1401px){
  .bf-open-sidebar{ display:none; }
}


/* === Yandex map price label === */
.b3-ymaps-price{
  position: relative;
  transform: translateY(-10px);
  background:#111827;
  color:#fff;
  font-size:12px;
  line-height:1;
  padding:4px 6px;
  border-radius:6px;
  white-space:nowrap;
  box-shadow:0 1px 2px rgba(0,0,0,.15);
  pointer-events:none;
}

.b3-map{padding:0}

/* === Yandex custom marker === */
.b3-marker{position:relative; left:0; top:0; transform: translate(-50%, -22px);}
.b3-marker__dot{width:14px; height:14px; border:2px solid #111827; background:#fff; border-radius:50%; margin:0 auto;}
.b3-marker__price{position:absolute; bottom:16px; left:50%; transform:translateX(-50%); background:#111827; color:#fff; font-size:12px; line-height:1; padding:4px 6px; border-radius:6px; white-space:nowrap; box-shadow:0 1px 2px rgba(0,0,0,.15);}
