/**
 * Product Filters - Mobile Only (≤768px)
 * Clean mobile slide-in sidebar
 */

/* =================================
   Mobile Filter Sidebar
   ================================= */
.block.filter.sidebar-filters {
    position: fixed;
    top: 0;
    left: -100%;
    width: 85%;
    max-width: 360px;
    height: 100vh;
    z-index: 1050;
    overflow-y: auto;
    overflow-x: hidden;
    transition: left 0.3s ease;
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: 2px 0 16px rgba(0, 0, 0, 0.2);
}

.block.filter.sidebar-filters.active {
    left: 0;
}

/* =================================
   Mobile Filter Title
   ================================= */
.filter-title {
    position: sticky;
    top: 0;
    z-index: 10;
    border-radius: 0;
    padding: 1rem 1.25rem;
}

.filter-title strong {
    font-size: 1rem;
}

.filter-close {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.5rem;
}

/* =================================
   Mobile Filter Content
   ================================= */
.block-content.filter-content {
    padding: 0;
}

/* =================================
   Mobile Active Filters
   ================================= */
.filter-current {
    padding: 1rem 1.25rem;
}

.filter-current-subtitle {
    font-size: 0.75rem;
    margin-bottom: 0.625rem;
}

.filter-current-item {
    font-size: 0.8125rem;
    padding: 0.5rem 0.875rem;
}

/* =================================
   Mobile Clear All Button
   ================================= */
.filter-actions {
    padding: 1rem 1.25rem;
}

.filter-actions .filter-clear {
    font-size: 0.8125rem;
    height: 2.25rem;
    padding: 0.5rem 0.875rem;
}

/* =================================
   Mobile Accordion
   ================================= */
.accordion-item.filter-option {
    padding: 0 1.25rem;
}

.accordion-button.filter-options-title {
    font-size: 0.875rem;
    padding: 1rem 0;
    min-height: 44px;
}

.accordion-button .badge {
    font-size: 0.6875rem;
    padding: 0.1875rem 0.5rem;
}

/* =================================
   Mobile Filter Items
   ================================= */
.filter-link {
    padding: 0.75rem 0;
    font-size: 0.875rem;
}

.filter-link .filter-label {
    font-size: 0.875rem;
}

.filter-link .filter-count {
    font-size: 0.6875rem;
    padding: 0.1875rem 0.5rem;
    min-width: 1.75rem;
}

/* =================================
   Mobile Swatches
   ================================= */
.swatch-option {
    min-width: 2.25rem;
    height: 2.25rem;
    font-size: 0.8125rem;
}

.swatch-option.color {
    min-width: 2.25rem;
    height: 2.25rem;
}

/* =================================
   Mobile Accessibility
   ================================= */
.filter-link,
.accordion-button,
.filter-clear,
.filter-current-item .action.remove {
    min-height: 44px;
}

/* =================================
   Mobile Safe Area
   ================================= */
@supports (padding: env(safe-area-inset-left)) {
    .block.filter.sidebar-filters {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
}

/* =================================
   Body Scroll Lock
   ================================= */
body.filter-active {
    overflow: hidden;
}