/* Homdorong Glass Pro v1 — تالار گفتگوی شیشه‌ای + چت حرفه‌ای‌تر + پیام صوتی بدون قاب
   فقط CSS؛ باید آخرین فایل CSS در index.html باشد. برگشت: همین خط link را از index.html حذف کنید. */

:root{
 --gl-bg-a:#0b2a2c;--gl-bg-b:#123c3a;
 --gl-fill:rgba(255,255,255,.07);--gl-fill-hover:rgba(255,255,255,.12);--gl-fill-active:rgba(255,255,255,.17);
 --gl-edge:rgba(255,255,255,.16);--gl-edge-soft:rgba(255,255,255,.08);
 --gl-panel:rgba(14,44,46,.46);--gl-blur:blur(22px) saturate(1.6);
 --gl-shine:inset 0 1px 0 rgba(255,255,255,.18);
 --gl-ink:#eef6f4;--gl-muted:#a3bfba;
 --gl-wall:#eef2f0;--gl-bubble-in:rgba(255,255,255,.86);--gl-bubble-in-edge:rgba(20,50,48,.08);
 --gl-out-a:#138472;--gl-out-b:#0a5a50;
 --gl-bar:rgba(255,255,255,.72);--gl-bar-edge:rgba(20,50,48,.10);
}
[data-theme=dark]{
 --gl-bg-a:#06161a;--gl-bg-b:#0c2a2b;--gl-panel:rgba(8,26,29,.5);
 --gl-wall:#0b1517;--gl-bubble-in:rgba(34,54,58,.72);--gl-bubble-in-edge:rgba(255,255,255,.07);
 --gl-bar:rgba(16,30,33,.7);--gl-bar-edge:rgba(255,255,255,.08);
}
@media (prefers-color-scheme:dark){
 :root:not([data-theme=light]){
  --gl-bg-a:#06161a;--gl-bg-b:#0c2a2b;--gl-panel:rgba(8,26,29,.5);
  --gl-wall:#0b1517;--gl-bubble-in:rgba(34,54,58,.72);--gl-bubble-in-edge:rgba(255,255,255,.07);
  --gl-bar:rgba(16,30,33,.7);--gl-bar-edge:rgba(255,255,255,.08);
 }
}

