/* =============================================================
   Product Catalog Page Styles
   ============================================================= */

.catalog-page .breadcrumb { display:flex; align-items:center; gap:.5rem; padding: 1rem 1rem 0; font-size:.875rem; color:var(--text-gray); }
.catalog-page .breadcrumb a { color: var(--text-dark); text-decoration:none; }
.catalog-page .breadcrumb a:hover { color: var(--relaxo-orange); }

.catalog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding: 1rem; }
.catalog-toolbar .toolbar-left { display:flex; gap:.75rem; align-items:center; }
.catalog-toolbar .search-box { position:relative; }
.catalog-toolbar .search-box input { width: 260px; max-width: 50vw; padding:.6rem 2.2rem .6rem .85rem; border:1px solid var(--border-light); border-radius:12px; outline:none; }
.catalog-toolbar .search-box i { position:absolute; right:.6rem; top:50%; transform: translateY(-50%); color: var(--text-gray); }
.catalog-toolbar .sort { display:flex; gap:.5rem; align-items:center; }
.catalog-toolbar select { padding:.5rem .75rem; border:1px solid var(--border-light); border-radius:10px; }
.catalog-toolbar .view-toggle button { border:1px solid var(--border-light); background: #fff; color: var(--text-dark); padding:.5rem .75rem; border-radius: 8px; }
.catalog-toolbar .view-toggle button.is-active { background: var(--bg-light); }

.catalog-body { display:grid; grid-template-columns: 280px 1fr; gap: 1.25rem; padding: 0 1rem 2rem; }
@media (max-width: 1024px){ .catalog-body { grid-template-columns: 1fr; } }

.filters { position:sticky; top: 90px; align-self:start; }
.filters .filters-inner { border:1px solid var(--border-light); border-radius: 12px; overflow:hidden; background:#fff; }
.filters-header { display:flex; align-items:center; justify-content:space-between; padding:.75rem 1rem; border-bottom:1px solid var(--border-light); }
.filter-group { padding: .75rem 1rem; border-bottom:1px solid var(--border-light); }
.filter-group:last-child { border-bottom:0; }
.filter-group h4 { margin-bottom: .5rem; font-weight: 600; }
.checklist label { display:flex; align-items:center; gap:.5rem; padding:.25rem 0; }
.price-row { display:flex; gap:.5rem; align-items:center; }
.price-row input { width: 100%; padding:.5rem .6rem; border:1px solid var(--border-light); border-radius:8px; }
.btn-sm { font-size:.85rem; padding:.45rem .75rem; }
.sticky-cta { position: sticky; bottom: 0; background: #fff; padding: .75rem 1rem; box-shadow: 0 -6px 12px rgba(0,0,0,.03); }

.results .chips { display:flex; flex-wrap:wrap; gap:.5rem; padding: .5rem 0; }
.results .chip { background: var(--bg-light); color: var(--text-dark); border:1px solid var(--border-light); padding:.25rem .5rem; border-radius: 9999px; display:inline-flex; align-items:center; gap:.35rem; }
.results .chip button { border:none; background:transparent; cursor:pointer; color: var(--text-gray); }

.adaptive-grid { display:grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 1rem; }
@media (min-width: 768px){ .adaptive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px){ .adaptive-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.results.list-view .adaptive-grid { display:block; }
.results.list-view .product-card { display:flex; gap: 1rem; }
.results.list-view .product-image { width: 220px; height: 160px; }

.pagination { display:flex; gap:.5rem; align-items:center; justify-content:center; padding: 1rem 0; }
.pagination button { border:1px solid var(--border-light); background:#fff; padding:.5rem .75rem; border-radius: 8px; cursor:pointer; }
.pagination button.is-active { background: var(--relaxo-orange); border-color: var(--relaxo-orange); color:#fff; }

/* Mobile filter overlay */
.filters-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 60; visibility:hidden; opacity:0; transition: opacity .2s ease, visibility .2s ease; }
.filters-overlay.is-open { visibility:visible; opacity:1; }
.filters-sheet { position: absolute; left:0; right:0; bottom: -100%; background:#fff; border-top-left-radius: 16px; border-top-right-radius:16px; min-height: 55vh; transition: bottom .25s ease; }
.filters-overlay.is-open .filters-sheet { bottom: 0; }
.sheet-header { display:flex; align-items:center; justify-content:space-between; padding: .75rem 1rem; border-bottom:1px solid var(--border-light); }
.sheet-body { padding: .5rem 1rem; max-height: 60vh; overflow:auto; }
.sheet-footer { padding: .75rem 1rem; border-top:1px solid var(--border-light); display:flex; gap:.5rem; justify-content:flex-end; }

/* Quick view */
.quickview { position: fixed; inset:0; background: rgba(0,0,0,.5); z-index: 70; visibility:hidden; opacity:0; transition: opacity .18s ease, visibility .18s; }
.quickview.is-open { visibility:visible; opacity:1; }
.quickview-dialog { position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); width: min(900px, 95vw); max-height: 90vh; overflow:auto; background:#fff; border-radius: 12px; box-shadow: 0 24px 48px rgba(0,0,0,.2); }
.quickview-close { position:absolute; right:.5rem; top:.25rem; border:none; background:transparent; font-size: 28px; color: var(--text-gray); cursor:pointer; }
.quickview-body { padding: 1rem; }

/* Minor helpers */
.icon-left i { margin-right: .5rem; }
.w-full { width: 100%; }
.container { width:100%; margin-left:auto; margin-right:auto; padding-left: 1rem; padding-right: 1rem; max-width: 1200px; }