/* Shared inline bottle filters and sort menu. */

.list-meta { position: relative; }

.sort-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  width: 260px;
  margin: 0;
  padding: 10px 0;
  list-style: none;
  background: var(--palette-white);
  border: 1px solid var(--palette-card-rule);
  border-radius: var(--radius-surface, 14px);
  box-shadow: 0 16px 48px color-mix(in srgb, var(--palette-shadow) 14%, transparent);
}

.sort-menu[hidden] { display: none !important; }

.sort-menu button {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 12px 22px;
  border: 0;
  background: transparent;
  color: var(--palette-body);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2;
  text-align: left;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
}

.sort-menu button:hover { background: var(--palette-sand); }

.sort-menu button.is-on { color: var(--palette-ink); }

.sort-tick {
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  visibility: hidden;
  color: var(--palette-body);
}

.sort-tick svg { display: block; }

.sort-menu button.is-on .sort-tick { visibility: visible; }

/* The accordion occupies its own column within the asset area. */
.asset-browser { display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start; }
.asset-browser.filters-visible { grid-template-columns:248px minmax(0,1fr); }
.asset-browser-results { min-width:0;container-type:inline-size;container-name:assets; }
.asset-filters { min-width:0;margin:0;padding:0;border:0;background:none;color:var(--ink); }
.asset-filters[hidden] { display:none!important; }
.filters-content { display:flex;flex-direction:column;width:100%;font-family:var(--font-body); }
.filters-head { display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:44px;padding:0 0 8px; }
.filters-clear { min-height:36px;border:0;padding:6px 0;background:none;font:600 12px/20px var(--font-body);color:var(--palette-body);cursor:pointer;white-space:nowrap; }
.filters-clear:hover:not(:disabled) { text-decoration:underline;text-underline-offset:3px; }
.filters-clear:disabled { color:var(--palette-mute);opacity:.65;cursor:default; }
.filters-x { display:grid;place-items:center;width:32px;height:36px;padding:0;border:0;border-radius:var(--radius-surface,14px);background:none;color:var(--palette-ink);cursor:pointer; }
.filters-x:hover { background:var(--palette-sand); }
.filters-x svg { width:18px;height:18px; }
.filters-body { min-width:0; }
.filters-block { border-top:1px solid var(--palette-line);padding:0; }
.filters-block:last-child { border-bottom:1px solid var(--palette-line); }
.filters-block>button { display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:4px 8px;width:100%;min-height:48px;margin:0;padding:12px 0;border:0;background:none;color:var(--palette-ink);font:600 14px/20px var(--font-body);text-align:left;cursor:pointer; }
.filter-category { text-transform:none; }
.filter-chevron { grid-column:3;grid-row:1;width:16px;height:16px; }
.filters-block>button[aria-expanded=true] .filter-chevron { transform:rotate(180deg); }
.filter-selection-summary { grid-column:1 / 3;grid-row:2;font:400 12px/18px var(--font-body);color:var(--palette-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.filter-selection-summary[hidden],.filter-facet-count[hidden] { display:none; }
.filter-facet-count { display:grid;place-items:center;min-width:20px;height:20px;border-radius:50%;background:var(--tone-kelly);color:var(--palette-body);font-size:11px;font-weight:600; }
.filters-panel { padding:0 0 12px; }
.filters-panel[hidden] { display:none!important; }
.filters-content button:focus-visible,.filters-content input:focus-visible,.btn-filters:focus-visible,.asset-view-toggle button:focus-visible,.active-filter:focus-visible { outline:2px solid var(--palette-kelly);outline-offset:2px; }
.filters-content .spirit-search input { min-width:0;width:100%;padding:0;text-transform:none;letter-spacing:0; }
.filters-content .price-fields input { width:100%;min-width:0;box-sizing:border-box; }
.filter-options { max-height:220px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin; }
.filter-no-options { margin:12px 4px;font:400 13px/20px var(--font-body);color:var(--palette-body); }
.filter-no-options[hidden] { display:none; }
.active-filters { display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 16px; }
.active-filters[hidden] { display:none; }
.active-filter { display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 10px;border:1px solid var(--palette-line);border-radius:var(--radius-surface,14px);background:var(--tone-kelly);color:var(--palette-ink);font:500 12px/18px var(--font-body);cursor:pointer; }
.active-filter svg { width:16px;height:16px;flex-shrink:0; }
.filter-result-status { margin:0 0 12px;color:var(--palette-body);font:400 12px/18px var(--font-body); }
.filter-result-status[hidden] { display:none; }
.filters-done { display:none; }
.watchlist-tools { display:flex;align-items:center;gap:12px;margin:20px 0 24px; }
.watchlist-tools[hidden] { display:none!important; }
.watchlist-tools .list-meta { margin:0; }
.asset-browser .wishlist-release-stack[hidden] { display:none!important; }
.asset-browser .bottle-grid:not(.is-rows) { grid-template-columns:repeat(4,minmax(0,1fr)); }
@container assets (max-width:1000px) { .asset-browser .bottle-grid:not(.is-rows) { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@container assets (max-width:720px) { .asset-browser .bottle-grid:not(.is-rows) { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container assets (max-width:300px) { .asset-browser .bottle-grid:not(.is-rows) { grid-template-columns:1fr; } }
@media(max-width:1100px) { .asset-browser.filters-visible { grid-template-columns:200px minmax(0,1fr);gap:20px; } }

.price-fields { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:8px; }
.price-fields label { display:grid;gap:6px;min-width:0;color:var(--palette-body);font:400 12px/18px var(--font-body); }
.price-fields input { height:44px;padding:0 10px;border:1px solid var(--palette-line);border-radius:var(--radius-surface,14px);background:var(--palette-sand);color:var(--ink);font:500 14px/20px var(--font-body);font-variant-numeric:tabular-nums;text-align:left; }

.price-slider {
  position: relative;
  height: 28px;
  margin-top: 8px;
}

.price-track,
.price-fill {
  position: absolute;
  left: 10px;
  right: 10px;
  top: 12px;
  height: 4px;
  border-radius: var(--radius-surface, 14px);
  background: var(--palette-line);
}

.price-fill {
  right: auto;
  background: var(--palette-kelly);
}

.price-slider input[type="range"] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 28px;
  margin: 0;
  background: none;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}

.price-slider input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  pointer-events: auto;
  width: 22px;
  height: 22px;
  border: 2px solid var(--palette-card-rule);
  border-radius: 50%;
  background: var(--palette-white);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--palette-shadow) 12%, transparent);
  cursor: pointer;
}

.price-slider input[type="range"]::-moz-range-thumb {
  pointer-events: auto;
  width: 22px;
  height: 22px;
  border: 2px solid var(--palette-card-rule);
  border-radius: 50%;
  background: var(--palette-white);
  cursor: pointer;
}

.spirit-search {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  margin-bottom: 8px;
  padding: 0 12px;
  border: 1px solid var(--palette-line);
  border-radius: var(--radius-surface, 14px);
  background: var(--palette-sand);
  color: var(--palette-body);
}

.spirit-search svg { flex: none; }

.spirit-search input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 14px;
}

.bottle-card:not(.bc-card)[hidden],
.vault-card:not(.bc-card)[hidden],
.filter-opt[hidden] { display: none !important; }

.filter-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  box-sizing: border-box;
  padding: 8px;
  border-radius: var(--radius-surface,14px);
  font: 400 13px/20px var(--font-body);
  cursor: pointer;
}

