/* ------------------------------------- */
/* КАРТОЧКА - КНОПКА С ТЕКСТОМ И ИКОНКОЙ */
/* ------------------------------------- */

/* Секретные фразы:

button-text-icon-card-


*/

/* ----------------- */
/* БЫСТРЫЕ НАСТРОЙКИ */
/* ----------------- */

/* 1. Раскомментировать, чтобы отключить ТЕНЬ при наведении на карточку */

.folders-row .col-lg-3 > a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]:hover {
	filter: none;
	-webkit-filter: none;
}

/* Убираем всё содержание и индикаторы */

.folders-row a[href*="wpm-category/button-text-icon-card-"] > .folder-content {
	display: none;
}

/* Обёртка рубрики */

.col-lg-3:has(a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]) {
	display: block !important;
    z-index: 498 !important;

	/* использовать только для визуального контроля, иначе увеличивает высоту обёртки рубрики */
    /* border: 1px solid #333333; */
	/* корректировка высоты, если включен border выше */
	/* height: 48.8px; */
}

/* Ширина всей карточки на больших экранах */

@media (min-width: 768px) {

.col-lg-3:has(a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]) {
	
	/* width: 100% !important; */
    /* width: fit-content !important; */
    width: auto !important;
	
	padding: 0;
    margin-left: 15px;
    margin-right: 15px;
	/* margin-right: var(--right-shift-button-text-icon-card); */
}
}

/* Карточка на маленьких экранах */

@media (min-width: 320px) and (max-width: 767px) {

.col-lg-3:has(a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]) {
	width: 100%!important;
}
}

/* ------------------------ */
/* Внешние отступы карточки */
/* ------------------------ */

/* .col-lg-3:has(a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]) {
    margin-bottom: 60px;
	margin-top: 20px;
} */

/* Блока-ссылка */
/* ------------ */

.folders-row a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"] {
	display: flex;
	flex-flow: row-reverse;
	gap: 10px;
	/* выравнивание иконки и текста по вертикали */
	align-items: center;
	/* выравнивание иконки и текста по горизонтали */
	justify-content: left;
	text-align: left;
	/* height: 100% !important; */
	/* height: 80px !important; */
	height: 48.8px!important;
	
	/* не менять - выходит за пределы кликабельности */
	margin: 0px !important;
	
	/* внутренние отступы кнопки - можно менять */
	padding: 0px 20px;
	
	border-radius: 20px;
	
	box-shadow: none;
    /* background: none; */
    background: #0aa0ff;
	
	/* плавная анимация */
	-webkit-transition: all var(--speed-all-effects-button-card) ease-out;
    -moz-transition: all var(--speed-all-effects-button-card) ease-out;
    -o-transition: all var(--speed-all-effects-button-card) ease-out;
    transition: all var(--speed-all-effects-button-card) ease-out;
	
	border: 1px solid #2d2d2d;
}

/* Осветляем кнопку при наведении */

.folders-row a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"]:hover {
	box-shadow: inset 0 0 0 10em rgb(255 255 255 / 20%);
	/* плавная анимация */
	-webkit-transition: all var(--speed-all-effects-button-card) ease-out;
    -moz-transition: all var(--speed-all-effects-button-card) ease-out;
    -o-transition: all var(--speed-all-effects-button-card) ease-out;
    transition: all var(--speed-all-effects-button-card) ease-out;
}

/* Ширина блока-ссылки на больших экранах */

@media (min-width: 768px) {
	
.folders-row a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"] {
	/* width: 100% !important; */
	/* width: auto; */
	/* по ширине максимального текста */
	width: fit-content;
}
}

/* Ширина и Выравнивание блока-ссылки на маленьких экранах */
/* По умолчанию берётся ширина классической карточки = 340px и 360px */

@media (max-width: 767px) {
	
.folders-row a[href*="wpm-category/button-text-icon-card-"][class*="folder-wrap"] {
	/* на всю ширину - надо подумать */
	/* width: 100% !important; */
	/* max-width: fit-content; */
	
	/* по ширине максимального текста - из-за этого не получится выровнять кнопки по левому краю */
	width: fit-content;
	
	/* Выравнивание по левому краю контента работает только при ширине 340px и 360px */
	
	/* выравнивание блока-ссылки по центру */
	justify-self: center;
}
}

