/* ═══════════════════════════════════════════════════════════════════
   «زاد بيان Meet» — هويّة صفحة اللقاء برابط (docs/GUEST-MEETINGS-PLAN.md).

   صفحةٌ مستقلّة داكنة بتدرّجٍ من أخضر العلامة، وبطاقاتٌ زجاجية. شاشة المكالمة نفسها
   (lc-*) تأخذ لوحتها الداكنة الموجودة في live-class.css، منقولةً هنا تحت .zb-meet
   فلا يتغيّر شيءٌ في المحاضرات والغرف.
   ═══════════════════════════════════════════════════════════════════ */

.zb-meet {
    --zbm-bg-1: #04110d;
    --zbm-bg-2: #0a241c;
    --zbm-accent: #2FBE8B;
    --zbm-accent-2: #7BE0B4;
    --zbm-glass: rgba(19, 36, 32, .62);
    --zbm-glass-line: rgba(123, 224, 180, .16);
    --zbm-text: #E7F1EC;
    --zbm-text-2: #A0B6AD;
    --zbm-amber: #EFB963;
    min-height: 100dvh;
    color: var(--zbm-text);
    background:
        radial-gradient(80ch 50ch at 85% -10%, rgba(47, 190, 139, .28) 0%, transparent 60%),
        radial-gradient(70ch 45ch at 5% 110%, rgba(18, 128, 91, .30) 0%, transparent 60%),
        linear-gradient(160deg, var(--zbm-bg-2) 0%, var(--zbm-bg-1) 70%);
    background-attachment: fixed;
    font-family: inherit;
}

/* صفحة Meet بلا ترويسة الموقع ولا تذييله — كما تفعل zui.css لإطارات التطبيق */
body:has(.zb-meet) {
    background: #04110d;
    padding-top: 0 !important;
    overflow-x: clip;
}

body:has(.zb-meet)::before,
body:has(.zb-meet)::after,
body:has(.zb-meet) > footer.footer {
    display: none;
}

/* ── اللوحة الداكنة لشاشة المكالمة داخل Meet (منقولة من :root[data-theme=dark]) ── */
.zb-meet .lc-root {
    --lc-primary: #2FBE8B;
    --lc-primary-dark: #7BE0B4;
    --lc-primary-light: #12332A;
    --lc-secondary: #3FCF9B;
    --lc-on-primary: #062319;
    --lc-btn: #2FBE8B;
    --lc-btn-hover: #4FCF9E;
    --lc-wash-a: transparent;
    --lc-wash-mid: transparent;
    --lc-wash-b: transparent;
    --lc-card: rgba(19, 36, 32, .72);
    --lc-card-2: rgba(15, 30, 25, .72);
    --lc-card-3: #1B2F29;
    --lc-line: rgba(123, 224, 180, .14);
    --lc-line-2: rgba(123, 224, 180, .22);
    --lc-text: #E7F1EC;
    --lc-text-2: #A0B6AD;
    --lc-text-3: #8AA69D;
    --lc-stage: #061310;
    --lc-stage-3: #1B3C30;
    --lc-warn: #EFB963;
    --lc-warn-bg: #33280F;
    --lc-warn-line: #54411A;
    --lc-warn-solid: #E2A542;
    --lc-stop: #E4635B;
    --lc-stop-bg: #3A1B19;
    --lc-stop-line: #5A2925;
    --lc-stop-text: #F08D86;
    --lc-stop-solid: #C7413A;
    --lc-tip-bg: #E7F1EC;
    --lc-tip-fg: #0F1E19;
    --lc-mono-s: 22%;
    --lc-mono-l: 24%;
    --lc-mono-fs: 42%;
    --lc-mono-fl: 76%;
    --lc-shadow: 0 4px 10px -2px rgba(0,0,0,.5);
    --lc-shadow-lg: 0 24px 60px -18px rgba(0,0,0,.75), 0 4px 14px -4px rgba(0,0,0,.45);
    --lc-shadow-pill: 0 8px 26px -6px rgba(0,0,0,.7), 0 2px 8px -2px rgba(0,0,0,.45);
    background: transparent;
}

.zb-meet .lc-center {
    background: none;
    min-height: calc(100dvh - 72px);
}

.zb-meet .lc-panel {
    background: var(--zbm-glass);
    border: 1px solid var(--zbm-glass-line);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    border-radius: 24px;
}

.zb-meet .lc-panel-wide {
    width: min(1040px, 100%);
}

