export const CLASS_ROOT = "carousel-hero";

export const CLASS_VIEWPORT_WRAPPER = `${CLASS_ROOT}__viewport-wrapper`;
export const CLASS_VIEWPORT = `${CLASS_ROOT}__viewport`;
export const CLASS_TRACK = `${CLASS_ROOT}__track`;
export const CLASS_SLIDE = `${CLASS_ROOT}__slide`;
export const CLASS_SLIDE_CONTAINER = `${CLASS_ROOT}__slide-container`;
export const CLASS_SLIDE_CONTENT = `${CLASS_ROOT}__slide-content`;
export const CLASS_SLIDE_SUBTITLE = `${CLASS_ROOT}__slide-subtitle`;
export const CLASS_SLIDE_IMAGE_WRAPPER = `${CLASS_ROOT}__slide-image-wrapper`;
export const CLASS_SLIDE_IMAGE = `${CLASS_ROOT}__slide-image`;
export const CLASS_SLIDE_BUTTON = `${CLASS_ROOT}__slide-button`;
export const CLASS_PREV = `${CLASS_ROOT}__prev`;
export const CLASS_NEXT = `${CLASS_ROOT}__next`;
export const CLASS_PLAY_PAUSE = `${CLASS_ROOT}__play-pause`;
export const CLASS_TABS = `${CLASS_ROOT}__tabs`;
export const CLASS_TAB = `${CLASS_ROOT}__tab`;
export const CLASS_PAGINATION = `${CLASS_ROOT}__pagination`;
export const CLASS_PAGINATION_ITEM = `${CLASS_ROOT}__pagination-item`;
export const CLASS_PAGINATION_SVG = `${CLASS_ROOT}__pagination-svg`;
export const CLASS_PAGINATION_CIRCLE = `${CLASS_ROOT}__pagination-circle`;
export const CLASS_NAVIGATION = `${CLASS_ROOT}__navigation`;

export const CLASS_ACTIVE = "is-active";
export const CLASS_PLAYING = "is-playing";
export const CLASS_PAUSED = "is-paused";

export const SELECTOR_VIEWPORT = `.${CLASS_VIEWPORT}`;
export const SELECTOR_TRACK = `.${CLASS_TRACK}`;
export const SELECTOR_PREV = `.${CLASS_PREV}`;
export const SELECTOR_NEXT = `.${CLASS_NEXT}`;
export const SELECTOR_PLAY_PAUSE = `.${CLASS_PLAY_PAUSE}`;
export const SELECTOR_TABS = `.${CLASS_TABS}`;
export const SELECTOR_TAB = `.${CLASS_TAB}`;
export const SELECTOR_PAGINATION = `.${CLASS_PAGINATION}`;
export const SELECTOR_ACTIVE = `.${CLASS_ACTIVE}`;