/* Browse CSS. Moved from app.css; shared public sources stay in app.css. */

.browse-shell{display:flex;flex-direction:column;gap:18px;margin-top:12px;}

.browse-main{display:grid;grid-template-columns:clamp(350px,calc(20vw + 75px),400px) minmax(0,1fr);gap:16px;align-items:flex-start;}

.browse-content{background:#fbfcfe;border:1px solid var(--surface-border);border-radius:var(--surface-radius-primary);padding:var(--surface-pad-primary);box-shadow:var(--surface-shadow);position:relative;}

.browse-content > *{position:relative;}

.browse-results-area{position:relative;min-height:240px;}

.browse-loading{display:none;align-items:center;justify-content:center;margin:16px 0 18px;position:sticky;top:140px;z-index:4;pointer-events:none;}

.browse-content.is-loading .browse-loading{display:flex;}

.browse-content.is-loading .browse-results-area .browse-grid,
    .browse-content.is-loading .browse-results-area .browse-empty,
    .browse-content.is-loading .browse-results-area .resultsbar{opacity:.35;filter:blur(1.5px);}

.browse-loading-card{display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border-radius:999px;background:#0f172a;border:1px solid #0b1220;box-shadow:0 14px 34px rgba(15,23,42,.28);font-size:14px;font-weight:700;color:#fff;letter-spacing:.01em;animation:browse-pulse 1.6s ease-in-out infinite;}

.browse-spinner{width:22px;height:22px;box-sizing:border-box;border-radius:999px;border:var(--ajax-spinner-border-width-strong) solid rgba(255,255,255,.35);border-top-color:#ffffff;animation:public-ajax-spin .9s linear infinite;}

@keyframes browse-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.02);}}

.facet-group{border:1px solid var(--surface-border);border-radius:12px;background:var(--surface-bg);overflow:hidden;}

.facet-header{display:flex;justify-content:space-between;align-items:center;width:100%;padding:10px 14px;font-weight:600;font-size:13px;background:var(--surface-soft-bg);border:0;border-bottom:1px solid var(--surface-border-soft);cursor:pointer;text-align:left;}

.facet-header.is-static{cursor:default;}

.facet-header.is-static .toggle-arrow{display:none;}

