.filters-section { padding: 24px 0 72px; background: #0F1117; }
.filters-section .filters-section-header { margin-bottom: 8px; }
.filters-section .filters-section-header h2 { font-size: 36px; font-weight: 800; color: #E8EAF0; margin-bottom: 8px; }
.filters-section .filters-section-header p { font-size: 16px; color: #8B93A8; margin-bottom: 28px; }
.filters-section .filters-bar { background: #1A1D27; border: 1px solid #2A2D3E; border-radius: 12px; padding: 20px 24px; display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-end; margin-bottom: 24px; }
.filters-section .filter-group { display: flex; flex-direction: column; gap: 10px; }
.filters-section .filter-group label { font-size: 11px; font-weight: 700; color: #E8EAF0; text-transform: uppercase; letter-spacing: 1px; }
.filters-section .tag-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.filters-section .tag-btn { display: inline-flex; align-items: center; padding: 8px 14px; background: #1A1D27; border: 1px solid #3A3D4E; border-radius: 6px; font-size: 13px; font-weight: 600; color: #C8CDD8; cursor: pointer; transition: all 0.15s ease; user-select: none; }
.filters-section .tag-btn:hover { background: #2D1618; border-color: #E53935; color: #E53935; }
.filters-section .tag-btn.active { background: #E53935; border-color: #E53935; color: #FFFFFF; }
.filters-section .sort-group { display: flex; flex-direction: column; gap: 10px; margin-left: auto; }
.filters-section .sort-group label { font-size: 11px; font-weight: 700; color: #E8EAF0; text-transform: uppercase; letter-spacing: 1px; }
.filters-section .sort-select { padding: 9px 36px 9px 14px; background: #141620 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235A6273' d='M6 8L1 3h10z'/%3E%3C/svg%3E") no-repeat right 12px center; border: 1px solid #2A2D3E; border-radius: 6px; font-size: 14px; font-weight: 600; color: #E8EAF0; cursor: pointer; appearance: none; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }
.filters-section .sort-select:focus { outline: none; border-color: #E53935; }
.filters-section .filters-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.filters-section .results-count { font-size: 14px; color: #8B93A8; }
.filters-section .results-count strong { color: #E8EAF0; }
.filters-section .btn-reset-filter { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: none; border: 1px solid #2A2D3E; border-radius: 6px; font-size: 13px; font-weight: 600; color: #8B93A8; cursor: pointer; transition: all 0.15s; opacity: 0; pointer-events: none; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }
.filters-section .btn-reset-filter.visible { opacity: 1; pointer-events: auto; }
.filters-section .btn-reset-filter:hover { background: #1D0F10; border-color: #4A1C20; color: #EF4444; }
@media (max-width: 768px) {
  .filters-section { padding: 12px 0 32px; }
  .filters-section .filters-section-header h2 { font-size: 22px; margin-bottom: 2px; }
  .filters-section .filters-section-header p { font-size: 13px; margin-bottom: 10px; }
  .filters-section .filters-bar { flex-direction: row; flex-wrap: wrap; align-items: center; padding: 10px 12px; gap: 6px; margin-bottom: 8px; }
  .filters-section .filter-group { flex: 1; min-width: 0; gap: 4px; }
  .filters-section .filter-group label { font-size: 10px; }
  .filters-section .tag-buttons { gap: 4px; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
  .filters-section .tag-btn { padding: 5px 8px; font-size: 10px; flex-shrink: 0; }
  .filters-section .sort-group { margin-left: auto; gap: 3px; flex-shrink: 0; }
  .filters-section .sort-group label { font-size: 10px; }
  .filters-section .sort-select { padding: 5px 24px 5px 8px; font-size: 11px; }
  .filters-section .filters-meta { margin-bottom: 6px; }
  .filters-section .results-count { font-size: 11px; }
  .filters-section .btn-reset-filter { padding: 4px 10px; font-size: 11px; }
}
