/* v270 · اشتراک لایو: گوی اشتراک + شیت روشن */

/* ═══ دکمهٔ بالای اتاق ═══ */
#liveRoom49 button.sb270{ position:relative; width:38px !important; height:38px !important; padding:0 !important; border:0 !important; border-radius:50% !important;
  display:grid !important; place-items:center; cursor:pointer; background:none !important; box-shadow:none !important; isolation:isolate }
#liveRoom49 button.sb270 .rg270{ position:absolute; inset:0; border-radius:50%; z-index:-2; background:conic-gradient(from 0deg,#22D3EE,#8B5CF6,#FF5E9C,#22D3EE); animation:rg270 6s linear infinite }
#liveRoom49 button.sb270 .cr270{ position:absolute; inset:2.5px; border-radius:50%; z-index:-1; display:grid; place-items:center;
  background:radial-gradient(circle at 35% 28%,#B79CFF 0%,#7C3AED 50%,#4C1D95 100%);
  box-shadow:inset 0 2px 3px rgba(255,255,255,.45), inset 0 -3px 6px rgba(30,0,70,.5), 0 6px 14px -4px rgba(124,58,237,.85) }
#liveRoom49 button.sb270 .sg270{ width:18px; height:18px; filter:drop-shadow(0 1px 1.5px rgba(30,0,70,.5)) }
#liveRoom49 button.sb270:active{ transform:scale(.92) }
@keyframes rg270{ to{ transform:rotate(360deg) } }

/* ═══ شیت ═══ */
#shareSh69.sh270{ position:fixed; inset:0; z-index:2147482500; display:flex; align-items:flex-end; justify-content:center; padding:0 !important;
  background:rgba(46,16,101,0); transition:background .25s; font-family:inherit }