.zb-meet .lc-lobby-preview {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 0 0 1px var(--zbm-glass-line), 0 30px 60px -30px rgba(0,0,0,.8);
}

.zb-meet .lc-btn-primary {
    background: linear-gradient(135deg, #34D399 0%, #12805B 100%);
    color: #04140e;
    font-weight: 800;
    border: 0;
    box-shadow: 0 10px 30px -10px rgba(47, 190, 139, .7);
}

.zb-meet .lc-btn-primary:hover:not(:disabled) {
    filter: brightness(1.08);
}

/* ── الترويسة: «زاد بيان Meet» ── */
.zbm-shell {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

.zbm-bar {
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 22px;
    border-bottom: 1px solid rgba(123, 224, 180, .08);
    background: rgba(4, 17, 13, .45);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    position: sticky;
    top: 0;
    z-index: 20;
}

.zbm-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--zbm-text);
    text-decoration: none;
    font-weight: 800;
    font-size: 18px;
}

.zbm-brand img {
    filter: brightness(1.25) saturate(1.1);
}

.zbm-brand-meet {
    padding: 3px 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, #34D399, #12805B);
    color: #04140e;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .02em;
}

.zbm-bar-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 13px;
    color: var(--zbm-text-2);
    padding: 4px 10px;
    border: 1px solid var(--zbm-glass-line);
    border-radius: 999px;
}

.zbm-stage {
    flex: 1;
}

/* ── نموذج الضيف داخل اللوبي ── */
.lc-lobby-identity {
    margin: 4px 0 14px;
}

.zbm-form {
    display: grid;
    gap: 12px;
}

.zbm-field {
    display: grid;
    gap: 6px;
}

