/*
Theme Name: Donalfarm Child
Theme URI: http://demo.7iquid.com/donalfarm/
Author: 7iquid
Author URI: http://themeforest.net/user/7iquid
Template: donalfarm
Description: Donalfarm is the best of agriculture farm theme for organic farm website, such as organic food, organic agriculture, dairy farm, livestock, fruits, vegetables, agriculture business, organic shop or grocery.  It's layouts with a sleek and modern design, fully responsive and easy to customize with the Elementor builder with fully responsive, ensuring that your website will look great on all devices, including desktops, laptops, tablets, and smartphones. Donalfarm is also highly customizable, allowing you to easily modify the layout, colors, and fonts to match your brand and style.
Version: 1.0.0
License: ThemeForest
License URI: https://themeforest.net/licenses
Text Domain: donalfarm-child
Tags: agriculture, farmers, farm tour, market, fresh food, quality, organic, organic food, health, technologies, clean, nature, environment, elementor, garden, products, farm shop, grocery store, woocommerce
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Requires at least: 5.8 or Higher
Requires PHP: 7.4 or Higher
Tested up to: 8.3
*/

:root{
	--primary-font: 'SVN Poppins', sans-serif;
	--secondary-font: 'Dancing Script', sans-serif;
}

.white-image img {
    filter: brightness(0) invert(1);
}
.services-box .elementor-widget-pxl_fancy_box,
.services-box .elementor-widget-container,
.services-box .pxl-fancybox-wrap{
	height: 100%;
}
.newsletter-form input {
	background-color: rgba(255,255,255,.4);
    border-color: #fff;
}
.newsletter-form .wpcf7-submit {
	background-color: var(--second-color);
	border-color: var(--second-color);
	color: #072010;
	width: 100%;
}

.pxl-heading-wrap .heading-subtitle,
.pxl-pagetitle.layout-df .pxl-page-title .sub-title {
    font-family: var(--secondary-font);
}
.pxl-progressbar.layout-1 .title-wrap,
.pxl-pt-wrap .sub-title {
	font-family: var(--secondary-font);
}
.pxl-pagetitle.layout-df .pxl-page-title .main-title {
	font-family: var(--primary-font);
	font-weight: 700;
}
.pxl-pagetitle.layout-df .pxl-breadcrumb .br-item,
.pxl-brc-wrap .br-item,
.pxl-pt-wrap .main-title {
	font-family: var(--primary-font);
}
.product-info-fields {
	margin-bottom: 20px;
}

.info-field {
	display: flex;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
	gap: 10px;
}

.info-field:last-child {
	border-bottom: none;
}

.field-label {
	font-weight: 600;
	color: #333;
	font-size: 14px;
}

.field-value {
	color: #666;
	font-size: 14px;
}



/* Membership Promotion */
.membership-promotion {
	background: linear-gradient(135deg, #278d45 0%, #155527 100%);
	border-radius: 8px;
	padding: 15px;
	color: white;
}

.promotion-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
}

.promotion-text {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 500;
	flex: 1;
}

.promotion-text .mf-svg-wrapper {
	flex-shrink: 0;
	color: #f8c32c;
}

.promotion-text i {
	color: #ffd700;
	font-size: 16px;
	font-style: normal;
}

.register-button {
    background: #fff;
    color: var(--primary-color);
    border: none;
    padding: 10px 20px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 16px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 5px;
    line-height: 1;
    flex-shrink: 0;
}

.register-button:hover {
	background: #f8f9fa;
	transform: translateY(-2px);
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	text-decoration: none;
	color: #007cba;
}

.register-button i {
	font-size: 14px;
	font-style: normal;
}

/* Icon styles */

.icon-star::before {
	content: "⭐";
}

.icon-user-plus::before {
	content: "👤+";
}