.filter-opt:hover { background:var(--palette-sand); }
.filter-opt:has(input:checked) { background:var(--tone-kelly); }
.filter-opt input {
  flex-shrink:0;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--palette-kelly);
}

.filters-more {
  display: block;
  width: 100%;
  min-height:36px;
  margin:4px 0 0;
  border: 0;
  background: transparent;
  color: var(--palette-body);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  text-align:left;
  padding:6px 8px;
  cursor: pointer;
}
.filters-more[hidden] { display:none; }

.filters-empty {
  margin: 18px 0 0;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--palette-body);
}

.filters-empty[hidden] { display: none !important; }

.bottle-toolbar .list-meta,.market-tools .list-meta { margin:0;flex-shrink:0; }
.market-tools .btn-filters[hidden],.bottle-toolbar .btn-filters[hidden] { display:none; }
.market .market-tools { width:100%; }
.market .market-tools .field { flex:1; }
.bottle-toolbar .list-meta .sort,.market-tools .list-meta .sort { height:44px;padding:0 14px;border:1px solid var(--palette-line);border-radius:var(--radius-surface, 14px);background:var(--palette-sand);font:500 13px var(--font-body);white-space:nowrap;cursor:pointer;color:var(--palette-body);text-transform:none;letter-spacing:0; }
#overview .bottle-toolbar .vault-search,.market .market-tools .field { height:44px;border:1px solid var(--palette-line);border-radius:var(--radius-surface, 14px);background:var(--palette-sand);box-sizing:border-box; }
#collection-results { display:block;width:auto;max-width:none;text-align:left;white-space:nowrap; }
.market>.results { display:block;margin:12px 0 16px;font-size:12px;color:var(--palette-body); }

