/*
Theme Name: Lebasino Child
Theme URI: https://rtl-theme.com/?p=11020
Author: Jamal Ghaffari
Author URI: https://www.rtl-theme.com/user-profile/jamal_ghaffari/
Description: قالب فرزند Lebasino برای شخصی‌سازی و افزودن تغییرات بدون دست‌کاری در فایل‌های اصلی قالب والد. با استفاده از Lebasino Child می‌توانید استایل‌ها، توابع و فایل‌های سفارشی خود را به راحتی اضافه و مدیریت کنید.
Version: 1.0.0
Template: lebasino
Text Domain: lebasino-child
Domain Path: /languages
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: child-theme, lebasino, customization, woocommerce, elementor
*/


/* ========================================================= LEBASINO Mobile Floating Bottom Navigation ========================================================= */
 .lebasino-mobile-bottom-bar {
	/* ----------------------------------------- Variables ----------------------------------------- */
	--lebasino-bottom-bg: rgba(32, 32, 32, 0.96);
	 --lebasino-bottom-text: #f4f4f4;
	 --lebasino-bottom-muted: #a8a8a8;
	 --lebasino-bottom-border: rgba(255, 255, 255, 0.09);
	 --lebasino-primary: var(--primary-color, var(--e-global-color-primary, #3b82f6));
	 --lebasino-radius: 22px;
	 position: fixed;
	 right: 10px;
	 bottom: calc(10px + env(safe-area-inset-bottom));
	 left: 10px;
	 z-index: 99990;
	 display: none;
	 direction: rtl;
	 box-sizing: border-box;
	/* Floating */
	 background: var(--lebasino-bottom-bg);
	 border: 1px solid var(--lebasino-bottom-border);
	 border-radius: var(--lebasino-radius);
	 box-shadow: 0 10px 35px rgba(0, 0, 0, 0.25), 0 3px 12px rgba(0, 0, 0, 0.15);
	 backdrop-filter: blur(16px);
	 -webkit-backdrop-filter: blur(16px);
	 animation: lebasinoBottomBarIn 0.45s cubic-bezier(.22, 1, .36, 1);
}
/* ========================================================= Inner ========================================================= */
 .lebasino-mobile-bottom-inner {
	 position: relative;
	 display: flex;
	 align-items: stretch;
	 width: 100%;
	 height: 72px;
	 padding: 7px 6px calc(7px + env(safe-area-inset-bottom)) 6px;
	 box-sizing: border-box;
}
/* ========================================================= Item ========================================================= */
 .lebasino-mobile-bottom-item {
	 position: relative;
	 flex: 1 1 25%;
	 display: flex;
	 flex-direction: column;
	 align-items: center;
	 justify-content: center;
	 gap: 3px;
	 min-width: 0;
	 padding: 5px 3px;
	 border: 0;
	 outline: 0;
	 background: transparent;
	 color: var(--lebasino-bottom-muted);
	 font-family: inherit;
	 text-decoration: none !important;
	 cursor: pointer;
	 border-radius: 17px;
	 -webkit-tap-highlight-color: transparent;
	 transition: color .25s ease, background-color .25s ease, transform .25s cubic-bezier(.22, 1, .36, 1);
}
/* ========================================================= Hover / Active ========================================================= */
 .lebasino-mobile-bottom-item:hover {
	 color: var(--lebasino-primary);
}
 .lebasino-mobile-bottom-item.is-active {
	 color: var(--lebasino-primary);
	 background: color-mix( in srgb, var(--lebasino-primary) 12%, transparent );
}
/* ========================================================= Press Animation ========================================================= */
 .lebasino-mobile-bottom-item:active {
	 transform: scale(.91);
}
/* ========================================================= Icon ========================================================= */
 .lebasino-mobile-bottom-icon {
	 position: relative;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 width: 31px;
	 height: 31px;
	 color: currentColor;
}
 .lebasino-mobile-bottom-icon svg {
	 width: 25px;
	 height: 25px;
	 fill: none;
	 stroke: currentColor;
	 stroke-width: 1.65;
	 stroke-linecap: round;
	 stroke-linejoin: round;
	 transition: transform .3s cubic-bezier(.22, 1, .36, 1), stroke-width .2s ease;
}
/* Active icon */
 .lebasino-mobile-bottom-item.is-active .lebasino-mobile-bottom-icon svg {
	 transform: translateY(-2px) scale(1.06);
	 stroke-width: 1.9;
}
/* ========================================================= Label ========================================================= */
 .lebasino-mobile-bottom-label {
	 display: block;
	 max-width: 100%;
	 color: currentColor;
	 font-size: 11.5px;
	 font-weight: 500;
	 line-height: 1.4;
	 white-space: nowrap;
	 overflow: hidden;
	 text-overflow: ellipsis;
	 transition: transform .25s ease, color .25s ease;
}
 .lebasino-mobile-bottom-item.is-active .lebasino-mobile-bottom-label {
	 font-weight: 600;
	 transform: translateY(-1px);
}
/* ========================================================= Badge ========================================================= */
 .lebasino-mobile-badge {
	 position: absolute;
	 top: -3px;
	 right: -2px;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 min-width: 18px;
	 height: 18px;
	 padding: 0 4px;
	 box-sizing: border-box;
	 border-radius: 999px;
	 background: var(--lebasino-primary);
	 color: #fff;
	 font-family: inherit;
	 font-size: 9px;
	 font-weight: 800;
	 line-height: 1;
	 box-shadow: 0 2px 7px rgba(0, 0, 0, .25);
	 animation: lebasinoBadgeIn .35s cubic-bezier(.22, 1, .36, 1);
}
/* Badge when number is large */
 .lebasino-mobile-badge[data-badge] {
	 min-width: 18px;
}
/* ========================================================= Back Button ========================================================= */
 .lebasino-mobile-back-button {
	 appearance: none;
	 -webkit-appearance: none;
}
 .lebasino-mobile-back-button .lebasino-mobile-bottom-icon svg {
	 transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
 .lebasino-mobile-back-button:hover .lebasino-mobile-bottom-icon svg {
	 transform: translateY(-3px);
}
/* ========================================================= Touch feedback ========================================================= */
 .lebasino-mobile-bottom-item::after {
	 content: "";
	 position: absolute;
	 inset: 8px;
	 border-radius: 15px;
	 background: var(--lebasino-primary);
	 opacity: 0;
	 transform: scale(.7);
	 pointer-events: none;
	 transition: opacity .2s ease, transform .2s ease;
}
 .lebasino-mobile-bottom-item:active::after {
	 opacity: .07;
	 transform: scale(1);
}
/* ========================================================= Animations ========================================================= */
 @keyframes lebasinoBottomBarIn {
	 from {
		 opacity: 0;
		 transform: translateY(25px) scale(.96);
	}
	 to {
		 opacity: 1;
		 transform: translateY(0) scale(1);
	}
}
 @keyframes lebasinoActiveIndicator {
	 from {
		 width: 8px;
		 opacity: 0;
	}
	 to {
		 width: 22px;
		 opacity: 1;
	}
}
 @keyframes lebasinoBadgeIn {
	 from {
		 opacity: 0;
		 transform: scale(.5);
	}
	 70% {
		 transform: scale(1.12);
	}
	 to {
		 opacity: 1;
		 transform: scale(1);
	}
}
/* ========================================================= Mobile ========================================================= */
 @media (max-width: 767px) {
	 .lebasino-mobile-bottom-bar {
		 display: block;
	}
	 body {
		 padding-bottom: 95px;
	}
	 #goftino_w{
		 bottom:90px !important;
	}
}
/* ========================================================= Small Screens ========================================================= */
 @media (max-width: 380px) {
	 .lebasino-mobile-bottom-bar {
		 right: 7px;
		 bottom: calc(7px + env(safe-area-inset-bottom));
		 left: 7px;
		 border-radius: 19px;
	}
	 .lebasino-mobile-bottom-inner {
		 height: 68px;
		 padding: 5px;
	}
	 .lebasino-mobile-bottom-label {
		 font-size: 10.5px;
	}
	 .lebasino-mobile-bottom-icon {
		 width: 28px;
		 height: 28px;
	}
	 .lebasino-mobile-bottom-icon svg {
		 width: 23px;
		 height: 23px;
	}
	 body {
		 padding-bottom: 88px;
	}
}
/* ========================================================= Accessibility ========================================================= */
 @media (prefers-reduced-motion: reduce) {
	 .lebasino-mobile-bottom-bar, .lebasino-mobile-bottom-item, .lebasino-mobile-bottom-item svg, .lebasino-mobile-bottom-label, .lebasino-mobile-badge {
		 animation: none !important;
		 transition: none !important;
	}
}
 .lebasino-badge-bump {
	 animation: lebasinoBadgeBump .45s cubic-bezier(.22, 1, .36, 1) !important;
}
 .lebasino-wishlist-bump {
	 animation: lebasinoWishlistBump .45s cubic-bezier(.22, 1, .36, 1);
}
 @keyframes lebasinoBadgeBump {
	 0% {
		 transform: scale(1);
	}
	 40% {
		 transform: scale(1.35);
	}
	 70% {
		 transform: scale(.92);
	}
	 100% {
		 transform: scale(1);
	}
}
 @keyframes lebasinoWishlistBump {
	 0% {
		 transform: scale(1);
	}
	 40% {
		 transform: scale(1.18) rotate(-8deg);
	}
	 70% {
		 transform: scale(.95) rotate(5deg);
	}
	 100% {
		 transform: scale(1) rotate(0);
	}
}
