/**
 * Outdoor Favourites — Heart Icon States & Animation
 */

/* ── Heart Icon States ── */

.outdoor-favourite-trigger {
	cursor: pointer;
	transition: transform 0.15s ease;
}

/* Active state: brand green */
.outdoor-favourite-trigger.outdoor-fav-active .elementor-icon {
	color: #56A89A !important;
	border-color: #56A89A !important;
}

.outdoor-favourite-trigger.outdoor-fav-active .elementor-icon svg {
	fill: #56A89A !important;
}

/* Loading state */
.outdoor-favourite-trigger.outdoor-fav-loading {
	opacity: 0.5;
	pointer-events: none;
}

/* Bounce animation on toggle */
.outdoor-favourite-trigger.outdoor-fav-bounce {
	animation: outdoorFavBounce 0.3s ease;
}

@keyframes outdoorFavBounce {
	0%   { transform: scale(1); }
	40%  { transform: scale(1.25); }
	100% { transform: scale(1); }
}

/* ── Favourites Page: Empty State ── */

.outdoor-favourites-empty {
	text-align: center;
	padding: 60px 20px;
	color: #666;
}

.outdoor-favourites-empty .dashicons {
	font-size: 48px;
	width: 48px;
	height: 48px;
	color: #ccc;
	margin-bottom: 16px;
}

.outdoor-favourites-empty p {
	font-size: 1.1em;
	margin-bottom: 20px;
}

.outdoor-favourites-empty .button {
	display: inline-block;
	padding: 10px 24px;
	background: #333;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
}

.outdoor-favourites-empty .button:hover {
	background: #555;
	color: #fff;
}

/* ── Favourites Page: 3-Column Product Grid ── */

.outdoor-favourites-grid ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 20px !important;
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.outdoor-favourites-grid ul.products li.product {
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Responsive: 2 columns on tablet, 1 on mobile */
@media (max-width: 768px) {
	.outdoor-favourites-grid ul.products {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 480px) {
	.outdoor-favourites-grid ul.products {
		grid-template-columns: 1fr !important;
	}
}

/* ── Popup: WooCommerce Login/Register Form ── */

/* Hide the My Account navigation/dashboard chrome inside popup */
.elementor-popup-modal .woocommerce-MyAccount-navigation {
	display: none !important;
}

.elementor-popup-modal .woocommerce-MyAccount-content {
	width: 100% !important;
	float: none !important;
}

/* Two-column login/register layout inside popup.
   WC uses float layout on .col-1/.col-2 — override with grid.
   IMPORTANT: WC's clearfix pseudo-elements (::before/::after with display:table)
   become grid items and break the 2-column layout. Must hide them. */
.elementor-popup-modal .u-columns.col2-set {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
}

.elementor-popup-modal .u-columns.col2-set::before,
.elementor-popup-modal .u-columns.col2-set::after {
	display: none !important;
	content: none !important;
}

.elementor-popup-modal .u-columns.col2-set .col-1,
.elementor-popup-modal .u-columns.col2-set .col-2 {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Form inputs fill their column */
.elementor-popup-modal .woocommerce-form .input-text {
	width: 100% !important;
	box-sizing: border-box;
}

/* Button styling inside popup */
.elementor-popup-modal .woocommerce-form button[type="submit"] {
	width: 100%;
	margin-top: 10px;
	background-color: #444543 !important;
	color: #fff !important;
	border: none !important;
	padding: 15px 20px !important;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease;
	border-radius: 4px;
}

.elementor-popup-modal .woocommerce-form button[type="submit"]:hover {
	background-color: #706964 !important;
	color: #fff !important;
}

@media (max-width: 600px) {
	.elementor-popup-modal .u-columns.col2-set {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}