/* SIIK scroller: arrows for swipe rows, only on devices with a mouse and only while the row overflows */
.sks-arrow { display: none; }
@media (hover: hover) and (pointer: fine) {
  .sks-on > .sks-arrow {
    all: unset; box-sizing: border-box; cursor: pointer;
    position: absolute; z-index: 5; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px; border-radius: 50%;
    display: grid; place-items: center;
    color: #F4F4F8; background: rgba(14, 14, 24, .78);
    border: 1px solid rgba(255, 255, 255, .18);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .45);
    transition: background-color .15s, opacity .15s;
  }
  .sks-on > .sks-arrow:hover { background: #8B5CF6; border-color: #8B5CF6; }
  .sks-on > .sks-arrow:focus-visible { outline: 2px solid #B197FF; outline-offset: 2px; }
  .sks-on > .sks-arrow[disabled] { opacity: 0; pointer-events: none; }
  .sks-on > .sks-arrow svg { width: 18px; height: 18px; display: block; }
  .sks-on > .sks-prev { left: -6px; }
  .sks-on > .sks-prev svg { transform: rotate(180deg); }
  .sks-on > .sks-next { right: -6px; }
  .sks-on .spg-grid, .sks-on .srv-list { cursor: grab; }
  .sks-dragging { cursor: grabbing !important; scroll-snap-type: none !important; user-select: none; }
  .sks-dragging * { pointer-events: none; }
}