.zbm-field label {
    font-weight: 700;
    font-size: 14px;
    color: var(--lc-text, #E7F1EC);
}

.zbm-field input,
.zbm-phone select {
    height: 46px;
    border-radius: 12px;
    border: 1px solid var(--lc-line-2, #2E4C42);
    background: rgba(6, 19, 16, .65);
    color: var(--lc-text, #E7F1EC);
    padding: 0 14px;
    font-size: 16px;
    width: 100%;
    font-family: inherit;
}

.zbm-field input:focus,
.zbm-phone select:focus {
    outline: none;
    border-color: var(--zbm-accent, #2FBE8B);
    box-shadow: 0 0 0 3px rgba(47, 190, 139, .25);
}

.zbm-phone {
    display: grid;
    grid-template-columns: 116px 1fr;
    gap: 8px;
}

.zbm-phone select {
    padding: 0 8px;
}

.zbm-hint {
    font-size: 12.5px;
    color: var(--lc-text-2, #A0B6AD);
}

.zbm-err {
    font-size: 12.5px;
    color: var(--lc-stop-text, #F08D86);
}

.zbm-consent {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--lc-text-2, #A0B6AD);
    cursor: pointer;
}

.zbm-consent input {
    margin-top: 4px;
    width: 18px;
    height: 18px;
    accent-color: #2FBE8B;
    flex: none;
}

/* ── «سابقاً: …» على البلاطة وفي القائمة ── */
.lc-tile-note {
    display: inline-block;
    margin-inline-start: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    background: rgba(239, 185, 99, .18);
    color: #F6D08F;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
    max-width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.lc-tag-note {
    background: rgba(239, 185, 99, .18);
    color: #B7791F;
}

.zb-meet .lc-tag-note {
    color: #F6D08F;
}

/* ── لوحة المضيف العائمة ──
   فوق غرفة المكالمة (.lc-room z-index 1040) وتحت نوافذها (1060)، وفي جهة المسرح (يسار RTL)
   لا فوق قائمة المشاركين */
.zbm-host,
.zbm-host-mini {
    position: fixed;
    inset-inline-end: 18px;
    bottom: 96px;
    z-index: 1050;
}

.zbm-host {
    width: min(380px, calc(100vw - 36px));
    background: rgba(13, 30, 25, .92);
    border: 1px solid rgba(123, 224, 180, .22);
    border-radius: 18px;
    box-shadow: 0 24px 60px -18px rgba(0,0,0,.8);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: #E7F1EC;
    overflow: hidden;
    animation: zbm-pop .25s ease;
}

.zbm-host-head {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(52, 211, 153, .22), rgba(18, 128, 91, .18));
    border: 0;
    color: inherit;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.zbm-host-head span {
    flex: 1;
    text-align: start;
}

.zbm-host-body {
    max-height: min(50vh, 420px);
    overflow: auto;
    padding: 8px 12px 12px;
    display: grid;
    gap: 8px;
}

.zbm-host-empty {
    color: #A0B6AD;
    font-size: 13.5px;
    margin: 6px 4px;
}

.zbm-wait {
    display: grid;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(123, 224, 180, .1);
}

.zbm-wait-who {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.zbm-wait-who small {
    width: 100%;
    color: #A0B6AD;
}

.zbm-wait-act,
.zbm-host-foot {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.zbm-host-foot {
    padding-top: 4px;
}

.zbm-chip {
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
}

.zbm-chip.is-amber {
    background: rgba(239, 185, 99, .18);
    color: #F6D08F;
}

.zbm-btn {
    height: 34px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid rgba(123, 224, 180, .22);
    background: rgba(255, 255, 255, .05);
    color: #E7F1EC;
    font: inherit;
    font-weight: 700;
    font-size: 13.5px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.zbm-btn.is-primary {
    background: linear-gradient(135deg, #34D399, #12805B);
    color: #04140e;
    border: 0;
}

.zbm-btn:disabled {
    opacity: .55;
    cursor: default;
}

.zbm-host-mini {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(123, 224, 180, .3);
    background: rgba(13, 30, 25, .92);
    color: #7BE0B4;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 12px 30px -10px rgba(0,0,0,.8);
}

@keyframes zbm-pop {
    from { opacity: 0; transform: translateY(10px) scale(.98); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .zbm-host { animation: none; }
}

/* ── داخل المكالمة: شريط «زاد بيان Meet» يختفي، والمكالمة على أرضيّة مصمتة ──
   كان الشريط يظهر من خلال ترويسة المكالمة الشفّافة، فتقع «اللقاء مباشر الآن» فوق الشعار */
.zb-meet:has(.lc-room) .zbm-bar { display: none; }
.zb-meet .lc-room { background: linear-gradient(160deg, #0a241c 0%, #04110d 70%); }

/* ── زرّ المضيف: نصٌّ مقروء في زاوية الشاشة بجانب الشريط السفليّ، لا دائرةٌ فوق اسم البلاطة ── */
.zbm-host-mini {
    width: auto;
    height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font: inherit;
    font-weight: 700;
    font-size: 14px;
    bottom: 22px;
}
/* اللوحة المفتوحة من أداة الشريط: فوق الشريط، في جهة «مغادرة» */
.zbm-host.is-docked { bottom: 96px; }
.lc-tool.zbm-tool-on { color: #34D399; }
.lc-tool.zbm-tool-alert { box-shadow: 0 0 0 2px #EFB963; animation: zbm-pulse 1.6s ease-in-out infinite; }
@keyframes zbm-pulse { 50% { box-shadow: 0 0 0 5px rgba(239, 185, 99, .25); } }
@media (prefers-reduced-motion: reduce) { .lc-tool.zbm-tool-alert { animation: none; } }
@media (max-width: 640px) { .zbm-host.is-docked { bottom: 150px; inset-inline-end: 12px; } }
.zbm-invite { display: grid; gap: 8px; padding-bottom: 10px; margin-bottom: 4px; border-bottom: 1px solid rgba(123, 224, 180, .12); }
.zbm-invite small { color: #A0B6AD; font-weight: 700; }

@media (max-width: 640px) {
    .zbm-bar { padding: 0 14px; height: 56px; }
    .zbm-brand-name { display: none; }
    .zbm-host, .zbm-host-mini { inset-inline-end: 12px; bottom: 88px; }
}

/* ── رابط ضيوف المحاضرة: زرّه فوق زرّ لوحة الانتظار، ولوحته بالهيئة نفسها ── */
.zbm-linkbox { padding: 10px 12px; border-radius: 10px; border: 1px dashed rgba(23, 105, 90, .45); background: rgba(23, 105, 90, .06); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13.5px; word-break: break-all; }
.zbm-linkbox.is-dark { border-color: rgba(123, 224, 180, .3); background: rgba(255, 255, 255, .04); color: #E7F1EC; }
.zbm-lecture-opt { margin-top: 8px; padding-top: 12px; border-top: 1px dashed var(--bs-border-color, #dfe7e3); }
@media (max-width: 640px) { .zbm-host-mini { bottom: 84px; } }