@use '../../../scss/variables/colors' as colors;

.edd-modal {
	.edd-acr-cart-item {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		padding: 16px;
		border: 1px solid colors.$wp-gray-5;
		border-radius: 4px;
		background: #fff;
		transition: all 0.2s ease;

		&:hover {
			border-color: colors.$wp-gray-20;
		}
	}

	.edd-acr-cart-item__content {
		display: flex;
		gap: 12px;
		flex: 1;
		min-width: 0;
	}

	.edd-acr-cart-item__image {
		flex-shrink: 0;

		img {
			display: block;
			width: 50px;
			height: 50px;
			object-fit: cover;
			border-radius: 4px;
			border: 1px solid colors.$wp-gray-5;
		}
	}

	.edd-acr-cart-item__details {
		flex: 1;
		min-width: 0;
	}

	.edd-acr-cart-item__title {
		font-weight: 600;
		margin-bottom: 6px;
		word-break: break-word;
		line-height: 1.4;
	}

	.edd-acr-cart-item__meta {
		font-size: 13px;
		color: colors.$wp-gray-50;
		margin-top: 4px;
	}

	.edd-acr-cart-item__quantity {
		display: inline-block;
	}

	.edd-acr-cart-item__price {
		flex-shrink: 0;
		font-weight: 600;
		white-space: nowrap;
		margin-left: 16px;
		padding-top: 2px;
	}

	.edd-acr-cart-item__options {
		font-style: italic;
		font-size: 13px;
		color: colors.$wp-gray-50;
	}
}
