.close-btn {
    position: absolute;
    top: 25px;
    right: 69px;  
    z-index: 99;
    cursor: pointer;
}

 
.mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    visibility: hidden;  
    opacity: 0.7;
    transition: all 0.5s ease;
}

 
.menu-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
   
    z-index: 10;
    opacity: 0.7;
    transition: opacity 0.5s ease;
}

 
.menu-box {
    position: absolute;
    top: 0;
    left: 0; /* التثبيت على اليسار */
    width: 300px; /* عرض القائمة */
    max-width: 85%;
    height: 100%;
    z-index: 50;
    transform: translateX(-100%); /* دفع القائمة لليسار خارج الشاشة */
    transition: transform 0.5s cubic-bezier(0.7, 0, 0.3, 1);
    overflow-y: auto;
}

 

/* الحالة النشطة (عند ظهور القائمة) */
/* يفترض أن الكلاس 'mobile-menu-visible' يضاف للـ body أو للحاوية الأب */
.mobile-menu-visible .mobile-menu {
    visibility: visible;
    opacity: 1;
}

.mobile-menu-visible .menu-backdrop {
    opacity: 0.7;
}

.mobile-menu-visible .menu-box {
    transform: translateX(0); /* تعود القائمة لمكانها (من اليسار لليمين) */
}
.left-icon{
left: calc(var(--spacing) * 3.5);	
 right: unset;
}
.left-txt{
 left: 0;
 right:unset;
}
.scl-img{
 transform: scaleX(-1)
}
.left-470 {
 left: 470px;
 right:unset
}
.left-440 {
 left: 440px;
  right:unset
}
.bg-shape2{
 background-image: url(../images/shape/shape-2.png);
 transform:scaleX(-1)
}

.logo-img{
	width:60%
}
@media (max-width: 768px) {
.logo-img{
	width:68%
}	
}

.alert-cs {
    background-color: oklab(72.3% -.18885 .110891 / .1);
    outline-color: oklab(72.3% -.18885 .110891 / .2);
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
    border-radius: .375rem;
    color: oklch(87.1% .15 154.449);
    padding: 20px;
}

.alert-cd {
    background-color: oklab(0.62 0.17 0.12 / 0.1);
    outline-color: oklab(0.61 0.16 0.12 / 0.2);
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
    border-radius: .375rem;
    color: oklch(0.8 0.11 30.84);
    padding: 20px;
}