/* v0.8.20 · drawer mobile separato per filtri e comandi */

.filters-drawer {
  display: none;
}

@media (max-width: 640px) {
  .filters-drawer[open] {
    position: fixed;
    inset: auto 0 0 0;
    display: flex;
    flex-direction: column;
    width: min(100%, 680px);
    max-width: 100%;
    max-height: min(76dvh, 720px);
    margin: 0 auto;
    padding: 0;
    border: 1px solid var(--border);
    border-bottom: 0;
    border-radius: 22px 22px 0 0;
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 -12px 34px color-mix(in srgb, #000 28%, transparent);
    overflow: hidden;
  }

  .filters-drawer::backdrop {
    background: color-mix(in srgb, #000 48%, transparent);
    backdrop-filter: blur(2px);
  }

  .filters-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border);
    flex: 0 0 auto;
  }

  .filters-drawer-head h2 {
    margin: 1px 0 0;
    font-size: 1.05rem;
  }

  .filters-drawer-head .section-kicker {
    margin: 0;
  }

  .filters-drawer-body {
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px 14px calc(16px + env(safe-area-inset-bottom));
  }

  .filters-drawer .quick-row,
  .filters-drawer .category-row,
  .filters-drawer .community-row {
    display: flex !important;
    width: 100%;
    max-width: 100%;
  }

  .filters-drawer .quick-row,
  .filters-drawer .category-row {
    flex-wrap: wrap;
    overflow: visible;
    padding: 0;
    gap: 8px;
  }

  .filters-drawer .category-row {
    margin-top: 12px;
  }

  .filters-drawer .community-row {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    flex-direction: column;
    gap: 8px;
  }

  .filters-drawer .community-add-btn {
    width: 100%;
    min-height: 44px;
  }

  .filters-drawer .view-switch {
    flex: 1 1 100%;
    width: 100%;
  }

  .filters-drawer .view-switch-btn {
    flex: 1 1 0;
  }

  /* Nella v0.8.20 il pannello sticky non si espande mai sopra le schede. */
  .search-panel.is-scroll-expanded {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 6px;
    border-radius: 14px;
  }
}