// Marketplace

.no-results {
	padding: 16px;
	text-align: center;
}

.c-marketplace {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;

	&__header {
		&__text{
			font-size: 20px;
			font-weight: 600;
		}
	}

	&__content {
		display: flex;
		flex-direction: column;
		gap: 35px;
		padding: 30px 34px;
		width: 100%;
		max-width: 1248px;
		margin: auto;
	}

	&__list {
		display: flex;
		flex-wrap: wrap;
		gap: 24px;
		justify-content: flex-start;
	}
}

.p-marketplace1 {
	display: grid;
	gap: 32px;
	grid-template-columns: 460px 1fr;

	&__content {
		display: flex;
		flex-direction: column;
		gap: 35px;
		padding: 30px 34px 30px 0;
	}

	&__breadcrumb {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 31px;

		&--add {
			border-radius: 32px;
			background: linear-gradient(90deg, #ff71e8 0.03%, #3838ff 99.8%);
			height: 44px;
			flex-direction: row-reverse;
		}
	}

	&__list {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		gap: 32px;
	}

	&__filters {
		max-width: 200px;

		.c-select__content {
			border: 1px solid #2a46ff;
		}

		.c-select__item {
			text-align: center;
		}
	}
}

.custom-filter {
	padding: 0;
	margin: 0;

	>li {
		padding: 10px;
		margin: 0;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.c-select__content {
		height: 42px;
		border-radius: 42px;
		background: #fff;
	}

	.c-select--action {
		color: #2a46ff;

		svg {
			transform: rotate(-90deg);
		}
	}

	.c-select__placeholder {
		font-size: 18px;
		font-weight: 700;
		line-height: 34px;
		letter-spacing: 0.75px;
		color: #2a46ff;
	}
}

.cart {
	border-radius: 12px;
	border: 1px solid #DEDEEC;
	background: #FFF;
	box-shadow: 1px 12px 24px 0px rgba(37, 37, 37, 0.40);
	width: 436px;
	height: auto;
	padding: 24px;
	flex-direction: column;
	gap: 24px;
	position: fixed;
	top: 96px;
	right: 20px;
	display: none;
	.input-card-custom {
		input {
			padding:7px 20px 7px 12px
		}
	}
	&.isOpen {
		display: flex;
	}
	p {
		margin: 0;
	}
	&--header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		svg {
			cursor: pointer;
		}
		&__title {
			color: #000;
			font-size: 20px;
			font-style: normal;
			font-weight: 600;
			line-height: normal;
			letter-spacing: -0.2px;
			span {
				color: #5050FF;
				font-size: 20px;
				font-style: normal;
				font-weight: 600;
				line-height: normal;
				letter-spacing: -0.2px;
			}
		}
	}
	&--txt {
		p {
			color: rgba(85, 95, 109, 1);
			font-size: 14px;
			font-style: normal;
			font-weight: 400;
			line-height: normal;
			letter-spacing: 0.28px;
		}
	}
	&--block {
		display: flex;
		flex-direction: column;
		gap: 12px;
		max-height: calc(100vh - 360px);
		overflow: auto;
		height: auto;
    padding-right: 8px;
    margin-right: -8px;
		&__item {
			display: flex;
			padding: 16px;
			justify-content: space-between;
			align-items: flex-start;
			align-self: stretch;
			border-radius: 8px;
			border: 1px solid #DEDEEC;
			background: #F4F5F9;
			gap: 16px;
			.info-card {
				display: flex;
				flex-direction: column;
				gap: 12px;
				flex: 1;
				&--wrap {
					display: flex;
					justify-content: space-between;
					align-items: flex-end;
					gap: 12px;
					.col-1 {
						width: 50%;
						.title {
							color: #40405B;
							font-size: 12px;
							font-style: normal;
							font-weight: 700;
							line-height: 16px;
              margin-bottom: 8px;
						}
					}
					.col-2 {
						width: 25%;
						.title {
							color: #40405B;
							font-size: 10px;
							font-style: normal;
							font-weight: 600;
							line-height: 16px;
              margin-bottom: 8px;
						}
					}
					.col-3{
						width: 25%;
						.title {
							color: #40405B;
							font-size: 10px;
							font-style: normal;
							font-weight: 600;
							line-height: 16px;
              margin-bottom: 8px;
						}
					}
				}
				&--detail {
					color: #40405B;
					font-size: 12px;
					font-style: normal;
					font-weight: 400;
					line-height: normal;
					span {
						color: #40405B;
						font-size: 12px;
						font-style: normal;
						font-weight: 700;
						line-height: normal;
					}
				}
				&--price {
					color: #40405B;
					font-size: 12px;
					font-style: normal;
					font-weight: 400;
					line-height: normal;
					span {
						color: #5050FF;
						font-size: 12px;
						font-style: normal;
						font-weight: 700;
						line-height: normal;
					}
				}
			}
			.actions {
        margin-top: 24px;
				width: auto;
				.actions-wrap {
					cursor: pointer;
					display: flex;
					padding: 10px;
					justify-content: center;
					align-items: center;
					gap: 10px;
					border-radius: 12px;
					background: #F2415A;
				}
			}
		}
		
	}
	&--footer {
		cursor: pointer;
		display: flex;
		padding: 12px 16px;
		justify-content: center;
		align-items: center;
		gap: 10px;
		align-self: stretch;
		border-radius: 12px;
		background: var(--btn, linear-gradient(90deg, #55F 1.38%, #F3A2CF 100%));
		box-shadow: 0px 1px 2px -1px rgba(17, 12, 34, 0.08);
		color: #FFF;
		font-size: 14px;
		font-style: normal;
		font-weight: 600;
		line-height: 24px;
	}
}
