/* ===== THEME PICKER MODAL ===== */
#theme-picker-ov{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.75);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:.3s;}
#theme-picker-ov.on{opacity:1;pointer-events:all;}
#theme-picker-box{background:linear-gradient(145deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.25);border-radius:20px;padding:28px;width:440px;max-width:96vw;max-height:88vh;overflow-y:auto;transform:scale(.9);transition:.35s cubic-bezier(.34,1.56,.64,1);}
#theme-picker-box::-webkit-scrollbar{width:4px;}
#theme-picker-box::-webkit-scrollbar-track{background:transparent;}
#theme-picker-box::-webkit-scrollbar-thumb{background:rgba(245,166,35,.3);border-radius:4px;}
#theme-picker-ov.on #theme-picker-box{transform:scale(1);}
.theme-opts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:16px;}
.theme-opt{border-radius:12px;padding:13px 8px;cursor:pointer;border:2px solid rgba(255,255,255,.1);transition:.25s;text-align:center;font-family:'Cairo',sans-serif;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:6px;color:#ddd;}
.theme-opt.active{border-color:var(--t-accent2)!important;box-shadow:0 0 12px var(--t-glow);}
.theme-opt:hover{transform:scale(1.06);border-color:rgba(255,255,255,.3);}
.theme-dot{width:30px;height:30px;border-radius:50%;}

.logo{display:flex;align-items:center;gap:12px;}
.logo-ic{
  width:46px;height:46px;
  background:linear-gradient(135deg,var(--t-accent),var(--t-accent2));
  border-radius:14px;display:flex;align-items:center;justify-content:center;
  font-size:24px;box-shadow:0 0 25px var(--t-glow);
}
.logo-t{font-family:'Tajawal',sans-serif;font-size:20px;font-weight:900;background:linear-gradient(135deg,var(--t-accent2),var(--t-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.logo-s{font-size:10px;color:var(--mut);letter-spacing:2px;}
.sbdg{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);padding:6px 14px;border-radius:50px;font-size:12px;}
.sdot{width:7px;height:7px;border-radius:50%;background:var(--grn);animation:pulse 2s ease-in-out infinite;box-shadow:0 0 8px var(--grn);}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.5)}}