h1, h2, h3, h4, h5, h6,
.pxl-product-grid .price,
.single-product .product-price,
.btn, button, .button, input[type="submit"], input[type="button"], .pxl-btn {
	font-family: var(--primary-font);
}
.product-action.woosw-btn {
	font-size: 0 !important;
}
.product-action.woosw-btn:before {
	content: "\e9be";
	margin-right: 0;
    font-family: "pxli";
    font-size: 1em;
	display: block;
	font-size: 14px;
}
.product-action.woosw-btn.woosw-added:before {
    content: "";
}
.product-action.woosw-btn.woosw-adding:before {
    display: none;
}
.pxl-accordion.style2 .ac-content {
	color: #333;
}
.pxl-pagetitle.layout-df .pxl-breadcrumb .br-item {
	font-size: 14px;
}
.elementor-widget-n-tabs .e-n-tab-title:hover, .elementor-widget-n-tabs .e-n-tab-title[aria-selected=true], .elementor-widget-n-tabs .e-n-tab-title[aria-selected=true] a {
	border-color: #e6e6e6;
    border-width: 0 0 1px;
    border-style: solid;
}

form.cart .qty-field {
	display: flex;
	align-items: center;
	gap: 10px;
}
form.cart .qty-field .qty-label {
	font-weight: 600;
}

.single-product-image-badge {
	margin-top: 20px;
}
.single-product-image-badge {
	margin-top: 20px;
}

.single-product-image-badge img {
	max-height: 150px;
}

.mf-swiper-slider .pxl-swiper-arrow-prev .pxl-icon svg {
	transform: rotate(180deg);
}

