/* Keep the preference and explanation readable in every bidder theme. */
.market-personal { margin: .7rem 0 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--ink); }
.market-personal summary { min-height: 44px; box-sizing: border-box; padding: .8rem 1rem; font-weight: 750; cursor: pointer; }
.market-personal-body { padding: 0 1rem 1rem; max-width: 60rem; }
.market-personal-body p { line-height: 1.5; margin: .4rem 0 .7rem; }
.market-personal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.market-personal-actions form, .market-personal-reason form { margin: 0; }
.market-personal-actions button, .market-personal-reason button { min-height: 44px; padding: .55rem .7rem; font: inherit; font-weight: 650; border: 1px solid currentColor; border-radius: 8px; color: var(--ink); background: var(--card); cursor: pointer; }
.market-personal-actions a, .market-personal-actions a:visited { color: var(--ink); min-height: 44px; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: .2em; }
.market-personal-small { font-size: .82rem; }
.market-personal-reason { border-left: 3px solid var(--ink); padding-left: .6rem; margin: .5rem 0; color: var(--ink); }
.market-personal-reason p { margin: 0 0 .25rem; font-size: .8rem; line-height: 1.45; }
.market-personal-reason button { font-size: .8rem; }
.market-personal :focus-visible, .market-personal-reason :focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.market-personal button:hover, .market-personal-reason button:hover { text-decoration: underline; }
.market-search-understanding { display: flex; flex-wrap: wrap; gap: .4rem; color: var(--ink); }
.market-search-understanding span { border: 1px solid var(--line); border-radius: 7px; padding: .35rem .55rem; background: var(--card); }

