/*
 * AddonNest Front CSS
 * File Description: The main stylesheet of this plugins for main design part.
 */
 @import 'breakpoint';
 @import 'banner';
 @import 'onlinedelivery';
 @import 'countdown';
 @import 'photogallery';
 @import 'mediacard';
 @import 'products_category';
 @import 'breakingnews';
 @import 'team-member';
 @import 'features';
 @import 'call-contact-form';
 @import 'addonnest-title';
 @import 'events-list';
 @import 'member-list';
 @import 'restaurant-menu';
 @import 'restaurant-schedule';
 @import 'special-menu';
 @import 'time-line';
 @import 'pricing-table';
 @import 'services';
 @import 'addonnest-slider';
 @import 'animation-headline';
 @import 'addonnest-blog';
 @import 'addonnest-hero-video';
 @import 'video-gallery';





 // Variables
 $primary-color: #3BB77E;
 $hover-primary: darken($primary-color, 5%);
 $secondary-color: #f59758;
 $text-color: #253D4E;
 $light-text: #adadad;
 $lighter-text: #B6B6B6;
 $border-color: #ececec;
 $background-light: #fff;
 $card-radius: 15px;
 $btn-radius: 6px;
 $transition: all 0.3s ease;
 $box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
 $hover-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);

.addonnest-products-list {
	.addonnest-product-card {
		position: relative;
		background-color: $background-light;
		border: 1px solid $border-color;
		border-radius: $card-radius;
		overflow: hidden;
		transition: $transition;
		box-shadow: $box-shadow;
		margin-bottom: 30px;

		&:hover {
			transform: translateY(-5px);
			box-shadow: $hover-shadow;

			.addonnest-product-image-wrapper {
				img {
				transform: scale(1.05);
				}
			}

			.addonnest-add-to-cart {
				background-color: $primary-color;
				color: white;
			}
		}

		.addonnest-product-image-wrapper {
			position: relative;
			overflow: hidden;

			a {
				display: block;
			}

			img {
				width: 100%;
				height: 300px;
				object-fit: cover;
				transition: $transition;
			}

			.addonnest-product-badges {
				position: absolute;
				z-index: 9;

				.addonnest-discount-badge {
					display: inline-block;
					font-size: 12px;
					line-height: 1;
					font-weight: 600;
					border-radius: 0 0 15px 0;
					color: white;
					padding: 10px 20px;
					background-color: $secondary-color;
					box-shadow: 0 3px 10px rgba($secondary-color, 0.3);
				}

				&.addonnest-badge-top-left {
					left: 0;
					top: 0;
				}

				&.addonnest-badge-top-right {
					right: 0;
					top: 0;

					.addonnest-discount-badge {
						border-radius: 0 0px 0px 15px;
					}
				}
			}
		}

		.addonnest-product-details {
			padding: 20px;
			position: relative;

			.addonnest-product-category {
				color: $light-text;
				font-size: 12px;
				margin-bottom: 5px;

				a {
				font-family: "Quicksand", sans-serif;
				color: $light-text;
				font-size: 12px;
				text-decoration: none;
				transition: $transition;

				&:hover {
					color: $primary-color;
				}

				&:not(:last-child):after {
					content: ", ";
				}
				}
			}

			.addonnest-product-title {
					font-family: "Quicksand", sans-serif;
					font-size: 17px;
					font-weight: 700;
					margin: 6px 0;
					line-height: 1.4;
					overflow: hidden;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;

					a {
						font-family: "Quicksand", sans-serif;
						color: $text-color;
						text-decoration: none;
						transition: $transition;

						&:hover {
							color: $primary-color;
						}
					}
				}

			.addonnest-product-rating {
				display: flex;
				align-items: center;
				margin: 8px 0 0;

				.star-rating {
				height: 13px;
				position: relative;
				width: 60px;
				margin-right: 0;
				text-align: center;
				display: inline-flex;

				&:before {
					background-image: url('../../images/star-gray.png');
					background-repeat: repeat-x;
					background-size: 12px;
					bottom: 0;
					content: "";
					display: block;
					height: 12px;
					left: 0;
					position: absolute;
					right: 0;
					top: 0;
					width: 60px;
				}

				& > span {
					display: block;
					text-indent: -10000px;
					margin-right: 10px;
					width: 60px;
					height: 12px;
					position: absolute;
					overflow: hidden;

					&:before {
					background-image: url('../../images/star.png');
					background-repeat: repeat-x;
					background-size: 12px;
					bottom: 0;
					content: "";
					display: block;
					height: 12px;
					left: 0;
					position: absolute;
					right: 0;
					text-indent: 10000px;
					top: 0;
					}
				}
				}

				.addonnest-review-count {
					color: $lighter-text;
					font-size: 13px;
					margin-left: 5px;
				}
			}

			.addonnest-product-price {
					font-family: "Quicksand", sans-serif;
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					gap: 8px;

					del {
						order: 2;
						color: #adadad;
						text-decoration: line-through;

						.woocommerce-Price-amount.amount {
							font-family: "Quicksand", sans-serif;
							font-size: 14px;
							font-weight: 400;

							.woocommerce-Price-currencySymbol {
								font-size: 12px;
							}
						}
					}

				ins {
				order: 1;
				text-decoration: none;

				.woocommerce-Price-amount.amount {
					font-family: "Quicksand", sans-serif;
					font-size: 20px;
					font-weight: 700;
					color: $primary-color;

					.woocommerce-Price-currencySymbol {
					font-size: 16px;
					margin-left: 2px;
					}
				}
				}

				// For non-sale items (single price)
				> .woocommerce-Price-amount.amount {
				font-family: "Quicksand", sans-serif;
				font-size: 20px;
				font-weight: 700;
				color: $primary-color;

				.woocommerce-Price-currencySymbol {
					font-size: 16px;
					margin-left: 2px;
				}
				}

				.screen-reader-text {
				position: absolute;
				width: 1px;
				height: 1px;
				padding: 0;
				margin: -1px;
				overflow: hidden;
				clip: rect(0, 0, 0, 0);
				white-space: nowrap;
				border: 0;
				}
			}

			.addonnest-add-to-cart {
				font-family: "Quicksand", sans-serif;
				position: relative;
				display: block;
				padding: 12px 20px;
				border-radius: $btn-radius;
				background-color: #DEF9EC;
				font-size: 14px;
				font-weight: 700;
				color: $primary-color;
				text-align: center;
				margin-top: 10px;
				text-decoration: none;
				transition: $transition;
				border: none;
				cursor: pointer;

				&:hover {
				background-color: $primary-color;
				color: white;
				box-shadow: 0 5px 15px rgba($primary-color, 0.3);
				}

				&:active {
				transform: translateY(2px);
				}
			}
		}
	}
}

