/* ── Layout ── */
.bdf-wrap { display:flex; gap:28px; align-items:flex-start; position:relative; }

/* ── Sidebar ── */
.bdf-sidebar {
  width:240px; flex-shrink:0;
  position:sticky; top:20px;
  border:1px solid #e5e5e5; border-radius:12px;
  padding:16px; max-height:85vh; overflow-y:auto;
}
.bdf-sidebar-head {
  display:flex; justify-content:space-between;
  align-items:center; margin-bottom:12px;
}
.bdf-sidebar-actions { display:flex; gap:4px; align-items:center; font-size:13px; }
.bdf-link { background:none; border:none; color:#7f1416; cursor:pointer; font-size:13px; padding:0; }
.bdf-genre-list { display:flex; flex-direction:column; gap:2px; }
.bdf-check-label {
  display:flex; align-items:center; gap:10px;
  padding:7px 4px; cursor:pointer; border-bottom:1px solid #f5f5f5;
  font-size:14px;
}
.bdf-check-label:hover { color:#7f1416; }
.bdf-check-label input { accent-color:#7f1416; width:16px; height:16px; flex-shrink:0; }

/* ── Main ── */
.bdf-main { flex:1; min-width:0; }

/* ── Toolbar ── */
.bdf-toolbar {
  display:flex; justify-content:space-between;
  align-items:center; gap:12px; flex-wrap:wrap;
  margin-bottom:12px;
}
.bdf-topfilters { display:flex; gap:8px; align-items:center; }
.bdf-chip {
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid #ddd; border-radius:999px;
  padding:7px 14px; background:#fff;
  cursor:pointer; font-size:14px; font-weight:500;
  transition:border-color .2s;
}
.bdf-chip:hover { border-color:#7f1416; }
.bdf-chip-icon { padding:7px 10px; }
.bdf-chip-arrow { font-size:11px; }

.bdf-right-toolbar { display:flex; gap:12px; align-items:center; }
.bdf-sort-label { display:flex; align-items:center; gap:6px; font-size:14px; }
.bdf-sort-select {
  border:1px solid #ddd; border-radius:8px;
  padding:6px 10px; font-size:14px; cursor:pointer;
}

/* ── Grid/List toggle ── */
.bdf-view-toggle { display:flex; gap:4px; }
.bdf-view-btn {
  border:1px solid #ddd; border-radius:6px;
  background:#fff; padding:6px 8px;
  cursor:pointer; color:#666; display:flex; align-items:center;
  transition:all .15s;
}
.bdf-view-btn.is-active { background:#222; color:#fff; border-color:#222; }

/* ── Meta bar ── */
.bdf-meta-bar {
  display:flex; justify-content:space-between;
  font-size:13px; color:#666; margin-bottom:14px;
}

/* ── Book cards ── */
/* LIST view */
.bdf-view-list .bdf-card {
  display:flex; gap:18px;
  border-bottom:1px solid #eee; padding:20px 0;
}
.bdf-view-list .bdf-card:first-child { padding-top:0; }

/* GRID view */
.bdf-view-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.bdf-view-grid .bdf-card {
  display:flex; flex-direction:column; gap:10px;
  border:1px solid #eee; border-radius:12px; padding:14px;
}
.bdf-view-grid .bdf-cover-link img { width:100%; height:220px; object-fit:cover; border-radius:8px; }

/* Cover */
.bdf-cover-link { flex-shrink:0; display:block; }
.bdf-cover-link img { width:130px; height:auto; border-radius:8px; display:block; }
.bdf-cover-placeholder { width:130px; height:180px; background:#f0f0f0; border-radius:8px; }

/* Card body */
.bdf-card-body { flex:1; min-width:0; }
.bdf-book-title { margin:0 0 4px; font-size:20px; }
.bdf-book-title a { text-decoration:none; color:#111; }
.bdf-book-title a:hover { color:#7f1416; }
.bdf-book-author { color:#7f1416; font-size:14px; margin-bottom:6px; }
.bdf-book-excerpt { font-size:14px; color:#444; line-height:1.6; margin-bottom:8px; }
.bdf-book-genres { font-size:13px; color:#666; margin-bottom:10px; }

/* Price */
.bdf-price-row { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.bdf-price-new { font-size:22px; font-weight:800; color:#7f1416; }
.bdf-price-new.is-free { color:#27ae60; }
.bdf-price-old { font-size:15px; color:#999; text-decoration:line-through; }
.bdf-avail { font-size:12px; color:#666; }

/* Retailer buttons */
.bdf-retailer-btns { display:flex; flex-wrap:wrap; gap:8px; }
.bdf-ret-btn {
  display:inline-block; background:#7f1416; color:#fff;
  padding:8px 14px; border-radius:6px; font-size:13px;
  font-weight:600; text-decoration:none;
  transition:background .2s;
}
.bdf-ret-btn:hover { background:#222; color:#fff; }

/* ── Pagination ── */
.bdf-pages { display:flex; gap:6px; flex-wrap:wrap; margin-top:24px; justify-content:center; }
.bdf-page {
  border:1px solid #ddd; padding:8px 13px; border-radius:8px;
  text-decoration:none; color:#333; background:#fff;
  font-size:14px; transition:all .15s;
}
.bdf-page:hover { border-color:#7f1416; color:#7f1416; }
.bdf-page.is-active { background:#7f1416; color:#fff; border-color:#7f1416; }
.bdf-ellipsis { padding:8px 6px; color:#999; }
.bdf-page-range { text-align:center; margin-top:8px; font-size:13px; color:#666; }

/* ── Loading state ── */
.bdf-wrap.is-loading { opacity:.5; pointer-events:none; transition:opacity .2s; }
.bdf-empty { color:#666; padding:40px 0; text-align:center; }

/* ══════════════════════════════
   MODAL SYSTEM
══════════════════════════════ */
.bdf-overlay {
  display:none; position:fixed;
  inset:0; background:rgba(0,0,0,.45);
  z-index:9000;
}
.bdf-overlay.is-open { display:block; }

.bdf-modal {
  display:none; position:fixed;
  bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:560px;
  background:#fff; border-radius:16px 16px 0 0;
  z-index:9100; overflow:hidden;
  box-shadow:0 -4px 24px rgba(0,0,0,.15);
}
@media (min-width:600px) {
  .bdf-modal {
    top:50%; bottom:auto;
    transform:translate(-50%,-50%);
    border-radius:16px;
    max-height:85vh;
    overflow-y:auto;
  }
}
.bdf-modal.is-open { display:block; }

.bdf-modal-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; border-bottom:1px solid #eee; position:sticky; top:0; background:#fff;
}
.bdf-modal-title { font-weight:700; font-size:17px; flex:1; text-align:center; }
.bdf-modal-close {
  background:none; border:none; font-size:18px;
  cursor:pointer; color:#666; padding:0;
}
.bdf-modal-back {
  background:none; border:none; font-size:22px;
  cursor:pointer; color:#333; padding:0;
}

.bdf-modal-body { padding:0; }
.bdf-modal-row {
  padding:16px 20px; border-bottom:1px solid #f0f0f0;
  cursor:pointer; display:flex; justify-content:space-between; align-items:center;
}
.bdf-modal-row:hover { background:#fafafa; }
.bdf-sub-trigger { font-weight:600; font-size:14px; letter-spacing:.04em; }

.bdf-radio-label, .bdf-modal-row .bdf-check-label {
  display:flex; align-items:center; gap:12px;
  width:100%; cursor:pointer; font-size:15px;
}
.bdf-radio-label input, .bdf-modal-row .bdf-check-label input {
  accent-color:#7f1416; width:18px; height:18px; flex-shrink:0;
}

.bdf-modal-footer {
  padding:16px 20px; border-top:1px solid #eee;
  display:flex; gap:16px; align-items:center;
  position:sticky; bottom:0; background:#fff;
}
.bdf-modal-footer .bdf-btn {
  flex:1; text-align:center; padding:12px; font-size:15px; border-radius:8px;
}
.bdf-btn {
  display:inline-block; background:#7f1416; color:#fff;
  padding:10px 18px; border-radius:8px; font-size:14px;
  font-weight:700; border:none; cursor:pointer; text-decoration:none;
  transition:background .2s;
}
.bdf-btn:hover { background:#222; }

/* No scroll when modal open */
.bdf-no-scroll { overflow:hidden; }

/* ── Responsive ── */
@media (max-width:768px) {
  .bdf-wrap { flex-direction:column; }
  .bdf-sidebar { width:100%; position:static; max-height:none; }
  .bdf-view-grid { grid-template-columns:1fr; }
  .bdf-toolbar { flex-direction:column; align-items:flex-start; }
}

/* ══════════════════════════════
   STICKY TOOLBAR
══════════════════════════════ */
.bdf-main { position: relative; }

.bdf-toolbar {
  position: sticky;
  top: 0px;
  z-index: 100;
  background: #fff;
  padding: 10px 0;
  border-bottom: 1px solid #eee;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* When admin bar is visible */
.admin-bar .bdf-toolbar {
  top: 32px;   /* desktop admin bar height */
}

/* ══════════════════════════════
   GRID VIEW CARD (clean minimal)
══════════════════════════════ */
.bdf-view-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

/* Grid card outer */
.bdf-view-grid .bdf-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 0;
  overflow: hidden;
}

/* Hide list-only elements in grid */
.bdf-view-grid .bdf-book-excerpt,
.bdf-view-grid .bdf-avail,
.bdf-view-grid .bdf-retailer-btns {
  display: none;
}

/* Grid cover — full width image */
.bdf-view-grid .bdf-cover-link {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
}

.bdf-view-grid .bdf-cover-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  display: block;
  transition: transform .3s ease;
}

.bdf-view-grid .bdf-cover-link:hover img {
  transform: scale(1.03);
}

.bdf-view-grid .bdf-cover-placeholder {
  width: 100%;
  height: 220px;
  background: #f0f0f0;
  border-radius: 0;
}

/* Grid card body */
.bdf-view-grid .bdf-card-body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

/* Title in grid */
.bdf-view-grid .bdf-book-title {
  font-size: 15px;
  margin: 0;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Author in grid */
.bdf-view-grid .bdf-book-author {
  font-size: 13px;
  color: #7f1416;
  margin: 0;
}

/* Taxonomy/genre in grid */
.bdf-view-grid .bdf-book-genres {
  font-size: 12px;
  color: #888;
  margin: 0;
}

/* Price row in grid */
.bdf-view-grid .bdf-price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  margin: 4px 0 0;
}

.bdf-view-grid .bdf-price-new {
  font-size: 18px;
  font-weight: 800;
  color: #7f1416;
}

.bdf-view-grid .bdf-price-new.is-free {
  color: #27ae60;
}

.bdf-view-grid .bdf-price-old {
  font-size: 13px;
  color: #999;
  text-decoration: line-through;
}

/* Get Deal button — grid only */
.bdf-view-grid .bdf-grid-deal-btn {
  display: inline-block;
  margin-top: 10px;
  background: #7f1416;
  color: #fff;
  text-align: center;
  padding: 9px 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s;
}

.bdf-view-grid .bdf-grid-deal-btn:hover {
  background: #222;
  color: #fff;
}

/* ── LIST view: hide grid-only deal btn ── */
.bdf-view-list .bdf-grid-deal-btn {
  display: none;
}

/* ── Genre visibility: list vs grid ── */
/* Hide grid genres (first only) in list view */
.bdf-view-list .bdf-genres-grid {
  display: none;
}

/* Hide list genres (all) in grid view */
.bdf-view-grid .bdf-genres-list {
  display: none;
}

/* ── Responsive grid ── */
@media (max-width: 900px) {
  .bdf-view-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

@media (max-width: 540px) {
  .bdf-view-grid {
    grid-template-columns: 1fr;
  }
}

/* GLOBAL SITE WIDTH */
.wp-site-blocks {
    max-width: 1400px !important;
    margin-left: auto;
    margin-right: auto;
}

/* MAIN CONTENT WIDTH REMOVE LIMIT */
.wp-block-group,
.wp-block-post-content,
.wp-block-page-content,
main {
    max-width: 1400px !important;
}

/* REMOVE NARROW CONTENT LOCK */
.wp-block-post-content > *,
.wp-block-group > * {
    max-width: 1400px !important;
}

/* FIX QUERY LOOP / PRODUCTS GRID AREA */
.wp-block-query,
.wp-block-columns {
    max-width: 1400px !important;
}

/* ADD SIDE PADDING SO CONTENT NOT TOUCH EDGE */
.wp-site-blocks {
    padding-left: 30px;
    padding-right: 30px;
}