.market-refine { border: 1px solid var(--line); border-radius: 12px; margin: .4rem 0 1rem; background: var(--card); color: var(--ink); }
.market-refine summary { min-height: 44px; box-sizing: border-box; padding: .8rem 1rem; cursor: pointer; font-weight: 750; }
.market-refine-form { padding: 0 1rem 1rem; }
.market-refine-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: .8rem; }
.market-refine label { display: flex; flex-direction: column; gap: .35rem; min-width: 0; font-weight: 650; }
.market-refine input, .market-refine select { min-width: 0; width: 100%; max-width: 100%; min-height: 44px; height: max(44px, 2.75rem); box-sizing: border-box; padding: .5rem; border: 1px solid var(--ink); border-radius: 7px; background: var(--card); color: var(--ink); font: inherit; }
.market-refine p { font-size: .85rem; line-height: 1.5; }
.market-refine-actions { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
.market-refine button, .market-refine a, .market-refine a:visited { display: inline-flex; align-items: center; min-height: 44px; box-sizing: border-box; font: inherit; font-weight: 650; color: var(--ink); background: var(--card); }
.market-refine button { padding: .5rem .8rem; border: 1px solid var(--ink); border-radius: 7px; cursor: pointer; }
.market-refine a { text-decoration: underline; text-underline-offset: .2em; }
.market-refine :focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.market-refine button:hover { text-decoration: underline; }
.market-filter-errors { border-left: 3px solid var(--ink); padding: .6rem; margin-bottom: .8rem; }

/* Each Market surface stays inside the Market, including compact navigation. */
.market-nav { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; padding:.65rem 1rem; border-bottom:1px solid var(--line,#4b5563); background:var(--card,#fff); color:var(--ink,#172b43); position:relative; z-index:20; }
.market-nav a, .market-nav a:visited, .market-nav summary, .market-nav button { color:var(--ink,#172b43); background:var(--card,#fff); min-height:44px; padding:.6rem .7rem; box-sizing:border-box; display:inline-flex; align-items:center; font:inherit; font-weight:700; border:1px solid transparent; border-radius:8px; text-decoration:underline; text-underline-offset:.2em; }
.market-nav .market-nav-brand { font-size:1.05rem; font-weight:850; margin-right:auto; text-decoration:none; }
.market-nav .market-nav-cart, .market-nav .market-nav-cart:visited { background:#17345a; border:2px solid #17345a; color:#fff; min-height:48px; text-decoration:none; }
.market-nav .market-nav-cart:hover, .market-nav .market-nav-cart:focus { background:#0f2745; color:#fff; text-decoration:underline; }
.market-nav-account { position:relative; }
.market-nav-account summary { cursor:pointer; border-color:currentColor; }
.market-nav-account > div { position:absolute; right:0; top:100%; min-width:12rem; background:var(--card,#fff); border:1px solid var(--ink,#172b43); border-radius:8px; padding:.4rem; box-shadow:0 6px 20px #0003; }
.market-nav-account:not([open]) > div { display:none; }
.market-nav-account a, .market-nav-account button { display:flex; width:100%; text-align:left; cursor:pointer; }
.market-nav-account form { margin:0; }
.market-nav a:hover, .market-nav button:hover { text-decoration:underline; border-color:currentColor; }
.market-nav :focus-visible { outline:3px solid currentColor; outline-offset:3px; }
.product-grid > .market-delivery-tile { grid-column:auto; display:flex; flex-direction:column; align-items:stretch; gap:1rem; padding:1rem; border:2px solid var(--ink,#172b43); background:var(--card,#fff); color:var(--ink,#172b43); }
/* Change text and its surface together on a theme switch. An all-property
   transition left dark-theme text on the previous light card for 180ms. */
.product-grid { --market-card-surface:var(--card,#fffdf9); --market-card-ink:var(--ink,#17231f); --market-card-muted:var(--muted,#58665f); }
.product-grid > .product-card { background:var(--market-card-surface); color:var(--market-card-ink); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.product-grid > .product-card .maker { color:var(--market-card-muted); }
.market-delivery-tile .delivery-strip-fields button,
.market-delivery-tile .delivery-strip-fields button:hover,
.market-delivery-tile .delivery-strip-fields button:focus { background:#17345a; border-color:#17345a; color:#fff; }
.market-delivery-tile .delivery-strip-fields button:hover { text-decoration:underline; }
.market-delivery-tile .delivery-strip-intro, .market-delivery-tile .delivery-strip-fields { display:flex; flex-wrap:wrap; gap:.65rem; min-width:0; }
.market-delivery-tile .delivery-strip-intro > div, .market-delivery-tile input, .market-delivery-tile button { min-width:0; max-width:100%; box-sizing:border-box; }
.market-delivery-tile .delivery-strip-mark { flex-basis:100%; }
.market-delivery-tile .delivery-strip-check { min-width:0; margin-top:auto; width:100%; border-left:0; border-top:1px solid var(--ink); padding:.8rem 0 0; }
.market-delivery-tile .delivery-strip-fields input { flex:1 1 6rem; }
.market-delivery-tile .delivery-strip-fields button { flex:1 1 7rem; }
.market-availability-status:empty { display:none; }
.market-availability-status { grid-column:1 / -1; color:var(--ink,#172b43); }
.market-item-shell { max-width:72rem; margin:auto; padding:1rem; color:var(--ink,#172b43); }
.market-back { display:inline-flex; align-items:center; min-height:44px; color:inherit; }
.market-item-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(17rem,1fr); gap:1.5rem; }
.market-item-photos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; gap:.7rem; }
.market-item-photos img { width:100%; height:auto; max-height:38rem; object-fit:contain; background:var(--card,#fff); }
.market-item-photos img:first-child { grid-column:1 / -1; }
.market-item-purchase { min-width:0; }
.market-detail-price { font-size:2rem; font-weight:850; margin:.5rem 0; color:var(--ink,#172b43); }
.market-premium { display:inline-flex; align-items:center; width:fit-content; border:1px solid currentColor; border-radius:6px; padding:.3rem .5rem; color:var(--ink,#172b43); font-weight:750; }
.market-item-purchase summary { min-height:44px; padding:.5rem 0; cursor:pointer; font-weight:750; }
.market-item-description, .market-terms { line-height:1.55; overflow-wrap:anywhere; }
.market-item-description a, .market-item-purchase a { color:var(--ink,#172b43); text-decoration:underline; }
.market-item-shell :focus-visible { outline:3px solid var(--ink,#172b43); outline-offset:3px; }
@media(max-width:640px) { .market-item-layout { grid-template-columns:minmax(0,1fr); } .market-nav { padding:.5rem; } .market-nav .market-nav-brand { flex-basis:100%; } }

.market-item-shell h2 { color:var(--ink,#172b43); font-size:1.15rem; letter-spacing:normal; text-transform:none; }
.market-delivery-footer { margin-top:2rem; padding:1.5rem 0; border-top:2px solid var(--ink); background:var(--card); color:var(--ink); }
.market-delivery-footer nav { display:flex; flex-wrap:wrap; gap:.75rem; }
.market-delivery-footer a, .market-delivery-footer a:visited, .market-delivery-footer a:hover { display:inline-flex; align-items:center; min-height:44px; color:var(--ink); text-decoration:underline; text-underline-offset:.2em; }
.market-delivery-footer :focus { outline:3px solid var(--ink); outline-offset:3px; }
/* Phones: one row under 80px. The brand and "Shop the Market" are the same
   destination (one control per job); the page heading names the store. */
@media (max-width: 480px) {
  .market-nav { gap:.25rem; padding:.35rem .5rem; }
  .market-nav .market-nav-brand { display:none; }
  .market-nav a, .market-nav a:visited, .market-nav summary { padding:.5rem .55rem; }
  .market-nav .market-nav-long { display:none; }
  .market-nav-account { margin-left:auto; }
}