/* PHP list pages (/ads, /category/{slug}, /categories), loaded after the prototype's pages-browse.css and
   reference-pages.css. The prototype built these controls as <button>s in JavaScript; on the server they are links
   and real form fields, so the few rules below give them the same look. Nothing here touches shared components. */

/* Selected category and sort choice are links marked aria-current (the prototype used aria-pressed buttons). */
body:is([data-page=listings],[data-page=map]) .browse-filter-tree-choice[aria-current]{background:var(--accent-soft);color:var(--accent-strong);font-weight:600}
body:is([data-page=listings],[data-page=map]) .browse-sort-option[aria-current]{border-color:var(--accent-strong);background:var(--accent-pale)}
body:is([data-page=listings],[data-page=map]) .browse-sort-option[aria-current] .browse-sort-choice-mark{border-color:var(--accent-strong)}
body:is([data-page=listings],[data-page=map]) .browse-sort-option[aria-current] .browse-sort-choice-mark .icon{visibility:visible}
.browse-filter-tree-choice,.browse-sort-option,.browse-category-suggestion,.browse-chip,a.browse-quick-filter{text-decoration:none}
.browse-filter-tree-leaf .browse-filter-tree-choice{padding-inline-start:26px;font-size:11px}

/* Text attribute filter (e.g. colour) beside the dropdowns. */
.browse-field>input{width:100%;min-width:0;min-height:42px;border:1px solid var(--browse-line);border-radius:10px;background:var(--surface-soft,#fcfdff);color:var(--browse-ink);padding:8px 10px;font-size:12px}
/* Neighborhood picker without a city. */
.browse-choice-picker.is-disabled>summary{opacity:.55;cursor:not-allowed}

/* /categories: subcategory menu items are links. */
.browse-category-tile{text-decoration:none}
.browse-subcategory-menu a{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:11px;padding:14px 12px;background:transparent;color:var(--browse-ink);font-size:12px;text-align:right;text-decoration:none}
.browse-subcategory-menu a span{display:flex;align-items:center;gap:9px;color:var(--browse-muted);font-size:11px}
.browse-subcategory-menu a .icon{width:13px;height:13px;transform:rotate(180deg)}
.browse-subcategory-menu a.is-active,.browse-subcategory-menu a:hover{background:var(--accent-soft);color:var(--accent-strong)}
@media(max-width:540px){
  .browse-subcategory-menu a{white-space:nowrap;flex-shrink:0;border:1px solid var(--browse-line);padding:11px;font-size:11px}
  .browse-subcategory-menu a span{font-size:10px;gap:5px}
}

/* Results column: the shared card grid ("جدیدترین آگهی‌ها" layout). */
.browse-results .latest-results{margin-top:4px}
.browse-results .empty-state{grid-column:1/-1}

/* Balanced actions in the sidebar and mobile filter dialog. */
body[data-page=listings] #browse-listing-filters .browse-filter-actions,
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
body[data-page=listings] #browse-listing-filters .browse-filter-actions>.app-button,
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-actions>.app-button{width:100%;min-width:0;height:44px;min-height:44px;margin:0;padding:8px 6px;white-space:nowrap;line-height:1.6;justify-content:center!important;font-size:12px}
body[data-page=listings] #browse-listing-filters .browse-filter-actions{padding:16px 0 0;margin-top:18px}
body[data-page=listings] #browse-listing-filters .browse-apply-chevron{display:none}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-apply{gap:7px}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-apply-chevron{flex:none;width:16px;height:16px}

/* Pair the requested fields in the roomy mobile dialog; retain the narrow sidebar layout. */
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-location{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px;align-items:start}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-attributes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px;align-items:start}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup :is(.browse-filter-location,.browse-filter-attributes)>*{min-width:0}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-attributes>*{grid-column:1/-1}
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-attributes:has([name="a[parking]"]):has([name="a[extras]"])>.browse-field:has([name="a[parking]"], [name="a[extras]"]){grid-column:auto}

/* Paired vehicle choices in the filter dialog; numeric ranges keep their full row. */
body:is([data-page=listings],[data-page=map]) .browse-filter-popup .browse-filter-attributes>.browse-field:has([name="a[brand]"],[name="a[year][eq]"],[name="a[gearbox]"],[name="a[condition]"]){grid-column:auto}