/* ---------------------------------------- */
/* КАРТОЧКА - СПЛОШНАЯ РАЗДЕЛИТЕЛЬНАЯ ЛИНИЯ */
/* ---------------------------------------- */

/* Добавить в начало ярлыка:

line-card-

*/

/* ----------------- */
/* БЫСТРЫЕ НАСТРОЙКИ */
/* ----------------- */

/* 1. Раскомментировать, чтобы отключить ТЕНЬ при наведении на карточку */

.folders-row .col-lg-3 > a[href*="wpm-category/line-card-"][class*="folder-wrap"]:hover {
	filter: none;
}

/* Убираем ОПИСАНИЕ */

.folders-row a[href*="wpm-category/line-card-"] > .folder-content {
	display: none;
}

/* Убираем ОБЛОЖКУ */

.folders-row a[href*="wpm-category/line-card-"] > .folder-front,
.folders-row a[href*="wpm-category/line-card-"] > .folder-sub-front{
	display: none;
}

/* Переносим КАРТОЧКУ-ЛИНИЮ на новую строку */

.col-lg-3:has(a[href*="wpm-category/line-card-"][class*="folder-wrap"]) {
	display: block!important;
	width: 100%!important;
	z-index: 498!important;
}

/* ВНЕШНИЕ ОТСТУПЫ КАРТОЧКИ-ЛИНИИ на разных экранах */
/* ------------------------------------------------ */

.col-lg-3:has(a[href*="wpm-category/line-card-"][class*="folder-wrap"]) {
    margin-top: calc(0px + var(--line-padding-line-card));
	margin-bottom: calc(30px + var(--line-padding-line-card));
}

/* Общие настройки ЛИНИИ */

.folders-row a[href*="wpm-category/line-card-"][class*="folder-wrap"] {
    height: var(--line-height-line-card)!important;
    top: 0;
    margin: 0 auto;
	cursor: default;
    pointer-events: none;
}

/* Убираем рамку - ТЕНЬ вокруг карточки */

.folders-row a[href*="wpm-category/line-card-"][class*="folder-wrap"] {
	border: none;
	box-shadow: none;
	border-radius: 0;
	background: none;
	/* временный фон карточки */
    /* background: aqua;  */
}

/* Растягиваем КАРТОЧКУ - ЛИНИЮ на всю ширину кабинета кроме мобильных */

@media (min-width: 768px) {
	
.folders-row a[href*="wpm-category/line-card-"][class*="folder-wrap"] {
	width: 100%!important;
}
}

/* Ширина ЛИНИИ на мобильных */

@media (min-width: 460px) and (max-width: 767px) {
	
.folders-row a[href*="wpm-category/line-card-"][class*="folder-wrap"] {
	width: 340px;
}
}

@media (min-width: 320px) and (max-width: 459px) {

.folders-row a[href*="wpm-category/line-card-"][class*="folder-wrap"] {
	width: 360px;
}
}

/* ------------------------- */
/* Превращаем СТИКЕР в ЛИНИЮ */

.folders-row a[href*="wpm-category/line-card-"] .label {
	font-size: 0;
	width: 100%;
	max-width: none;
    top: 0;
	left: 0px;
	border-radius: var(--line-radius-line-card);
	line-height: normal;
    padding: 0;
    height: 100%;
}
	/* трансформация линии */
	/* transform: skew(35deg, 359deg); */
	
	/* тень как шкала прогресса */
	/* вариант 1 */
	/* background-image: linear-gradient(90deg, orange, orange 33.33%, transparent 33.33%, transparent 100%); */
	/* вариант 2 */
	/* box-shadow: inset rgb(64 159 255 / 84%) 770px 0px 0px 0px; */
	
	/* тень как рамка */
	/* box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px, rgb(51, 51, 51) 0px 0px 0px 3px; */
	
	/* тень как от полки */
	/* box-shadow: 0 20px 20px -5px #333; */
	
	/* Пунктирная линия с градиентом */
	/* background: linear-gradient(to right, transparent 50%, #fff 50%),  */
				/* linear-gradient(to right, blue, red); */
	/* background-size: 16px 2px, 100% 2px; */
	
	/* Вертикальные линии */
	/* background-image: linear-gradient(90deg, orange, orange 33.33%, transparent 33.33%, transparent 100%); */
	/* background-size: 3px 100%; */
	
	/* тень радужная */
	/* box-shadow: rgb(85, 91, 255) 0px 0px 0px 3px, rgb(31, 193, 27) 0px 0px 0px 6px, rgb(255, 217, 19) 0px 0px 0px 9px, rgb(255, 156, 85) 0px 0px 0px 12px, rgb(255, 85, 85) 0px 0px 0px 15px; */


/* ----------------- */
/* ЭФФЕКТЫ для ЛИНИИ */
/* ----------------- */

/* 1. Хвостик Bubble Bottom */

/* a[href*="wpm-category/line-card-"] .label:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: calc(var(--line-height-line-card) * 0.13) solid transparent;
  border-top-color: #333;
  border-bottom: 0;
  margin-left: calc(var(--line-height-line-card) * 0.13 * -1);
  margin-bottom: calc(var(--line-height-line-card) * 0.13 * -1);
} */

/* 2. Хвостик Треугольник ВНИЗ */

/* a[href*="wpm-category/line-card-"] .label:after {
	content: '';
	width: 0;
	height: 0;
	border-left: 25px solid transparent;
	border-right: 25px solid transparent;
	border-top: 50px solid #333;
} */