/**
 * Post Grid filters — móvil: sin botón Filter, scroll horizontal, flechas Palantir.
 * Cargado vía functions.php (no depende de style.css / @import).
 */

@media only screen and (max-width: 999px) {
  .nectar-post-grid-wrap .nectar-post-grid-filters h4 {
    display: none !important;
  }

  .nectar-post-grid-filters.fji-filters-scroll {
    max-width: none !important;
    width: 100%;
    overflow: visible;
  }

  /*
   * Shell = solo track + flechas.
   * Importante: anular reglas antiguas tipo
   * `.nectar-post-grid-filters div:not(.n-sticky)` que también matcheaban este wrapper
   * y desplazaban el centro vertical (padding-top 40px de Salient + flex en el shell).
   */
  .nectar-post-grid-filters .fji-filters-shell {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-track {
    position: relative;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0 28px !important;
    margin: 0 !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    /* Espacio bajo el fade de las flechas (~74px como Palantir) */
    padding: 10px 74px !important;
    min-height: 0 !important;
    max-width: none !important;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-track::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-track a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: 3;
    /* Palantir: wrapper ~74px (44px fade + 26px icono) */
    width: 74px !important;
    height: auto !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent;
    cursor: pointer;
    color: #1a1a1a;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 0 !important;
    transform: none !important;
    transition: opacity 0.2s ease, visibility 0.2s ease;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow svg {
    display: block;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    fill: currentColor;
    /* Compensa ópticamente el subrayado ::after de Salient en el link activo */
    transform: translateY(2px);
  }

  /* Prev: icono al borde izquierdo + degradado hacia el contenido (como Palantir) */
  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow--prev {
    left: 0;
    justify-content: flex-start !important;
    padding: 0 44px 0 4px !important;
    background: linear-gradient(
      270deg,
      rgba(246, 244, 238, 0) 0%,
      rgba(246, 244, 238, 0.75) 25%,
      rgba(246, 244, 238, 0.9) 50%,
      #f6f4ee 75%
    );
  }

  /* Next: icono al borde derecho + degradado hacia el contenido */
  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow--next {
    right: 0;
    justify-content: flex-end !important;
    padding: 0 4px 0 44px !important;
    background: linear-gradient(
      90deg,
      rgba(246, 244, 238, 0) 0%,
      rgba(246, 244, 238, 0.75) 25%,
      rgba(246, 244, 238, 0.9) 50%,
      #f6f4ee 75%
    );
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow--next svg {
    transform: translateY(2px) rotate(180deg);
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-arrow.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

@media only screen and (min-width: 1000px) {
  .fji-filters-arrow {
    display: none !important;
  }

  .nectar-post-grid-filters .fji-filters-shell .fji-filters-track {
    overflow: visible !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
