/* Filter Section */
        .filter-section {
            width: 100%;
            background: white;
            border-bottom: 1px solid var(--border-color);
            padding: 16px var(--desktop-padding);
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }

        .filter-group {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .category-filters {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .filter-button {
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
        }

        .filter-button:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .filter-button.active {
            background: #000;
            color: white;
            border-color: #000;
        }

        /* Subcategory Filters */
        .subcategory-filters {
            display: flex;
            gap: 6px;
            flex-wrap: wrap;
            animation: fadeIn 0.3s ease;
        }

        .subcategory-filter {
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
            display: flex;
            align-items: center;
            gap: 4px;
        }

        .subcategory-filter:hover {
            border-color: #333;
            background: #F3F4F6;
        }

        .subcategory-filter.active {
            background: #000;
            color: white;
            border-color: #000;
        }

        .subcategory-filter i {
            font-size: 11px;
        }

        /* Additional Tab Section */
        .additional-tab-section {
            width: 100%;
            background: white;
            border-bottom: 1px solid var(--border-color);
            padding: 12px var(--desktop-padding);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .tab-group {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }

        .tab-button {
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
        }

        .tab-button:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .tab-button.active {
            background: #000;
            color: white;
            border-color: #000;
        }

        .tab-reset-button {
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            color: #6B7280;
            cursor: pointer;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
            gap: 6px;
            white-space: nowrap;
        }

        .tab-reset-button:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .tab-reset-button svg {
            width: 14px;
            height: 14px;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(-5px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .sort-select {
            padding: 8px 12px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 8px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            min-width: 120px;
        }

        .sort-select:hover {
            border-color: #333;
        }

        .discount-toggle {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
        }

        .discount-toggle:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .discount-toggle.active {
            background: #FFF3F3;
            border-color: #FF4D4F;
            color: #FF4D4F;
        }

        .filter-reset {
            padding: 8px 12px;
            background: transparent;
            border: none;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            color: #9CA3AF;
            cursor: pointer;
            transition: all 0.2s ease;
            margin-left: auto;
        }

        .filter-reset:hover {
            color: #374151;
        }

        /* Location Filter */
        .location-filter-container {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .location-filter-btn {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
        }

        .location-filter-btn:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .location-filter-btn.active {
            --spread: 45deg;
            --shimmer-color: #ffffff;
            --radius: 20px;
            --speed: 6s;
            --cut: 0.05em;
            --bg: #000;

            background: var(--bg);
            border: 1px solid rgba(255, 255, 255, 0.1);
            color: #ffffff;
            overflow: hidden;
            position: relative;
            transform: translateZ(0);
        }

        .location-filter-btn.active svg {
            filter: brightness(0) invert(1);
        }

        /* Shimmer effect for active location filter button */
        .location-filter-btn.active::before {
            content: '';
            position: absolute;
            inset: -100%;
            width: auto;
            rotate: 0;
            background: conic-gradient(
                from calc(270deg - (var(--spread) * 0.5)),
                transparent 0,
                var(--shimmer-color) var(--spread),
                transparent var(--spread),
                transparent 360deg
            );
            animation: spin-around var(--speed) linear infinite;
            translate: 0 0;
            z-index: -1;
            filter: blur(3px);
        }

        .location-filter-btn.active::after {
            content: '';
            position: absolute;
            inset: var(--cut);
            background: var(--bg);
            border-radius: var(--radius);
            z-index: -1;
        }

        /* Distance Buttons */
        .distance-buttons {
            display: flex;
            gap: 6px;
            margin-top: 8px;
            flex-wrap: wrap;
        }

        .distance-btn {
            padding: 6px 14px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 16px;
            font-family: 'Pretendard', sans-serif;
            font-size: 12px;
            font-weight: 500;
            color: #6B7280;
            cursor: pointer;
            transition: all 0.2s ease;
            white-space: nowrap;
        }

        .distance-btn:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .distance-btn.active {
            background: #000;
            border-color: #000;
            color: white;
        }

        /* Distance Display on Cards */
        .property-distance {
            font-size: 12px;
            color: var(--text-tertiary);
            font-weight: 500;
            margin-left: 4px;
        }

        /* Price Range Slider */
        /* Price Filter Container & Button */
        .price-filter-container {
            position: relative;
            display: inline-block;
        }

        .price-filter-button {
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 8px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 20px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.5;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s;
            white-space: nowrap;
        }

        .price-filter-button:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .price-filter-button.active {
            --spread: 45deg;
            --shimmer-color: #ffffff;
            --radius: 20px;
            --speed: 6s;
            --cut: 0.05em;
            --bg: #000;

            background: var(--bg);
            border: 1px solid rgba(255, 255, 255, 0.1);
            color: #ffffff;
            overflow: hidden;
            position: relative;
            transform: translateZ(0);
        }

        .price-filter-button.active svg {
            transform: rotate(180deg);
            filter: brightness(0) invert(1);
        }

        /* Shimmer effect for active price filter button */
        .price-filter-button.active::before {
            content: '';
            position: absolute;
            inset: -100%;
            width: auto;
            rotate: 0;
            background: conic-gradient(
                from calc(270deg - (var(--spread) * 0.5)),
                transparent 0,
                var(--shimmer-color) var(--spread),
                transparent var(--spread),
                transparent 360deg
            );
            animation: spin-around var(--speed) linear infinite;
            translate: 0 0;
            z-index: -1;
            filter: blur(3px);
        }

        .price-filter-button.active::after {
            content: '';
            position: absolute;
            inset: var(--cut);
            background: var(--bg);
            border-radius: var(--radius);
            z-index: -1;
        }

        /* Price Dropdown Panel */
        .price-dropdown-panel {
            display: none;
            position: absolute;
            top: calc(100% + 8px);
            left: 0;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 12px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
            padding: 20px;
            min-width: 400px;
            z-index: 1000;
        }

        .price-dropdown-panel.show {
            display: block;
        }

        .price-panel-title {
            font-family: 'Pretendard', sans-serif;
            font-size: 15px;
            font-weight: 600;
            color: #111827;
            margin-bottom: 16px;
        }

        /* Quick Selection Buttons */
        .price-quick-buttons {
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 8px;
            margin-bottom: 16px;
        }

        .price-quick-buttons.mobile {
            grid-template-columns: repeat(6, 1fr);
        }

        .price-quick-btn {
            padding: 10px 8px;
            border: 1px solid #E5E7EB;
            background: white;
            border-radius: 6px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            font-weight: 500;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s;
        }

        .price-quick-btn:hover {
            background: #F3F4F6;
            border-color: #9CA3AF;
        }

        .price-quick-btn:active {
            background: #EFF6FF;
            border-color: #3B82F6;
            color: #3B82F6;
        }

        /* Min/Max Input Row */
        .price-input-row {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 12px;
        }

        .price-input-row.mobile {
            gap: 8px;
        }

        .price-input-group {
            display: flex;
            align-items: center;
            gap: 6px;
            flex: 1;
        }

        .price-adjust-btn {
            width: 32px;
            height: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #E5E7EB;
            background: white;
            border-radius: 6px;
            font-size: 16px;
            color: #6B7280;
            cursor: pointer;
            transition: all 0.2s;
            flex-shrink: 0;
        }

        .price-adjust-btn:hover {
            background: #F3F4F6;
            border-color: #9CA3AF;
        }

        .price-input-wrapper {
            position: relative;
            flex: 1;
        }

        .price-input-wrapper input {
            width: 100%;
            padding: 8px 10px;
            border: 1px solid #E5E7EB;
            border-radius: 6px;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            color: #111827;
            text-align: center;
        }

        .price-input-wrapper input:focus {
            outline: none;
            border-color: #3B82F6;
            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
        }

        .price-input-wrapper label {
            position: absolute;
            bottom: -18px;
            left: 50%;
            transform: translateX(-50%);
            font-family: 'Pretendard', sans-serif;
            font-size: 11px;
            color: #9CA3AF;
            white-space: nowrap;
        }

        .price-separator {
            font-size: 16px;
            color: #9CA3AF;
            flex-shrink: 0;
        }

        /* Price Reset Button */
        .price-reset-btn {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
            padding: 8px 0;
            margin-left: auto;
            margin-top: 8px;
            background: transparent;
            border: none;
            font-family: 'Pretendard', sans-serif;
            font-size: 13px;
            color: #6B7280;
            cursor: pointer;
            transition: color 0.2s;
        }

        .price-reset-btn:hover {
            color: #EF4444;
        }

        .price-reset-btn.mobile {
            justify-content: center;
            padding: 10px;
            border: 1px solid #E5E7EB;
            border-radius: 8px;
            margin-top: 12px;
        }

        @media (max-width: 1024px) {
            .filter-section {
                padding: 12px var(--tablet-padding);
                gap: 12px;
                /* 서브카테고리와의 구분선 - 단일 border만 사용 */
                border-bottom: 1px solid #EAECF0 !important;
            }

            /* additional-tab-section의 border 제거 (이중선 방지) */
            .additional-tab-section,
            .additional-tab-section.has-subcategories {
                border-bottom: none !important;
            }

            .price-range-container {
                min-width: 180px;
            }
        }

        /* Mobile Filter Button */
        .mobile-filter-toggle {
            display: none;
            width: 100%;
            padding: 10px 16px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 8px;
            font-family: 'Pretendard', sans-serif;
            font-size: 14px;
            font-weight: 500;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
            align-items: center;
            justify-content: space-between;
        }

        .mobile-filter-toggle:hover {
            border-color: #333;
            background: #F9FAFB;
        }

        .mobile-filter-toggle svg {
            transition: transform 0.3s ease;
        }

        .mobile-filter-toggle.active svg {
            transform: rotate(180deg);
        }

        /* Mobile Filter Sheet - 단순화 */
        .mobile-filter-sheet {
            display: none;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            background: white;
            border-top-left-radius: 16px;
            border-top-right-radius: 16px;
            box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
            z-index: 10001;
            max-height: 85vh;
            overflow-y: auto;
        }

        .mobile-filter-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 20px;
            border-bottom: 1px solid #E5E7EB;
            position: sticky;
            top: 0;
            background: white;
            z-index: 10;
        }

        .mobile-filter-title {
            font-family: 'Pretendard', sans-serif;
            font-size: 18px;
            font-weight: 700;
            color: #000;
        }

        .mobile-filter-close {
            background: none;
            border: none;
            font-size: 24px;
            color: #666;
            cursor: pointer;
            padding: 0;
            width: 32px;
            height: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .mobile-filter-content {
            padding: 20px;
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        .mobile-filter-group {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .mobile-filter-group-title {
            font-family: 'Pretendard', sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: #374151;
        }

        .mobile-filter-actions {
            position: sticky;
            bottom: 0;
            background: white;
            padding: 16px 20px;
            border-top: 1px solid #E5E7EB;
            display: flex;
            gap: 12px;
        }

        .mobile-filter-reset-btn {
            flex: 1;
            padding: 12px;
            background: white;
            border: 1px solid #E5E7EB;
            border-radius: 8px;
            font-family: 'Pretendard', sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: #374151;
            cursor: pointer;
            transition: all 0.2s ease;
        }

        .mobile-filter-reset-btn:hover {
            border-color: #333;
        }

        .mobile-filter-apply-btn {
            flex: 2;
            padding: 12px;
            background: #000;
            border: none;
            border-radius: 8px;
            font-family: 'Pretendard', sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: white;
            cursor: pointer;
            transition: all 0.2s ease;
        }

        .mobile-filter-apply-btn:hover {
            background: #333;
        }

        /* Mobile Filter Overlay - 단순화 */
        .mobile-filter-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.5);
            z-index: 10000;
        }

        @media (max-width: 767px) {
            .filter-section {
                padding-top: 12px !important;
                padding-bottom: 12px !important;
                padding-left: 16px !important;
                padding-right: 16px !important;
                gap: 8px;
                display: flex !important;
                flex-direction: row;
                align-items: center;
                flex-wrap: nowrap;
                overflow-x: auto;
                /* 서브카테고리와의 구분선 - 단일 border만 사용 */
                border-bottom: 1px solid #EAECF0 !important;

                /* 스크롤 최적화 */
                scrollbar-width: none;
                -ms-overflow-style: none;
                -webkit-overflow-scrolling: touch;
            }

            .filter-section::-webkit-scrollbar {
                display: none;
            }

            /* 숨겨진 필터들 표시 */
            .filter-section > .category-filters,
            .filter-section > .filter-group,
            .filter-section > .price-filter-button,
            .filter-section > .discount-toggle {
                display: flex !important;
            }

            /* 필터 버튼 스크롤 최적화 */
            .filter-button,
            .price-filter-button,
            .discount-toggle,
            .location-filter-btn,
            .subcategory-filter {
                flex-shrink: 0;
                white-space: nowrap;
            }

            /* 카테고리 필터 버튼들 */
            .category-filters {
                display: flex;
                flex-wrap: nowrap;
                flex-shrink: 0;
                gap: 6px;
            }

            /* 모바일 위치 필터 */
            .location-filter-container {
                display: flex !important;
                flex-shrink: 0;
            }

            .location-filter-btn {
                width: auto;
            }

            /* 모바일 필터 버튼 - 맨 오른쪽 배치 */
            .mobile-filter-toggle {
                display: flex;
                flex-shrink: 0;
                order: 999;
            }

            /* price-range-container 숨김 유지 (바텀시트로 이동) */
            .filter-section > .price-range-container,
            .filter-section > .filter-reset {
                display: none !important;
            }

            /* Additional Tab Section - 서브카테고리 영역 */
            .additional-tab-section {
                padding-top: 0 !important;
                padding-bottom: 0 !important;
                padding-left: 16px !important;
                padding-right: 16px !important;
                gap: 8px;
                display: none !important; /* 기본적으로 숨김 */
                overflow-x: auto;
                flex-wrap: nowrap;
                border-bottom: none !important; /* 이중선 방지 */
                height: 0;
                min-height: 0;

                /* 스크롤 최적화 */
                scrollbar-width: none;
                -ms-overflow-style: none;
                -webkit-overflow-scrolling: touch;
            }

            /* 서브카테고리가 있을 때만 표시 */
            .additional-tab-section.has-subcategories {
                display: flex !important;
                padding-top: 12px !important;
                padding-bottom: 12px !important;
                border-bottom: 1px solid #EAECF0 !important; /* 서브카테고리 하단 구분선 */
                height: auto;
            }

            /* 서브카테고리가 표시될 때도 filter-section의 border 유지 (메인↔서브 사이 구분선) */
            .filter-section.has-subcategories-active {
                border-bottom: 1px solid #EAECF0 !important;
            }

            .additional-tab-section::-webkit-scrollbar {
                display: none;
            }

            #subcategory-container {
                display: flex !important;
                flex-wrap: nowrap !important;
                gap: 6px;
                width: max-content;
            }

            #subcategory-container .subcategory-filter {
                flex-shrink: 0;
                white-space: nowrap;
            }
        }