.bottle-toolbar .btn-filters,.market-tools .btn-filters { display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;width:auto;height:44px;min-height:44px;padding:0 14px;border:1px solid var(--palette-line);border-radius:var(--radius-surface, 14px);background:var(--palette-sand);color:var(--palette-body);font:500 13px var(--font-body);text-transform:none;letter-spacing:0;cursor:pointer; }
.btn-filters>svg { width:19px;height:19px; }
.filter-trigger-count { display:grid;place-items:center;min-width:20px;height:20px;border-radius:50%;background:var(--tone-kelly);color:var(--palette-body);font-size:11px; }
.filter-trigger-count[hidden] { display:none; }

.bottle-toolbar .btn-filters[aria-expanded=true],.market-tools .btn-filters[aria-expanded=true] { background:var(--tone-kelly);border-color:var(--palette-card-rule);color:var(--palette-body); }

/* On phones the same inline component uses the available width above the cards. */
@media(max-width:650px) {
  .asset-browser.filters-visible { grid-template-columns:minmax(0,1fr);gap:20px; }
  .filters-head { padding-bottom:8px; }
  .filters-clear,.filters-x { min-height:44px; }
  .filter-opt { min-height:44px;font-size:14px; }
  .filters-content .spirit-search input,.price-fields input { font-size:16px; }
  .filters-done { display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin:16px 0 0;border:0;border-radius:var(--radius-surface,14px);background:var(--palette-ink);color:var(--palette-white);font:600 14px/20px var(--font-body);cursor:pointer; }
  .watchlist-tools { flex-wrap:wrap;gap:8px; }
  .watchlist-tools .field { flex:1 0 100%!important;width:100%; }
  .watchlist-tools .list-meta { flex:1; }
  .watchlist-tools .sort { width:100%; }
  .sort-menu { max-width:calc(100vw - 48px); }
}
/* Icon controls are shared by Market, Watchlist and Collection. */
body .site .listing-icon-control{position:relative;width:44px;min-width:44px;height:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px!important;gap:0;border:1px solid var(--palette-line);border-radius:14px;background:var(--palette-white);color:var(--palette-ink);font-size:0!important}
body .site .listing-icon-control>span:not(.filter-trigger-count){display:none}
body .site .listing-icon-control :is(img,svg){width:20px;height:20px;flex:none}
body .site .listing-icon-control .filter-trigger-count{position:absolute;top:-6px;right:-4px;background:var(--palette-ink);color:var(--palette-white);font:600 10px/16px 'DM Sans',sans-serif;border-radius:4px;min-width:16px;padding:0 2px}
body .site .listing-icon-control:focus-visible{outline:2px solid var(--palette-ink);outline-offset:2px}
body .site .sort-menu button{font:400 14px/20px 'DM Sans',sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body .market-page .market-browse-controls .market-tools,body .market-page .watchlist-tools{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;margin:0}
body .market-page .market-browse-controls .field,body .market-page .watchlist-tools .field{flex:1;min-width:0;height:44px;padding:0 12px;margin:0}
body .market-page :is(.market-browse-controls,.watchlist-tools) .list-meta{flex:none;width:auto;margin:0;position:relative}
body .market-page .market-browse-controls{margin-bottom:16px}
body .market-page .market-shelf{margin-top:20px}
body .market-page .market-section-head{margin-bottom:8px}
body .market-page .market-shelf-track{gap:12px;padding-bottom:8px;grid-auto-columns:calc((100% - 48px)/5)}
body .market-page .watchlist-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
@media(max-width:800px){body .market-page .market-shelf-track{grid-auto-columns:calc((100% - 8px)/2);gap:8px}body .market-page .watchlist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body .market-page .market-shelf-controls{gap:4px}body .market-page .market-shelf-arrow{width:36px;height:44px;border:0}}