/* ============ ۱) تالار گفتگو (ستون فهرست) — شیشه‌ای ============ */
/* پس‌زمینهٔ رنگی پشت شیشه تا محو‌شدگی دیده شود */
html body .app-shell{
 background:
  radial-gradient(520px 420px at 100% 0%,rgba(31,174,150,.55),transparent 70%),
  radial-gradient(460px 460px at 90% 100%,rgba(201,163,79,.38),transparent 70%),
  radial-gradient(380px 380px at 40% 45%,rgba(40,120,170,.28),transparent 70%),
  linear-gradient(160deg,var(--gl-bg-a),var(--gl-bg-b))!important;
}
html body .sidebar{
 background:var(--gl-panel)!important;
 -webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);
 border-inline-end:1px solid var(--gl-edge-soft)!important;
 box-shadow:inset -1px 0 0 rgba(255,255,255,.04)!important;
 color:var(--gl-ink)!important;position:relative;z-index:2;
}
html body .sidebar-header{
 background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;
 border-bottom:1px solid var(--gl-edge-soft)!important;box-shadow:var(--gl-shine);
 -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
html body .sidebar .search-box{
 background:var(--gl-fill)!important;border:1px solid var(--gl-edge-soft)!important;border-radius:14px!important;
 box-shadow:var(--gl-shine)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
 transition:background .18s,border-color .18s,box-shadow .18s;
}
html body .sidebar .search-box:focus-within{background:var(--gl-fill-hover)!important;border-color:rgba(201,163,79,.7)!important;box-shadow:var(--gl-shine),0 0 0 3px rgba(201,163,79,.16)!important}
html body .conversation-list{padding:10px 6px!important}
html body .conversation-item{
 background:var(--gl-fill)!important;border:1px solid var(--gl-edge-soft)!important;border-radius:18px!important;
 margin:5px 6px!important;width:calc(100% - 12px)!important;box-shadow:var(--gl-shine)!important;
 -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
 transition:background .18s,border-color .18s,transform .14s,box-shadow .18s!important;
}
html body .conversation-item:hover{background:var(--gl-fill-hover)!important;border-color:var(--gl-edge)!important;transform:translateY(-1px)!important}
html body .conversation-item.active{
 background:linear-gradient(120deg,rgba(201,163,79,.28),rgba(255,255,255,.14))!important;
 border-color:rgba(201,163,79,.55)!important;
 box-shadow:var(--gl-shine),0 10px 26px -14px rgba(201,163,79,.65)!important;
}
html body .conversation-item.active::before{inset-inline-start:-1px;inset-block:16px;width:3px}
html body .conversation-item .avatar{box-shadow:0 0 0 2px rgba(255,255,255,.22),0 6px 14px -6px rgba(0,0,0,.5)!important}
html body .conversation-item .row-top strong{color:var(--gl-ink)!important}
html body .conversation-item .preview,html body .conversation-copy .row-top time{color:var(--gl-muted)!important}
html body .conversation-item:has(time.has-unread) .preview{color:var(--gl-ink)!important}
html body .sidebar .badge,html body .conversation-item .badge{
 background:linear-gradient(145deg,#e3c274,#c9a34f)!important;color:#1d1606!important;
 box-shadow:0 4px 10px -4px rgba(201,163,79,.9),inset 0 1px 0 rgba(255,255,255,.5)!important;
}
html body .fab{
 background:linear-gradient(145deg,#e3c274,#c9a34f)!important;color:#1d1606!important;
 box-shadow:0 12px 26px -10px rgba(201,163,79,.85),inset 0 1px 0 rgba(255,255,255,.55)!important;
}
html body .fab-menu{
 background:rgba(14,44,46,.72)!important;color:var(--gl-ink)!important;border:1px solid var(--gl-edge)!important;
 -webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);box-shadow:var(--gl-shine),0 18px 40px -12px rgba(0,0,0,.55)!important;
}
html body .fab-menu button{color:var(--gl-ink)!important}
html body .fab-menu button:hover{background:var(--gl-fill-hover)!important}

/* ============ ۲) چت حرفه‌ای‌تر ============ */
html body .chat-panel{background:var(--gl-wall)!important}
html body .messages{
 background-color:var(--gl-wall)!important;
 background-image:
  radial-gradient(700px 420px at 0% 0%,color-mix(in srgb,var(--hp-teal) 9%,transparent),transparent 70%),
  radial-gradient(600px 400px at 100% 100%,color-mix(in srgb,var(--hp-brass) 9%,transparent),transparent 70%)!important;
 background-size:auto!important;
 padding:22px clamp(14px,5vw,56px) 26px!important;
}
html body .chat-header{
 background:var(--gl-bar)!important;border-bottom:1px solid var(--gl-bar-edge)!important;
 -webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);
 box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 10px 30px -22px rgba(10,40,38,.6)!important;
}
html body .chat-heading strong{font-weight:700;font-size:16px}
html body .chat-header .avatar{width:42px;height:42px}

/* حباب‌ها: ساده‌تر، خواناتر، فاصله‌گذاری منظم */
html body .message-row{margin-block:2px!important}
html body .message-row:not(.cont){margin-top:12px!important}
html body .message-row .message-bubble{
 border-radius:16px!important;padding:8px 13px 6px!important;max-width:min(72%,34rem);
 box-shadow:0 1px 2px rgba(10,40,38,.08),0 8px 18px -14px rgba(10,40,38,.35)!important;
}
html body .message-row.theirs .message-bubble{
 background:var(--gl-bubble-in)!important;border:1px solid var(--gl-bubble-in-edge)!important;
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-start-end-radius:4px!important;
}
html body .message-row.mine .message-bubble{
 background:linear-gradient(160deg,var(--gl-out-a),var(--gl-out-b))!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 22px -14px rgba(10,90,80,.8)!important;border-start-start-radius:4px!important;
}
html body .message-row.cont:not(.mine) .message-bubble{border-start-end-radius:16px!important}
html body .message-row.cont.mine .message-bubble{border-start-start-radius:16px!important}
html body .message-bubble p{font-size:14.5px;line-height:1.9}
html body .message-meta{opacity:.8;margin-top:2px}

/* جداکنندهٔ روز: قرص شیشه‌ای کوچک */
html body .day-sep span{
 background:var(--gl-bar)!important;border:1px solid var(--gl-bar-edge)!important;font-size:11.5px;font-weight:600;padding:3px 14px!important;
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:none!important;
}

/* نوار ارسال: شیشه‌ای و مرتب */
html body .composer{
 background:var(--gl-bar)!important;border:1px solid var(--gl-bar-edge)!important;border-radius:24px!important;
 -webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 14px 34px -18px rgba(10,40,38,.55)!important;
}
html body .composer .attach-btn,html body .composer .record-btn{color:var(--hp-muted)!important;background:transparent!important;width:42px;height:42px}
html body .composer .attach-btn:hover,html body .composer .record-btn:hover{background:color-mix(in srgb,var(--hp-teal) 12%,transparent)!important;color:var(--hp-teal)!important}
html body .composer .record-btn.recording{background:#e5484d!important;color:#fff!important}
html body .send-btn{background:linear-gradient(150deg,var(--gl-out-a),var(--gl-out-b))!important}

/* ============ ۳) پیام صوتی بدون قاب ============ */
/* قاب (کادر پیوست + آیکون + نام فایل + لینک) برداشته می‌شود؛ فقط پخش‌کننده می‌ماند */
html body .attachment[data-hd-voice],html body .message-row.mine .attachment[data-hd-voice],html body .message-row.theirs .attachment[data-hd-voice]{
 display:block!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;border-radius:0!important;
}
html body .attachment[data-hd-voice]:hover{background:none!important;transform:none!important}
html body .attachment[data-hd-voice] .attachment-icon,
html body .attachment[data-hd-voice] .attachment-content>strong,
html body .attachment[data-hd-voice] .attachment-content>a,
html body .attachment[data-hd-voice] .attachment-content>.hd-media-download,
html body .attachment[data-hd-voice] .attachment-content>small.muted{display:none!important}
html body .attachment[data-hd-voice] .attachment-content{display:block;gap:0}
html body .attachment[data-hd-voice] .hd-aud{padding:0;min-width:min(260px,66vw);gap:10px}
html body .attachment[data-hd-voice] .hd-aud-play{
 width:42px;height:42px;z-index:2;pointer-events:auto!important;touch-action:manipulation;
 box-shadow:0 6px 14px -6px rgba(0,0,0,.45);transition:transform .12s,box-shadow .18s;
}
html body .attachment[data-hd-voice] .hd-aud-play:hover{transform:scale(1.06)}
html body .attachment[data-hd-voice] .hd-aud-play:active{transform:scale(.93)}
html body .attachment[data-hd-voice] .hd-aud.err .hd-aud-play{animation:gl-shake .35s}
@keyframes gl-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
html body .hd-aud-wave,html body .hd-aud-speed{pointer-events:auto}
/* حباب فقط‌صوتی کمی جمع‌وجورتر */
html body .message-bubble:has(.attachment[data-hd-voice]){padding:9px 12px 6px!important}

@media (max-width:820px){
 html body .message-row .message-bubble{max-width:86%}
 html body .conversation-item{margin:4px 4px!important;width:calc(100% - 8px)!important}
}
/* اگر مرورگر backdrop-filter ندارد، پس‌زمینه‌ها کمی مات‌تر شوند تا خوانا بمانند */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 :root{--gl-panel:rgba(12,40,42,.92);--gl-bar:rgba(255,255,255,.96);--gl-bubble-in:#fff}
 [data-theme=dark]{--gl-bar:rgba(16,30,33,.97);--gl-bubble-in:#22363a}
}

/* ============ ۴) پالت یکدست: فقط سبز-آبی (teal) + برنجی ============ */
:root{--pl-teal:#1fa392;--pl-teal-d:#0f6b61;--pl-brass:#d6b25e}
/* کاشی‌های آمار: شیشه‌ای، آیکون تک‌رنگ */
html body .hd2-stats{gap:8px;padding:10px 10px 4px}
html body .hd2-tile{
 background:var(--gl-fill)!important;border:1px solid var(--gl-edge-soft)!important;color:var(--gl-ink)!important;border-radius:16px!important;
 box-shadow:var(--gl-shine);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
html body .hd2-tile:hover{background:var(--gl-fill-hover)!important}
html body .hd2-tile .hd2-ic{color:var(--gl-muted);display:grid;place-items:center}
html body .hd2-tile .hd2-cp small{color:var(--gl-muted)!important}
html body .hd2-tile.on{background:color-mix(in srgb,var(--pl-teal) 26%,transparent)!important;border-color:var(--pl-teal)!important}
html body .hd2-tile.on .hd2-ic{color:var(--pl-brass)}
/* آواتارها: همه یک گرادیان سبز-آبی؛ گروه/کانال کمی تیره‌تر با حلقهٔ برنجی */
html body .sidebar .avatar,html body .chat-header .avatar{
 background:linear-gradient(145deg,var(--pl-teal),var(--pl-teal-d))!important;color:#fff!important;
}
html body .sidebar .avatar.group-avatar,html body .chat-header .avatar.group-avatar{
 background:linear-gradient(145deg,#17766b,#0b4a47)!important;color:var(--pl-brass)!important;
}
/* گفتگوی فعال: شیشهٔ سبز-آبی با نوار برنجی (به‌جای زمینهٔ زرد گل‌آلود) */
html body .conversation-item.active{
 background:linear-gradient(120deg,color-mix(in srgb,var(--pl-teal) 30%,transparent),rgba(255,255,255,.10))!important;
 border-color:color-mix(in srgb,var(--pl-teal) 70%,transparent)!important;
 box-shadow:var(--gl-shine),0 10px 26px -16px rgba(31,163,146,.8)!important;
}
html body .conversation-item.active::before{background:var(--pl-brass)}
html body .conversation-item time.has-unread,html body .conversation-copy .row-top time.has-unread{color:var(--pl-brass)!important}
/* چیپ «پیام‌ها» در جستجو و تاریخ بالا */
html body #hd-v12-search-toggle{
 background:color-mix(in srgb,var(--pl-teal) 35%,transparent)!important;border:1px solid color-mix(in srgb,var(--pl-teal) 70%,transparent)!important;color:var(--gl-ink)!important;
}
html body #hd-jalali-date{
 background:var(--gl-fill)!important;color:var(--gl-ink)!important;border:1px solid var(--gl-edge-soft)!important;
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--gl-shine)!important;
}
html body #hd-jalali-date *{color:inherit!important}
/* نوار پایین (گفتگوها/تماس‌ها/مخاطبین/تنظیمات): شیشه‌ای */
html body div[style*="border-radius: 24px"][style*="z-index: 50"]{
 background:rgba(12,38,40,.62)!important;border:1px solid var(--gl-edge)!important;
 -webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);box-shadow:var(--gl-shine),0 16px 36px -14px rgba(0,0,0,.6)!important;
}
html body div[style*="border-radius: 24px"][style*="z-index: 50"] button{color:var(--gl-muted)!important}
html body div[style*="border-radius: 24px"][style*="z-index: 50"] button[style*="var(--accent)"]{color:var(--pl-brass)!important}
/* دکمهٔ + : همان برنجی پالت */
html body .fab{background:linear-gradient(145deg,#e6c97f,var(--pl-brass))!important}

/* ============ ۵) کنتراست بالاتر: حروف شفاف‌تر و خواناتر ============ */
:root{
 --gl-panel:rgba(6,26,28,.74);--gl-ink:#ffffff;--gl-muted:#d3e6e2;
 --gl-fill:rgba(255,255,255,.09);--gl-fill-hover:rgba(255,255,255,.15);
 --gl-bubble-in:rgba(255,255,255,.96);--gl-bubble-in-edge:rgba(20,50,48,.14);
 --gl-out-a:#0f6f60;--gl-out-b:#084a42;
 --gl-bar:rgba(255,255,255,.9);--gl-bar-edge:rgba(20,50,48,.16);
 --pl-brass:#f0cd7a;
 --hp-ink:#0c1a1c;--hp-muted:#3d5256;
}
[data-theme=dark]{--gl-bubble-in:rgba(36,58,62,.96);--gl-bar:rgba(12,24,27,.88);--gl-bar-edge:rgba(255,255,255,.14);--gl-bubble-in-edge:rgba(255,255,255,.12);--hp-ink:#f2f8f6;--hp-muted:#b4c9c8}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--gl-bubble-in:rgba(36,58,62,.96);--gl-bar:rgba(12,24,27,.88);--gl-bar-edge:rgba(255,255,255,.14);--gl-bubble-in-edge:rgba(255,255,255,.12);--hp-ink:#f2f8f6;--hp-muted:#b4c9c8}}
/* تالار */
html body .sidebar{-webkit-backdrop-filter:blur(26px) saturate(1.5);backdrop-filter:blur(26px) saturate(1.5)}
html body .conversation-item .row-top strong{font-weight:800;font-size:15.5px;text-shadow:0 1px 2px rgba(0,0,0,.35)}
html body .conversation-item .preview{font-size:13.5px;font-weight:500;opacity:1}
html body .conversation-copy .row-top time{font-weight:600}
html body .hd2-tile .hd2-cp b{font-weight:800;color:#fff}
html body .hd2-tile .hd2-cp small{font-size:11px;font-weight:600}
html body .sidebar .brand-inline small{color:var(--gl-muted)!important}
html body .sidebar .search-box input::placeholder{color:var(--gl-muted)!important;opacity:1}
html body .conversation-item{border-color:rgba(255,255,255,.14)!important}
html body .conversation-item.active{background:linear-gradient(120deg,rgba(31,163,146,.42),rgba(255,255,255,.10))!important}
html body .sidebar .badge,html body .conversation-item .badge{color:#1a1203!important;font-weight:800}
/* متن‌های چت */
html body .message-row.theirs .message-bubble{color:var(--hp-ink)!important}
html body .message-row.theirs .message-bubble p{color:var(--hp-ink)}
html body .message-row.mine .message-bubble,html body .message-row.mine .message-bubble p{color:#fff!important}
html body .message-bubble p{font-weight:500}
html body .message-row.theirs .message-meta,html body .message-row.theirs .message-bubble time{color:var(--hp-muted)!important}
html body .message-row.mine .message-meta,html body .message-row.mine .message-bubble time,html body .message-row.mine .tick{color:rgba(255,255,255,.9)!important}
html body .message-meta{opacity:1}
html body .day-sep span{color:var(--hp-ink)!important;font-weight:700}
html body .chat-heading strong{color:var(--hp-ink)!important}
html body .chat-heading small{color:var(--hp-muted)!important}
html body .composer textarea{color:var(--hp-ink)!important}
html body .composer textarea::placeholder{color:var(--hp-muted)!important;opacity:1}
html body .hd-aud-time,html body .hd-aud-speed{opacity:1;font-weight:700}
html body .hd-aud-wave i{opacity:.4}
/* نوار پایین */
html body div[style*="border-radius: 24px"][style*="z-index: 50"]{background:rgba(6,26,28,.82)!important}
html body div[style*="border-radius: 24px"][style*="z-index: 50"] button{color:var(--gl-muted)!important}