/* ستايل نيون: توهج أزرق/بنفسجي يطابق شعار "نيون فون". تأثيرات خفيفة بالوضع الفاتح وأقوى بالداكن */
:root{--nn-a:#00a2ff;--nn-b:#7c5cff;--nn-c:#ff3df2;--nn-glow:0 0 6px #00a2ff66,0 0 18px #7c5cff40}

/* الشريط العلوي */
.topbar-msg{background:linear-gradient(90deg,#060a16,#101a3a 30%,#1a1040 70%,#060a16);color:#e6f3ff;text-shadow:0 0 6px #00a2ffaa;border-bottom:1px solid #00a2ff55;box-shadow:0 1px 12px #00a2ff33}

/* اسم المحل بالأعلى */
.brand #bn{background:linear-gradient(90deg,var(--nn-a),var(--nn-b),var(--nn-c),var(--nn-a));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:nn-flow 8s linear infinite;filter:drop-shadow(0 0 6px #00a2ff55)}
.brand img{box-shadow:0 0 0 1px #00a2ff66,0 0 12px #00a2ff55;animation:nn-pulse 3.2s ease-in-out infinite}

/* بطاقة الواجهة: إطار نيون يدور */
.hero{isolation:isolate;box-shadow:0 0 0 1px #00a2ff40,0 10px 40px #00a2ff26,0 0 60px #7c5cff26}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;border-radius:inherit;padding:2px;background:conic-gradient(from var(--nn-ang,0deg),var(--nn-a),var(--nn-b),var(--nn-c),var(--nn-a));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:nn-spin 6s linear infinite;opacity:.9}
.hero h1{text-shadow:0 0 10px #00a2ff99,0 0 30px #7c5cff66}
.hero img{filter:drop-shadow(0 0 14px #00a2ffaa);animation:nn-float 5s ease-in-out infinite}
.hero .btn{box-shadow:0 0 0 2px #fff,0 0 18px #00a2ffcc,0 0 36px #7c5cff88}

/* عناوين الأقسام */
.sec:before{box-shadow:0 0 8px var(--nn-a),0 0 16px var(--nn-b)}

/* الأزرار الرئيسية */
.btn:not(.sec):not(.wa):not(.danger){background:linear-gradient(135deg,#0a6bdc,#5b3df5);box-shadow:0 4px 16px #3d6bff55}
.btn:not(.sec):not(.wa):not(.danger):hover{box-shadow:0 0 0 1px #8fd0ff,0 0 20px #00a2ffaa}
.btn.wa{box-shadow:0 4px 16px #0e7a3c55}

/* بطاقات الأقسام والمنتجات */
.cat,.p{transition:box-shadow .25s,transform .25s}
.cat:hover,.p:hover{box-shadow:0 0 0 1px #00a2ff80,0 6px 24px #00a2ff33,0 0 32px #7c5cff26}
.cat .ico{filter:drop-shadow(0 0 6px #00a2ff66)}
.p .tag{box-shadow:0 0 10px currentColor}

/* شريط التنقل السفلي */
.tab[aria-current=page]{color:var(--nn-a);text-shadow:0 0 8px #00a2ff99}
.tab[aria-current=page] svg{filter:drop-shadow(0 0 6px #00a2ffcc)}
.tab[aria-current=page]:after{content:"";position:absolute;top:0;inset-inline:30%;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--nn-a),var(--nn-b));box-shadow:0 0 8px var(--nn-a)}

/* زر موقعنا */
.npl-head{border-color:#00a2ff66;box-shadow:0 0 10px #00a2ff33}

/* الوضع الداكن: توهج أقوى وخلفية بنقاط ضوء خفيفة */
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]) body{background:radial-gradient(60% 40% at 100% 0,#7c5cff1f,transparent 70%),radial-gradient(50% 35% at 0 30%,#00a2ff17,transparent 70%),var(--bg);background-attachment:fixed}
  :root:not([data-theme=light]) .cat,:root:not([data-theme=light]) .p{box-shadow:0 0 0 1px #00a2ff2e,0 0 18px #00a2ff14}
}
:root[data-theme=dark] body{background:radial-gradient(60% 40% at 100% 0,#7c5cff1f,transparent 70%),radial-gradient(50% 35% at 0 30%,#00a2ff17,transparent 70%),var(--bg);background-attachment:fixed}
:root[data-theme=dark] .cat,:root[data-theme=dark] .p{box-shadow:0 0 0 1px #00a2ff2e,0 0 18px #00a2ff14}

@property --nn-ang{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes nn-spin{to{--nn-ang:360deg}}
@keyframes nn-flow{to{background-position:300% 0}}
@keyframes nn-pulse{0%,100%{box-shadow:0 0 0 1px #00a2ff66,0 0 10px #00a2ff44}50%{box-shadow:0 0 0 1px #7c5cff99,0 0 18px #7c5cff77}}
@keyframes nn-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){
  .brand #bn,.brand img,.hero:before,.hero img{animation:none}
}

/* ---- لمسات نهائية ---- */
html{scroll-behavior:smooth}
::selection{background:#00a2ff55;color:inherit}
:focus-visible{outline:2px solid var(--nn-a);outline-offset:2px;border-radius:8px}
.btn{transition:transform .12s,box-shadow .2s,filter .2s}
.btn:active{transform:scale(.97)}
.p{border-radius:18px}
.p:hover{transform:translateY(-3px)}
.p .btn:not(.sec){box-shadow:0 4px 14px #3d6bff44}
.tabbar{-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px)}
.skeleton-hero,.skeleton-row i,.skeleton-grid i{background-image:linear-gradient(100deg,transparent 30%,#00a2ff22 50%,transparent 70%);background-size:220% 100%;animation:nn-shimmer 1.5s linear infinite}
@keyframes nn-shimmer{from{background-position:120% 0}to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.skeleton-hero,.skeleton-row i,.skeleton-grid i{animation:none}.p:hover{transform:none}}
@media print{.topbar-msg,.tabbar,.appbar{display:none!important}}