/**
 * NexaShop Solar Icons - Elementor & Theme Optimization Master Stylesheet
 * Ensures precise, pixel-perfect, and professional sizing and alignment
 * across Elementor widgets, theme widgets, and responsive breakpoints.
 *
 * @package NexaShop
 * @subpackage Icons
 * @version 1.1.0
 */

/* ==========================================================================
   1. ROOT VARIABLES & UNIVERSAL SIZING CLASSES
   ========================================================================== */
:root {
	--solar-base-size: 1em;
}

.solar {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: var(--solar-size, 1em);
	height: var(--solar-size, 1em);
	min-width: var(--solar-size, 1em);
	min-height: var(--solar-size, 1em);
	line-height: 1 !important;
	vertical-align: middle !important;
	position: relative;
	background-color: currentColor;
	mask-repeat: no-repeat !important;
	mask-position: center center !important;
	mask-size: contain !important;
	-webkit-mask-repeat: no-repeat !important;
	-webkit-mask-position: center center !important;
	-webkit-mask-size: contain !important;
	flex-shrink: 0 !important;
	box-sizing: content-box;
	font-style: normal;
	speak: never;
}

/* Explicit Utility Size Classes */
.solar-xs  { --solar-size: 12px; font-size: 12px !important; width: 12px !important; height: 12px !important; }
.solar-sm  { --solar-size: 14px; font-size: 14px !important; width: 14px !important; height: 14px !important; }
.solar-md  { --solar-size: 18px; font-size: 18px !important; width: 18px !important; height: 18px !important; }
.solar-lg  { --solar-size: 22px; font-size: 22px !important; width: 22px !important; height: 22px !important; }
.solar-xl  { --solar-size: 28px; font-size: 28px !important; width: 28px !important; height: 28px !important; }
.solar-2xl { --solar-size: 36px; font-size: 36px !important; width: 36px !important; height: 36px !important; }
.solar-3xl { --solar-size: 48px; font-size: 48px !important; width: 48px !important; height: 48px !important; }

/* Prevent disappearing when parent sets font-size: 0 to hide text */
[style*="font-size: 0"] > .solar,
[style*="font-size:0"] > .solar,
[style*="font-size: 0px"] > .solar,
[style*="font-size:0px"] > .solar {
	font-size: 18px !important;
}

/* ==========================================================================
   2. ELEMENTOR CORE WIDGETS INTEGRATION
   ========================================================================== */

/* 2.1 Elementor Icon Widget */
.elementor-widget-icon .elementor-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center;
}

.elementor-widget-icon .elementor-icon i.solar,
.elementor-widget-icon .elementor-icon .solar {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 1em !important;
	height: 1em !important;
	min-width: 1em !important;
	min-height: 1em !important;
	font-size: inherit !important;
	margin: auto !important;
	vertical-align: middle !important;
	transform: none;
}

/* Stacked & Framed Circle/Square Icon Fix */
.elementor-view-stacked .elementor-icon,
.elementor-view-framed .elementor-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	line-height: 1 !important;
}

.elementor-view-stacked .elementor-icon i.solar,
.elementor-view-framed .elementor-icon i.solar {
	width: 1em !important;
	height: 1em !important;
	margin: auto !important;
}

/* 2.2 Elementor Icon Box Widget */
.elementor-widget-icon-box .elementor-icon-box-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.elementor-widget-icon-box .elementor-icon-box-icon .elementor-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.elementor-widget-icon-box .elementor-icon-box-icon i.solar,
.elementor-widget-icon-box .elementor-icon-box-icon .solar {
	display: inline-flex !important;
	width: 1em !important;
	height: 1em !important;
	min-width: 1em !important;
	min-height: 1em !important;
	font-size: inherit !important;
	vertical-align: middle !important;
	margin: auto !important;
}

/* 2.3 Elementor Button Widget */
.elementor-button .elementor-button-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	vertical-align: middle;
	flex-shrink: 0;
}

.elementor-button .elementor-button-icon i.solar,
.elementor-button .elementor-button-icon .solar {
	display: inline-flex !important;
	font-size: 1.18em;
	width: 1em !important;
	height: 1em !important;
	vertical-align: middle !important;
	color: inherit;
}