/* ----- STACK PRICE + RATING ----- */
.product-rating-price.d-flex {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

/* Giá (first child) */
.product-rating-price .price,
.mf-empty-price-wrap {
  display: block !important;
  width: 100%;
  line-height: 28px;
}

/* Rating (second child) */
.product-rating-price .product-rating {
  display: block !important;
  width: 100%;
}

/* ----- STYLE CHO ICON + TEXT ----- */
.mf-empty-price-wrap {
  font-size: 14px;
  font-weight: 600;
}

.mf-zalo-link {
  display: flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: #e53935;

}

.mf-zalo-icon {
  width: 20px;
  height: auto;
  vertical-align: middle;
  flex-shrink: 0;
}

/* CSS cho toàn bộ container */
.pxl-fancybox-content {
    max-height: 80vh; /* Giới hạn chiều cao tối đa 80% viewport */
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* CSS cho phần mô tả có thể cuộn */
.pxl-fancybox-content .desc {
    max-height: 200px; /* Giới hạn chiều cao phần mô tả */
    overflow-y: auto; /* Tạo thanh cuộn dọc */
    margin-bottom: 15px;
    
    /* Tùy chỉnh thanh cuộn cho đẹp hơn */
    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}

/* Tùy chỉnh thanh cuộn cho Webkit browsers */
.pxl-fancybox-content .desc::-webkit-scrollbar {
    width: 6px;
}

.pxl-fancybox-content .desc::-webkit-scrollbar-track {
    background: transparent;
}

.pxl-fancybox-content .desc::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 3px;
}

.pxl-fancybox-content .desc::-webkit-scrollbar-thumb:hover {
    background-color: #999;
}

.pxl-product-grid .grid-item {
	height: 100%;
}
.pxl-product-grid .product-wrap {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.pxl-product-grid .product-wrap {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.pxl-product-grid .product-main-img {
    position: relative;
    padding-bottom: 100%;
}
.pxl-product-grid .product-main-img img {
	position: absolute;
    object-fit: cover;
}
.pxl-product-grid .product-rating .star-rating {
	display: block;
}

.pxl-product-grid .product-info {
	padding: 15px !important;
}

.pxl-product-grid .product-info {
	flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#pxl-main-products .pxl-grid-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	margin: 0;
}
#pxl-main-products .pxl-grid-inner .grid-item {
	width: 100%;
	padding: 0;
	margin: 0;
}
.pxl-myaccount-login-reg-form .pxl-register-form {
	display: block;
}
.show-password-input {
	background: transparent !important;
}

.smc-collapsed {
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.smc-toggle {
    display: inline-block;
    margin-top: 8px;
    border-radius: 0;
    cursor: pointer;
    background: transparent !important;
    color: var(--primary-color);
    padding: 0;
    border: none;
    border-bottom: 2px solid var(--primary-color);
}
.smc-toggle:hover,
.smc-toggle:focus {
	color: var(--default-color);
}

.arcu-widget.arcu-message {
	z-index: 99998 !important;
}

/** POPUP ***/
.mf-popup {
  display: none; /* ẩn mặc định */
  position: fixed;
  inset: 0; /* top:0; right:0; bottom:0; left:0 */
  background: rgba(0,0,0,0.6);
  z-index: 9999;
  align-items: center;  /* canh giữa dọc */
  justify-content: center; /* canh giữa ngang */
  padding: 20px; /* để tránh dính sát màn hình khi nhỏ */
}
.mf-popup.active {
  display: flex; /* khi mở popup thì thêm class active */
}

/* Hộp nội dung */
.mf-popup .popup-content {
  background: #fff;
  padding: 30px 25px;
  border-radius: 12px;
  max-width: 600px;   /* giới hạn độ rộng */
  width: 100%;        /* full trong max-width */
  position: relative;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
  animation: fadeInUp 0.3s ease;
}

/* Nút đóng */
.mf-popup .popup-close {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 24px;
  cursor: pointer;
  color: #555;
  transition: color 0.2s;
}
.mf-popup .popup-close:hover {
  color: #000;
}

.newsletter-form.popup-form input.wpcf7-text {
	background-color: rgba(var(--primary-color-rgb), 0.05);
}

/* Hiệu ứng xuất hiện */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* Animation */
@keyframes pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.7; }
}

/* CSS riêng cho mobile */

/* Responsive */
@media (min-width: 1200px) {
    .pxl-heading-wrap .heading-subtitle,
	.pxl-pagetitle.layout-df .pxl-page-title .sub-title {
		font-size: 32px;
		line-height: 1.2;
	}
	.pxl-pagetitle.layout-df .pxl-page-title .main-title {
		font-size: 80px;
	}
}

@media (max-width: 991px) {
	#pxl-main-products .pxl-grid-inner {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 767px) {
	
	#pxl-main-products .pxl-grid-inner {
		grid-template-columns: repeat(2, 1fr);
	}
    .pxl-fancybox-content {
        max-height: 70vh; /* Giảm chiều cao trên mobile */
        padding: 15px;
    }
    
    .pxl-fancybox-content .desc {
        max-height: 150px; /* Giảm chiều cao phần mô tả trên mobile */
        font-size: 14px; /* Giảm kích thước font */
        line-height: 1.4;
    }
    
    .pxl-fancybox-content .title {
        font-size: 18px; /* Điều chỉnh kích thước tiêu đề */
        margin-bottom: 10px;
    }
    
    .pxl-fancybox-content .btn {
        margin-top: auto; /* Đẩy nút xuống dưới cùng */
        font-size: 14px;
    }
	.product-summary-info {
		padding: 15px;
	}

	.info-field {
		flex-direction: column;
		align-items: flex-start;
		gap: 5px;
	}

	.field-value {
		text-align: left;
		margin-left: 0;
	}

	.promotion-content {
		flex-direction: column;
		text-align: center;
		gap: 15px;
	}

	.register-button {
		width: 100%;
		justify-content: center;
	}
}
@media (max-width: 576px) {
    .row-cols-sm-2 > * {
        flex: 0 0 auto;
        width: 50%;
    }
}

/* CSS cho mobile nhỏ hơn */
@media (max-width: 480px) {
    .pxl-fancybox-content {
        max-height: 60vh;
        padding: 12px;
    }
    
    .pxl-fancybox-content .desc {
        max-height: 120px;
        font-size: 13px;
    }
}