.facet-header:focus-visible{outline:2px solid #2563eb;outline-offset:2px;}

.facet-body{padding:10px 14px 14px;}

.facet-body.stack{display:grid;gap:6px;}

#catBody{gap:4px;}

#catBody .row{align-items:center;column-gap:8px;padding:4px 6px;}

#catBody .row .label{align-items:center;gap:0;position:relative;padding-left:0;}

#catBody .row .label[aria-expanded]::before{content:"";flex:0 0 auto;width:0;height:0;margin-right:4.5px;border-top:4.8px solid transparent;border-bottom:4.8px solid transparent;border-left:6px solid #607289;transform:translateY(-1.5px);transform-origin:center;}

#catBody .row .label[aria-expanded="true"]::before{transform:translateY(-.5px) rotate(90deg);}

#catBody .row .label[aria-expanded] .label-text{font-weight:550;color:#525252;}

#catBody .row .label-text{line-height:1.2;}

#catBody .row.is-search-match .label-text{background:#fff3b0;border-radius:2px;box-shadow:0 0 0 1px rgba(245,208,66,.18);}

.browse-category-search{position:relative;margin-bottom:2px;}

.browse-category-search-input{width:100%;height:34px;padding:0 32px 0 31px;border:1px solid var(--surface-border);border-radius:9px;background:var(--surface-bg);color:var(--fg);font:inherit;font-size:13px;outline:none;}

.browse-category-search-input:focus{border-color:#8fbbed;box-shadow:0 0 0 3px rgba(11,132,229,.13);}

.browse-category-search-icon{position:absolute;left:10px;top:50%;width:14px;height:14px;transform:translateY(-50%);color:#607087;pointer-events:none;}

.browse-category-search-icon::before{content:"";position:absolute;left:1px;top:1px;width:8px;height:8px;border:1.5px solid currentColor;border-radius:50%;}

.browse-category-search-icon::after{content:"";position:absolute;right:0;bottom:1px;width:6px;height:1.5px;background:currentColor;transform:rotate(45deg);transform-origin:left center;}

.browse-category-search-clear{position:absolute;right:6px;top:50%;width:22px;height:22px;border:0;border-radius:999px;padding:0;background:transparent;color:#526783;font-size:16px;font-weight:800;line-height:22px;transform:translateY(-50%);cursor:pointer;}

.browse-category-search-clear[hidden],.browse-category-search-status[hidden],.browse-category-search-empty[hidden]{display:none;}

.browse-category-search-status{min-height:18px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px;color:#607087;font-size:12px;}

.browse-category-search-status-clear{border:0;background:transparent;padding:0;color:#0066b3;font:inherit;font-size:12px;font-weight:800;cursor:pointer;}

.browse-category-search-empty{padding:9px 8px;border:1px dashed var(--surface-border);border-radius:8px;background:#fbfdff;color:#607087;font-size:12px;}

.browse-category-tree{display:grid;gap:4px;}

.price-grid{display:grid;gap:10px;}

.price-values{display:flex;justify-content:space-between;font-size:12px;color:var(--mut);min-height:18px;}

.price-grid #applyPrice:disabled{opacity:.6;cursor:not-allowed;background:#e2e8f0;color:#64748b;border-color:#cbd5e1;box-shadow:none;}

.price-grid #applyPrice:disabled:hover{background:#e2e8f0;color:#64748b;border-color:#cbd5e1;}

.slider{position:relative;height:30px;}

.slider .track{position:absolute;left:0;right:0;top:50%;height:6px;background:#dbe4ee;border-radius:999px;transform:translateY(-50%);}

.slider .range{position:absolute;top:50%;height:6px;background:#2563eb;border-radius:999px;transform:translateY(-50%);}

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

.slider input[type=range]::-webkit-slider-thumb{width:22px;height:22px;border-radius:50%;background:#2563eb;border:3px solid #fff;box-shadow:0 0 0 2px #a9bfff;pointer-events:auto;cursor:pointer;}

.slider input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#2563eb;border:3px solid #fff;box-shadow:0 0 0 2px #a9bfff;pointer-events:auto;cursor:pointer;}

.slider.is-empty .range{background:#dbe4ee;}

.slider.is-empty input[type=range]::-webkit-slider-thumb,.slider.is-empty input[type=range]::-moz-range-thumb{opacity:1;}

.price-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}

.price-row input{padding:8px 10px;border:1px solid var(--b);border-radius:10px;font-size:13px;}

.quickbar{
      margin:2px 0 8px;
      padding:10px;
      border-radius:16px;
      border:1px solid var(--surface-border);
      background:var(--surface-soft-bg);
      box-shadow:var(--surface-shadow);
      --quickbar-title-size:17px;
      --quickbar-subtitle-size:13px;
      --quickbar-tile-title-size:13px;
      --quickbar-tile-subtitle-size:12px;
      --quickbar-tile-min-h:58px;
      --quickbar-tile-min-w:96px;
      --quickbar-grid-gap:6px;
    }

.quickbar-head{
      position:relative;
      display:grid;
      gap:2px;
      margin-bottom:6px;
      padding-left:10px;
    }

.quickbar-head::before{
      content:"";
      position:absolute;
      left:0;
      top:1px;
      bottom:1px;
      width:4px;
      border-radius:999px;
      background:#2563eb;
    }

.quickbar-title{
      margin:0;
      color:#1f2937;
      font-size:var(--quickbar-title-size);
      font-weight:700;
      letter-spacing:-.005em;
      line-height:1.1;
    }

.quickbar-subtitle{
      margin:0;
      color:#64748b;
      font-size:var(--quickbar-subtitle-size);
      line-height:1.3;
      font-weight:500;
    }

.quickbar-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(var(--quickbar-tile-min-w),1fr));
      gap:var(--quickbar-grid-gap);
    }

.quickbar-tile{
      display:grid;
      gap:2px;
      justify-items:center;
      align-content:center;
      min-height:var(--quickbar-tile-min-h);
      padding:6px 8px;
      border-radius:12px;
      border:1px solid var(--surface-border);
      background:var(--surface-bg);
      box-shadow:none;
      cursor:pointer;
      transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background-color .16s ease;
    }

.quickbar-tile.is-active{
      border-color:var(--surface-utility-selected-border);
      background:var(--surface-utility-selected-bg);
      box-shadow:none;
    }

.quickbar-tile.is-active .quickbar-tile-title{color:#0f172a;}

.quickbar-tile.is-active .quickbar-tile-subtitle{color:#556785;}

.quickbar-tile:focus-visible{
      outline:2px solid rgba(37,99,235,.35);
      outline-offset:2px;
    }

.quickbar-tile-title{
      color:#1f2937;
      font-size:var(--quickbar-tile-title-size);
      line-height:1.15;
      font-weight:700;
      text-align:center;
      letter-spacing:-.01em;
    }

.quickbar-tile-subtitle{
      color:#64748b;
      font-size:var(--quickbar-tile-subtitle-size);
      line-height:1.25;
      font-weight:500;
      text-align:center;
    }

.browse-current{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0;}

.browse-current-title{font-size:13px;font-weight:600;color:var(--mut);}

.link-cta.browse-clearall{
      display:flex;
      align-items:center;
      position:relative;
      width:100%;
      margin-top:10px;
      padding:8px 4px 2px 2px;
      border:0;
      border-radius:0;
      justify-content:flex-start;
      gap:6px;
      color:#1e66c2;
      font-size:14px;
      font-weight:600;
      line-height:1.2;
      letter-spacing:0;
      text-align:left;
      background:transparent;
      cursor:pointer;
    }

.link-cta.browse-clearall::before{
      content:"";
      position:absolute;
      left:0;
      right:0;
      top:0;
      border-top:1px solid #d4deed;
      pointer-events:none;
    }

.link-cta.browse-clearall:focus-visible{
      outline-offset:2px;
    }

.link-cta.browse-clearall .browse-clearall-icon{
      width:16px;
      height:16px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      align-self:center;
      color:currentColor;
      flex:0 0 16px;
    }

.link-cta.browse-clearall .browse-clearall-icon svg{
      width:100%;
      height:100%;
      display:block;
      stroke:currentColor;
      stroke-width:2;
      fill:none;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

.link-cta.browse-clearall .browse-clearall-label{
      display:inline-flex;
      align-items:center;
      font-size:inherit;
      font-weight:inherit;
      line-height:inherit;
      letter-spacing:0;
    }

.chips{display:flex;flex-wrap:wrap;gap:8px;}

.chips .chip{margin:0;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f1f5f9;border:1px solid #d8e0f0;font-size:12px;}

.chips .chip button{border:0;background:none;font-size:14px;cursor:pointer;padding:0;line-height:1;}

.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0;}

@media (min-width: 1121px) {
.view-browse .toolbar{
        display:grid;
        grid-template-columns:minmax(12rem,1fr) max-content minmax(220px,340px);
        align-items:center;
        gap:12px;
        margin:12px 0 14px;
      }

.view-browse .toolbar .browse-toolbar-control,
      .view-browse .toolbar .browse-toolbar-select{
        min-height:40px;
        border:1px solid var(--surface-border);
        border-radius:12px;
        background:var(--surface-bg);
        box-shadow:none;
        color:#1f2937;
      }

.view-browse .toolbar .browse-toolbar-control{
        appearance:none;
        -webkit-appearance:none;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        min-height:40px;
        padding:0 14px;
        font-family:var(--font-ui);
        font-size:13px;
        font-weight:700;
        line-height:1;
        cursor:pointer;
      }

.view-browse .toolbar .browse-filters-trigger{
        display:none;
      }

.view-browse .toolbar .browse-share-btn .share-icon{
        width:16px;
        height:16px;
        flex:0 0 16px;
        line-height:0;
      }

.view-browse .toolbar .browse-share-btn .share-icon svg{
        width:16px;
        height:16px;
        display:block;
      }

.view-browse .toolbar .browse-share-btn .share-label{
        margin-left:0;
        line-height:13px;
        white-space:nowrap;
      }

.view-browse .toolbar .browse-toolbar-control:focus-visible{
        outline:2px solid rgba(37,99,235,.35);
        outline-offset:3px;
      }

.view-browse .toolbar .sort{
        margin-left:0;
        min-width:0;
      }

.view-browse .toolbar .browse-toolbar-select{
        width:100%;
        min-width:0;
        padding:0 34px 0 14px;
        font-weight:700;
      }
}

.browse-filters-usage{
      display:none;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:10px 4px 10px 2px;
      margin:2px 0 6px;
      border-bottom:1px solid #d9e2f3;
    }

.browse-filters-usage-main{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-width:0;
      padding:2px 6px;
      margin:0;
      border:0;
      background:transparent;
      color:#2563eb;
      cursor:pointer;
      font-weight:700;
      font-size:15px;
      line-height:1;
      font-family:inherit;
      text-align:left;
      appearance:none;
      border-radius:999px;
      box-sizing:border-box;
    }

.browse-filters-usage-main:focus-visible{
      outline:2px solid rgba(37,99,235,.35);
      outline-offset:2px;
    }

.browse-filters-usage-icon{
      width:18px;
      height:18px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#2563eb;
      flex:0 0 18px;
    }

.browse-filters-usage-icon svg{
      width:100%;
      height:100%;
      display:block;
      stroke:currentColor;
      stroke-width:2;
      fill:none;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

.browse-filters-usage-text{
      font-size:15px;
      line-height:1.15;
      white-space:nowrap;
      color:#2563eb;
      font-weight:700;
    }

.browse-filters-usage-clear{
      font-size:15px;
      font-weight:700;
      color:#2563eb;
      padding:2px 4px;
      margin-right:2px;
      flex:0 0 auto;
    }

.browse-filters-usage-clear:focus-visible{
      outline-color:rgba(37,99,235,.35);
    }

.toolbar .browse-toolbar-select{padding:8px 12px;border-radius:10px;border:1px solid var(--b);font-weight:600;}

.view-browse .toolbar .browse-toolbar-select option{background:#fff;color:#0f172a;}

.browse-filters-trigger{display:none;align-items:center;gap:6px;}

.browse-filters-trigger .filters-icon{
      width:20px;
      height:20px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:inherit;
      flex:0 0 20px;
    }

.browse-filters-trigger .filters-icon svg{
      width:100%;
      height:100%;
      display:block;
      stroke:currentColor;
      stroke-width:2;
      fill:none;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

.browse-filters-count{display:none;width:20px;min-width:20px;height:20px;padding:0;border-radius:999px;background:#0b1220;color:#fff;font-size:12px;font-weight:700;line-height:12px;text-align:center;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;}

.browse-grid{margin-top:12px;}

@media(min-width:721px) {
.view-browse .browse-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,186px),1fr));}
}

@media(min-width:1121px) {
.view-browse .browse-content{padding:var(--surface-pad-section);}
}

@media(max-width:1120px) {
.browse-main{grid-template-columns:minmax(0,1fr);}

.browse-content{padding:var(--surface-pad-section);border-radius:14px;}

.browse-filters-usage:not([hidden]){display:flex;}
}

@media (max-width: 1120px) {
.view-browse .toolbar{
      --toolbar-h:46px;
      --toolbar-gap:8px;
      --toolbar-radius:12px;
      --icon-only-w:50px;
      --filter-text-w:132px;
      --share-text-w:132px;
      --sort-min-w:170px;
      display:grid;
      grid-template-columns:auto auto minmax(var(--sort-min-w),1fr);
      align-items:stretch;
      gap:var(--toolbar-gap);
      container-type:inline-size;
    }

.view-browse .browse-summary{
      grid-column:1/-1;
      order:0;
      margin-bottom:2px;
    }

.view-browse .toolbar .browse-toolbar-control,
      .view-browse .toolbar .browse-toolbar-select{
      min-height:var(--toolbar-h);
      height:var(--toolbar-h);
      box-sizing:border-box;
      border-radius:var(--toolbar-radius);
      border:1px solid var(--surface-border);
      background:var(--surface-bg);
      box-shadow:none;
      color:#1f2937;
      font-size:15px;
      font-weight:700;
    }

.view-browse .toolbar .browse-toolbar-control{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      line-height:1;
    }

.browse-filters-trigger{
      display:inline-flex;
      grid-column:1;
      order:1;
      width:auto;
      min-width:var(--filter-text-w);
      padding:0 12px;
      justify-content:center;
      gap:6px;
      white-space:nowrap;
    }

.view-browse .toolbar .browse-filters-trigger .filters-label{
      line-height:1;
      white-space:nowrap;
      font-size:15px;
    }

.view-browse .toolbar .browse-filters-trigger .browse-filters-count{line-height:12px}

.browse-share-btn{
      display:inline-flex;
      grid-column:2;
      order:2;
      width:auto;
      min-width:var(--share-text-w);
      padding:0 12px;
      gap:6px;
      justify-content:center;
    }

.view-browse .toolbar .browse-share-btn .share-icon{
      width:16px;
      height:16px;
      flex:0 0 16px;
      line-height:0;
    }

.view-browse .toolbar .browse-share-btn .share-icon svg{
      width:16px;
      height:16px;
      display:block;
    }

.view-browse .toolbar .browse-share-btn .share-label{
      display:inline-flex;
      align-items:center;
      white-space:nowrap;
      margin-left:0;
      line-height:15px;
      font-size:15px;
    }

.view-browse .toolbar .sort{
      grid-column:3;
      order:3;
      margin-left:0;
      width:min(100%,420px);
      justify-self:start;
    }

.view-browse .toolbar .browse-toolbar-select{
      width:100%;
      min-width:var(--sort-min-w);
      padding:0 34px 0 10px;
      font-size:14px;
    }

@container (max-width: 560px) {
.view-browse .toolbar .browse-share-btn{
        min-width:var(--icon-only-w);
        padding:0;
        gap:0;
      }

.view-browse .toolbar .browse-share-btn .share-label{
        display:none;
      }
}

@container (max-width: 470px) {
.view-browse .toolbar .browse-filters-trigger{
        min-width:var(--icon-only-w);
        padding:0;
        gap:0;
      }

.view-browse .toolbar .browse-filters-trigger .filters-label,
      .view-browse .toolbar .browse-filters-trigger .browse-filters-count{
        display:none !important;
      }
}

@media (max-width: 454px) {
.view-browse .toolbar{
        --toolbar-h:clamp(34px,10.13vw,46px);
        --toolbar-gap:clamp(3px,1.76vw,8px);
        --icon-only-w:clamp(32px,11vw,50px);
        --sort-min-w:0px;
      }

.view-browse .toolbar .browse-filters-trigger,
      .view-browse .toolbar .browse-share-btn{
        width:var(--icon-only-w);
        min-width:var(--icon-only-w);
        padding:0;
        gap:0;
      }

.view-browse .toolbar .browse-filters-trigger .filters-icon svg{
        width:clamp(12px,3.52vw,16px);
        height:clamp(12px,3.52vw,16px);
      }

.view-browse .toolbar .browse-share-btn .share-icon,
      .view-browse .toolbar .browse-share-btn .share-icon svg{
        width:clamp(12px,3.52vw,16px);
        height:clamp(12px,3.52vw,16px);
      }

.view-browse .toolbar .browse-filters-trigger .filters-label,
      .view-browse .toolbar .browse-filters-trigger .browse-filters-count,
      .view-browse .toolbar .browse-share-btn .share-label{
        display:none !important;
      }

.view-browse .toolbar .sort{
        width:100%;
        min-width:0;
      }

.view-browse .toolbar .browse-toolbar-select{
        min-width:0;
        font-size:12px;
        padding:0 clamp(18px,7.49vw,34px) 0 clamp(6px,2.2vw,10px);
      }
}
}

.facet-body label.row{cursor:pointer;}

.facet-body .row{position:relative;}

.facet-body .row::after{
  content:"";
  position:absolute;
  left:0;right:0;
  bottom:calc(-1 * var(--row-gap, 8px));
  height:var(--row-gap, 8px);
  background:transparent;
  pointer-events:auto;
}

#newArrivalsBody .row .label{color:#334155;}

#newArrivalsBody .row .count{color:#7c8aa0;}

#newArrivalsBody .row.is-active{background:#f1f5fb;}

#newArrivalsBody .row.is-active .label{color:#0f172a;font-weight:500;}

#newArrivalsBody .row.is-active .count{color:#4b5f7d;font-weight:600;}

.facet-footer{margin-top:6px;display:flex;justify-content:flex-start;}

@media(max-width:340px) {
.view-browse .browse-content{
    padding:var(--container-pad-default);
  }

.view-browse .browse-filters-usage:not([hidden]){
    display:grid;
    grid-template-columns:minmax(0,1fr);
    justify-content:start;
    align-items:start;
    gap:4px;
    padding:6px 0;
  }

.view-browse .browse-filters-usage-main{
    min-width:0;
    width:100%;
    align-items:flex-start;
    gap:6px;
  }

.view-browse .browse-filters-usage-text{
    min-width:0;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.15;
  }

.view-browse .browse-filters-usage-clear{
    justify-self:start;
    margin-right:0;
    padding:2px 0;
  }

}

.browse-category-search-clear{
  --public-hover-transform:translateY(calc(-50% - 1px));
  --public-press-transform:translateY(-50%);
}

.browse-filters-usage-main,
.browse-filters-usage-clear{
  --public-hover-accent:#2563eb;
  --public-hover-fill:rgba(37,99,235,.10);
  --public-hover-edge:rgba(37,99,235,.24);
  --public-hover-ring:rgba(37,99,235,.18);
  --public-hover-fg:#1d4ed8;
  --public-hover-transform:none;
  --public-press-fill:rgba(37,99,235,.16);
  --public-press-edge:rgba(37,99,235,.32);
  --public-press-ring:rgba(37,99,235,.22);
  --public-press-fg:#1d4ed8;
}

.price-grid #applyPrice{
  --public-hover-accent:#0b1220;
  --public-hover-fill:#1e293b;
  --public-hover-edge:#1e293b;
  --public-hover-ring:rgba(15,23,42,.18);
  --public-hover-fg:#fff;
}

.price-grid #applyPrice{
  --public-press-fill:#101827;
  --public-press-edge:#101827;
  --public-press-ring:rgba(15,23,42,.2);
  --public-press-shadow:inset 0 3px 7px rgba(0,0,0,.22),0 0 0 1px var(--public-press-ring);
  --public-press-fg:#fff;
}
