@use '@cloud-ru/ds-figma-variables/build/scss/styles/styles.module' as base;

.root {
  position: relative;

  display: flex;
  column-gap: base.$sn-primitive-dimension-16;
  align-items: center;
  justify-content: space-between;

  width: 100%;
}

.controls {
  display: flex;
  column-gap: base.$sn-primitive-dimension-8;
  align-items: center;
}

// Слайдер страниц центрируется по футеру, а не по остатку между кнопками, — так в макете.
.slider {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

// Плейсхолдер слайдера: три точки по 16px — типовое количество новостей в выпуске.
.sliderSkeleton {
  width: calc(3 * #{base.$sn-primitive-dimension-16});
  height: base.$sn-primitive-dimension-16;
  border-radius: base.$sn-density-radius-2xs;
}