/* Shopping */

.shopping_layout p em {
	color: #6760c9;
	font-style: normal;
}

.shopping_layout hr {
	height: 0px;
	border-top: none;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(to right, transparent, #b7b0cf, transparent) 1;
	background: none;
}

.shopping {
	width: 100%;
	min-height: 350px;
	position: relative;
}

.shopping.loading {
	background: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/page/details/loader64_gray.png) no-repeat center;
}

	.shopping.loading > * {
		display: none;
	}

.shopping_message_block {
	min-height: 218px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid transparent;
	border-image: linear-gradient(to right, transparent, #b7b0cf, transparent) 1;
}

.shopping_message {
	position: relative;
	padding-left: 34px;
	color: #9791ab;
	cursor: default;
}
.shopping_message::before {
	content: 'i';
	width: 24px;
	height: 24px;
	display: flex;
	position: absolute;
	justify-content: center;
	left: 0px;
	top: 50%;
	translate: 0% -50%;
	color: #9791ab;
	font-size: 18px;
	line-height: 23px;
	border: 1px solid #9791ab;
	border-radius: 100%;
}

	.shopping_message a:hover {
		text-decoration: none;
	}

.shopping .rewards {
	height: calc(var(--item-size) * 1px);
	display: flex;
	position: relative;
	justify-content: space-between;
	padding-bottom: 20px;
	margin-bottom: 70px;
	--item-size: 116;
}
	.shopping .rewards .item {
		display: flex;
		position: relative;
		--i: 0;
		--img: 142;
		--gap: 8;
	}

	.shopping .rewards .item.icon1 {--i: 1}
	.shopping .rewards .item.icon2 {--i: 2}
	.shopping .rewards .item.icon3 {--i: 3}
	.shopping .rewards .item.icon4 {--i: 4}
	.shopping .rewards .item.icon5 {--i: 5}
	.shopping .rewards .item.icon6 {--i: 6}

	.shopping .rewards .item::before {
		content: '';
		width: 4px;
		height: 20px;
		display: block;
		position: absolute;
		left: 50%;
		bottom: -24px;
		translate: -50% 0%;
		background: #dcdcdc url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/rewards.png) no-repeat;
		background-position: calc(-1px * (var(--i) * var(--img) - var(--img) - var(--img-posx-corr)) - 70px) -90px;
		border: 2px solid #fff;
		border-top: none;
		border-bottom: none;
		pointer-events: none;
		z-index: 3;
		--img-posx-corr: 0;
	}

	.shopping .rewards .item:not(.active)::before {
		background-image: none;
	}

	.shopping .rewards .item.icon5::before {
		--img-posx-corr: -15;
	}

	.shopping .rewards .item::after {
		content: attr(data-crystal);
		width: 100%;
		display: block;
		position: absolute;
		left: 0;
		bottom: -68px;
		font-size: 16px;
		text-align: center;
		pointer-events: none;
		z-index: 4;
	}

		.reward_icon {
			width: calc(var(--size) * 1px);
			height: calc(var(--size) * 1px);
			background: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/rewards_disabled.png) no-repeat var(--posx) top / auto 100%;
			opacity: 0.4;
			--size: var(--item-size);
			--step: calc(var(--size) + (calc(var(--gap) / calc(var(--img) / var(--size)))));
			--offset: calc(var(--step) * var(--i) * -1);
			--posx: calc((var(--offset) + var(--step)) * 1px);
		}

		.shopping .rewards .item.active .reward_icon {
			background-image: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/rewards.png);
			opacity: 1;
		}

		.shopping .rewards .item:not(.active):hover .reward_icon {
			opacity: 0.8;
			transition: opacity 0.2s ease-out;
		}

		.shopping .rewards .item.active:hover .reward_icon {
			filter: brightness(0.9) contrast(200%);
			transition: filter 0.2s ease-out;
		}

		.reward_hint {
			min-width: 100px;
			display: flex;
			position: absolute;
			box-sizing: border-box;
			flex-direction: column;
			left: 20%;
			top: 80%;
			translate: 0% 0%;
			padding: 12px 20px 14px;
			color: #222;
			font: normal 14px/1.2 Cambria, Georgia, Times;
			background: #fff url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/hint.png) no-repeat;
			box-shadow: 1px 1px 6px #0007;
			border-radius: 6px;
			opacity: 0;
			scale: 0.92;
			pointer-events: none;
			z-index: 10;
		}

		.shopping .rewards .item:hover .reward_hint {
			translate: 0% 30%;
			opacity: 1;
			scale: 1;
			transition: all 0.3s ease-out;
		}

			.reward_hint i,
			.reward_hint em {
				display: block;
				font-style: normal;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.reward_hint em {
				color: #6760c9;
			}

	.shopping .rewards .progress_zero,
	.shopping .rewards .progress {
		height: 12px;
		position: absolute;
		bottom: 0px;
	}

	.shopping .rewards .progress_zero {
		width: calc(var(--item-size) * 0.5px);
		left: 0px;
	}

	.shopping .rewards .progress {
		width: var(--bar-width);
		left: calc(var(--item-size) * 0.5px);
		right: calc(var(--item-size) * 0.5px);
		--bar-width: calc(100% - (var(--item-size) * 1px));
	}

		.line_bar,
		.line_pad {
			height: inherit;
			position: absolute;
			background: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/progress_bar.png) no-repeat 0 0 / 100% 100%;
		}

		.line_bar {
			width: 100%;
			z-index: 2;
			clip-path: polygon(0% 0%, var(--progress) 0%, var(--progress) 100%, 0% 100%);
			--progress: 0%;
		}

		.line_pad {
			width: 100%;
			opacity: 0.3;
			filter: grayscale(1);
			z-index: 1;
		}

		.shopping .rewards .progress_zero .line_bar,
		.shopping .rewards .progress_zero .line_pad {
			background-size: auto 100%;
		}

.shopping .cart_notice {
	font-size: 15px;
	color: #3fa1d4;
	text-align: center;
}

.shopping .crystals {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
	padding-top: 16px;
	gap: 12px;
	color: #674f3d;
	font: 20px/24px Cambria, Georgia, "Times New Roman", Times, serif;
	background: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/header_line.png) no-repeat;
	cursor: default;
}

	.shopping .crystals span {
		display: flex;
		align-items: inherit;
		font-size: 30px;
		color: #3fa1d4;
	}

	.shopping .crystals span::before {
		content: '';
		width: 32px;
		height: 32px;
		display: block;
		margin-right: 4px;
		background: url(https://aa.cdn.gmru.net/static/aa.mail.ru/img/main/content/shopping/crystals.png) no-repeat left 75%;
	}

#textcontent a.aa_item_tooltip:link,
#textcontent a.aa_item_tooltip:visited {
    text-decoration: none;
    border-bottom: #7366bd 1px dashed;
    color: #7366bd;
    cursor: help;
}

#textcontent a.aa_item_tooltip::after {
    content: '[?]'; /* Добавляем после текста закрывающую кавычку */
}

.inv-icon {
    border-width: 2px;
    border-style: solid;
}