/* HERO */
.hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px 20px;text-align:center;position:relative;}
.hero-badge{
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.3);
  padding:7px 18px;border-radius:50px;font-size:12px;color:var(--gl);margin-bottom:24px;
  animation:fadeInDown .8s ease;
}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
.hero-h{font-family:'Tajawal',sans-serif;font-size:clamp(32px,5vw,64px);font-weight:900;line-height:1.1;margin-bottom:14px;animation:fadeInUp .8s ease .1s both;}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.hero-h .g{background:linear-gradient(135deg,var(--gl),var(--gold),#ff8f00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero-p{font-size:15px;color:var(--mut);max-width:480px;line-height:1.8;margin-bottom:32px;animation:fadeInUp .8s ease .2s both;}
.btn-grp{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;animation:fadeInUp .8s ease .3s both;}
.btn{padding:13px 28px;border-radius:12px;font-family:'Cairo',sans-serif;font-size:15px;font-weight:700;border:none;cursor:pointer;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;align-items:center;gap:8px;}
.btn:hover{transform:translateY(-3px) scale(1.03);}
.btn-p{background:linear-gradient(135deg,var(--t-accent),var(--t-accent2),#e65100);color:white;box-shadow:0 6px 25px var(--t-glow);}
.btn-s{background:rgba(255,255,255,.06);color:var(--w);border:1px solid rgba(255,255,255,.15);}
.btn-g{background:transparent;color:var(--gl);border:2px solid rgba(245,166,35,.4);}

/* FEATURES STRIP */


/* STATS BAR */
.stats-bar{
  display:flex;gap:24px;justify-content:center;align-items:center;
  padding:10px 20px 0;animation:fadeInUp .8s ease .35s both;flex-wrap:wrap;
}
.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px;}
.stat-num{font-family:'Tajawal',sans-serif;font-size:22px;font-weight:900;color:var(--t-accent2);}
.stat-lbl{font-size:10px;color:var(--mut);letter-spacing:1px;}

/* Footer */
.site-footer{padding:12px 20px;border-top:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0;}
.footer-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.footer-btn{background:transparent;border:none;color:var(--mut);font-family:'Cairo',sans-serif;font-size:11px;cursor:pointer;padding:4px 8px;border-radius:6px;transition:.2s;}
.footer-btn:hover{color:white;background:rgba(255,255,255,.05);}
.footer-copy{font-size:10px;color:rgba(255,255,255,.2);}


/* MODALS */
.overlay{position:fixed;inset:0;z-index:100;background:rgba(5,13,26,.88);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:.4s;}
.overlay.on{opacity:1;pointer-events:all;}
.modal{background:linear-gradient(145deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.25);border-radius:24px;padding:34px;width:390px;max-width:94vw;transform:scale(.9) translateY(30px);transition:.4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden;}
.modal::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--gold),var(--gl),var(--gold),transparent);}
.overlay.on .modal{transform:scale(1) translateY(0);}
.mhdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.mtit{font-family:'Tajawal',sans-serif;font-size:19px;font-weight:800;background:linear-gradient(135deg,var(--gl),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.mcl{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--mut);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.mcl:hover{background:rgba(255,80,80,.2);color:white;}
.fg{margin-bottom:14px;}
.fl{display:block;font-size:11px;color:var(--mut);margin-bottom:6px;font-weight:600;}
.fi,.fsel{width:100%;padding:12px 14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:11px;color:white;font-family:'Cairo',sans-serif;font-size:14px;outline:none;appearance:none;-webkit-appearance:none;transition:.3s;}
.fi:focus,.fsel:focus{border-color:var(--gold);background:rgba(245,166,35,.06);}
.fi::placeholder{color:rgba(255,255,255,.25);}
.fsel option{background:#0d1f3c;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.sw{position:relative;}.sw::after{content:'▼';position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:9px;color:var(--gold);pointer-events:none;}
.btn-full{width:100%;justify-content:center;padding:13px;font-size:15px;border-radius:11px;margin-top:6px;}
.fmsg{font-size:12px;margin-top:8px;padding:8px 12px;border-radius:9px;display:none;}
.fmsg.e{background:rgba(239,83,80,.1);color:#ef9a9a;border:1px solid rgba(239,83,80,.2);display:block;}
.fmsg.k{background:rgba(0,230,118,.1);color:#a5d6a7;border:1px solid rgba(0,230,118,.2);display:block;}

/* ===== CHAT PAGE ===== */
#chat-page{
  display:none;
  position:fixed;
  inset:0;
  z-index:1;
  flex-direction:column;
}
.chat-hdr{
  height:58px;
  flex-shrink:0;
  background:rgba(10,22,40,.97);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(245,166,35,.2);
  padding:0 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:10;
}
.clogo{display:flex;align-items:center;gap:9px;cursor:pointer;}
.clogo-ic{width:36px;height:36px;background:linear-gradient(135deg,var(--gold),var(--gd));border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;}
.clogo-t{font-family:'Tajawal',sans-serif;font-weight:900;font-size:15px;background:linear-gradient(135deg,var(--gl),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.cnav{display:flex;gap:3px;}
.cnav-btn{padding:6px 14px;border-radius:8px;background:transparent;border:none;color:var(--mut);font-family:'Cairo',sans-serif;font-size:12px;cursor:pointer;transition:.2s;}
.cnav-btn:hover,.cnav-btn.on{background:rgba(245,166,35,.12);color:var(--gl);}

/* THE KEY FIX - chat body fills remaining space */
.chat-body{
  flex:1;
  display:grid;
  grid-template-columns:240px 1fr 260px;
  min-height:0; /* CRITICAL */
  overflow:hidden;
  direction:ltr; /* keep rooms on left, users on right regardless of page RTL */
}
.chat-body > * { direction: rtl; } /* restore RTL for content inside panels */

/* PANELS */
.rpanel,.upanel{background:rgba(8,18,35,.85);display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.rpanel{border-left:1px solid rgba(255,255,255,.06);}
.upanel{border-right:1px solid rgba(255,255,255,.06);}
.phdr{padding:13px 15px;font-size:10px;font-weight:700;color:var(--gold);letter-spacing:2px;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.05);display:flex;align-items:center;gap:5px;flex-shrink:0;}
.slist{flex:1;overflow-y:auto;padding:7px;}
.slist::-webkit-scrollbar{width:3px;}.slist::-webkit-scrollbar-thumb{background:rgba(245,166,35,.3);border-radius:3px;}
.ri{padding:10px 12px;border-radius:10px;cursor:pointer;transition:.2s;margin-bottom:3px;display:flex;align-items:center;gap:8px;border:1px solid transparent;}
.ri:hover{background:rgba(245,166,35,.08);border-color:rgba(245,166,35,.15);}
.ri.on{background:rgba(245,166,35,.15);border-color:rgba(245,166,35,.3);}
.r-ic{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.r-nm{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.r-cn{font-size:10px;color:var(--mut);}

/* MAIN CHAT - THE KEY */
.cmain{
  display:flex;
  flex-direction:column;
  background:rgba(6,14,26,.6);
  min-height:0; /* CRITICAL */
  overflow:hidden;
}
.crhdr{padding:11px 16px;background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:9px;flex-shrink:0;}
.cr-nm{font-size:14px;font-weight:700;}
.cr-sb{font-size:11px;color:var(--mut);}

/* MESSAGES - THE KEY */
.msgs{
  flex:1;
  overflow-y:auto;
  padding:15px;
  display:flex;
  flex-direction:column;
  gap:3px;
  min-height:0; /* CRITICAL */
}
.msgs::-webkit-scrollbar{width:3px;}.msgs::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:3px;}
.welcome{background:linear-gradient(135deg,rgba(245,166,35,.1),rgba(245,166,35,.05));border:1px solid rgba(245,166,35,.2);border-radius:11px;padding:11px 16px;margin-bottom:12px;text-align:center;font-size:12px;color:var(--gl);}
.msg{display:flex;align-items:flex-start;gap:8px;padding:4px 3px;border-radius:8px;transition:.2s;animation:mi .25s ease;}
/* Name Frames */
.nf-gold{background:linear-gradient(90deg,#ffd700,#ff8c00,#ffd700);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 2s linear infinite;}
.nf-fire{background:linear-gradient(90deg,#ff4500,#ff8c00,#ffd700,#ff4500);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 1.5s linear infinite;}
.nf-ice{background:linear-gradient(90deg,#00cfff,#a8edff,#00cfff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 2s linear infinite;}
.nf-galaxy{background:linear-gradient(90deg,#b044ff,#ff44aa,#44aaff,#b044ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:300%;animation:nf-shine 3s linear infinite;}
.nf-rose{background:linear-gradient(90deg,#ff6b9d,#ff4081,#ff6b9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 2s linear infinite;}
.nf-emerald{background:linear-gradient(90deg,#00e676,#69f0ae,#00e676);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 2s linear infinite;}
.nf-royal{background:linear-gradient(90deg,#ffd700,#fff,#ffd700);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 2.5s linear infinite;}
.nf-neon{color:#39ff14!important;text-shadow:0 0 6px #39ff14,0 0 14px #39ff14,0 0 22px #39ff14;}
.nf-plasma{background:linear-gradient(90deg,#ff00ff,#00ffff,#ff00ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:nf-shine 1.8s linear infinite;}
@keyframes nf-shine{0%{background-position:0%}100%{background-position:200%}}

/* ===== NAME FRAME BORDER WRAPPERS — ENHANCED SHIMMER & GLOW ===== */
/* Base shimmer sweep shared by all animated frames */
@keyframes nfw-sweep{0%,25%{left:-80%;opacity:0}30%{opacity:1}85%{opacity:.7}100%{left:130%;opacity:0}}
@keyframes nfw-gold-glow{0%,100%{box-shadow:0 0 5px rgba(255,215,0,.35),inset 0 0 4px rgba(255,215,0,.06)}50%{box-shadow:0 0 14px rgba(255,215,0,.75),0 0 24px rgba(255,200,0,.35),inset 0 0 10px rgba(255,215,0,.14)}}
@keyframes nfw-fire-glow{0%,100%{box-shadow:0 0 6px rgba(255,100,0,.45);border-color:#ff660088}50%{box-shadow:0 0 18px rgba(255,150,0,.75),0 0 30px rgba(255,60,0,.4);border-color:#ffaa00bb}}
@keyframes nfw-ice-glow{0%,100%{box-shadow:0 0 6px rgba(0,207,255,.35)}50%{box-shadow:0 0 16px rgba(0,207,255,.65),0 0 26px rgba(0,180,255,.28)}}
@keyframes nfw-galaxy-glow{0%{box-shadow:0 0 8px rgba(176,68,255,.45);border-color:#b044ff99}33%{box-shadow:0 0 16px rgba(255,68,170,.55);border-color:#ff44aaaa}66%{box-shadow:0 0 16px rgba(68,170,255,.55);border-color:#44aaffaa}100%{box-shadow:0 0 8px rgba(176,68,255,.45);border-color:#b044ff99}}
@keyframes nfw-rose-glow{0%,100%{box-shadow:0 0 6px rgba(255,64,129,.35)}50%{box-shadow:0 0 16px rgba(255,64,129,.68),0 0 26px rgba(255,100,180,.28)}}
@keyframes nfw-emerald-glow{0%,100%{box-shadow:0 0 6px rgba(0,230,118,.35)}50%{box-shadow:0 0 16px rgba(0,230,118,.68),0 0 26px rgba(0,200,100,.28)}}
@keyframes nfw-royal-glow{0%,100%{box-shadow:0 0 10px rgba(255,215,0,.45),0 0 18px rgba(255,215,0,.18)}50%{box-shadow:0 0 20px rgba(255,215,0,.85),0 0 36px rgba(255,200,0,.45),inset 0 0 14px rgba(255,215,0,.18)}}
@keyframes nfw-neon-glow{0%,100%{box-shadow:0 0 8px rgba(57,255,20,.45),0 0 16px rgba(57,255,20,.2)}50%{box-shadow:0 0 18px rgba(57,255,20,.85),0 0 34px rgba(57,255,20,.45)}}
@keyframes nfw-plasma-glow{0%{box-shadow:0 0 8px rgba(255,0,255,.45);border-color:#ff00ffaa}50%{box-shadow:0 0 16px rgba(0,255,255,.55);border-color:#00ffffaa}100%{box-shadow:0 0 8px rgba(255,0,255,.45);border-color:#ff00ffaa}}
@keyframes nfw-diamond-glow{0%,100%{box-shadow:0 0 10px rgba(100,200,255,.35),0 0 18px rgba(100,200,255,.18)}50%{box-shadow:0 0 20px rgba(100,220,255,.75),0 0 34px rgba(100,200,255,.35)}}
@keyframes nfw-silver-glow{0%,100%{box-shadow:0 0 5px rgba(176,190,197,.28)}50%{box-shadow:0 0 14px rgba(200,220,230,.55),0 0 22px rgba(176,190,197,.22)}}
@keyframes nfw-ocean-glow{0%,100%{box-shadow:0 0 6px rgba(2,136,209,.38)}50%{box-shadow:0 0 16px rgba(2,136,209,.68),0 0 26px rgba(0,180,230,.28)}}
@keyframes nfw-purple-glow{0%,100%{box-shadow:0 0 6px rgba(156,39,176,.38)}50%{box-shadow:0 0 16px rgba(180,60,210,.68),0 0 26px rgba(156,39,176,.28)}}
@keyframes nfw-red-glow{0%,100%{box-shadow:0 0 6px rgba(244,67,54,.42)}50%{box-shadow:0 0 16px rgba(255,80,60,.72),0 0 26px rgba(244,67,54,.32)}}
@keyframes nfw-cyan-glow{0%,100%{box-shadow:0 0 6px rgba(0,188,212,.38)}50%{box-shadow:0 0 16px rgba(0,220,240,.65),0 0 26px rgba(0,188,212,.28)}}
@keyframes glowPulse{0%,100%{text-shadow:0 0 4px currentColor}50%{text-shadow:0 0 14px currentColor,0 0 24px currentColor}}
@keyframes rainbowText{0%{color:#ff4444}16%{color:#ff8c00}33%{color:#ffd700}50%{color:#00e676}66%{color:#00bfff}83%{color:#b044ff}100%{color:#ff4444}}
@keyframes shimmer{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes lightningFlash{0%,100%{opacity:1;box-shadow:0 0 4px rgba(255,215,0,.3)}40%{opacity:.25;box-shadow:0 0 18px #ffd700,0 0 32px #ff8c00}60%{opacity:1}}
@keyframes musicBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes fire2Flicker{0%,100%{box-shadow:0 0 5px rgba(255,68,68,.4)}50%{box-shadow:0 0 16px rgba(255,215,0,.7),0 0 28px rgba(255,68,68,.45)}}
@keyframes heartFloat{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-28px) scale(.6)}}
@keyframes flowerFloat{0%{opacity:1;transform:translateY(0) rotate(0deg)}100%{opacity:0;transform:translateY(-24px) rotate(180deg)}}
@keyframes starFloat{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:1;transform:translateY(-14px) scale(1.2)}100%{opacity:0;transform:translateY(-28px) scale(.5)}}
@keyframes snowFloat{0%{opacity:1;transform:translateY(0) rotate(0)}100%{opacity:0;transform:translateY(-30px) rotate(360deg)}}
@keyframes moneyFloat{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-25px) scale(.7)}}
@keyframes butterflyFloat{0%{opacity:1;transform:translateY(0) scaleX(1)}50%{transform:translateY(-10px) scaleX(-1)}100%{opacity:0;transform:translateY(-25px) scaleX(1)}}

.nfw-gold{border:1px solid #ffd700aa;background:rgba(255,215,0,.08);border-radius:6px;padding:0 6px;animation:nfw-gold-glow 2s ease-in-out infinite;}
.nfw-fire{border:1px solid #ff6600aa;background:linear-gradient(135deg,rgba(255,80,0,.09),rgba(255,160,0,.06));border-radius:6px;padding:0 6px;animation:nfw-fire-glow 1.2s ease-in-out infinite;}
.nfw-ice{border:1px solid #00cfff99;background:rgba(0,207,255,.07);border-radius:6px;padding:0 6px;animation:nfw-ice-glow 2.5s ease-in-out infinite;}
.nfw-galaxy{border:1px solid #b044ffaa;background:linear-gradient(135deg,rgba(176,68,255,.08),rgba(255,68,170,.05));border-radius:6px;padding:0 6px;animation:nfw-galaxy-glow 2s ease-in-out infinite;}
.nfw-rose{border:1px solid #ff4081aa;background:rgba(255,64,129,.07);border-radius:6px;padding:0 6px;animation:nfw-rose-glow 2s ease-in-out infinite;}
.nfw-emerald{border:1px solid #00e676aa;background:rgba(0,230,118,.07);border-radius:6px;padding:0 6px;animation:nfw-emerald-glow 2.2s ease-in-out infinite;}
.nfw-royal{border:2px solid #ffd700cc;background:rgba(255,215,0,.1);border-radius:6px;padding:0 6px;animation:nfw-royal-glow 1.5s ease-in-out infinite;}
.nfw-neon{border:1px solid #39ff14cc;background:rgba(57,255,20,.07);border-radius:6px;padding:0 6px;animation:nfw-neon-glow 1s ease-in-out infinite;}
.nfw-plasma{border:1px solid #ff00ffaa;background:rgba(255,0,255,.07);border-radius:6px;padding:0 6px;animation:nfw-plasma-glow 1.5s ease-in-out infinite;}
.nfw-hearts{border:1px solid #ff409999;background:rgba(255,64,153,.06);border-radius:6px;padding:0 6px;position:relative;animation:nfw-rose-glow 2s ease-in-out infinite;}
.nfw-flowers{border:1px solid #ff8c0099;background:rgba(255,140,0,.06);border-radius:6px;padding:0 6px;position:relative;animation:nfw-gold-glow 2.5s ease-in-out infinite;}
.nfw-stars{border:1px solid #ffd70099;background:rgba(255,215,0,.08);border-radius:6px;padding:0 6px;position:relative;animation:nfw-gold-glow 2s ease-in-out infinite;}
.nfw-glow{border:1px solid #b044ff99;background:rgba(176,68,255,.06);border-radius:6px;padding:0 6px;animation:nfw-purple-glow 2s ease-in-out infinite;}
.nfw-rainbow{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.04);border-radius:6px;padding:0 6px;animation:rainbowText 3s linear infinite;}
.nfw-diamond{border:2px solid #64c8ffcc;background:rgba(100,200,255,.08);border-radius:6px;padding:0 6px;animation:nfw-diamond-glow 2s ease-in-out infinite;}
.nfw-crown{border:2px solid #ffd700bb;background:rgba(255,215,0,.09);border-radius:6px;padding:0 6px;animation:nfw-gold-glow 1.8s ease-in-out infinite;}
.nfw-silver{border:1px solid #b0bec5bb;background:rgba(176,190,197,.07);border-radius:6px;padding:0 6px;animation:nfw-silver-glow 2.5s ease-in-out infinite;}
.nfw-ocean{border:1px solid #0288d1aa;background:rgba(2,136,209,.07);border-radius:6px;padding:0 6px;animation:nfw-ocean-glow 2.5s ease-in-out infinite;}
.nfw-sunset{border:1px solid #ff6f00aa;background:linear-gradient(135deg,rgba(255,111,0,.07),rgba(255,180,0,.05));border-radius:6px;padding:0 6px;animation:nfw-fire-glow 2s ease-in-out infinite;}
.nfw-purple{border:1px solid #9c27b0aa;background:rgba(156,39,176,.07);border-radius:6px;padding:0 6px;animation:nfw-purple-glow 2s ease-in-out infinite;}
.nfw-red{border:1px solid #f44336aa;background:rgba(244,67,54,.07);border-radius:6px;padding:0 6px;animation:nfw-red-glow 1.5s ease-in-out infinite;}
.nfw-cyan{border:1px solid #00bcd4aa;background:rgba(0,188,212,.07);border-radius:6px;padding:0 6px;animation:nfw-cyan-glow 2s ease-in-out infinite;}
.nfw-snow{border:1px solid #b3e5fcaa;background:rgba(179,229,252,.05);border-radius:6px;padding:0 6px;position:relative;animation:nfw-ice-glow 3s ease-in-out infinite;}
.nfw-money{border:1px solid #43a047aa;background:rgba(67,160,71,.07);border-radius:6px;padding:0 6px;position:relative;animation:nfw-emerald-glow 2.2s ease-in-out infinite;}
.nfw-lightning{border:1px solid #ffd700aa;background:rgba(255,215,0,.06);border-radius:6px;padding:0 6px;animation:lightningFlash 1.5s ease-in-out infinite;}
.nfw-butterfly{border:1px solid #e91e63aa;background:rgba(233,30,99,.06);border-radius:6px;padding:0 6px;position:relative;animation:nfw-rose-glow 2s ease-in-out infinite;}
.nfw-music{border:1px solid #00acc1aa;background:rgba(0,172,193,.06);border-radius:6px;padding:0 6px;animation:musicBounce 1s ease-in-out infinite;}
.nfw-fire2{border:1px solid #ff5722aa;background:rgba(255,87,34,.07);border-radius:6px;padding:0 6px;animation:fire2Flicker 1s ease-in-out infinite;}

/* Floating particles container */
.nf-particle-wrap{position:relative;display:inline-block;}
.nf-particle{position:absolute;font-size:9px;pointer-events:none;top:0;animation:heartFloat 1.5s ease-out forwards;}
/* ===== END ANIMATED NAME FRAMES ===== */
@keyframes mi{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.msg:hover{background:rgba(255,255,255,.03);}
.av{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;transition:border-radius .3s;}
.mc{flex:1;min-width:0;}
.mh{display:flex;align-items:center;gap:6px;margin-bottom:2px;flex-wrap:wrap;}
.mn{font-size:13px;font-weight:700;}
.mb{font-size:9px;padding:2px 6px;border-radius:50px;font-weight:700;border:1px solid;}
.msg-badge{display:inline-block;line-height:1;vertical-align:middle;filter:drop-shadow(0 0 3px rgba(255,215,0,.4));transition:transform .2s;}
.msg-badge:hover{transform:scale(1.3);}
.mt{font-size:10px;color:var(--mut);margin-right:auto;}
.msg-reply-btn{display:none;background:none;border:none;color:var(--mut);font-size:13px;cursor:pointer;padding:0 4px;border-radius:4px;line-height:1;transition:.15s;opacity:.7;}
.msg-reply-btn:hover{color:var(--gold);opacity:1;background:rgba(255,215,0,.1);}
.msg:hover .msg-reply-btn{display:inline-block;}
.mx{font-size:13px;color:rgba(255,255,255,.85);line-height:1.6;word-break:break-word;}
.sys{text-align:center;padding:5px;font-size:11px;color:var(--gold);background:rgba(245,166,35,.06);border-radius:8px;margin:3px 0;animation:mi .25s ease;}
/* Chat images & YouTube */
.chat-img{max-width:240px;max-height:200px;border-radius:10px;cursor:pointer;display:block;margin-top:4px;object-fit:cover;}
.chat-gif{max-width:240px;border-radius:10px;display:block;margin-top:4px;}
.yt-embed{margin-top:6px;border-radius:10px;overflow:hidden;width:240px;height:135px;background:#000;}
.yt-embed iframe{width:100%;height:100%;border:none;}
.ntc{text-align:center;padding:6px;font-size:12px;color:#ef9a9a;background:rgba(239,83,80,.08);border-radius:8px;margin:3px 0;}

/* ===== QUOTE / REPLY SYSTEM ===== */
.quote-preview-bar{display:none;align-items:center;gap:10px;padding:7px 14px;background:rgba(245,166,35,.07);border-top:1px solid rgba(245,166,35,.2);direction:rtl;border-radius:0;}
.quote-preview-bar.on{display:flex;}
.quote-preview-line{width:3px;min-height:34px;align-self:stretch;background:var(--gold);border-radius:3px;flex-shrink:0;}
.quote-preview-content{flex:1;min-width:0;}
.quote-preview-name{font-size:11px;font-weight:700;color:var(--gold);margin-bottom:2px;}
.quote-preview-text{font-size:12px;color:rgba(255,255,255,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.quote-preview-close{background:none;border:none;color:var(--mut);font-size:20px;cursor:pointer;padding:0 4px;line-height:1;flex-shrink:0;}
.quote-preview-close:hover{color:#fff;}
.msg-quote{background:rgba(255,255,255,.04);border-right:3px solid var(--gold);border-radius:6px;padding:5px 10px;margin-bottom:5px;cursor:pointer;transition:.15s;}
.msg-quote:hover{background:rgba(245,166,35,.07);}
.msg-quote-name{font-size:11px;color:var(--gold);font-weight:700;margin-bottom:2px;}
.msg-quote-text{font-size:12px;color:rgba(255,255,255,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:380px;}
.msg.long-pressed{background:rgba(245,166,35,.08)!important;border-radius:8px;transition:background .2s;}
body.theme-classic .msg-quote{background:rgba(21,101,192,.06);border-right-color:#1565c0;}
body.theme-classic .msg-quote-name{color:#1565c0;}
body.theme-classic .quote-preview-bar{background:rgba(21,101,192,.06);border-top-color:rgba(21,101,192,.2);}
body.theme-classic .quote-preview-line{background:#1565c0;}
body.theme-classic .quote-preview-name{color:#1565c0;}
body.theme-lite .msg-quote{background:rgba(89,135,201,.06);border-right-color:#5987c9;}
body.theme-lite .msg-quote-name{color:#5987c9;}
body.theme-lite .quote-preview-bar{background:rgba(89,135,201,.06);border-top-color:rgba(89,135,201,.2);}
body.theme-lite .quote-preview-line{background:#5987c9;}
body.theme-lite .quote-preview-name{color:#5987c9;}

/* INPUT - STAYS AT BOTTOM */
.cin-area{
  flex-shrink:0; /* NEVER SHRINK */
  padding:12px 15px;
  background:rgba(8,18,35,.9);
  border-top:1px solid rgba(255,255,255,.07);
}
.cin-bar{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:13px;padding:5px 5px 5px 13px;transition:.3s;}
.cin-bar:focus-within{border-color:rgba(245,166,35,.4);background:rgba(245,166,35,.04);}
.cin{flex:1;background:transparent;border:none;outline:none;color:white;font-family:'Cairo',sans-serif;font-size:13px;padding:7px 0;direction:rtl;}
.cin::placeholder{color:rgba(255,255,255,.25);}
.cin:disabled{opacity:.4;cursor:not-allowed;}
.ib{width:36px;height:36px;border-radius:10px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:.2s;flex-shrink:0;}
.ibe{background:transparent;color:var(--mut);}.ibe:hover{color:var(--gold);background:rgba(245,166,35,.1);}
.ibs{background:linear-gradient(135deg,var(--gold),var(--gd));color:white;box-shadow:0 3px 12px rgba(245,166,35,.3);}
.ibs:hover{transform:scale(1.1);}

/* EMOJI */
.epicker{position:absolute;bottom:70px;right:15px;background:linear-gradient(145deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.2);border-radius:13px;padding:12px;display:none;grid-template-columns:repeat(8,1fr);gap:4px;z-index:50;box-shadow:0 15px 50px rgba(0,0,0,.5);}
.epicker.on{display:grid;}
.eb{background:transparent;border:none;font-size:19px;cursor:pointer;padding:3px;border-radius:6px;transition:.15s;line-height:1;}
.eb:hover{background:rgba(255,255,255,.1);transform:scale(1.3);}

/* USERS PANEL */
.ucbar{padding:8px 13px;background:linear-gradient(135deg,rgba(245,166,35,.15),rgba(245,166,35,.05));border-bottom:1px solid rgba(245,166,35,.15);display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gl);flex-shrink:0;}
/* ===== بحث الأعضاء + تبويب الأصدقاء في upanel ===== */
.upanel-tabs{display:flex;gap:0;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.08);}
.upanel-tab{flex:1;padding:8px 6px;font-size:11px;font-weight:700;font-family:'Cairo',sans-serif;text-align:center;cursor:pointer;background:transparent;border:none;color:var(--mut);transition:.2s;border-bottom:2px solid transparent;}
.upanel-tab.active{color:var(--gl);border-bottom-color:var(--gold);}
.upanel-tab:hover{color:#fff;}
.upanel-search-bar{display:flex;align-items:center;gap:6px;padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;}
.upanel-search-inp{flex:1;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:5px 10px;font-size:12px;font-family:'Cairo',sans-serif;color:#fff;outline:none;direction:rtl;}
.upanel-search-inp::placeholder{color:var(--mut);}
.upanel-search-inp:focus{border-color:rgba(245,166,35,.5);background:rgba(255,255,255,.1);}
.upanel-friends-panel{flex:1;overflow-y:auto;padding:7px;display:none;flex-direction:column;gap:5px;}
.upanel-friends-panel.active{display:flex;}
.upanel-friends-panel::-webkit-scrollbar{width:3px;}
.upanel-friends-panel::-webkit-scrollbar-thumb{background:rgba(245,166,35,.3);border-radius:3px;}
.upf-item{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);cursor:pointer;transition:.2s;}
.upf-item:hover{background:rgba(245,166,35,.07);border-color:rgba(245,166,35,.2);}
.upf-av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gd));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#000;flex-shrink:0;}
.upf-nm{font-size:12px;font-weight:700;color:#fff;flex:1;}
.upf-st{font-size:10px;}
body.theme-classic .upanel-search-inp{background:rgba(21,101,192,.07);border-color:rgba(21,101,192,.2);color:#1a2740;}
body.theme-classic .upanel-search-inp:focus{border-color:#1565c0;}
body.theme-classic .upanel-tab{color:#7090b0;}
body.theme-classic .upanel-tab.active{color:#1565c0;border-bottom-color:#1565c0;}
body.theme-classic .upf-item{background:rgba(21,101,192,.04);border-color:rgba(21,101,192,.1);}
body.theme-classic .upf-item:hover{background:rgba(21,101,192,.1);}
body.theme-classic .upf-nm{color:#1a2740;}
body.theme-lite .upanel-search-inp{background:rgba(89,135,201,.07);border-color:rgba(89,135,201,.2);color:#1a2740;}
body.theme-lite .upanel-search-inp:focus{border-color:#5987c9;}
body.theme-lite .upanel-tab{color:#7090b0;}
body.theme-lite .upanel-tab.active{color:#5987c9;border-bottom-color:#5987c9;}
body.theme-lite .upf-item{background:rgba(89,135,201,.04);border-color:rgba(89,135,201,.1);}
body.theme-lite .upf-item:hover{background:rgba(89,135,201,.1);}
body.theme-lite .upf-nm{color:#1a2740;}
.usl{font-size:9px;font-weight:700;color:var(--gold);letter-spacing:2px;text-transform:uppercase;padding:7px 9px 3px;display:flex;align-items:center;gap:5px;}
.usl::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(245,166,35,.3),transparent);}
.ui{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:9px;cursor:pointer;transition:.2s;margin-bottom:2px;}
.ui:hover{background:rgba(255,255,255,.05);}
.uav{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;position:relative;transition:border-radius .3s;}
.udot{position:absolute;bottom:0;right:0;width:9px;height:9px;border-radius:50%;background:var(--grn);border:2px solid #08122d;}
.un{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.um{font-size:10px;color:var(--mut);}

/* CTX */
.ctx{position:fixed;background:linear-gradient(145deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.25);border-radius:11px;padding:5px;z-index:999;box-shadow:0 15px 50px rgba(0,0,0,.6);min-width:160px;display:none;}
.ctx.on{display:block;}
.ctx-i{padding:8px 11px;border-radius:8px;cursor:pointer;font-size:12px;display:flex;align-items:center;gap:6px;transition:.2s;}
.ctx-i:hover{background:rgba(245,166,35,.1);color:var(--gl);}
.ctx-i.d{color:#ef9a9a;}.ctx-i.d:hover{background:rgba(239,83,80,.15);}

/* ===== POPUP MENU ===== */
.popup-overlay{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);}
.popup-overlay.on{display:flex;}
.popup-backdrop{position:absolute;inset:0;background:transparent;}
@keyframes popIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
/* ===== SADA-STYLE POPUP ===== */
.popup-box{position:relative;background:#fff;border-radius:16px;width:420px;max-width:96vw;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.9);animation:popIn .3s cubic-bezier(.34,1.56,.64,1);max-height:92vh;overflow-y:auto;}
.popup-cover{position:relative;height:130px;background:linear-gradient(135deg,#1a0a2e,#0d1f3c);overflow:hidden;flex-shrink:0;}
.popup-cover-img{width:100%;height:100%;object-fit:cover;display:none;}
.popup-cover-default{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:28px;opacity:.3;pointer-events:none;}
.popup-topbar{position:absolute;top:8px;left:0;right:0;display:flex;justify-content:space-between;padding:0 10px;z-index:5;}
.popup-topbar-btn{background:rgba(0,0,0,.55);border:none;color:#fff;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15px;backdrop-filter:blur(4px);}
.popup-topbar-btn:hover{background:rgba(0,0,0,.8);}
.popup-likes-bar{display:flex;align-items:center;gap:6px;margin-top:8px;}
.popup-like-btn{background:rgba(229,57,53,.12);border:1px solid rgba(229,57,53,.3);color:#e53935;border-radius:20px;padding:5px 14px;cursor:pointer;font-size:13px;display:flex;align-items:center;gap:5px;font-family:'Cairo',sans-serif;transition:.15s;}
.popup-like-btn:hover,.popup-like-btn.liked{background:#e53935;color:#fff;}
.popup-like-count{background:rgba(0,0,0,.08);color:#555;border-radius:20px;padding:5px 12px;font-size:13px;font-family:'Cairo',sans-serif;font-weight:700;}
.popup-av-section{display:flex;align-items:flex-end;gap:14px;padding:0 18px;margin-top:-65px;margin-bottom:10px;position:relative;z-index:2;}
.popup-av{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:900;flex-shrink:0;border:4px solid #fff;box-shadow:0 4px 20px rgba(0,0,0,.4);overflow:hidden;background:#ccc;}
.popup-av img{width:100%;height:100%;object-fit:cover;display:block;}
.popup-av-info{flex:1;padding-bottom:6px;min-width:0;}
.popup-username{font-size:16px;font-weight:800;color:#1a1a2e;}
.popup-rank-label{font-size:11px;margin-top:3px;padding:2px 8px;border-radius:20px;display:inline-block;}
.popup-tabs{display:flex;border-bottom:2px solid #f0f2f5;}
.popup-tab{flex:1;padding:10px;text-align:center;font-size:13px;font-weight:700;cursor:pointer;border:none;background:none;color:#888;font-family:'Cairo',sans-serif;transition:.2s;}
.popup-tab.on{color:#1565c0;border-bottom:3px solid #1565c0;margin-bottom:-2px;}
.popup-tab:hover:not(.on){color:#1565c0;background:rgba(21,101,192,.04);}
.popup-info-panel{padding:10px 16px;display:none;}
.popup-info-panel.on{display:block;}
.popup-info-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid #f0f2f5;font-size:13px;}
.popup-info-row:last-child{border-bottom:none;}
.popup-info-label{color:#555;display:flex;align-items:center;gap:6px;}
.popup-info-value{color:#1a1a2e;font-weight:600;}
.popup-actions{padding:6px;display:none;}
.popup-actions.on{display:block;}
.popup-action{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:10px;cursor:pointer;font-size:13px;transition:.15s;color:#1a1a2e;border:none;background:none;width:100%;text-align:right;font-family:'Cairo',sans-serif;}
.popup-action:hover{background:#f5f7fc;color:#1565c0;}
.popup-action.danger{color:#c62828;}
.popup-action.danger:hover{background:rgba(198,40,40,.07);color:#c62828;}
.popup-action.success{color:#2e7d32;}
.popup-action.success:hover{background:rgba(46,125,50,.07);color:#2e7d32;}
.popup-action.warn{color:#e65100;}
.popup-action.warn:hover{background:rgba(230,81,0,.07);color:#e65100;}
.popup-action.gold{color:#f57f17;}
.popup-action.gold:hover{background:rgba(245,127,23,.07);color:#f57f17;}
.popup-action-icon{font-size:18px;width:26px;text-align:center;flex-shrink:0;}
/* hide old header */
.popup-header{display:none!important;}
.popup-close{display:none!important;}

/* ===== BOTTOM BAR (موبايل) ===== */
.ghzl-bottom-bar{position:fixed;bottom:0;left:0;right:0;height:58px;background:rgba(6,12,24,.98);backdrop-filter:blur(20px);border-top:1px solid rgba(245,166,35,.2);z-index:600;display:none;flex-direction:column;}
.ghzl-bottom-bar.on{display:flex;}
.ghzl-bb-inner{height:100%;display:flex;align-items:center;padding:0 12px;gap:4px;}
.ghzl-bb-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;border-radius:8px;padding:5px 4px;transition:.2s;border:none;background:transparent;color:var(--mut);}
.ghzl-bb-item:hover,.ghzl-bb-item.on{color:var(--gl);background:rgba(245,166,35,.1);}
.ghzl-bb-icon{font-size:18px;}
.ghzl-bb-label{font-size:9px;font-weight:600;}

/* ===== SETTINGS PANEL ===== */
.ghzl-settings-panel{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(145deg,#08152b,#0a1c35);border-top:2px solid rgba(245,166,35,.3);z-index:700;transform:translateY(100%);transition:.35s cubic-bezier(.4,0,.2,1);max-height:75vh;overflow-y:auto;display:none;}
.ghzl-settings-panel.on{transform:translateY(0);display:block;}
.ghzl-sp-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(0,0,0,.3);position:sticky;top:0;z-index:1;}
.ghzl-sp-tab{flex:1;padding:11px 6px;text-align:center;font-size:11px;font-weight:600;cursor:pointer;color:var(--mut);border-bottom:2px solid transparent;transition:.2s;font-family:'Cairo',sans-serif;background:none;border-left:none;border-right:none;border-top:none;}
.ghzl-sp-tab.on{color:var(--gold);border-bottom-color:var(--gold);}

/* Toggle switch for sounds panel */
.ghzl-toggle-sw{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;}
.ghzl-toggle-sw input{opacity:0;width:0;height:0;position:absolute;}
.ghzl-sw-track{position:absolute;inset:0;background:rgba(255,255,255,.15);border-radius:24px;cursor:pointer;transition:.3s;}
.ghzl-sw-track::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.3s;box-shadow:0 1px 4px rgba(0,0,0,.3);}
.ghzl-toggle-sw input:checked + .ghzl-sw-track{background:linear-gradient(135deg,var(--gold),var(--gd));}
.ghzl-toggle-sw input:checked + .ghzl-sw-track::before{transform:translateX(20px);}
.ghzl-sp-content{padding:14px;}
.ghzl-myinfo-box{background:linear-gradient(135deg,rgba(245,166,35,.08),rgba(245,166,35,.03));border:1px solid rgba(245,166,35,.2);border-radius:12px;padding:13px;margin-bottom:12px;}
.ghzl-myinfo-row{display:flex;align-items:center;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px;}
.ghzl-myinfo-row:last-child{border-bottom:none;}
.ghzl-myinfo-row .lbl{color:var(--mut);flex:1;}
.ghzl-myinfo-row .val{font-weight:600;}
.ghzl-sp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
.ghzl-sp-item label{display:block;font-size:11px;color:var(--mut);margin-bottom:5px;}
.ghzl-sp-select{width:100%;padding:8px 10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-family:'Cairo',sans-serif;font-size:12px;outline:none;appearance:none;}
.ghzl-status-opts{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px;}
.ghzl-status-opt{padding:6px 14px;border-radius:20px;border:1px solid rgba(255,255,255,.1);font-size:12px;cursor:pointer;transition:.2s;font-family:'Cairo',sans-serif;background:none;color:var(--w);}
.ghzl-status-opt:hover,.ghzl-status-opt.on{border-color:var(--gold);background:rgba(245,166,35,.12);color:var(--gl);}
.ghzl-ignore-list{display:flex;flex-direction:column;gap:6px;}
.ghzl-ignore-item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:rgba(255,255,255,.03);border-radius:8px;font-size:12px;}
.ghzl-ignore-rm{background:rgba(239,83,80,.15);border:1px solid rgba(239,83,80,.25);color:#ef9a9a;border-radius:6px;padding:3px 8px;font-size:11px;cursor:pointer;}

/* ⚙️ زر الضبط في الهيدر */
.ghzl-settings-btn{background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.25);color:var(--gold);border-radius:8px;padding:5px 9px;cursor:pointer;font-size:15px;transition:.2s;}
.ghzl-settings-btn:hover{background:rgba(245,166,35,.2);}

/* PM */
.pm{position:fixed;bottom:16px;left:16px;width:340px;height:440px;background:linear-gradient(145deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.3);border-radius:15px;z-index:200;box-shadow:0 15px 50px rgba(0,0,0,.6);display:none;flex-direction:column;min-width:260px;min-height:300px;}
.pm.on{display:flex;}
.pmh{padding:11px 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06);cursor:move;user-select:none;flex-shrink:0;position:relative;}
.pm-opt-item{padding:9px 14px;font-size:13px;font-family:'Cairo',sans-serif;color:#e0e0e0;cursor:pointer;border-radius:9px;transition:.18s;display:flex;align-items:center;gap:8px;}
.pm-opt-item:hover{background:rgba(245,166,35,.12);color:#ffd700;}
.pmt{font-size:12px;font-weight:700;color:var(--gl);}
.pmc{background:transparent;border:none;color:var(--mut);font-size:15px;cursor:pointer;}
.pmm{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px;min-height:0;}
.pmmsg{font-size:12px;padding:6px 10px;border-radius:8px;max-width:85%;display:flex;flex-direction:column;gap:2px;}
.pmmsg .pm-txt{word-break:break-word;}
.pmmsg .pm-time{font-size:10px;opacity:.5;align-self:flex-end;}
.pms{background:rgba(245,166,35,.15);color:var(--gl);align-self:flex-start;}
.pmr{background:rgba(255,255,255,.06);align-self:flex-end;}
.pmir{display:flex;gap:6px;padding:8px;border-top:1px solid rgba(255,255,255,.06);flex-shrink:0;}
.pmin{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:6px 10px;color:white;font-family:'Cairo',sans-serif;font-size:12px;outline:none;direction:rtl;}
.pmse{background:linear-gradient(135deg,var(--gold),var(--gd));border:none;border-radius:8px;padding:6px 12px;color:white;cursor:pointer;}
.pm-maximize-btn{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#aaa;border-radius:6px;padding:2px 7px;cursor:pointer;font-size:12px;}
.pm-maximize-btn:hover{background:rgba(255,255,255,.15);}
.pm-win-btn{width:14px;height:14px;border-radius:50%;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:9px;transition:.15s;flex-shrink:0;}
.pm-win-btn:hover{filter:brightness(1.3);}
.pm-btn-close{background:#ff5f57;}
.pm-btn-min{background:#febc2e;}
.pm-btn-max{background:#28c840;}
.pm.minimized .pmm,.pm.minimized .pmir,.pm.minimized #pm-voice-bar,.pm.minimized #pm-emoji-picker{display:none!important;}
.pm.minimized{height:auto!important;min-height:0!important;}
.pm.maximized{width:520px!important;height:600px!important;}

/* ADMIN */
.apanel{position:fixed;inset:0;z-index:200;background:rgba(5,13,26,.97);backdrop-filter:blur(20px);display:none;flex-direction:column;}
.apanel.on{display:flex;}
.ahdr{padding:16px 26px;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(245,166,35,.2);flex-shrink:0;}
.atit{font-family:'Tajawal',sans-serif;font-size:22px;font-weight:900;background:linear-gradient(135deg,var(--gl),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
/* Admin vertical layout */
.ap-body-wrap{display:flex;flex:1;overflow:hidden;}
.ap-sidebar{width:210px;flex-shrink:0;background:rgba(3,8,20,.85);border-left:1px solid rgba(245,166,35,.15);display:flex;flex-direction:column;overflow-y:auto;padding:10px 0;scrollbar-width:thick;scrollbar-color:rgba(245,166,35,.5) rgba(255,255,255,.05);}
.ap-sidebar::-webkit-scrollbar{width:10px;}
.ap-sidebar::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:6px;}
.ap-sidebar::-webkit-scrollbar-thumb{background:rgba(245,166,35,.45);border-radius:6px;border:2px solid rgba(3,8,20,.85);}
.ap-sidebar::-webkit-scrollbar-thumb:hover{background:rgba(245,166,35,.75);}
.abdy{flex:1;overflow-y:auto;padding:28px;scrollbar-width:thick;scrollbar-color:rgba(245,166,35,.4) rgba(255,255,255,.04);}
.abdy::-webkit-scrollbar{width:12px;}
.abdy::-webkit-scrollbar-track{background:rgba(255,255,255,.03);border-radius:6px;}
.abdy::-webkit-scrollbar-thumb{background:rgba(245,166,35,.4);border-radius:6px;border:3px solid rgba(5,13,26,.97);}
.abdy::-webkit-scrollbar-thumb:hover{background:rgba(245,166,35,.7);cursor:grab;}
.abdy::-webkit-scrollbar-thumb:active{background:rgba(245,166,35,.9);cursor:grabbing;}
.ap-tab{display:flex;align-items:center;gap:10px;padding:13px 18px;font-size:14px;font-family:'Cairo',sans-serif;font-weight:600;background:transparent;border:none;border-right:3px solid transparent;color:var(--mut);cursor:pointer;transition:all .2s;white-space:nowrap;width:100%;text-align:right;direction:rtl;}
.ap-tab:hover{color:#fff;background:rgba(255,255,255,.06);}
.ap-tab.on{color:#ffd700;border-right-color:#ffd700;background:rgba(255,215,0,.09);}
.perm-card{background:rgba(10,22,40,.85);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px;margin-bottom:16px;transition:border-color .2s;}
.perm-card:hover{border-color:rgba(255,215,0,.25);}
.perm-rank-hdr{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.06);}
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.perm-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;background:rgba(255,255,255,.03);border-radius:10px;border:1px solid rgba(255,255,255,.05);cursor:pointer;transition:all .2s;}
.perm-item:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.15);}
.perm-item.active{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.3);}
.perm-cb{width:20px;height:20px;min-width:20px;accent-color:#22c55e;cursor:pointer;margin-top:1px;}
.perm-lbl{font-size:12px;color:#ccc;line-height:1.5;}
.perm-lbl strong{display:block;font-size:13px;color:#fff;margin-bottom:2px;}
.atbl{width:100%;border-collapse:collapse;}
.atbl th{padding:10px 13px;text-align:right;font-size:10px;font-weight:700;color:var(--gold);letter-spacing:1px;border-bottom:1px solid rgba(245,166,35,.2);}
.atbl td{padding:10px 13px;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px;vertical-align:middle;}
.atbl tr:hover td{background:rgba(255,255,255,.02);}
.aab{padding:4px 9px;border-radius:7px;border:none;cursor:pointer;font-family:'Cairo',sans-serif;font-size:11px;font-weight:700;transition:.2s;margin:2px;}
.ab-ban{background:rgba(239,83,80,.2);color:#ef9a9a;border:1px solid rgba(239,83,80,.3);}
.ab-unban{background:rgba(0,230,118,.2);color:#a5d6a7;border:1px solid rgba(0,230,118,.3);}
.tag-ok{background:rgba(0,230,118,.15);color:#a5d6a7;padding:2px 7px;border-radius:50px;font-size:10px;}
.tag-ban{background:rgba(239,83,80,.15);color:#ef9a9a;padding:2px 7px;border-radius:50px;font-size:10px;}

/* TOAST */
.toast{position:fixed;top:16px;left:50%;transform:translateX(-50%) translateY(-80px);background:linear-gradient(135deg,#0d1f3c,#0a1628);border:1px solid rgba(245,166,35,.3);border-radius:11px;padding:11px 20px;font-size:13px;z-index:1000;box-shadow:0 15px 50px rgba(0,0,0,.5);transition:.4s cubic-bezier(.34,1.56,.64,1);}
.toast.on{transform:translateX(-50%) translateY(0);}
.toast.e{border-color:rgba(239,83,80,.4);color:#ef9a9a;}
.toast.k{border-color:rgba(0,230,118,.4);color:#a5d6a7;}

/* RANK BADGES */
.rk-owner{background:rgba(255,107,53,.2);color:#ff6b35;border-color:rgba(255,107,53,.4);}
.rk-admin{background:rgba(255,193,7,.2);color:#ffd54f;border-color:rgba(255,193,7,.3);}
.rk-vip{background:rgba(156,39,176,.2);color:#ce93d8;border-color:rgba(156,39,176,.3);}
.rk-member{background:rgba(66,165,245,.15);color:#90caf9;border-color:rgba(66,165,245,.2);}
.rk-visitor{background:rgba(255,255,255,.08);color:#ccc;border-color:rgba(255,255,255,.15);}

/* ===== FOOTER ===== */
.site-footer {
  background: rgba(5,10,20,.9);
  border-top: 1px solid rgba(245,166,35,.15);
  padding: 18px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  flex-shrink: 0;
}
.footer-links { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.footer-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,.1);
  color: var(--mut);
  padding: 5px 12px;
  border-radius: 20px;
  font-family: 'Cairo', sans-serif;
  font-size: 11px;
  cursor: pointer;
  transition: .2s;
}
.footer-btn:hover { border-color: rgba(245,166,35,.4); color: var(--gl); background: rgba(245,166,35,.07); }
.footer-copy { font-size: 11px; color: rgba(255,255,255,.25); }

/* ===== POLICY MODAL ===== */
.policy-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(5,13,26,.95);
  backdrop-filter: blur(20px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: .3s;
}
.policy-overlay.on { opacity: 1; pointer-events: all; }
.policy-modal {
  background: linear-gradient(145deg,#0d1f3c,#0a1628);
  border: 1px solid rgba(245,166,35,.2);
  border-radius: 20px;
  width: 720px;
  max-width: 95vw;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transform: translateY(30px);
  transition: .4s cubic-bezier(.34,1.56,.64,1);
}
.policy-modal::before {
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gl),var(--gold),transparent);
}
.policy-overlay.on .policy-modal { transform: translateY(0); }
.policy-hdr {
  padding: 18px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.08);
  flex-shrink: 0;
}
.policy-tabs {
  display: flex;
  gap: 8px;
}
.policy-tab {
  padding: 7px 16px;
  border-radius: 20px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.1);
  color: var(--mut);
  font-family: 'Cairo', sans-serif;
  font-size: 12px;
  cursor: pointer;
  transition: .2s;
}
.policy-tab.active {
  background: rgba(245,166,35,.15);
  border-color: rgba(245,166,35,.4);
  color: var(--gl);
}
.policy-close {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--mut);
  font-size: 16px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: .2s;
}
.policy-close:hover { background: rgba(239,83,80,.2); color: white; }
.policy-body {
  flex: 1;
  overflow-y: auto;
  padding: 24px 28px;
  line-height: 1.9;
  color: rgba(255,255,255,.8);
  font-size: 13px;
}
.policy-body::-webkit-scrollbar { width: 4px; }
.policy-body::-webkit-scrollbar-thumb { background: rgba(245,166,35,.3); border-radius: 4px; }
.policy-body h2 {
  font-family: 'Tajawal', sans-serif;
  font-size: 18px;
  font-weight: 800;
  background: linear-gradient(135deg,var(--gl),var(--gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 16px;
}
.policy-body h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--gl);
  margin: 20px 0 8px;
  padding-right: 10px;
  border-right: 3px solid var(--gold);
}
.policy-body p { margin-bottom: 12px; }
.policy-body .rule {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 8px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.policy-body .rule-icon { font-size: 16px; flex-shrink: 0; margin-top: 2px; }
.policy-body .rule-text { flex: 1; }
.policy-footer {
  padding: 14px 24px;
  border-top: 1px solid rgba(255,255,255,.06);
  text-align: center;
  font-size: 11px;
  color: var(--mut);
  flex-shrink: 0;
}

/* ===== EMOJI PICKER FULL ===== */
.epicker {
  position:absolute;
  bottom:70px;
  right:10px;
  left:10px;
  background:linear-gradient(145deg,#0d1f3c,#0a1628);
  border:1px solid rgba(245,166,35,.2);
  border-radius:16px;
  padding:10px;
  display:none;
  flex-direction:column;
  gap:8px;
  z-index:50;
  box-shadow:0 15px 50px rgba(0,0,0,.6);
  max-height:280px;
}
.epicker.on { display:flex; }
.ep-cats {
  display:flex;
  gap:4px;
  border-bottom:1px solid rgba(255,255,255,.08);
  padding-bottom:8px;
  flex-wrap:wrap;
}
.ep-cat {
  background:transparent;
  border:none;
  font-size:20px;
  cursor:pointer;
  padding:5px 8px;
  border-radius:8px;
  transition:.15s;
}
.ep-cat:hover, .ep-cat.active {
  background:rgba(245,166,35,.2);
  transform:scale(1.15);
}
.ep-grid {
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:3px;
  overflow-y:auto;
  max-height:180px;
}
.ep-grid::-webkit-scrollbar { width:3px; }
.ep-grid::-webkit-scrollbar-thumb { background:rgba(245,166,35,.3); border-radius:3px; }

/* ===== MOBILE RESPONSIVE ===== */
@media (max-width: 768px) {

  /* Hide side panels by default on mobile */
  .rpanel { display: none; }
  .upanel { display: none; }

  /* Chat body - single column */
  .chat-body {
    grid-template-columns: 1fr !important;
  }

  /* Header mobile */
  .chat-hdr {
    padding: 0 8px;
    height: 52px;
    overflow: visible;
  }
  .clogo-t { font-size: 13px; }
  /* إخفاء أزرار الهيدر على الموبايل - موجودة في قائمة المزيد */
  .cnav { display: none !important; }
  #gold-shop-btn { display: none !important; }
  #inbox-btn { display: none !important; }
  #news-btn { display: none !important; }
  #profile-btn { display: none !important; }
  #desk-menu-btn { display: none !important; }
  #notif-bell { display: none !important; }
  .chat-hdr .btn.btn-g { display: none !important; }
  /* إخفاء عداد المتصلين على الموبايل لتوفير مساحة */
  .chat-hdr .sbdg { display: none !important; }
  /* إظهار الذهب بارز في الهيدر على الموبايل */
  #gold-display {
    display: flex !important;
    padding: 5px 10px !important;
    font-size: 13px !important;
    gap: 4px !important;
    background: rgba(255,215,0,.15) !important;
    border: 1px solid rgba(255,215,0,.4) !important;
    border-radius: 50px !important;
  }
  /* الشارة الصغيرة للرتبة */
  #my-badge {
    font-size: 10px !important;
    padding: 3px 7px !important;
  }
  .chat-hdr > div:last-child {
    flex-shrink: 0;
    gap: 5px !important;
  }

  /* Input area - bigger on mobile */
  .cin-area { padding: 10px 12px; }
  .cin { font-size: 15px; }

  /* Emoji picker on mobile - full width bottom sheet */
  .epicker {
    position: fixed !important;
    bottom: 60px !important;
    left: 0 !important;
    right: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    max-height: 300px !important;
  }
  .ep-grid { grid-template-columns: repeat(7, 1fr) !important; }

  /* Messages */
  .msgs { padding: 10px; }
  .mn { font-size: 13px; }
  .mx { font-size: 13px; }

  /* Mobile bottom bar - يُتحكم به عبر JS فقط */
  #chat-bottom-bar {
    position: fixed;
    bottom: 42px;
    left: 0;
    right: 0;
    z-index: 50;
  }
  /* Mobile bottom nav */
  .mob-nav {
    position: static !important;
    height: 58px;
    background: linear-gradient(180deg, rgba(8,18,40,.99), rgba(5,12,28,1));
    border-top: 1px solid rgba(245,166,35,.2);
    align-items: center;
    justify-content: space-around;
    box-shadow: 0 -3px 15px rgba(0,0,0,.5);
    width: 100%;
  }
  /* mob-top-bar يُتحكم به عبر JS فقط */
  .cmain { padding-bottom: 0 !important; }
  /* الموبايل: padding للـ nav (58) + إعلان (42) = 100 */
  #chat-page { padding-bottom: 100px; }
  .chat-body { margin-top: 0; }
  /* Input area on mobile stays above nav bar */
  .cin-area {
    padding: 8px 10px !important;
    position: sticky;
    bottom: 0;
    z-index: 20;
  }

  /* Mobile drawer for rooms */
  .mob-drawer {
    display: flex !important;
    position: fixed;
    inset: 0;
    z-index: 300;
    background: rgba(5,13,26,.95);
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.4,0,.2,1);
  }
  .mob-drawer.open { transform: translateX(0); }

  /* Users drawer — drops from top, doesn't cover full screen */
  #mob-users {
    inset: 0 0 auto 0 !important;
    max-height: 70vh;
    border-radius: 0 0 20px 20px;
    transform: translateY(-100%) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.6);
  }
  #mob-users.open { transform: translateY(0) !important; }
  .mob-drawer-hdr {
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255,255,255,.08);
    flex-shrink: 0;
  }
  .mob-drawer-hdr span { font-size: 15px; font-weight: 700; color: var(--gl); }
  .mob-drawer-close { background: rgba(255,255,255,.06); border: none; color: white; width: 34px; height: 34px; border-radius: 50%; font-size: 16px; cursor: pointer; }
  .mob-drawer-body { flex: 1; overflow-y: auto; padding: 10px; }

  /* Mobile nav buttons */
  .mob-nav-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    background: transparent;
    border: none;
    color: var(--mut);
    font-family: 'Cairo', sans-serif;
    cursor: pointer;
    padding: 6px 14px;
    border-radius: 10px;
    transition: .2s;
    font-size: 10px;
  }
  .mob-nav-btn.active { color: var(--gold); background: rgba(245,166,35,.1); }
  .mob-nav-btn span:first-child { font-size: 20px; }

  /* Room header mobile */
  .crhdr { padding: 9px 12px; }
  .cr-nm { font-size: 13px; }

  /* Landing mobile */
  .hero { padding: 30px 16px; }
  .hero-h { font-size: 28px; }
  .btn-grp { flex-direction: column; align-items: stretch; }
  .btn { justify-content: center; }
  .site-hdr { padding: 10px 16px; }
}

/* Mobile nav & drawers — hidden on desktop */
@media (min-width: 769px) {
  .mob-nav { display: none !important; }
  .mob-drawer { display: none !important; }
  #mob-top-bar { display: none !important; }
  #chat-bottom-bar { display: none !important; }
  #desk-second-bar { display: flex !important; }
  #chat-page { padding-bottom: 42px; }
}
@media (max-width: 768px) {
  #desk-second-bar { display: none !important; }
}

/* Mobile slide menu item */
.mob-menu-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 18px;
  border-bottom: 1px solid #f0f0f0;
  cursor: pointer;
  transition: background .15s;
  font-family: 'Cairo', sans-serif;
  font-size: 14px;
  color: #222;
  font-weight: 600;
  text-decoration: none;
  user-select: none;
}
.mob-menu-item:hover { background: #f5f5f5; }
.mob-menu-item:active { background: #e3f2fd; }
.mob-menu-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

/* ===== LITE THEME (ثيم لايت - من Lite.css) ===== */
/* general colors */
body.theme-lite a{color:orange;}
body.theme-lite{background:#ededed; color:#333;}
body.theme-lite button{ background:transparent; color:#fff; }
body.theme-lite input, body.theme-lite textarea, body.theme-lite .post_input_container{background: #f8fbfb;border: 1px solid #a1959559 !important;color: #000;}
body.theme-lite .setdef{ color:#333; }

/* item with background no effect */
body.theme-lite .bback{ background:rgb(0,0,0,0.05); }

/* item with background no effect with border */
body.theme-lite .bbackb{ background:rgb(0,0,0,0.05); border:1px solid rgb(0,0,0,0.08); }

/* item with no background and hover effect */
body.theme-lite .bhover:hover, body.theme-lite .bhoverr:hover{ background:rgb(0,0,0,0.05); }

/* item with background and hover effect */
body.theme-lite .bbackhover{ background:rgb(0,0,0,0.05); }
body.theme-lite .bbackhover:hover{ background:rgb(0,0,0,0.025); }

/* item width background and hover effect with a border */
body.theme-lite .bbackhoverb{ background:rgb(0,0,0,0.05); }
body.theme-lite .bbackhoverb:hover{ background:rgb(0,0,0,0.025); border:1px solid rgb(0,0,0,0.08); }

/* item with no background with line separator and hover effect */

body.theme-lite .blisting:hover{border-radius: 10px; background: rgb(0,0,0,0.05); }

/* item with no background with line separator */
body.theme-lite .blist{ border-bottom: 1px solid rgb(0,0,0,0.08); }

/* private panel top */


/* page menu & page sub menu */
body.theme-lite .bpmenu:hover{ background: rgb(242 242 242); }
body.theme-lite .bsub{ background:rgb(0,0,0,0.1); }
body.theme-lite .bsub:hover{ background:rgb(0,0,0,0.2); }

/* sub menus for card, logs, wall, news */
body.theme-lite .bmenu, body.theme-lite .submenu{border-bottom: 1px solid rgb(0 0 0 / 18%);}
body.theme-lite .bmenu:hover, body.theme-lite .submenu:hover{ background:rgb(0,0,0,0.05); }

/* box shadow */
body.theme-lite .bshadow, body.theme-lite .page_element, body.theme-lite .float_menu, body.theme-lite .btnshadow, body.theme-lite .pboxed{ box-shadow:0 1px 3px rgb(0,0,0,0.2); }

/* main item selected for panel and box */


/* reg menu selected item */
body.theme-lite .rselected{background: linear-gradient(#FF8F00,#FF5722);color: white;}

/* page selected */
body.theme-lite .pselected{ color:#03add8; }

/* current item selected */
body.theme-lite .cselected, body.theme-lite .liked{ background:rgb(0,0,0,0.05); }

/* paginate item selected */
body.theme-lite .pag_btn{ background:rgb(0,0,0,0.05); color:#666; }
body.theme-lite .pagselected, body.theme-lite .pag_btn:hover{ background:rgb(0,0,0,0.10); }

/* count and gold tag */
body.theme-lite .gtag{ background:#fff; border:1px solid rgb(0,0,0,0.08); }

/* border color for separator and items border */
body.theme-lite .bborder{ border-bottom:1px solid rgb(0,0,0,0.08); }
body.theme-lite .tborder{ border-top:1px solid rgb(0,0,0,0.08); }
body.theme-lite .lborder, body.theme-lite .ppanel{ border-left:1px solid rgb(0,0,0,0.08); }
body.theme-lite .rborder{ border-right:1px solid rgb(0,0,0,0.08); }
body.theme-lite .fborder{ border:1px solid rgb(0,0,0,0.08); }

/* float top color */



/* headers colors and top box colors */
body.theme-lite .bhead{ background:linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%); color:#fff; }
body.theme-lite .modal_top{ background:linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%); color:#fff; }
body.theme-lite .pro_top{ background:#5987c9; color:#fff; }
body.theme-lite .bfoot{ background:linear-gradient(to top,#abcdff 0%,#6892ce 17%,#5987c9 42%,#5987c9 100%); color:#fff; }
body.theme-lite .foot{text-shadow: 0 0 2px rgba(0, 0, 0, .8);background: #5987c9;color: #ffffff;}

/* background major element panel, page menu, float menu, modal, chat boxes */
body.theme-lite .backglob{ background:#fff; }
body.theme-lite .back_chat{ background:#fff; }
body.theme-lite .back_priv{ background:#fff; }
body.theme-lite .back_panel{ background:#fff; }
body.theme-lite .back_menu{ background:#fff; }
body.theme-lite .back_pmenu{background: #ffffff;color: #000;}
body.theme-lite .back_input{background: linear-gradient(to bottom,#dae5eb 0%,#fdfefe 100%);border-top: 1px solid #bfc9d2;border-bottom: 1px solid #bfc9d2;}
body.theme-lite .back_modal{ background:#fff; }
body.theme-lite .page_element{ background:#fff; }
body.theme-lite .back_quote{ background:#fff; }

/* main theme color */
body.theme-lite .theme_color{ color:#FF5722; }
body.theme-lite .default_color{ color:#222; }
body.theme-lite .error{ color:red; }
body.theme-lite .success{ color:#74b20e; }
body.theme-lite .warn{ color:orange; }

/* button colors */
body.theme-lite .defaultd_btn{ background:#333; color:#fff; }
body.theme-lite .warn_btn{ background:orange; color:#fff; }

/* default username color */


/* chat system messsage text color */


/* opacity for offline users in list */
body.theme-lite .offline{ opacity:0.5; }

/* menu icon */
body.theme-lite .subi{ color:#03add8; }

/* wall reply background */
body.theme-lite .reply_item{ background:#f6f6f6; }

/* main post item option wall and news */
body.theme-lite .main_post_item{color: #5987c9;}

/* input option background colors */


/* private log bubble colors */
body.theme-lite .target_private{color: #36f;background: #fffee2;border: 1px solid #cccccc7d;border-radius: 10px;}
body.theme-lite .hunter_private{color: #C06;background: #fffee2;border: 1px solid #cccccc7d;border-radius: 10px;}
body.theme-lite .targ_quote, body.theme-lite .hunt_quote{color: #000000;background: #e9e9e9;border: 1px solid #cccccc7d;border-radius: 10px;}

/* quote in chat background */
body.theme-lite .cquote{  background:rgb(0,0,0,0.05) !important; }
body.theme-lite .cqname{ color:#000; }
body.theme-lite .cqmess{ color:#666; }

/* tab menu */
body.theme-lite .tab_menu_item_store{border: 1px solid #a195952e;background: #f6f6f6;}
body.theme-lite .tab_menu{ background:#fff; box-shadow:0 1px 3px rgb(0,0,0,0.2); }
body.theme-lite .tab_menu_item{ }
body.theme-lite .tab_selected{background: linear-gradient(#FF8F00,#FF5722);color: white;}

/* modal menu */
body.theme-lite .modal_mback{ background:rgb(0,0,0,0.04); }
body.theme-lite .modal_mborder{ border-bottom: 1px solid rgb(0,0,0,0.08); }

/* back transparency background for modal box */
body.theme-lite .modal_back{ background-color:rgba(0,0,0,0.4); }

/* chat logs */
body.theme-lite .log2{background: #fffee291}
body.theme-lite .topic_log{ background:#dfebfb; color:#0d261a; }
body.theme-lite .sys_log{background: #fffee291;border: 1px solid #ccc;}

/* upload progress */
body.theme-lite .bprogress{ background:#74b20e; color:#fff; }

/* notification colors */
body.theme-lite .bnotify{ background:red; color:#fff; }
body.theme-lite .foot_notify, body.theme-lite .head_notify{ border:1px solid #fff; }

/* date colors */
body.theme-lite .sub_date{ color:#888; }
body.theme-lite .sub_chat, body.theme-lite .sub_priv{ color:#000; }

/* secondary text color */
body.theme-lite .sub_text, body.theme-lite .list_mood{ color:#000; }

/* profile likes */
body.theme-lite .plikes{ background-color:rgba(100,100,100,0.3); color:#fff; }

/* spinner color */
body.theme-lite .bspin{ color:rgb(0,0,0,0.3); }

/* special chat item */
body.theme-lite .my_notice{ color:#fff; background:#03add8; }
body.theme-lite .system_text{background:#efefef;color:#000;border:1px solid #9e9e9e59}

/* outside pages background */
body.theme-lite .back_page{background: #6892ce;color: #fff;}
body.theme-lite .ban_text_sultan{font-size: 15px;}

/* video background color */
body.theme-lite .post_video{ background:rgb(0,0,0,1); }

/* slider */
body.theme-lite .boom_slider .ui-widget-content{ background: #ededed; }
body.theme-lite .boom_slider .ui-state-default{ background: #999 !important; }
body.theme-lite .boom_slider .ui-state-active{ background: #999 !important; }
body.theme-lite .boom_slider .ui-slider-range{ background:#ccc; }

/* select input color */
body.theme-lite .selectboxit-list, body.theme-lite .selectboxit-btn{ background-color: #f6f6f6; color:#666;  border:1px solid #e6e6e6 !important; }
body.theme-lite .selectboxit-list .selectboxit-focus .selectboxit-option-anchor{ background-color: #ededed; color:#666; }
body.theme-lite .selectboxit-default-arrow{ border-top: 4px solid #666; }
body.theme-lite .selectboxit-btn.selectboxit-enabled:hover, body.theme-lite .selectboxit-btn.selectboxit-enabled:focus, body.theme-lite .selectboxit-btn.selectboxit-enabled:active{ background:#f6f6f6; color:#666; }
body.theme-lite .selectboxit-options{ background:#fff; border:1px solid #ccc; }
body.theme-lite .selectboxit-list .selectboxit-option-anchor{ color:#666; }

/* sultan css */
body.theme-lite .panel_bar{background: linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);color: #fff;font-family: 'flat-jooza';border: 1px solid #a0b3c3;border-top: none;border-top-left-radius: 6px;border-top-right-radius: 6px;}
body.theme-lite .bhead_2{ background:#5987c9; color:#fff; }
body.theme-lite .back_box{background: linear-gradient(to bottom,#ebebeb 0%,#fdfefe 100%);/* border-top: 1px solid #bfc9d2; */border-bottom: 1px solid #bfc9d2;}
body.theme-lite .qcontrol{background: linear-gradient(to bottom,#dae5eb 0%,#fdfefe 100%);border: 1px solid #bfc9d2;}

/*************************/
/*************************/
body.theme-lite .cname{color:#2566e6}
body.theme-lite .my_text{border:1px solid #ccc}

body.theme-lite .user_count{color:#ff5722;border-bottom:1px solid #d1dee8}
body.theme-lite .back_theme{border:1px solid #ff7102;color:#fff;background:linear-gradient(#FF5722,#ff7102)}

body.theme-lite .send_btn{background: #ff5722;color: #fff;border-radius: 5px;}
body.theme-lite .input_item{color: #ff5722;}
body.theme-lite .default_btn, body.theme-lite .theme_btn, body.theme-lite .ok_btn{background: linear-gradient(#FF8F00,#FF5722);color: #fff;font-family: 'flat-jooza' }
body.theme-lite .custom-span-link:hover, body.theme-lite .default_btn:hover, body.theme-lite .theme_btn:hover, body.theme-lite .ok_btn:hover{background: linear-gradient(#f3b526,#f7842a); }
body.theme-lite .post_content{background: #efefef;}
body.theme-lite .border_bottom, body.theme-lite .label_line, body.theme-lite .listing_element, body.theme-lite .listing_half_element, body.theme-lite .post_element, body.theme-lite .list_element, body.theme-lite .listing_reg, body.theme-lite .left_list, body.theme-lite .user_item, body.theme-lite .user_item_custom, body.theme-lite .box_title{border-bottom: 1px solid #ededed;}
body.theme-lite .back_ptop{background: linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);color: #fff;}
body.theme-lite #chat_right_data{border: 1px solid #a0b3c3;}
body.theme-lite ::-webkit-scrollbar-thumb{-webkit-border-radius: 20px;background-color: #5987c9 }
body.theme-lite ::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3) }
body.theme-lite .user{color: #000;}
body.theme-lite .float_top, body.theme-lite .float_ctop{border-bottom: 1px solid rgb(209 222 232)!important;background: linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);color: #fff;border: 1px solid #fff;}
body.theme-lite .color_lookup{color: #3f51b5;}
body.theme-lite .fmenu_item{border-bottom: 1px solid #ededed;}
body.theme-lite .mroom_text{color: #fff!important;}
body.theme-lite .menuname, body.theme-lite .menuranktxt, body.theme-lite .mroom_name, body.theme-lite .mroom_text, body.theme-lite .ban_text_sultan_shadow{text-shadow: 0 0 2px rgba(0, 0, 0, .8);}
body.theme-lite #chat_main_menu, body.theme-lite #status_menu, body.theme-lite #bank_menu, body.theme-lite #room_options_menu, body.theme-lite #chat_left_menu{border: 1px solid #bfc9d2!important;box-shadow: 0 3px 10px rgb(10 37 64 / 10%)!important;}
body.theme-lite .menui{color: #5987c9;}
body.theme-lite .fmenu_text{color: #000;}
body.theme-lite .background_stream{background-color: rgb(241 243 244);}
body.theme-lite .stream_header{background: linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);}
body.theme-lite .modal_mborder .modal_selected, body.theme-lite .modal_selected{background: linear-gradient(#FF8F00,#FF5722);color: #fff;}


body.theme-lite .proicon{width: 24px;color: #5987c9;}
body.theme-lite .emo_head{background: linear-gradient(to bottom,#ffffff 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);color: white;}
body.theme-lite .title_sultan_post{color: #ff5722;border-bottom: 1px solid #ededed;}
body.theme-lite .description_sultan_post{color: #ff7102;}
body.theme-lite .sultan-pro-sadairaqchat{background: linear-gradient(to bottom,#bacce54a 0%,#6892ce7a 50%,#5987c963 52%,#5987c93d 100%);}
/*rooms*/
body.theme-lite .noview{background: #e5e5e575;color: #ff5722;text-shadow: 0 0 2px rgb(255 255 255 / 90%);border-radius: 10px;}
body.theme-lite .blisting{border-bottom: 1px solid rgb(191 201 210/50%)!important;}
body.theme-lite .s_elem{box-shadow: 0 0 1px 1px #ddd;background: linear-gradient(to bottom,#dee6ed 19%,#c8d5e0 22%,#ffffff 100%);color: #202020;border: 1px solid #fff;}
body.theme-lite .s_elem:hover{background: linear-gradient(to bottom,#e9f0f5 19%,#d4e0eb 22%,#ffffff 100%);color: #202020;font-family: flat-jooza;border: 1px solid #fff }
body.theme-lite .room_icon{box-shadow: 0 2px 2px 0 #d4d2d2;background: linear-gradient(#f2f5f8,#f4f4f4);border: 1px solid rgb(162 180 199/75%);}
body.theme-lite .room_count{color: #ff5722;}
body.theme-lite #page_main_menu{box-shadow: 0 3px 10px #9E9E9E;}
/******/

body.theme-lite .chat_system{color: #000;}
body.theme-lite .delete_btn{background: linear-gradient(#F44336,#c11010);color: #fff;font-family: 'flat-jooza';}
body.theme-lite .delete_btn:hover{background: linear-gradient(#f44336cc,#c11010d4);}
body.theme-lite .svg_sultan{fill: #ffffff;}
body.theme-lite .console_log .console_text{color: #F44336;}
body.theme-lite .console_log .console_user{color: #3F51B5;}
body.theme-lite .sub_list_cell_top .console_reason{color: #ff7102;}
body.theme-lite .sys_sultan_msg{color: #F44336;}
body.theme-lite #delete_warn .link_like{color: #000000;}
body.theme-lite .title_sultan_regmute{color:#ff5722;border-bottom:1px solid #cdcdcd}
body.theme-lite .sultan_action_history{color: #ff5722;font-family: 'Changa';}
body.theme-lite .sultan_text_history{color: #5987c9;}
/*****store icon********/
body.theme-lite .store_icon{fill:#ff5722;}
body.theme-lite .theme_co{color: #ff5722;}
/**********************************/
body.theme-lite .win_coins_sultan{color: #ff7102;}
body.theme-lite .more_itemleft{background: #effaff;}
body.theme-lite .Terms_Use6{color: #ff7a02;background: #fff2cc;}
body.theme-lite .ulist_item{background: #f3f3f3;color: #666;}
body.theme-lite .top_coins_back{color:#ff5722}
body.theme-lite .sultan_private__button{background:#FF5722;color:#fff}
body.theme-lite .sultan_lockcomment{color:#434140;background-color:#f7f7f7;box-shadow:0 1px 3px rgb(0,0,0,0.2)}
body.theme-lite .tptext{font-family: 'Changa';font-size: 13px;}
body.theme-lite .send_button_sound{background:linear-gradient(#FF8F00,#FF5722);color:#fff}
body.theme-lite .send_button_sound:hover{background: linear-gradient(#f3b526,#f7842a); }
body.theme-lite .padding-bottom-store{background: #9e9e9e12;color: black;}
body.theme-lite .radiocss{padding:2px;background:#f8fbfb;border:1px solid #a1959540!important;color:#000}
body.theme-lite .emo_select{/*border: 1px solid #ffffffa6 !important;*/}
body.theme-lite .bselected, body.theme-lite .bselected_sultan .emo_select{background: linear-gradient(rgb(40 84 148) 0%, rgb(106, 151, 216) 50%, rgb(71 104 152) 52%, rgb(40, 84, 148) 100%);}
body.theme-lite .kingcss{background:#f8fbfb;border:1px solid #a195951f!important;box-shadow:0px 0px 8px #BDBDBD}
@media only screen and (max-width : 480px) { {
  body.theme-lite .bhead, body.theme-lite .bfoot, body.theme-lite .float_top, body.theme-lite .float_ctop{background: linear-gradient(to bottom,#b1c7e5 0%,#6892ce 50%,#5987c9 52%,#5987c9 100%);}
}
body.theme-lite .addme{border: 1px solid #ff572230 !important;box-shadow: 0px 0px 8px #FF5722;}
body.theme-lite .Sharegiftcss{text-shadow: none;background:#f8fbfb;border:1px solid #b1b1b159!important}.Terms_Use3{color:#FF5722;background:#f9f9f9;box-shadow:#76767652 1px 0 9px 0}.Terms_Use2{color:#FF5722}.Terms_Use1{box-shadow:0 1px 3px rgb(0,0,0,.2);background:#f8fbfb;color:#000}.title_Store{color:#ff5722;border-bottom:1px solid #d1dee8}.description_Store{color:#ff7102}.store-item{background:#f6f6f6;border:1px solid #a195955c!important}.month{color:#ff601c;border-bottom:1px solid #a195955c!important;text-shadow:0 0 2px #fff}.title-time,.title-price,.title-info{box-shadow:0 0 8px #BDBDBD;background:#f8fbfb;border:1px solid #a1959559!important;color:#4b4b4b}
body.theme-lite .post__announcePost{background:#f0ffffb0!important;border:1px solid #77777740 !important}
body.theme-lite .islamic-span{color:#FF5722;background:#f2feff;border:1px solid #a1959538!important;text-shadow:0 0 1px rgb(255 255 255 / 80%);box-shadow:0 0 6px #ff57224a}.custom-span{color:#FF5722;background:#f2feff;border:1px solid #a1959538!important;text-shadow:0 0 1px rgb(255 255 255 / 80%);box-shadow:0 0 6px #ff57224a}.custom-span-link{background:linear-gradient(#FF8F00,#FF5722);color:#fff}.custom-span-underline{color:#5987c9}
body.theme-lite .user_Lmode{
    color: #004a85;
}
/* ===== END LITE THEME ===== */

/* شريط أدوات الموبايل */
#mob-tools-bar{display:none!important;align-items:center;gap:6px;padding:6px 10px;background:rgba(8,18,36,.95);border-top:1px solid rgba(255,255,255,.07);}
.mob-tool-btn{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;color:#b0bec5;transition:.2s;}
.mob-tool-btn:active{background:rgba(255,215,0,.15);border-color:rgba(255,215,0,.3);}
@media(max-width:480px){
  #mob-tools-bar{display:flex!important;}
  .cin-tool-btn{display:none!important;}
}