/* RTL Spacing for Button Icons */
html[dir="rtl"] .elementor-button .elementor-align-icon-right .solar {
	margin-left: 8px;
	margin-right: 0;
}

html[dir="rtl"] .elementor-button .elementor-align-icon-left .solar {
	margin-right: 8px;
	margin-left: 0;
}

/* 2.4 Elementor Icon List Widget */
.elementor-icon-list-item {
	display: flex !important;
	align-items: center !important;
}

.elementor-icon-list-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0;
}

.elementor-icon-list-icon i.solar,
.elementor-icon-list-icon .solar {
	display: inline-flex !important;
	width: 1em !important;
	height: 1em !important;
	font-size: inherit !important;
	vertical-align: middle !important;
}

/* 2.5 Elementor Icon Picker Modal in WP Admin */
.elementor-icons-manager__tab__item i.solar,
.e-icon-picker i.solar {
	display: inline-flex !important;
	width: 24px !important;
	height: 24px !important;
	font-size: 24px !important;
	color: #495157;
	vertical-align: middle;
	margin-bottom: 6px;
}

.elementor-icons-manager__tab__item:hover i.solar,
.e-icon-picker .active i.solar {
	color: #5856d6;
}

/* ==========================================================================
   3. NEXASHOP THEME WIDGETS INTEGRATION & BALANCED SIZING
   ========================================================================== */

/* 3.1 Category Products Columns Widget (بر اساس دسته‌بندی) */
.nexashop-cat-btn-wishlist {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 17px;
}

.nexashop-cat-btn-wishlist i.solar,
.nexashop-cat-btn-wishlist .solar {
	font-size: 17px !important;
	width: 17px !important;
	height: 17px !important;
	min-width: 17px !important;
	min-height: 17px !important;
	color: inherit !important;
}

.nexashop-cat-btn-cart {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.nexashop-cat-btn-cart i.solar,
.nexashop-cat-btn-cart .solar {
	font-size: 15px !important;
	width: 15px !important;
	height: 15px !important;
	min-width: 15px !important;
	min-height: 15px !important;
	color: inherit !important;
}

.nexashop-cat-header-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.nexashop-cat-header-icon i.solar,
.nexashop-cat-header-icon .solar {
	font-size: 22px !important;
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	min-height: 22px !important;
	color: inherit !important;
}

.nexashop-col-see-all-btn i.solar,
.nexashop-col-see-all-btn .solar {
	font-size: 14px !important;
	width: 14px !important;
	height: 14px !important;
	margin-left: 4px;
}

/* 3.2 Special Offers Carousel (فروش ویژه) */
.nexashop-special-top-badge {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.nexashop-special-top-badge i.solar,
.nexashop-special-top-badge .solar {
	font-size: 22px !important;
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	min-height: 22px !important;
	color: #ffffff;
}

.nexashop-special-btn-wishlist {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 18px;
}

.nexashop-special-btn-wishlist i.solar,
.nexashop-special-btn-wishlist .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	min-height: 18px !important;
	color: inherit !important;
}

.nexashop-special-btn-cart i.solar,
.nexashop-special-btn-cart .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
	color: inherit !important;
}

.nexashop-special-nav-btn i.solar,
.nexashop-special-nav-btn .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
}

.nexashop-special-clock-pill i.solar,
.nexashop-special-clock-pill .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
	color: #10b981;
}

/* 3.3 Special Offers V2 */
.nexashop-v2-btn-cart i.solar,
.nexashop-v2-btn-cart .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
	color: inherit !important;
}

.nexashop-v2-nav-btn i.solar,
.nexashop-v2-nav-btn .solar {
	font-size: 17px !important;
	width: 17px !important;
	height: 17px !important;
}

/* 3.4 Similar Products Widget (کالاهای مشابه) */
.nexashop-similar-wishlist {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 17px;
}

.nexashop-similar-wishlist i.solar,
.nexashop-similar-wishlist .solar {
	font-size: 17px !important;
	width: 17px !important;
	height: 17px !important;
	min-width: 17px !important;
	min-height: 17px !important;
	color: inherit !important;
}