/* -------------------------- */
/* Превращаем СТИКЕР в КНОПКУ */
/* -------------------------- */

/* Общие настройки */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .label {
	display: block;
    white-space: nowrap;
	background: none !important;
    border-radius: 0;
    font-weight: bold;
    font-size: 19px;
    width: auto;
	
	/* чтобы текст не вылезал за пределы блока-ссылки и не мешал иконке */
    text-wrap: auto;
	max-width: none;
	/* max-width: 100%; */
	
	/* Ограничить одной строкой? */
	
    text-transform: none;
    /* padding: 6px 10px; */
    padding: 0;
    /* line-height: 1.9rem; */
    line-height: normal;
    overflow: visible;
    left: 0px;
    right: 0;
	text-align: left;
    position: relative;
    top: 0px !important;

	/* плавная анимация */
	-webkit-transition: all var(--speed-all-effects-button-card) ease-out;
    -moz-transition: all var(--speed-all-effects-button-card) ease-out;
    -o-transition: all var(--speed-all-effects-button-card) ease-out;
    transition: all var(--speed-all-effects-button-card) ease-out;

    border: 1px solid #2d2d2d;
}

/* Убираем осветление самого стикера - при наведении */
/* Иначе подхватывается блоком button-card.css */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .label:hover {
	box-shadow: none;
}

/* Размер стикера на мобильных */

/* @media (min-width: 460px) and (max-width: 767px) {

.folders-row a[href*="wpm-category/button-text-icon-card-"] .label {   
	font-size: 25px;
	line-height: .9;
    overflow: hidden;
    text-overflow: ellipsis;
}
}

@media (min-width: 320px) and (max-width: 459px) {

.folders-row a[href*="wpm-category/button-text-icon-card-"] .label {   
	font-size: 25px;
	line-height: .9;
    overflow: hidden;
    text-overflow: ellipsis;
}
} */

/* --------------- */
/* Блок содержания */
/* --------------- */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-front,
.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front {
    /* display: block !important; */
    display: flex !important;
	z-index: 10;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    transform: none;
	
	/* фон для иконки с прозрачностью */
	background: #ffffff !important;
    /* background: none !important; */
	
    position: relative;
    /* width: 100% !important; */
	width: auto !important;
	/* Высота обложки */
    height: 80% !important;
    aspect-ratio: 1 / 1;
    margin: 0px;
    padding: 0px;
    top: 0px;
    left: 0px;
    bottom: 0px;
    border-radius: 5px;
	
	/* анимация обложки? */
	/* transform: rotateZ(45deg); */
	
	border: 1px solid #2d2d2d;
}

/* ------------------- */
/* ИЗОБРАЖЕНИЕ ОБЛОЖКИ */
/* ------------------- */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-front pattern image,
.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front pattern image {
	transform: none;
	height: 100%;
	width: auto;
	x: 0;
	y: 0;
	filter: none;
	-webkit-filter: none;
}

/* --------------- */
/* ЭФФЕКТЫ ОБЛОЖКИ */
/* --------------- */

/* Тонировка обложки */
/* Берётся от классической карточки, если не задать */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front pattern image,
.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-front pattern image {
	/* эффекты */
	filter: none;
	-webkit-filter: none;
}

/* Осветление и Яркость - при наведении */
/* Берётся от классической карточки, если не задать */

.folders-row a[href*="wpm-category/button-text-icon-card-"]:hover .folder-sub-front pattern image,
.folders-row a[href*="wpm-category/button-text-icon-card-"]:hover .folder-front pattern image {
	/* эффекты */
	filter: none;
	-webkit-filter: none;
}

/* Коррекция обложки */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-front path[id*="shape-front"],
.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front path[id*="shape-front"] {
    d: path("M 0 204 H 204 V 0 H 0 V 204 Z");
    transform: translate(33px, 0px);
}

/* Фон обложки */

.folder-wrap a[href*="wpm-category/button-text-icon-card-"] .folder-front use[fill^="#"],
.folder-wrap a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front use[fill^="#"] {
    fill: none;
    /* fill: #00b3ee; */
}

/* Убираем коррекцию стилей от Mozilla Firefox */

.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-front use[fill^="url"],
.folders-row a[href*="wpm-category/button-text-icon-card-"] .folder-sub-front use[fill^="url"] {
	transform: none;
}