/**
 * anjocatsublinks — Category quick links
 *
 * @author    André Forte
 * @copyright 2026 André Forte
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License (AFL 3.0)
 */
.anjocsl { position: relative; margin: 0 0 1.5rem; }
.anjocsl .anjocsl__track {
  display: flex; gap: 20px; margin: 0; padding: 0 0 4px; list-style: none;
  overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none;
}
/* Mão só quando há itens escondidos para deslizar (classe posta pelo front.js). */
.anjocsl.is-scrollable .anjocsl__track { cursor: grab; }
.anjocsl .anjocsl__track::-webkit-scrollbar { display: none; }
.anjocsl .anjocsl__item { flex: 0 0 auto; width: 145px; margin: 0; padding: 0; scroll-snap-align: start; }
.anjocsl .anjocsl__link { display: block; color: inherit; text-align: center; text-decoration: none; }
.anjocsl .anjocsl__link:hover, .anjocsl .anjocsl__link:focus { color: inherit; text-decoration: none; }
.anjocsl .anjocsl__circle {
  position: relative; display: block; width: 145px; height: 145px;
  border-radius: 50%; overflow: hidden; background: #fff;
}
/* Mesmo cinza das listagens do tema (.thumbnail-container .img-overlay), como no anjoproductvariants. */
.anjocsl .anjocsl__circle::after {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: rgba(133, 133, 133, .06); pointer-events: none;
}
.anjocsl .anjocsl__img {
  display: block; width: 100%; height: 100%; max-width: none; object-fit: cover;
  -webkit-user-drag: none; user-select: none;
}
.anjocsl .anjocsl__title {
  display: block; margin: 10px 0 0; font-size: 12px; line-height: 1.25;
  text-transform: uppercase; overflow-wrap: break-word; color: inherit;
}
.anjocsl .anjocsl__arrow {
  position: absolute; top: 72px; z-index: 2; display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; margin-top: -20px; padding: 0 0 4px; border: 0; border-radius: 50%;
  background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .18); color: #000; font-size: 30px; line-height: 1; cursor: pointer;
}
.anjocsl .anjocsl__arrow--prev { left: 0; }
.anjocsl .anjocsl__arrow--next { right: 0; }
.anjocsl .anjocsl__arrow[hidden] { display: none; }
.anjocsl.is-dragging .anjocsl__track { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.anjocsl.is-dragging .anjocsl__link { pointer-events: none; }

@media (hover: none) {
  .anjocsl.is-scrollable .anjocsl__track { cursor: auto; }
  .anjocsl .anjocsl__arrow { display: none; }
}

@media (max-width: 767px) {
  .anjocsl .anjocsl__track { gap: 12px; }
  .anjocsl .anjocsl__item { width: 95px; }
  .anjocsl .anjocsl__circle { width: 95px; height: 95px; }
  /* O título pode ocupar parte do espaço entre círculos, para palavras longas não partirem. */
  .anjocsl .anjocsl__title { margin: 8px -6px 0; font-size: 11px; }
  .anjocsl .anjocsl__arrow { display: none; }
}
