/* SUNDUQ v299 — compact mobile filters for Market, Jobs and Realty.
   Desktop keeps the familiar sidebar. Mobile gets one compact toolbar + bottom sheet. */

.su299FilterBar,
.su299ActiveChips,
.su299SheetHead,
.su299SheetActions,
.su299FilterBackdrop{display:none}

.su299FilterShell{position:relative}
.su299FieldLabel{display:grid;gap:7px}
.su299FieldLabel>span{font-size:12.5px;font-weight:800;color:var(--k-muted,#9fb2c7)}
.su299PriceRow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.su299FilterPanel .su299SheetActions{display:grid;grid-template-columns:1fr;margin-top:14px}
.su299FilterPanel .su299ApplyBtn{display:none}

/* Keep desktop sidebars compact and consistent. */
.marketPage .su299FilterPanel,
.jobs93Page .su299FilterPanel,
.realty94Page .su299FilterPanel{align-self:start}

.su299ResetBtn,
.su299ApplyBtn{
  min-height:44px;border-radius:13px;padding:10px 14px;font:inherit;font-weight:800;cursor:pointer
}
.su299ResetBtn{background:var(--k-card-2,#12273a);color:var(--k-text,#fff);border:1px solid var(--k-line,rgba(255,255,255,.12))}
.su299ApplyBtn{background:var(--k-accent,#1877f2);color:#fff;border:0}

/* Market switches to one column at 1050px in its legacy stylesheet. */
@media (max-width:1050px){
  .su299FilterShell--market .su299FilterBar,
  .su299FilterShell--market .su299ActiveChips{display:flex}
  .su299FilterShell--market .su299FilterPanel{position:fixed!important}
  .su299FilterShell--market .su299FilterBackdrop{display:block}
}

/* Jobs/Realty switch to one column at 850px. */
@media (max-width:850px){
  .su299FilterShell--jobs .su299FilterBar,
  .su299FilterShell--jobs .su299ActiveChips,
  .su299FilterShell--realty .su299FilterBar,
  .su299FilterShell--realty .su299ActiveChips{display:flex}
  .su299FilterShell--jobs .su299FilterPanel,
  .su299FilterShell--realty .su299FilterPanel{position:fixed!important}
  .su299FilterShell--jobs .su299FilterBackdrop,
  .su299FilterShell--realty .su299FilterBackdrop{display:block}
}

@media (max-width:1050px){
  /* Shared mobile toolbar. Specific shells that remain desktop-size are hidden below. */
  .su299FilterBar{
    align-items:center;gap:8px;margin:0 0 8px;padding:3px 0 2px;
    overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;
    -webkit-overflow-scrolling:touch
  }
  .su299FilterBar::-webkit-scrollbar,.su299FilterQuick::-webkit-scrollbar{display:none}
  .su299Search{
    flex:0 0 min(54vw,230px);height:44px;display:flex;align-items:center;gap:8px;
    padding:0 12px;border:1px solid var(--k-line,rgba(255,255,255,.12));
    border-radius:14px;background:var(--k-card-flat,#07131f);color:var(--k-muted,#9fb2c7)
  }
  .su299Search .su296Icon{width:18px;height:18px;flex:0 0 18px}
  .su299Search input{
    min-width:0;width:100%;height:100%;border:0!important;outline:0!important;padding:0!important;
    background:transparent!important;color:var(--k-text,#fff)!important;font:inherit!important;box-shadow:none!important
  }
  .su299Search input::placeholder{color:var(--k-muted,#8fa3b8);opacity:.9}
  .su299FilterQuick{display:flex;gap:8px;flex:0 0 auto}
  .su299QuickBtn{
    height:44px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
    padding:0 12px;border-radius:14px;border:1px solid var(--k-line,rgba(255,255,255,.12));
    background:var(--k-card-2,#12273a);color:var(--k-text,#fff);font:inherit;font-size:13.5px;font-weight:800;cursor:pointer
  }
  .su299QuickBtn .su296Icon{width:15px;height:15px}
  .su299QuickBtn.is-active{border-color:rgba(65,145,255,.55);background:rgba(48,125,232,.15);color:#dbeaff}

  .su299ActiveChips{
    gap:7px;align-items:center;overflow-x:auto;scrollbar-width:none;margin:0 0 10px;
    -webkit-overflow-scrolling:touch
  }
  .su299ActiveChips:empty{display:none!important}
  .su299ActiveChips::-webkit-scrollbar{display:none}
  .su299ActiveChip{
    flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:5px 7px 5px 10px;
    border-radius:999px;background:rgba(48,125,232,.13);border:1px solid rgba(73,154,255,.28);color:#dbeaff;
    font-size:12.5px;font-weight:750;white-space:nowrap
  }
  .su299ActiveChip button{
    width:22px;height:22px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;
    background:rgba(255,255,255,.07);color:inherit;cursor:pointer
  }
  .su299ActiveChip button .su296Icon{width:13px;height:13px}

  .su299FilterBackdrop{
    position:fixed;inset:0;z-index:1390;border:0;padding:0;background:rgba(0,0,0,.54);
    opacity:0;pointer-events:none;transition:opacity .2s ease
  }
  .su299FilterPanel{
    left:0!important;right:0!important;bottom:0!important;top:auto!important;z-index:1400!important;
    width:100%!important;max-width:none!important;max-height:min(78dvh,720px);overflow-y:auto;
    margin:0!important;padding:16px 16px calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:24px 24px 0 0!important;transform:translateY(105%);visibility:hidden;
    transition:transform .24s ease,visibility 0s linear .24s;box-shadow:0 -18px 55px rgba(0,0,0,.42)!important
  }
  .su299FilterShell.is-open .su299FilterPanel{transform:translateY(0);visibility:visible;transition:transform .24s ease}
  .su299FilterShell.is-open .su299FilterBackdrop{opacity:1;pointer-events:auto}
  body.su299FiltersOpen{overflow:hidden!important}

  .su299SheetHead{
    display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:0 0 15px!important
  }
  .su299SheetHead>div{display:grid;gap:2px}
  .su299SheetHead b{font-size:20px;color:var(--k-text,#fff)}
  .su299SheetHead span{font-size:13px;color:var(--k-muted,#9fb2c7)}
  .su299SheetClose{
    flex:0 0 40px;width:40px;height:40px;display:grid;place-items:center;padding:0;
    border-radius:12px;border:1px solid var(--k-line,rgba(255,255,255,.12));
    background:var(--k-card-2,#12273a);color:var(--k-text,#fff);cursor:pointer
  }
  .su299SheetClose .su296Icon{width:19px;height:19px}
  .su299SheetActions{display:grid!important;grid-template-columns:minmax(100px,.7fr) minmax(170px,1.3fr);gap:9px}
  .su299FilterPanel .su299ApplyBtn{display:block}
  .su299PriceRow{grid-template-columns:1fr 1fr;gap:8px}

  /* Remove legacy sidebar margins that are too tall inside the bottom sheet. */
  .jobs93Page .su299FilterPanel>*+*,.realty94Page .su299FilterPanel>*+*{margin-top:11px}
  .jobs93Page .su299FilterPanel .su299SheetHead+*,.realty94Page .su299FilterPanel .su299SheetHead+*{margin-top:0}
  .marketPage .su299FilterPanel{display:grid!important;gap:11px!important}
  .marketPage .su299FilterPanel .marketFilters{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .marketPage .su299FilterPanel .marketFilters button{text-align:center;padding:10px 8px}
  .marketPage .su299FilterPanel .marketReset{margin:0;width:100%}
  .marketPage .su299FilterPanel .su299ApplyBtn{width:100%}
}

/* Jobs/Realty toolbar must stay hidden between 851 and 1050px. */
@media (min-width:851px) and (max-width:1050px){
  .su299FilterShell--jobs .su299FilterBar,.su299FilterShell--jobs .su299ActiveChips,
  .su299FilterShell--realty .su299FilterBar,.su299FilterShell--realty .su299ActiveChips{display:none!important}
  .su299FilterShell--jobs .su299FilterBackdrop,.su299FilterShell--realty .su299FilterBackdrop{display:none!important}
  .su299FilterShell--jobs .su299FilterPanel,.su299FilterShell--realty .su299FilterPanel{position:static!important;transform:none!important;visibility:visible!important}
}

@media (max-width:520px){
  .su299Search{flex-basis:min(58vw,220px)}
  .su299QuickBtn{padding:0 10px;font-size:13px}
  .su299FilterPanel{max-height:84dvh}
  .su299PriceRow{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  .su299FilterPanel,.su299FilterBackdrop{transition:none!important}
}