/* ============================================================
   FLAVSTART PRODUCT LISTING STYLES
   ============================================================ */

.fs-shop-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--fs-space-4);
    margin-bottom: var(--fs-space-8);
    flex-wrap: wrap;
}

.fs-shop-header__title {
    font-size: var(--fs-text-2xl);
    margin-bottom: var(--fs-space-1);
}

.fs-shop-header__desc {
    font-size: var(--fs-text-sm);
    color: var(--fs-gray-500);
    max-width: 600px;
}

.fs-shop-header__count {
    font-size: var(--fs-text-sm);
    color: var(--fs-gray-400);
}

/* Controls */
.fs-shop-controls {
    display: flex;
    align-items: center;
    gap: var(--fs-space-3);
}

.fs-shop-controls__view {
    display: flex;
    border: 1px solid var(--fs-gray-200);
    border-radius: var(--fs-radius-md);
    overflow: hidden;
}

.fs-shop-view-btn {
    padding: var(--fs-space-2) var(--fs-space-3);
    color: var(--fs-gray-400);
    transition: all var(--fs-transition-fast);
}

.fs-shop-view-btn.is-active {
    background: var(--fs-primary);
    color: var(--fs-white);
}

.fs-shop-sort {
    min-width: 180px;
}

.fs-shop-filter-toggle {
    display: none;
}

/* Layout */
.fs-shop-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--fs-space-8);
    align-items: start;
}

/* Sidebar */
.fs-shop-sidebar {
    position: sticky;
    top: calc(var(--fs-sticky-header-height) + var(--fs-space-4));
}

.fs-shop-sidebar__header {
    display: none;
}

.fs-filter-widget {
    margin-bottom: var(--fs-space-6);
    padding-bottom: var(--fs-space-6);
    border-bottom: 1px solid var(--fs-gray-100);
}

.fs-filter-widget:last-child { border-bottom: none; }

.fs-widget__title {
    font-size: var(--fs-text-sm);
    font-weight: var(--fs-font-bold);
    margin-bottom: var(--fs-space-4);
}

.fs-filter-list__item {
    margin-bottom: var(--fs-space-2);
}

.fs-filter-list__count {
    font-size: var(--fs-text-xs);
    color: var(--fs-gray-400);
    margin-left: auto;
}

.fs-price-filter__inputs {
    display: flex;
    align-items: center;
    gap: var(--fs-space-2);
}

.fs-price-filter__inputs .fs-input { padding: var(--fs-space-2); text-align: center; }
.fs-price-filter__separator { color: var(--fs-gray-400); }

/* Product Grid */
.fs-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fs-space-6);
}

.fs-product-grid[data-view="list"] {
    grid-template-columns: 1fr;
}

.fs-product-grid[data-view="list"] .fs-product-card {
    display: flex;
    flex-direction: row;
}

.fs-product-grid[data-view="list"] .fs-product-card .fs-card__image {
    width: 200px;
    aspect-ratio: 1;
    flex-shrink: 0;
}

.fs-product-grid[data-view="list"] .fs-product-card .fs-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Responsive */
@media (max-width: 1023px) {
    .fs-shop-layout { grid-template-columns: 1fr; }
    .fs-shop-sidebar { display: none; position: fixed; inset: 0; z-index: var(--fs-z-overlay); background: var(--fs-white); overflow-y: auto; }
    .fs-shop-sidebar.is-active { display: block; }
    .fs-shop-sidebar__header { display: flex; align-items: center; justify-content: space-between; padding: var(--fs-space-5); border-bottom: 1px solid var(--fs-gray-100); }
    .fs-shop-sidebar__inner { padding: var(--fs-space-5); }
    .fs-shop-filter-toggle { display: flex; }
    .fs-product-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
    .fs-product-grid { grid-template-columns: repeat(2, 1fr); gap: var(--fs-space-3); }
    .fs-shop-controls__view { display: none; }
    .fs-shop-sort { min-width: 140px; }
}