@import url('./market.css');

.eyebrow,
.feature-kicker,
.piece-category {
  font-size: .68rem;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.eyebrow { display: block; color: var(--muted); }

.showroom-feature {
  display: grid;
  grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: clamp(16px, 2.3vw, 34px);
  border-radius: 22px;
  background: #202026;
  color: #faf9f7;
}
.feature-image { grid-area: 1 / 2; position: relative; }
.feature-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 56% 29%;
}
.feature-copy {
  grid-area: 1 / 1;
  position: relative;
  padding: clamp(26px, 3vw, 45px) clamp(24px, 3.5vw, 56px);
}
.feature-kicker { display: flex; align-items: center; gap: 10px; color: #d2d0d4; }
.feature-kicker::before { content: ''; width: 24px; height: 1px; background: currentColor; }
.feature-copy h1 {
  margin: 18px 0 10px;
  font-size: clamp(2.75rem, 4.3vw, 4.2rem);
  font-weight: 500;
  letter-spacing: -.065em;
  line-height: .99;
}
.feature-copy h1 em {
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: -.045em;
}
.feature-copy p { color: #dfdde0; font-size: .9rem; line-height: 1.55; }
.feature-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 44px;
  margin-top: 20px;
  padding: 0 16px;
  border: 1px solid #64636b;
  border-radius: 999px;
  background: #34343b;
  color: white;
  font-size: .82rem;
  font-weight: 580;
}
.feature-link span { font-size: 1.05rem; }
.feature-link:hover { background: #45454e; }
.feature-live-count { display:inline-flex; align-items:center; gap:6px; margin-inline-start:8px; font-size:.76rem; font-weight:600; white-space:nowrap; }
.feature-live-count::before { content:""; width:7px; height:7px; border-radius:50%; background:#fc869d; }
.feature-live-count.external::before { background:currentColor; opacity:.65; }

.collection { padding: clamp(28px, 3.4vw, 49px) 0 clamp(38px, 5vw, 74px); }
.browse-menu { display:inline-flex; gap:2px; padding:3px; margin-bottom:13px; border:1px solid var(--line); border-radius:999px; background:var(--soft); }
.browse-menu a { display:grid; place-items:center; min-width:70px; min-height:36px; padding:0 12px; border-radius:999px; color:var(--muted); font-size:.81rem; font-weight:600; }
.browse-menu a[aria-current] { background:var(--ink); color:var(--card); }
.store-collection { margin-inline:auto; }
.store-collection .collection-title h1 { font-size:clamp(1.5rem,2.3vw,2.1rem); font-weight:800; line-height:1.3; letter-spacing:-.04em; overflow-wrap:anywhere; }
.store-collection .shop-search { min-width:140px; }
.store-kicker { margin:8px 0; color:var(--muted); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; }
.store-intro { margin:6px 0 0; color:var(--muted); font-size:.8rem; line-height:1.5; }
.store-total { margin:22px 0 13px; font-size:.76rem; color:var(--muted); }
.store-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.store-card { display:flex; align-items:center; min-width:0; gap:11px; min-height:78px; padding:10px 8px 14px 0; background:var(--card); }
.store-card:hover strong { text-decoration:underline; text-underline-offset:3px; }
.store-cover { flex:0 0 66px; height:77px; border-radius:9px; font-size:.75rem; letter-spacing:.1em; }
.store-label { flex:1; min-width:0; }
.store-label strong { display:block; overflow-wrap:anywhere; font-size:.88rem; font-weight:700; }
.store-label small { display:block; margin-top:4px; color:var(--muted); font-size:.72rem; }
.store-card > span:last-child { color:var(--muted); padding-right:4px; }
.store-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.store-preview > a { display:grid; min-width:0; align-content:start; gap:4px; }
.store-preview .media { position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:7px; }
.store-preview .media img { width:100%; height:100%; object-fit:cover; }
.store-preview .sample-badge { position:absolute; left:4px; bottom:4px; padding:2px 4px; font-size:.52rem; }
.store-preview strong { font-size:.78rem; letter-spacing:-.02em; }
.store-preview small { color:var(--muted); font-size:.65rem; }
.collection-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.collection-title,
.collection-controls,
.category-tabs,
.inventory-tools,
.stock-filter,
.piece-details,
.piece-details small,
.option-list,
.qty-line,
.purchase-bar,
.crumb,
.bag-row,
.auth-switch { display: flex; align-items: center; }
.collection-title,
.collection-controls { justify-content: space-between; gap: 18px; }
.collection-title h2 {
  font-size: clamp(1.95rem, 3.05vw, 3.05rem);
  font-weight: 570;
  letter-spacing: -.072em;
  line-height: 1.08;
}
.shop-search {
  flex: 0 1 240px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--h2-mist);
  padding: 0 12px;
  color: var(--muted);
}
.shop-search input { max-width: none; min-height: 42px; padding: 6px 0; }
.shop-search:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.shop-search input:focus-visible { outline: none; }
.collection-controls { flex-wrap:wrap; border-bottom: 1px solid #ececee; margin-top:17px; }
.category-tabs {
  flex: 1;
  gap:7px;
  flex-wrap:nowrap;
  overflow-x:auto;
  scrollbar-width:none;
  padding:3px 0 13px;
  min-width: 0;
}
.category-tab {
  position: relative;
  flex: 0 0 auto;
  min-height: 36px;
  border:1px solid #e9e8eb;
  border-radius:9px;
  background: white;
  color: var(--muted);
  font-size: .78rem;
  padding: 0 12px;
}
.category-tab[aria-pressed="true"] { color:#fff; font-weight:700; background:var(--h2-blue); border-color:var(--h2-blue); }
.category-tab[aria-pressed="true"]::after {
  content:none;
}
.category-tab:hover:not([aria-pressed="true"]) { color:var(--ink); border-color:#b9b7bf; }
.inventory-tools { flex-shrink: 0; gap: 16px; color: var(--muted); font-size: .78rem; }
.stock-filter { position: relative; min-height: 44px; gap: 6px; white-space: nowrap; cursor: pointer; }
.stock-filter input {
  appearance: none;
  position: relative;
  margin: 0;
  width: 28px;
  height: 17px;
  border: 1px solid #a4a4ad;
  border-radius: 18px;
  background: #c4c4cb;
  cursor: pointer;
}
.stock-filter input::before {
  content: '';
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 1px 2px #0003;
}
.stock-filter input:checked { background: var(--accent); border-color: var(--accent); }
.stock-filter input:checked::before { transform: translateX(11px); }
.inventory-tools select {
  min-height: 44px;
  padding: 4px;
  border: none;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}
.catalog-total { margin: 12px 0; color: var(--muted); font-size: .76rem; font-variant-numeric: tabular-nums; }
#product-results > .empty { margin: 16px 0 12px; }
.pieces { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px clamp(12px, 1.5vw, 22px); }
.piece-card { display: flex; flex-direction: column; min-width: 0; border-radius: 15px; }
.piece-card .media { aspect-ratio: 3/4; border-radius: 15px; background: var(--soft); }
.piece-card .media img { object-position: center; }
.piece-card .media .flag { background: #232328ed; color: white; border-radius: 7px; padding: 4px 10px; }
.piece-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex: 1;
  gap: 4px 8px;
  padding: 0 2px 9px;
}
.piece-details { justify-content: space-between; flex-wrap: wrap; gap: 4px 8px; padding: 8px 2px 0; }
.piece-category { color: var(--muted); font-size: .62rem; }
.piece-source { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 7px; min-width:0; }
.piece-store { font-size:.74rem; font-weight:600; overflow-wrap:anywhere; }
.piece-meta strong {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.47;
  overflow-wrap: anywhere;
}
.piece-price { white-space: nowrap; font-size: .9rem; font-weight: 580; letter-spacing: -.018em; font-variant-numeric: tabular-nums; }
.piece-details small { gap: 4px; color: var(--muted); font-size: .72rem; }
.color-mark { display: inline-block; flex-shrink: 0; width: 11px; height: 11px; border: 1px solid #0003; border-radius: 50%; }
@media (hover: hover) {
  .piece-card:hover .piece-meta strong { text-decoration: underline; text-underline-offset: 4px; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .piece-card img { transition: transform .32s ease-out; }
  .piece-card:hover img { transform: scale(1.025); }
}

.crumb { gap: 10px; margin: 22px 0; font-size: .78rem; color: var(--muted); }
.crumb a { padding-block: 4px; color: var(--ink); }
.crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.product-page {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  gap: clamp(24px, 5vw, 72px);
  max-width: 1160px;
  margin: auto;
  padding-bottom: 44px;
  align-items: start;
}
.product-gallery > .media { aspect-ratio: 3/4; border-radius: 19px; background: var(--soft); }
.product-gallery img { object-position: center; }
.product-gallery { min-width:0; }
.gallery-strip { display:flex; align-items:center; gap:12px; margin-top:9px; }
.gallery-thumbs { display:flex; align-items:center; gap:7px; overflow-x:auto; min-width:0; padding:3px; }
.gallery-thumb { flex:0 0 47px; height:58px; border:0; border-radius:7px; padding:0; }
.gallery-thumb[aria-pressed="true"] { outline:2px solid var(--ink); outline-offset:1px; }
.gallery-thumb:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.gallery-count { flex-shrink:0; margin-left:auto; font-size:.76rem; font-variant-numeric:tabular-nums; color:var(--muted); }
.product-byline { display:flex; align-items:center; gap:8px 14px; flex-wrap:wrap; }
.product-store { padding:6px 0; color:var(--ink); font-size:.82rem; font-weight:600; overflow-wrap:anywhere; }
.product-store:hover { text-decoration:underline; }
.product-copy { min-width: 0; padding: 12px 0; }
.customer-page h1, .auth-page h1, .product-copy h1 {
  font-size: clamp(1.7rem, 3vw, 2.85rem);
  line-height: 1.19;
  letter-spacing: -.064em;
}
.product-copy h1 { font-weight: 650; margin: 8px 0 10px; }
.detail-price { font-size: clamp(1.32rem, 2vw, 1.72rem); font-weight: 630; letter-spacing: -.04em; }
.product-description { margin: 14px 0 22px; color: var(--muted); font-size: .92rem; white-space: pre-line; }
#buy-options { padding-top: 21px; border-top: 1px solid var(--line); }
.option-group { margin-bottom: 17px; }
.option-group strong, .qty-line label { font-weight: 620; font-size: .88rem; }
.option-list { flex-wrap: wrap; gap: 7px; margin-top: 7px; }
.swatch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 15px;
  min-width: 49px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  font-size: .86rem;
}
.swatch[aria-pressed=true] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.swatch:disabled { text-decoration: line-through; }
.qty-line { flex-wrap: wrap; gap: 12px; margin: 12px 0 22px; }
.qty-line .qty-group { align-items: stretch; gap: 0; padding: 2px; border-radius: 13px; background: var(--soft); }
.qty-line .qty-group button,
.qty-line #buy-qty { border: 0; border-radius: 11px; min-height: 40px; background: transparent; }
.qty-line .qty-group button { width: 40px; font-size: 1.05rem; }
.qty-line .qty-group button:hover:not(:disabled) { background: var(--card); }
.qty-line #buy-qty { width: 34px; padding: 2px; text-align: center; appearance: textfield; }
.qty-line #buy-qty::-webkit-inner-spin-button { appearance: none; }
.purchase-bar { gap: 9px; }
.purchase-bar .btn { flex: 1; min-height: 49px; border-radius: 15px; }
.pdp-notes { margin-top: 22px; }
.pdp-notes details { padding: 15px 0; border-top: 1px solid var(--line); }
.pdp-notes summary, .demo-gate summary { cursor: pointer; font-weight: 630; font-size: .91rem; }
.pdp-notes details p, .pdp-notes dl { color: var(--muted); font-size: .87rem; margin-top: 9px; }

.customer-page{padding:20px 0 42px;margin:auto;max-width:1080px}.customer-page h1{margin:8px 0 24px}.customer-page h1 i{font:550 1rem/1 ui-monospace,monospace;color:var(--green);vertical-align:middle}
.basket-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:start;gap:clamp(20px,5vw,64px)}
.bag-row{align-items:flex-start;padding:16px 0;gap:16px;border-top:1px solid var(--rule)}.bag-thumb{width:78px;aspect-ratio:4/5;flex-shrink:0}
.bag-info{flex:1;min-width:0}.bag-info small,.checkout-item small{display:block;color:var(--muted);font-size:.8rem;margin:4px 0 8px}.bag-cost{text-align:right}.bag-cost button{display:block;margin-left:auto}
.basket-summary,.checkout-main{background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:clamp(18px,2.6vw,30px)}
.basket-summary{position:sticky;top:88px}.basket-summary h2,.checkout-main h2{font-size:1.16rem;letter-spacing:-.04em;margin-bottom:10px}.basket-summary dl{font-size:.92rem;margin:10px 0}.basket-summary .block{margin-top:15px}.checkout-main .form-grid{margin-top:20px}
.checkout-item{padding:10px 0;border-bottom:1px solid var(--rule)}.checkout-item strong{font-size:.91rem}.checkout-item span{font-size:.84rem}
.auth-page{max-width:430px;margin:36px auto 50px;background:var(--card);border:1px solid var(--rule);padding:clamp(18px,3vw,36px);border-radius:16px}.auth-page>p,.auth-page>.form-grid{margin-top:16px}.auth-page .form-grid .fine{margin:2px 0 6px}.auth-switch{justify-content:center;flex-wrap:wrap;gap:5px;margin-top:14px;font-size:.83rem}
.operator-owner-access { margin-top:18px; }
.operator-access form + .operator-owner-access { border-top:1px solid var(--rule); padding-top:16px; }
.operator-owner-access .fine { margin-bottom:8px; }
.demo-gate{margin-top:22px;padding-top:14px;border-top:1px solid var(--rule)}.demo-gate p{margin:8px 0}
.center-note{text-align:center;margin:-24px 0 22px;font-size:.85rem}.center-note a{text-decoration:underline}

@media (max-width: 860px) {
  .feature-copy h1 { font-size: 2.9rem; }
  .category-tabs { gap: 14px; }
  .basket-layout { gap: 16px; }
  .pieces { gap: 23px 12px; }
  .piece-meta { flex-direction: column; justify-content: flex-start; gap: 2px; }
}
@media (max-width: 660px) {
  .showroom-feature { display: block; margin-top: 13px; border-radius: 17px; }
  .feature-image { position: absolute; inset: 0; z-index: -1; }
  .feature-image img { object-position: 55% 31%; }
  .feature-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #16161be8 2%, #19191ed9 38%, #19191e6b 66%, #17171b14 100%);
  }
  .feature-copy { padding: 20px; }
  .feature-kicker { font-size: .6rem; }
  .feature-copy h1 { font-size: clamp(2.35rem, 8.6vw, 3.2rem); margin: 12px 0 8px; }
  .feature-copy p { font-size: .79rem; color: #f4f2f2; word-break: keep-all; }
  .feature-link { min-height: 44px; margin-top: 12px; padding: 0 12px; gap: 13px; font-size: .75rem; }
  .collection { padding: 26px 0 36px; }
  .collection-title { align-items: stretch; flex-direction: column; gap: 12px; }
  .collection-title h2 { font-size: 2rem; }
  .shop-search { flex: auto; width: 100%; }
  .shop-search input, .qty-line #buy-qty { font-size: 16px; }
  .collection-controls { flex-direction: column; align-items: stretch; margin-top: 2px; gap: 0; border: none; }
  .category-tabs { flex-wrap: wrap; gap: 0 12px; border-bottom: 1px solid var(--line); }
  .category-tab { min-width:44px; font-size: .82rem; }
  .category-tab[aria-pressed="true"]::after { bottom: 0; }
  .category-tab:focus-visible { outline-offset: -3px; }
  .inventory-tools { position: relative; z-index: 1; align-self: flex-end; gap: 9px; }
  .catalog-total { display: flex; align-items: center; min-height: 44px; margin: -44px 0 3px; width: fit-content; max-width: 24%; }
  #product-results > .empty { margin-top: 3px; }
  .pieces { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; }
  .piece-card .media { border-radius: 12px; }
  .piece-meta { padding: 0 1px 7px; }
  .piece-meta strong { font-size: .89rem; }
  .piece-price { font-size: .89rem; }
  .piece-category { font-size: .59rem; }
  .crumb { margin: 3px 0; }
  .crumb a { display:inline-flex; align-items:center; min-height:44px; }
  .qty-line .qty-group button,.qty-line #buy-qty,.bag-row .qty-group button { width:44px; min-height:44px; }
  .auth-switch .link-button,.bag-cost .link-button { min-width:44px; min-height:44px; }
  .product-page { display: block; padding-bottom: 16px; }
  .product-gallery > .media { aspect-ratio: auto; height: clamp(260px, 45vh, 450px); border-radius: 16px; }
  .product-gallery > .media img { object-fit: contain; }
  .product-copy { padding: 20px 1px 12px; }
  .product-description { margin: 10px 0 15px; }
  .purchase-bar {
    position: fixed;
    inset: auto 0 0;
    z-index: 3;
    padding: 9px max(14px, env(safe-area-inset-right)) max(9px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
    border-top: 1px solid var(--line);
    background: rgb(255 255 255 / .96);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
  body[data-screen="product"] { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .basket-layout { grid-template-columns: minmax(0, 1fr); }
  .basket-summary { position: static; }
  .customer-page { padding: 12px 0 24px; }
  .customer-page h1 { margin-bottom: 15px; }
  .bag-row { gap: 9px; }
  .bag-thumb { width: 58px; }
  .bag-info strong, .bag-cost { font-size: .87rem; }
  .auth-page { margin: 24px auto 42px; }
  .auth-page .field input, .checkout-main .field input { font-size: 16px; }
}
@media (min-width: 375px) and (max-width: 660px) {
  .collection-title { flex-direction: row; align-items: center; }
  .collection-title h2 { white-space: nowrap; font-size: clamp(1.7rem, 7vw, 2rem); }
  .shop-search { flex: 0 1 46%; min-width: 0; gap: 5px; padding: 0 8px; }
  .shop-search svg { flex-shrink: 0; }
}
@media (forced-colors: active) {
  .stock-filter input { appearance: auto; }
  .stock-filter input::before { display: none; }
  .category-tab[aria-pressed="true"] { text-decoration: underline; }
}

/* Compact shopping controls share one rhythm across catalog and store views. */
.market-page .collection-controls { align-items:flex-start; gap:0 18px; }
.market-page .category-tabs { flex-basis:100%; }
.market-page .inventory-tools { margin-left:auto; }
.market-page .catalog-total { display:flex; align-items:center; min-height:44px; margin:-44px 0 8px; width:fit-content; max-width:30%; }
.market-page .collection-controls .stock-filter { font-size:.75rem; }
.market-page .collection-controls select { font-size:.75rem; }
.store-grid .store-listing { border-bottom:1px solid var(--h2-silver); padding-bottom:20px; }
@media (max-width:1000px) { .store-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:660px) {
  .market-page .collection-title { flex-direction:row; align-items:center; }
  .store-collection:not(.market-list) .collection-title { flex-direction:column; align-items:stretch; gap:15px; }
  .store-collection .collection-title h1 { font-size:1.5rem; }
  .market-page .shop-search { flex:auto; min-width:0; padding-inline:12px; }
  .market-page .shop-search input { min-height:42px; }
  .market-page .collection-controls { margin-top:14px; gap:0; border-bottom:1px solid #ececee; }
  .market-page .category-tabs { flex-wrap:nowrap; gap:7px; width:100%; border:0; padding-bottom:7px; }
  .market-page .category-tab { min-width:44px; min-height:36px; font-size:.75rem; }
  .market-page .inventory-tools { align-self:flex-end; }
  .market-page .catalog-total { max-width:25%; margin-bottom:10px; }
  .store-grid { grid-template-columns:minmax(0,1fr); gap:8px; }
  .store-preview { gap:8px; }
  .store-preview strong { font-size:.8rem; }
  .store-preview .sample-badge { font-size:.56rem; }
  .store-label strong { font-size:.87rem; }
  .store-intro { font-size:.77rem; }
  .store-total { margin-top:18px; }
}

.work-tabs { display:flex; flex-wrap:wrap; gap:7px; margin:23px auto 0; max-width:960px; padding-bottom:12px; border-bottom:1px solid var(--rule); }
.work-tabs a { font-size:.84rem; padding:9px 15px; color:var(--muted); border-radius:4px; }
.work-tabs a[aria-current] { background:var(--dark); color:white; font-weight:650; }
.work-tabs + .page { padding-top:20px; }
.pdp-fields summary,.delivery-detail summary { cursor:pointer; font-size:.86rem; font-weight:650; }
.pdp-fields .form-grid { margin-top:12px; }
.delivery-detail { padding:10px 0; font-size:.85rem; color:var(--muted); }
body[data-screen=wholesale] .bag-button,body[data-screen=admin] .bag-button { display:none; }
.shipments { padding-top:16px; border-top:1px solid var(--rule); margin-top:10px; }
.shipments h2 { font-size:1.08rem; }
.shipment-group { padding:12px 0; }
.shipment-group + .shipment-group { border-top:1px solid var(--rule); }
.shipment-group h3 { font-size:.9rem; }
.shipment-group ul { margin:7px 0; padding-left:20px; font-size:.86rem; }
.shipment-group dl { font-size:.84rem; }
