/**
 * HYF Portfolio
 *
 * Reproduces what rendered template #827 before:
 *  1. Elementor wrapper defaults the template relied on.
 *  2. Essential Addons "Filterable Gallery" base styles (same selectors).
 *  3. Template #827's generated Elementor styles (post-827.css), re-scoped with
 *     the same specificity: ".elementor-827 .elementor-element.elementor-element-0c8639d"
 *     -> ".hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main".
 *  4. Grid + filter layout replacing Isotope.
 *
 * This file is enqueued from the shortcode, so it prints in the footer after the
 * theme's Additional CSS, the same position Elementor's template CSS had.
 * The site's Additional CSS (.portfolio-section ..., .eael-filter-gallery-control ...)
 * still applies on top.
 */

/* 1. Wrapper defaults (from Elementor frontend: .elementor-section, .elementor-widget, .elementor img) */
.hyf-portfolio {
	position: relative;
}
.hyf-portfolio *,
.hyf-portfolio ::before,
.hyf-portfolio ::after {
	box-sizing: border-box;
}
.hyf-portfolio-widget {
	position: relative;
}
.hyf-portfolio img {
	height: auto;
	max-width: 100%;
	border: none;
	border-radius: 0;
	box-shadow: none;
}
.hyf-portfolio a {
	box-shadow: none;
	text-decoration: none;
}

/* 2. Essential Addons Filterable Gallery base (card layout) */
.eael-filter-gallery-control {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	padding: 0;
	margin: 0;
}
.eael-filter-gallery-control ul,
.eael-filter-gallery-control ul li {
	text-align: center;
}
.eael-filter-gallery-control ul {
	margin: 0 0 20px 0;
	padding: 0;
	text-align: center;
}
.eael-filter-gallery-control ul li {
	list-style: none;
	font-size: 24px;
	display: inline-block;
	text-align: center;
}
.eael-filter-gallery-control ul li.control:focus-visible {
	outline: 1px solid #a9d204 !important;
}
.eael-filter-gallery-control > ul li {
	font-size: 13px;
	line-height: 1.8;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 6px 15px;
	cursor: pointer;
	margin: 0 5px;
	font-weight: normal;
}
.eael-filter-gallery-container {
	text-align: justify;
	font-size: 0.1px;
	overflow: hidden;
}
.eael-filterable-gallery-item-wrap {
	float: left;
	width: 33.33%;
}
.eael-gallery-grid-item {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
}
.gallery-item-caption-wrap {
	font-size: 14px;
	text-align: left;
}
.gallery-item-caption-over {
	width: 100%;
	height: auto;
}
body.rtl .gallery-item-caption-over {
	text-align: right;
}
.eael-filterable-gallery-item-wrap .eael-gallery-grid-item .gallery-item-thumbnail-wrap > img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}
.fg-item-title,
.fg-item-content {
	color: #ffffff;
	font-family: inherit;
}
.gallery-item-caption-wrap.caption-style-card .fg-item-title {
	font-size: 18px;
	margin: 15px 0 15px;
	line-height: 1;
}
.gallery-item-caption-wrap.caption-style-card {
	background: #f7f7f7;
}
.gallery-item-caption-wrap.caption-style-card .fg-item-title {
	margin: 10px 0 15px;
	color: #000000;
}
.gallery-item-caption-wrap.caption-style-card .fg-item-content {
	color: #212529;
	line-height: 1.5;
	font-weight: normal;
}
.gallery-item-caption-wrap.caption-style-card {
	padding: 10px;
	box-sizing: border-box;
	font-family: inherit;
}

/* 3. Template #827 widget settings (was uploads/elementor/css/post-827.css) */
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filter-gallery-wrapper {
	background-color: #fff;
	border-radius: 0;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filter-gallery-control ul li.control {
	color: #444;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filter-gallery-control ul > li.control {
	border-radius: 0;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filter-gallery-control ul li.active {
	color: #fff;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filter-gallery-control ul li.control.active {
	background: #333;
	border-radius: 0;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filterable-gallery-item-wrap .eael-gallery-grid-item {
	padding: 0;
	margin: 15px;
	border-radius: 0;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .eael-filterable-gallery-item-wrap .gallery-item-caption-wrap.caption-style-card {
	background-color: #f1f2f9;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .gallery-item-caption-wrap.caption-style-card .fg-item-title {
	color: #f56a6a;
}
.hyf-portfolio .hyf-portfolio-widget.hyf-portfolio-widget-main .gallery-item-caption-wrap.caption-style-card .fg-item-content {
	color: #444;
}

/* 4. Grid layout + filtering (replaces Isotope "fitRows") */
.hyf-portfolio .eael-filter-gallery-container {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
.hyf-portfolio .eael-filterable-gallery-item-wrap {
	float: none;
	transform-origin: 50% 50%;
}
.hyf-portfolio .eael-filterable-gallery-item-wrap.hyf-is-hidden {
	display: none;
}

/* Columns: same breakpoints the widget used (tablet <= 1024px, mobile <= 767px). */
.hyf-portfolio .hyf-cols-1 .eael-filterable-gallery-item-wrap { width: 100%; }
.hyf-portfolio .hyf-cols-2 .eael-filterable-gallery-item-wrap { width: 50%; }
.hyf-portfolio .hyf-cols-3 .eael-filterable-gallery-item-wrap { width: 33.3333%; }
.hyf-portfolio .hyf-cols-4 .eael-filterable-gallery-item-wrap { width: 25%; }
.hyf-portfolio .hyf-cols-5 .eael-filterable-gallery-item-wrap { width: 20%; }
.hyf-portfolio .hyf-cols-6 .eael-filterable-gallery-item-wrap { width: 16.6666%; }

@media only screen and (max-width: 1024px) {
	.hyf-portfolio .hyf-cols-tablet-1 .eael-filterable-gallery-item-wrap { width: 100%; }
	.hyf-portfolio .hyf-cols-tablet-2 .eael-filterable-gallery-item-wrap { width: 50%; }
	.hyf-portfolio .hyf-cols-tablet-3 .eael-filterable-gallery-item-wrap { width: 33.3333%; }
	.hyf-portfolio .hyf-cols-tablet-4 .eael-filterable-gallery-item-wrap { width: 25%; }
	.hyf-portfolio .hyf-cols-tablet-5 .eael-filterable-gallery-item-wrap { width: 20%; }
	.hyf-portfolio .hyf-cols-tablet-6 .eael-filterable-gallery-item-wrap { width: 16.6666%; }
}

@media only screen and (max-width: 767px) {
	.hyf-portfolio .hyf-cols-mobile-1 .eael-filterable-gallery-item-wrap { width: 100%; }
	.hyf-portfolio .hyf-cols-mobile-2 .eael-filterable-gallery-item-wrap { width: 50%; }
	.hyf-portfolio .hyf-cols-mobile-3 .eael-filterable-gallery-item-wrap { width: 33.3333%; }
	.hyf-portfolio .hyf-cols-mobile-4 .eael-filterable-gallery-item-wrap { width: 25%; }
	.hyf-portfolio .hyf-cols-mobile-5 .eael-filterable-gallery-item-wrap { width: 20%; }
	.hyf-portfolio .hyf-cols-mobile-6 .eael-filterable-gallery-item-wrap { width: 16.6666%; }
}