/* ═══════════════════════════════════════════════════════════════
   Burke Williams — Collections Page  |  Figma node: 1971:118982
   ═══════════════════════════════════════════════════════════════ */

/* Filter bar [1920×81] fill:#fffdf8 */
.bw-col-filter-bar { background: #fffdf8; border-bottom: 1px solid #ece8dd; padding: 0 120px; height: 81px; display: flex; align-items: center; }
.bw-col-filter-inner { display: flex; align-items: center; gap: 16px; }
.bw-col-filter-btn {
  display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px;
  border: 1px solid #000; border-radius: 44px; background: #fff;
  font-family: var(--font-body); font-size: 16px; font-weight: 500; line-height: 20px; letter-spacing: -0.1px; color: #2b3d39;
  cursor: pointer; transition: background 0.2s;
}
.bw-col-filter-btn:hover { background: #f6f3ec; }
.bw-col-filter-count { font-family: var(--font-body); font-size: 14px; color: #676767; }

/* Tab strip [1920×80] fill:#fffdf8 */
.bw-col-tabs-wrap {
  background: #fffdf8; border-bottom: 1px solid #ece8dd; padding: 0 120px; height: 80px;
  display: flex; align-items: center; position: sticky; top: 60px; z-index: 90;
}
.bw-col-tabs { display: flex; gap: 5px; overflow-x: auto; scrollbar-width: none; align-items: center; }
.bw-col-tabs::-webkit-scrollbar { display: none; }
.bw-col-tab {
  white-space: nowrap; flex-shrink: 0; padding: 8px 20px; border-radius: 500px;
  border: 1px solid transparent; background: transparent;
  font-family: var(--font-body); font-size: 15px; font-weight: 500; color: #676767;
  cursor: pointer; transition: background 0.2s, color 0.2s;
}
.bw-col-tab:hover { color: #335d88; border-color: #ece8dd; }
.bw-col-tab--active { background: #ece8dd; color: #335d88; font-weight: 600; }

/* Product grid section — fill:#ece8dd */
.bw-col-page { background: #ece8dd; }
.bw-col-grid-section { padding: 48px 120px 100px; }
.bw-col-grid-container { max-width: 1680px; margin-inline: auto; }
.bw-col-panel { display: none; }
.bw-col-panel--active { display: block; }
.bw-col-grid {
  display: grid;
  grid-template-columns: repeat(3, 382px);
  gap: 24px;
  justify-content: start;
}

/* Collections Card [382×447] fill:#fffdf8 radius:8px */
.bw-col-card {
  background: #fffdf8; border-radius: 8px; overflow: hidden;
  display: flex; flex-direction: column; gap: 16px; padding: 24px;
}
.bw-col-card-img-wrap { position: relative; width: 334px; height: 217px; border-radius: 10px; overflow: hidden; }
.bw-col-card-img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Badge pill [97×32] fill:#fffdf8 radius:10px */
.bw-col-card-badge {
  position: absolute; top: 10px; left: 10px;
  background: #fffdf8; border-radius: 10px; padding: 5px 10px;
  font-family: var(--font-body); font-size: 14px; font-weight: 500; color: #335d88;
}
/* Card body */
.bw-col-card-body { display: flex; flex-direction: column; gap: 15px; }
.bw-col-card-meta { display: flex; flex-direction: column; gap: 4px; }
.bw-col-card-stars { display: flex; align-items: center; gap: 2px; }
.bw-col-star { color: #ece8dd; font-size: 14px; }
.bw-col-star--full { color: #d4a853; }
.bw-col-card-reviews { font-family: var(--font-body); font-size: 12px; color: #676767; margin-left: 4px; }
.bw-col-card-sub { font-family: var(--font-body); font-size: 13px; font-weight: 400; color: #676767; }
.bw-col-card-text { display: flex; flex-direction: column; gap: 4px; }
.bw-col-card-title { font-family: var(--font-body); font-size: 16px; font-weight: 600; line-height: 21.6px; color: #335d88; margin: 0; }
.bw-col-card-price { font-family: var(--font-body); font-size: 16px; font-weight: 500; color: #2b3d39; margin: 0; }
/* Action row */
.bw-col-card-action { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bw-col-add-btn {
  display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 16px;
  border: 1px solid #335d88; border-radius: 100px; background: transparent;
  font-family: var(--font-body); font-size: 15px; font-weight: 500; color: #335d88;
  cursor: pointer; transition: background 0.2s, color 0.2s;
}
.bw-col-add-btn:hover { background: #335d88; color: #fff; }
.bw-col-add-btn:hover svg path { stroke: #fff; }
.bw-col-card-price-tag { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: #335d88; }
.bw-col-empty { font-family: var(--font-body); font-size: 18px; color: #676767; padding: 40px 0; }

@media (max-width: 1400px) { .bw-col-filter-bar, .bw-col-tabs-wrap, .bw-col-grid-section { padding-left: 64px; padding-right: 64px; } }
@media (max-width: 1200px) { .bw-col-grid { grid-template-columns: repeat(2, 1fr); } .bw-col-card-img-wrap { width: 100%; } }
@media (max-width: 768px) {
  .bw-col-filter-bar, .bw-col-tabs-wrap, .bw-col-grid-section { padding-left: 24px; padding-right: 24px; }
  .bw-col-grid { grid-template-columns: 1fr; }
  .bw-col-tabs-wrap { height: auto; min-height: 60px; padding-block: 8px; }
}