// Pagination styles
.addonnest-pagination {
   margin: 10px 0 30px;
   text-align: center;

	ul.page-numbers {
		display: inline-flex;
		align-items: center;
		list-style: none;
		padding: 0;
		margin: 0;

		li {
			margin: 0 5px;

			.page-numbers {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 40px;
				height: 40px;
				border-radius: 50%;
				font-size: 15px;
				font-weight: 600;
				color: $text-color;
				text-decoration: none;
				transition: $transition;
				background-color: #f5f5f5;

				&.current {
				background-color: $primary-color;
				color: white;
				box-shadow: 0 5px 15px rgba($primary-color, 0.3);
				}

				&:hover:not(.current) {
				background-color: #e9e9e9;
				}

				&.next, &.prev {
				font-size: 16px;
				}
			}
		}
	}
}

// Responsive styles
@media screen and (max-width: 991px) {
	.addonnest-products-list {
		grid-template-columns: repeat( auto-fill, minmax( 250px, 1fr ) );
	}
}

@media screen and (max-width: 767px) {
	.addonnest-products-list {
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
		gap: 20px;
	}

	.addonnest-product-card .addonnest-product-details {
		padding: 15px 20px;

		.addonnest-product-title {
			font-size: 15px;
			height: 42px;
		}

		.addonnest-add-to-cart {
			padding: 10px 15px;
			font-size: 13px;
		}
	}
}

@media screen and (max-width: 480px) {
	.addonnest-products-list {
		grid-template-columns: 1fr;
		max-width: 320px;
		margin: 20px auto;
	}
}