.nexashop-similar-btn-add {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 16px;
}

.nexashop-similar-btn-add i.solar,
.nexashop-similar-btn-add .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
	min-width: 16px !important;
	min-height: 16px !important;
	color: inherit !important;
}

.nexashop-similar-box .swiper-button-next i.solar,
.nexashop-similar-box .swiper-button-prev i.solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
}

/* 3.5 Product Carousel & Products Grid */
.nexashop-card-add-btn i.solar,
.nexashop-card-add-btn .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
	margin-left: 4px;
	color: inherit !important;
}

.nexashop-carousel-btn i.solar,
.nexashop-carousel-btn .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
}

.nexashop-carousel-icon i.solar,
.nexashop-carousel-icon .solar {
	font-size: inherit !important;
	width: 1em !important;
	height: 1em !important;
}

.nexashop-listing-btn-cart i.solar,
.nexashop-listing-btn-cart .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
}

/* 3.6 Floating Contact & Header / Mobile Navigation */
.nexashop-floating-contact-btn i.solar,
.nexashop-floating-contact-btn .solar {
	font-size: 26px !important;
	width: 26px !important;
	height: 26px !important;
	color: inherit !important;
}

.nexashop-bottom-nav-item i.solar,
.nexashop-bottom-nav-item .solar {
	font-size: 20px !important;
	width: 20px !important;
	height: 20px !important;
	margin-bottom: 2px;
	color: inherit !important;
}

.nexashop-menu-link i.solar,
.nexashop-menu-link .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
	margin-left: 8px;
}

.nexashop-header-search-btn i.solar,
.nexashop-header-search-btn .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
}

.nexashop-user-account-btn i.solar,
.nexashop-user-account-btn .solar {
	font-size: 20px !important;
	width: 20px !important;
	height: 20px !important;
}

.nexashop-cart-trigger-btn i.solar,
.nexashop-cart-trigger-btn .solar {
	font-size: 20px !important;
	width: 20px !important;
	height: 20px !important;
}

/* 3.7 Single Product Page Elements */
.nexashop-sp-actions-toolbar .sp-action-btn i.solar,
.nexashop-sp-actions-toolbar .sp-action-btn .solar {
	font-size: 20px !important;
	width: 20px !important;
	height: 20px !important;
}

.nexashop-sp-mobile-action-pills .sp-mobile-pill-btn i.solar,
.nexashop-sp-mobile-action-pills .sp-mobile-pill-btn .solar {
	font-size: 16px !important;
	width: 16px !important;
	height: 16px !important;
}

.nexashop-sp-services-item .sp-service-icon i.solar,
.nexashop-sp-services-item .sp-service-icon .solar {
	font-size: 26px !important;
	width: 26px !important;
	height: 26px !important;
}

.nexashop-sp-sku-box i.solar,
.nexashop-sp-feedback-trigger i.solar {
	font-size: 14px !important;
	width: 14px !important;
	height: 14px !important;
}

.prk-sticky-add-cart i.solar,
.prk-sticky-add-cart .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
}

.sp-btn-add-to-cart i.solar,
.sp-btn-add-to-cart .solar {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
}

/* ==========================================================================
   4. SMART PROPORTIONAL SIZING FOR ALL BUTTONS & CONTAINERS
   ========================================================================== */

/* Square or circular button with only a solar icon inside:
   Ensures the icon occupies approximately 50% to 56% of the button box */
button:not([style*="font-size"]) > i.solar:only-child,
.btn:not([style*="font-size"]) > i.solar:only-child,
[class*="-btn"]:not([style*="font-size"]) > i.solar:only-child,
[class*="-wishlist"]:not([style*="font-size"]) > i.solar:only-child,
[class*="-badge"]:not([style*="font-size"]) > i.solar:only-child {
	font-size: 1.25em;
	width: 1em;
	height: 1em;
}

/* Smooth SVG & Icon transition */
.solar,
i.solar {
	transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
	            color 0.2s cubic-bezier(0.16, 1, 0.3, 1),
	            opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
