/* الخلفية السودا اللي بتظهر ورا القائمة */

[id^="headlessui-dialog"] .fixed.inset-0.bg-black,
[id^="headlessui-dialog"] .fixed.inset-0{

backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);

background:rgba(0,0,0,.45)!important;

transition:.35s ease;

}

/* القائمة نفسها */

[id^="headlessui-dialog"] .bg-white,
[id^="headlessui-dialog"] .panel-inner{

background:rgba(20,20,20,.72)!important;

backdrop-filter:blur(28px);
-webkit-backdrop-filter:blur(28px);

border-left:
1px solid rgba(224,210,183,.08);

box-shadow:
-30px 0 80px rgba(0,0,0,.45);

}

/* Glow بسيط */

[id^="headlessui-dialog"] .bg-white::before,
[id^="headlessui-dialog"] .panel-inner::before{

content:"";

position:absolute;

top:0;
left:0;
right:0;

height:1px;

background:
linear-gradient(
90deg,
transparent,
rgba(224,210,183,.22),
transparent
);

}