#shareSh69.sh270.in{ background:rgba(46,16,101,.3) } #shareSh69.sh270.out{ background:rgba(46,16,101,0) }
.sh270 button, .sh270 input{ font-family:inherit }
.pn270{ position:relative; width:100%; max-width:480px; max-height:88vh; display:flex; flex-direction:column; overflow:hidden; color:#2E1065;
  border-radius:28px 28px 0 0; background:linear-gradient(180deg,#F7F2FF 0%,#FFFFFF 36%,#FFF9F2 100%);
  box-shadow:0 -18px 44px -14px rgba(139,92,246,.45), inset 0 1px 0 #fff; transform:translateY(100%); transition:transform .38s cubic-bezier(.2,.9,.3,1.05) }
.sh270.in .pn270{ transform:none } .sh270.out .pn270{ transform:translateY(100%) }
@media (min-width:600px){ .sh270:not(.dk270) .pn270{ border-radius:28px; margin-bottom:20px } }
.ob270{ position:absolute; border-radius:50%; filter:blur(44px); pointer-events:none }
.ob270.a{ width:240px; height:220px; top:-90px; inset-inline-start:-60px; background:rgba(34,211,238,.25) }
.ob270.b{ width:260px; height:240px; top:-60px; inset-inline-end:-90px; background:rgba(255,94,156,.25) }
.gr270{ position:relative; z-index:1; display:block; width:42px; height:5px; margin:10px auto 0; border-radius:99px; background:#E4D6FF }
.xx270{ position:absolute; z-index:3; top:14px; inset-inline-end:14px; width:34px; height:34px; border:0; border-radius:12px; display:grid; place-items:center; cursor:pointer;
  color:#6D28D9; background:#fff; box-shadow:0 4px 12px -6px rgba(139,92,246,.45), inset 0 0 0 1.5px #EDE4FD }
.xx270 svg{ width:17px; height:17px }
.bd270{ position:relative; z-index:1; flex:1; overflow-y:auto; padding:8px 14px 10px; scrollbar-width:none }
.bd270::-webkit-scrollbar{ display:none }

/* کارت لایو */
.lc270{ display:flex; align-items:center; gap:12px; padding:12px; margin-inline-end:40px; border-radius:20px; background:linear-gradient(120deg,#EFE6FF,#FFEFF7); box-shadow:inset 0 0 0 1.5px #EADDFB }
.la270{ position:relative; flex:none; width:58px; height:58px; padding:3px; border-radius:50%; display:grid; place-items:center }
.ring270{ position:absolute; inset:0; border-radius:50%; background:conic-gradient(from 0deg,#22D3EE,#8B5CF6,#FF5E9C,#22D3EE); animation:rg270 4s linear infinite }
.la270 img, .la270 em{ position:relative; width:100%; height:100%; border-radius:50%; object-fit:cover; border:2.5px solid #fff; display:grid; place-items:center; background:#F3ECFF; font-style:normal; font-weight:900; font-size:20px; color:#7C3AED }
.lv270{ position:absolute; bottom:-6px; left:50%; transform:translateX(-50%); padding:1px 7px; border-radius:99px; font-size:8.5px; font-weight:900; letter-spacing:.5px; color:#fff;
  background:linear-gradient(135deg,#FF3D7F,#C026D3); border:2px solid #fff }
.lt270{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.lt270 > b{ font-size:15.5px; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.lt270 > small{ font-size:11.5px; font-weight:700; color:#7C6A9E; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.lm270{ display:flex; flex-wrap:wrap; gap:6px; margin-top:3px }
.lm270 i{ display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:99px; font-style:normal; font-size:10.5px; font-weight:800; color:#6D28D9; background:#fff }
.lm270 i svg{ width:12px; height:12px } .lm270 i.f{ color:#C2410C; background:#FFF3E8 }

/* لینک */
.lk270{ display:flex; align-items:center; gap:8px; margin-top:10px; padding:6px 6px 6px 10px; border-radius:16px; background:#fff; box-shadow:0 8px 18px -16px rgba(91,33,182,.55), inset 0 0 0 1.5px #EDE4FD }
[dir=rtl] .lk270{ padding:6px 10px 6px 6px }
.li270{ flex:none; width:28px; height:28px; border-radius:9px; display:grid; place-items:center; color:#7C3AED; background:#F3ECFF }
.li270 svg{ width:15px; height:15px }
.lk270 input{ flex:1; min-width:0; border:0; outline:0; background:none; font-size:12px; font-weight:700; color:#5B4A7A; text-overflow:ellipsis }
.lk270 button{ flex:none; height:34px; padding:0 14px; border:0; border-radius:12px; cursor:pointer; color:#fff; font-size:12.5px; font-weight:900; background:linear-gradient(135deg,#8B5CF6,#6D28D9) }
.lk270 button.ok{ background:linear-gradient(135deg,#10B981,#059669) }

/* اشتراک سریع */
.qs270{ display:flex; gap:10px; overflow-x:auto; margin:12px -14px 0; padding:2px 14px 6px; scrollbar-width:none }
.qs270::-webkit-scrollbar{ display:none }
.q270{ flex:none; width:60px; display:flex; flex-direction:column; align-items:center; gap:5px; border:0; background:none; cursor:pointer; padding:0 }
.q270 span{ width:52px; height:52px; border-radius:18px; display:grid; place-items:center; color:#fff; box-shadow:0 8px 16px -10px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.4) }
.q270 span svg{ width:24px; height:24px }
.q270 small{ font-size:10.5px; font-weight:800; color:#5B4A7A; white-space:nowrap }
.q270.copy span{ background:linear-gradient(140deg,#B79CFF,#7C3AED) } .q270.copy.ok span{ background:linear-gradient(140deg,#34D399,#059669) }
.q270.wa span{ background:linear-gradient(140deg,#5BE38A,#16A34A) }
.q270.tg span{ background:linear-gradient(140deg,#5BC8F5,#1D8FD8) }
.q270.xx span{ background:linear-gradient(140deg,#3F3F46,#09090B) }
.q270.sms span{ background:linear-gradient(140deg,#FFB547,#F97316) }
.q270.mail span{ background:linear-gradient(140deg,#FF8FBF,#E11D74) }
.q270.more span{ background:linear-gradient(140deg,#E9E3F5,#C9BEE6); color:#5B21B6 }
.q270:active span{ transform:scale(.93) }

/* دعوت داخل Hartly */
.ih270{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin:12px 2px 8px }
.ih270 b{ display:flex; align-items:center; gap:6px; font-size:14px; font-weight:900 }
.ih270 b svg{ width:18px; height:18px; color:#8B5CF6 }
.ih270 small{ font-size:10.5px; font-weight:700; color:#8E7DB3 }
.tb270{ display:flex; gap:3px; padding:3px; border-radius:14px; background:#F3EDFC; box-shadow:inset 0 0 0 1.5px #EADFFB }
.tb270 .sh69-tab::after{ display:none !important }
.tb270 .sh69-tab{ padding:0 !important; flex:1; height:32px; display:grid; place-items:center; border-radius:11px; cursor:pointer; font-size:12.5px; font-weight:800; color:#7C6A9E; border:0 !important; transition:background .2s, color .2s }
.tb270 .sh69-tab.on{ color:#fff !important; background:linear-gradient(120deg,#FF3D7F,#C026D3 55%,#8B5CF6); box-shadow:0 6px 12px -8px rgba(192,38,211,.8) }
.sr270{ display:flex; align-items:center; gap:8px; height:40px; margin-top:8px; padding:0 6px 0 12px; border-radius:13px; background:#fff; box-shadow:inset 0 0 0 1.5px #EDE4FD }
[dir=rtl] .sr270{ padding:0 12px 0 6px }
.sr270 > svg{ width:16px; height:16px; color:#A78BFA; flex:none }
.sr270 input{ flex:1; min-width:0; border:0; outline:0; background:none; font-size:13px; font-weight:700; color:#2E1065 }
.sr270 button{ flex:none; height:28px; padding:0 10px; border:0; border-radius:9px; cursor:pointer; font-size:11px; font-weight:900; color:#6D28D9; background:#F3ECFF }
.ch270{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px }
.ch270:empty{ display:none }
.cp270{ position:relative; width:34px; height:34px; border-radius:50%; cursor:pointer; box-shadow:0 0 0 2px #fff, 0 0 0 3.5px #C084FC }
.cp270 img, .cp270 em{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:grid; place-items:center; font-style:normal; font-weight:900; color:#7C3AED; background:#F3ECFF }
.cp270 i{ position:absolute; top:-4px; inset-inline-end:-4px; width:15px; height:15px; border-radius:50%; display:grid; place-items:center; color:#fff; background:#E11D48; border:1.5px solid #fff }
.cp270 i svg{ width:8px; height:8px }
.cm270{ height:34px; padding:0 10px; border-radius:99px; display:grid; place-items:center; font-size:11.5px; font-weight:900; color:#6D28D9; background:#F3ECFF }
.ls270{ display:flex; flex-direction:column; gap:6px; margin-top:8px; min-height:120px }
.ls270 > p{ color:#8E7DB3 !important }
.rw270{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:16px; cursor:pointer; background:#fff; box-shadow:0 8px 16px -15px rgba(91,33,182,.55), inset 0 0 0 1.5px #F1E9FD;
  animation:ri270 .3s both; animation-delay:var(--d); transition:box-shadow .2s, background .2s }
@keyframes ri270{ from{ opacity:0; transform:translateY(6px) } }
.rw270.sel{ background:linear-gradient(120deg,#FFF0F7,#F3ECFF); box-shadow:0 0 0 2px #C084FC }
.ra270{ flex:none; width:42px; height:42px; border-radius:50%; overflow:hidden; display:grid; place-items:center; background:#F3ECFF; box-shadow:0 0 0 2px #fff, 0 0 0 3.5px #EDE4FD }
.ra270 img{ width:100%; height:100%; object-fit:cover } .ra270 em{ font-style:normal; font-weight:900; color:#7C3AED; font-size:16px }
.rw270 > b{ flex:1; min-width:0; font-size:14px; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.ck270{ flex:none; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; color:transparent; box-shadow:inset 0 0 0 2px #D8CCF2; transition:background .2s, box-shadow .2s }
.ck270 svg{ width:14px; height:14px }
.rw270.sel .ck270{ color:#fff; background:linear-gradient(135deg,#FF3D7F,#8B5CF6); box-shadow:none }
.sk270{ height:58px; border-radius:16px; background:linear-gradient(90deg,#F5F0FF,#FFFFFF,#F5F0FF); background-size:200% 100%; animation:sk270 1.1s linear infinite }
@keyframes sk270{ to{ background-position:-200% 0 } }
.em270{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:18px 10px; text-align:center; border-radius:16px; background:#FBF8FF }
.em270 svg{ width:32px; height:32px; color:#C4B5FD }
.em270 b{ font-size:13px; font-weight:900 } .em270 small{ font-size:11.5px; font-weight:700; color:#8E7DB3 }
.ft270{ position:relative; z-index:2; padding:10px 14px calc(12px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,rgba(255,249,242,0),#FFF9F2 30%) }
.sd270{ width:100%; height:50px; border:0; border-radius:16px; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; font-size:14.5px; font-weight:900;
  color:#A99BC6; background:#EFE9F8; transition:background .25s, color .25s, box-shadow .25s }
.sd270 svg{ width:19px; height:19px }
.sd270.on{ color:#fff; background:linear-gradient(120deg,#FF3D7F,#C026D3 55%,#8B5CF6); box-shadow:0 14px 26px -12px rgba(192,38,211,.85), inset 0 1px 0 rgba(255,255,255,.35) }
@media (prefers-reduced-motion:reduce){ .sh270 *, #liveRoom49 button.sb270 *{ animation:none !important } .pn270{ transition:none } }