/* VMeet room: the base the Education360 Live stylesheet (live.css) expects, a light theme for it, and VMeet's additions. */
:root{--font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-display:var(--font);--ease:cubic-bezier(.2,.8,.2,1);
  --focus:0 0 0 2px #0b1020,0 0 0 4px color-mix(in oklab,var(--brand) 70%,#fff);--focus-ring:color-mix(in oklab,var(--brand) 70%,#fff)}
*,*::before,*::after{box-sizing:border-box}
body{font:15px/1.5 var(--font)}
.icon{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block}
.icon-sm{width:14px;height:14px}.icon-lg{width:22px;height:22px}.icon-xl{width:32px;height:32px}
@media (max-width:640px){.hide-sm{display:none!important}}
button,input,select,textarea{font:inherit}

/* light theme: the stage stays dark (video looks best on it); panels, lobby and dialogs turn light */
html[data-theme="light"] .lv-body{--lv-bg:#eef1f7;--lv-surface:#ffffff;--lv-surface-2:#f3f5fa;--lv-surface-3:#e6eaf3;--lv-line:rgba(15,23,42,.08);--lv-line-2:rgba(15,23,42,.14);--lv-text:#0f172a;--lv-muted:#5b6782}
@media (prefers-color-scheme:light){html[data-theme="system"] .lv-body{--lv-bg:#eef1f7;--lv-surface:#ffffff;--lv-surface-2:#f3f5fa;--lv-surface-3:#e6eaf3;--lv-line:rgba(15,23,42,.08);--lv-line-2:rgba(15,23,42,.14);--lv-text:#0f172a;--lv-muted:#5b6782}}
html[data-theme="light"] .lv-icon-btn:hover,html[data-theme="light"] .lv-chip:hover{background:rgba(15,23,42,.06)}
@media (prefers-color-scheme:light){html[data-theme="system"] .lv-icon-btn:hover{background:rgba(15,23,42,.06)}}
html[data-theme="light"] .lv-stage,html[data-theme="light"] .lv-pre-video{background:#10172a}
@media (prefers-color-scheme:light){html[data-theme="system"] .lv-stage,html[data-theme="system"] .lv-pre-video{background:#10172a}}
html[data-theme="light"] .lv-btn.is-on{color:#92400e}
html[data-theme="light"] .lv-link{color:color-mix(in oklab,var(--brand) 85%,#000)}

/* additions */
.vm-code{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.02em}
.vm-muted{color:var(--lv-muted);font-size:14px}
.vm-copy{display:flex;gap:8px;align-items:center;margin:10px 0}
.vm-copy input{flex:1;min-width:0;min-height:38px;border-radius:10px;border:1px solid var(--lv-line-2);background:var(--lv-surface-2);color:var(--lv-text);padding:0 12px;font:13.5px ui-monospace,Menlo,Consolas,monospace}
.vm-label{display:block;font-weight:600;font-size:13px;margin-top:14px;color:var(--lv-muted)}
.vm-pre-note{font-size:12.5px;color:var(--lv-muted);display:flex;gap:6px;align-items:center;margin:8px 0 0}
.vm-lobby{background:color-mix(in oklab,var(--brand) 30%,transparent)!important;cursor:pointer}
.vm-lobby-card{position:fixed;right:16px;top:64px;z-index:60;width:min(360px,calc(100vw - 24px));background:var(--lv-surface);color:var(--lv-text);border:1px solid var(--lv-line-2);border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.45);padding:12px 14px;animation:vm-in .25s var(--ease)}
@keyframes vm-in{from{transform:translateY(-6px);opacity:0}}
.vm-lobby-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.vm-lobby-card ul{list-style:none;margin:0 0 8px;padding:0;max-height:300px;overflow:auto}
.vm-lobby-card li{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--lv-line)}
.vm-lobby-card li>span{flex:1;min-width:0}
.vm-lobby-card li b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vm-lobby-card li small{display:block;color:var(--lv-muted);font-size:12px}
@media (max-width:640px){.vm-lobby-card{top:auto;bottom:96px;right:12px}}

/* light theme: headings and the pastel status colours made for the dark stage */
html[data-theme="light"] :is(.lv-pre-info h1,.lv-modal-card h3,.lv-end-card h2,.lv-check-head h1){color:var(--lv-text)}
html[data-theme="light"] :is(.lv-pill.is-live,.lv-tag.is-live,.lv-chip.is-cc,.lv-cc-status.is-on){color:#15803d}
html[data-theme="light"] :is(.lv-pre-status,.lv-chip.is-warn,.lv-chip.is-hands,.lv-timer.is-low,.lv-cc-status.is-late,.lv-chat-note){color:#b45309}
html[data-theme="light"] :is(.lv-timer.is-over,.lv-tag.is-private,.lv-chip.is-concern){color:#b91c1c}
html[data-theme="light"] .lv-link{color:color-mix(in oklab,var(--brand) 80%,#000)}
@media (prefers-color-scheme:light){
  html[data-theme="system"] :is(.lv-pre-info h1,.lv-modal-card h3,.lv-end-card h2,.lv-check-head h1){color:var(--lv-text)}
  html[data-theme="system"] :is(.lv-pill.is-live,.lv-tag.is-live,.lv-chip.is-cc,.lv-cc-status.is-on){color:#15803d}
  html[data-theme="system"] :is(.lv-pre-status,.lv-chip.is-warn,.lv-chip.is-hands,.lv-timer.is-low,.lv-cc-status.is-late,.lv-chat-note){color:#b45309}
  html[data-theme="system"] :is(.lv-timer.is-over,.lv-tag.is-private,.lv-chip.is-concern){color:#b91c1c}
  html[data-theme="system"] .lv-link{color:color-mix(in oklab,var(--brand) 80%,#000)}
  html[data-theme="system"] .lv-btn.is-on{color:#92400e}
}