/* WineHub · bulk wine (Vin vrac), wh-bulk.php. The catalogue and the lot page use the theme's tokens and parts
   (wh-panel, wh-side filters, wh-spec, wh-pill); the lots are calm spec-sheet cards; the red is only on "Send the
   request". The last block is the admin page (winery and operator), on top of wh-winery's admin skin. */

.whb [hidden] { display: none !important; }

/* ---- catalogue: intro, three steps, the example note ---- */
.whb-head { padding-bottom: 12px; }
.whb-intro { max-width: 50rem; color: var(--ink-2); font-size: 1rem; line-height: 1.55; }
.whb-steps { list-style: none; counter-reset: whb; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
@media (min-width: 900px) { .whb-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); } }
.whb-steps li { counter-increment: whb; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 2px 12px; align-items: start; padding: 14px 16px; background: #fff; border-radius: var(--r-card); box-shadow: var(--shadow-1); }
.whb-steps li::before { content: counter(whb); grid-row: span 2; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--soft); color: var(--ink); font: 700 .875rem/1 var(--font-head); }
.whb-steps b { font: 600 .9375rem/1.35 var(--font-text); color: var(--ink); }
.whb-steps span { color: var(--muted); font-size: .875rem; line-height: 1.45; }
.whb-note { padding: 12px 16px; border-radius: var(--r-ctl); background: #FEF8E1; color: #4A3B0A; font-size: .875rem; line-height: 1.5; }
.whb-note--page { margin: 0 0 16px; }
.whb-note b { font-weight: 700; }

/* ---- lot cards ---- */
.whb-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.whb-card { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 18px 18px 6px; background: #fff; border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--shadow-1); transition: border-color 160ms var(--ease); }
.whb-card:hover { border-color: var(--line-2); }
.whb-card:has(.whb-card__title a:focus-visible) { outline: 2px solid var(--ink); outline-offset: 2px; }
.whb-card__title { font: 700 1.125rem/1.3 var(--font-head); letter-spacing: -.01em; }
.whb-card__title a { color: var(--ink); text-decoration: none; }
.whb-card__title a:focus-visible { outline: none; }
.whb-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.whb-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0; color: var(--muted); font-size: .8125rem; line-height: 1.4; }
.whb-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--c, #7A1F3D); box-shadow: inset 0 0 0 1px rgb(24 24 27 / .18); }
.whb-dot--white { --c: #E7D88E; }
.whb-dot--rose { --c: #E9A1B0; }
.whb-dot--sparkling { --c: #F2E9BE; }
.whb-dot--divin { --c: #94561F; }
.whb-kicker .wh-chip { vertical-align: baseline; }
.whb-card__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 -4px; }
.whb-status { display: inline-flex; align-items: center; min-height: 20px; padding: 0 8px; border-radius: 999px; font: 700 .6875rem/1 var(--font-text); letter-spacing: .02em; }
.whb-status--reserved { background: #FEF3C7; color: #78350F; }
.whb-status--sold { background: #EDEDEF; color: var(--ink-2); }
.whb-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; padding-top: 12px; border-top: 1px solid var(--line); }
.whb-facts dt { color: var(--muted); font-size: .75rem; line-height: 1.3; }
.whb-facts dd { margin: 2px 0 0; color: var(--ink); font: 600 .9375rem/1.3 var(--font-text); font-variant-numeric: tabular-nums; }
.whb-card__by { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 10px; margin-top: auto; border-top: 1px solid var(--line); font-size: .875rem; color: var(--muted); }
.whb-card__by a { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font-weight: 600; text-decoration: none; }
.whb-card__by a:hover { text-decoration: underline; }
.whb-empty { padding: 24px; background: #fff; border-radius: var(--r-card); box-shadow: var(--shadow-1); color: var(--ink-2); }
.whb-sell { margin-top: 20px; color: var(--muted); font-size: .875rem; }

/* ---- lot page ---- */
.whb-lot { display: grid; gap: var(--gap); align-items: start; }
@media (min-width: 1000px) { .whb-lot { grid-template-columns: minmax(0, 1fr) 400px; } }
.whb-lot__side { display: grid; gap: var(--gap); }
.whb-lot__main { padding: clamp(20px, 2.4vw, 32px); }
.whb-lot__main h1 { margin: 10px 0 4px; }
.whb-from { color: var(--ink-2); }
.whb-key { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 18px 0 0; border: 1px solid var(--line); border-radius: var(--r-ctl); }
.whb-key > div { padding: 12px 16px; }
.whb-key > div + div { border-left: 1px solid var(--line); }
.whb-key dt { color: var(--muted); font-size: .8125rem; }
.whb-key dd { margin: 2px 0 0; font: 700 1.125rem/1.25 var(--font-head); font-variant-numeric: tabular-nums; }
@media (max-width: 559.98px) { .whb-key { grid-template-columns: 1fr; } .whb-key > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; } .whb-key > div + div { border-left: 0; border-top: 1px solid var(--line); } .whb-key dd { margin: 0; text-align: right; } }
.whb-jump { margin-top: 14px; }
.whb-jump .wh-pill { width: 100%; }
@media (min-width: 1000px) { .whb-jump { display: none; } }
.whb-h { margin-top: 28px; font-size: 1.125rem; }
.whb-spec { margin-top: 10px; }
.whb-terms-note { margin-top: 14px; color: var(--muted); font-size: .8125rem; }
.whb-lot__main .whb-note { margin-top: 14px; }

.whb-winery { display: flex; gap: 16px; align-items: flex-start; }
.whb-winery .wh-logotile { flex: none; width: 104px; height: 64px; padding: 6px 8px; border: 1px solid var(--line); box-shadow: none; }
.whb-winery .wh-logotile--mono { font-size: 1.125rem; }
.whb-winery__body { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.whb-winery h2 { font-size: 1.125rem; }
.whb-winery .wh-pill { margin-top: 6px; }
.whb-label { color: var(--muted); font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }

/* ---- request for an offer ---- */
.whb-rfq { scroll-margin-top: 16px; }
.whb-rfq:focus { outline: none; }
.whb-rfq h2 { font-size: 1.25rem; }
.whb-rfq__lead { margin-top: 6px; color: var(--ink-2); font-size: .9375rem; }
.whb-rfq > .whb-note { margin-top: 12px; }
.whb-errors { margin-top: 12px; padding: 12px 16px; border-radius: var(--r-ctl); background: #FDECEC; color: #7F1D1D; font-weight: 600; font-size: .9375rem; }
.whb-form { display: grid; gap: 12px; margin-top: 16px; }
.whb-field { display: grid; gap: 6px; margin: 0; }
.whb-field label { font: 600 .875rem/1.3 var(--font-text); color: var(--ink); }
.whb-field input, .whb-field select, .whb-field textarea { width: 100%; min-height: 46px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: var(--r-ctl); background: #fff; color: var(--ink); font: inherit; font-size: 1rem; }
.whb-field textarea { min-height: 104px; padding: 10px 14px; resize: vertical; line-height: 1.5; }
.whb-field select { appearance: none; padding-right: 40px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%233F3F46' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 12px center / 18px no-repeat; }
.whb-field :is(input, select, textarea):focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgb(24 24 27 / .12); }
.whb-field [aria-invalid="true"], .whb-consent [aria-invalid="true"] { border-color: #B42318; box-shadow: 0 0 0 1px #B42318; }
.whb-err { color: #B42318; font-size: .8125rem; font-weight: 600; }
.whb-hint { margin: 0; color: var(--muted); font-size: .8125rem; line-height: 1.45; }
.whb-pair { display: grid; gap: 12px; }
.whb-consent { margin: 0; display: grid; gap: 4px; color: var(--muted); font-size: .8125rem; line-height: 1.5; }
.whb-consent label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.whb-consent input { flex: none; width: 20px; height: 20px; margin: 0; }
.whb-consent a { color: var(--ink); }
.whb-send { width: 100%; }
.whb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.whb-thanks { display: grid; gap: 8px; padding: 4px 0; }
.whb-thanks h2 { color: #14532D; }

/* ---- admin (wh-winery's skin: whw-card, whw-fields, whw-table) ---- */
.whb-admin .whw-fields__wide { grid-column: 1 / -1; }
.whb-admin .whb-sets { display: grid; gap: 8px 28px; margin: 6px 0 16px; }
@media (min-width: 900px) { .whb-admin .whb-sets { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.whb-admin .whb-sets fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.whb-admin .whb-lab { margin: 0 0 18px; }
.whb-admin .whb-lab .description { display: block; margin-top: 4px; }
.whb-admin .whb-lab > a { display: inline-block; margin: 0 12px 6px 0; }
.whb-admin [aria-invalid="true"] { border-color: #B42318 !important; box-shadow: 0 0 0 1px #B42318 !important; }
.whb-admin tr.whb-new > th .whw-strong { font-weight: 700; }
.whb-admin .whw-navtabs { margin-bottom: 14px; }