/* ── Interactive slides — "Make interactive" chooser (InteractiveSlides.js) ─────────────────
   The activities themselves are styled inside their sandboxed frame (see InteractiveSlides.html). */
.ixc-modal { position:fixed; inset:0; z-index:2147483000; display:grid; place-items:center; padding:16px; background:rgba(15,23,42,.45); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); opacity:0; transition:opacity .2s; font-family:Inter, system-ui, sans-serif; }
.ixc-modal.show { opacity:1; }
.ixc-dialog { width:min(760px, 100%); max-height:calc(100vh - 32px); display:flex; flex-direction:column; background:#fff; border-radius:26px; box-shadow:0 40px 90px -30px rgba(15,23,42,.6); overflow:hidden; color:#1F2340; }
.ixc-top { display:flex; align-items:center; gap:14px; padding:18px 22px; border-bottom:1px solid #eef0f6; }
.ixc-mark { flex:none; width:46px; height:46px; border-radius:15px; display:grid; place-items:center; color:#fff; font-size:20px; background:linear-gradient(135deg,#6D5DF6,#22A06B); }
.ixc-top h2 { margin:0; font-size:19px; font-weight:800; color:#1e1b4b !important; }
.ixc-top p { margin:2px 0 0; font-size:13px; color:#64748b; }
.ixc-x { margin-inline-start:auto; width:40px; height:40px; border-radius:50%; border:0; background:#f1f5f9; font-size:22px; color:#475569; cursor:pointer; }
.ixc-body { padding:18px 22px; overflow:auto; display:flex; flex-direction:column; gap:14px; }
.ixc-tiles { display:grid; grid-template-columns:repeat(auto-fill, minmax(132px, 1fr)); gap:10px; }
.ixc-tile { position:relative; display:flex; flex-direction:column; gap:4px; padding:12px 12px 10px; border-radius:16px; border:2px solid #E3E5F0; background:#FAFBFF; cursor:pointer; transition:border-color .15s, background .15s, transform .12s; }
.ixc-tile:hover { transform:translateY(-1px); border-color:#C9C3F5; }
.ixc-tile input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.ixc-tile:has(input:checked) { border-color:#6D5DF6; background:#F3F1FF; box-shadow:0 0 0 3px rgba(109,93,246,.15); }
.ixc-emoji { font-size:24px; line-height:1; }
.ixc-tile b { font-size:14px; }
.ixc-tile small { font-size:12px; color:#6B7090; line-height:1.3; }
.ixc-row { display:grid; grid-template-columns:1fr; gap:12px; }
.ixc-field { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:700; color:#334155; }
.ixc-field select, .ixc-field input[type=text] { font:inherit; font-weight:500; font-size:14px; padding:10px 12px; border:1.5px solid #e2e8f0; border-radius:12px; background:#f8fafc; color:#0f172a; outline:none; }
.ixc-field select:focus, .ixc-field input:focus { border-color:#6D5DF6; background:#fff; }
.ixc-seg { display:flex; gap:6px; padding:4px; border-radius:12px; background:#f1f5f9; }
.ixc-seg label { flex:1; position:relative; }
.ixc-seg input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.ixc-seg span { display:block; text-align:center; padding:8px 10px; border-radius:9px; font-size:13px; font-weight:700; color:#475569; }
.ixc-seg label:has(input:checked) span { background:#fff; color:#6D5DF6; box-shadow:0 2px 8px rgba(15,23,42,.08); }
.ixc-muted { margin:0; font-size:12.5px; color:#8A8FA8; }
.ixc-foot { display:flex; align-items:center; gap:10px; padding:14px 22px; border-top:1px solid #eef0f6; background:#fafbfd; }
.ixc-status { flex:1; font-size:13px; font-weight:600; color:#6D5DF6; }
.ixc-btn { height:44px; padding:0 18px; border:0; border-radius:13px; font:inherit; font-weight:800; font-size:14px; cursor:pointer; background:#eef0f6; color:#334155; }
.ixc-btn.primary { background:linear-gradient(135deg,#6D5DF6,#4F46E5); color:#fff; box-shadow:0 12px 24px -14px rgba(79,70,229,.9); display:inline-flex; align-items:center; gap:8px; }
.ixc-modal.busy .ixc-go, .ixc-modal.busy .ixc-tiles, .ixc-modal.busy .ixc-row, .ixc-modal.busy .ixc-field { opacity:.5; pointer-events:none; }
.ixc-modal.busy .ixc-status::before { content:''; display:inline-block; width:12px; height:12px; margin-inline-end:8px; border-radius:50%; border:2px solid #C9C3F5; border-top-color:#6D5DF6; animation:ixcSpin .8s linear infinite; vertical-align:-2px; }
@keyframes ixcSpin { to { transform:rotate(360deg); } }
@media (max-width: 560px) { .ixc-row { grid-template-columns:1fr; } }

/* ── "Interactive" tab under the Slides tab (right-edge tab group) ─────────── */
#navSystem .nav-tab.ix-nav-tab, html body #navSystem .nav-tab.ix-nav-tab { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; cursor:pointer;
  color:#fff !important; background:linear-gradient(160deg,#6D5DF6,#22A06B) !important; border-color:transparent !important; }
#navSystem .nav-tab.ix-nav-tab i { font-size:14px; color:#fff !important; -webkit-text-fill-color:#fff; }
#navSystem .nav-tab.ix-nav-tab small { font-size:9px; font-weight:800; letter-spacing:.06em; line-height:1; color:#fff !important; -webkit-text-fill-color:#fff; }
#navSystem .nav-tab.ix-nav-tab:hover { filter:brightness(1.08); color:#fff !important; }
body:not(.is-teacher) #navSystem .nav-tab.ix-nav-tab, body.lc-live-student #navSystem .nav-tab.ix-nav-tab { display:none !important; }

/* ── Live class: a student's simulation shown over the teacher's frame ─────── */
.sim-student-shot { position:absolute; inset:0; z-index:3; border-radius:inherit; overflow:hidden; background:#0f172a; pointer-events:none; }
.sim-student-shot img { width:100%; height:100%; object-fit:contain; display:block; }
.sim-student-shot span { position:absolute; left:10px; top:10px; padding:4px 10px; border-radius:999px; background:rgba(34,160,107,.92); color:#fff; font:700 12px Inter, system-ui, sans-serif; }
.ix-student-badge { position:absolute; left:10px; top:10px; z-index:3; padding:4px 10px; border-radius:999px; background:rgba(34,160,107,.92); color:#fff; font:700 12px Inter, system-ui, sans-serif; pointer-events:none; }

/* Where: two big tiles */
.ixc-where-title { font-size:14px; font-weight:800; color:#1F2340; display:flex; align-items:center; gap:8px; }
.ixc-where-title i { color:#6D5DF6; }
.ixc-where-tiles { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ixc-wtile { position:relative; display:grid; grid-template-columns:48px 1fr; grid-template-rows:auto auto; column-gap:12px; row-gap:2px; align-items:center; padding:14px 16px; border-radius:16px; border:2px solid #E3E5F0; background:#FAFBFF; cursor:pointer; transition:border-color .15s, background .15s, transform .12s; }
.ixc-wtile:hover { transform:translateY(-1px); }
.ixc-wtile input { position:absolute; inset:0; opacity:0; margin:0; cursor:pointer; }
.ixc-wicon { grid-row:1 / span 2; width:48px; height:48px; border-radius:14px; display:grid; place-items:center; color:#fff; font-size:19px; }
.ixc-wicon.rep { background:linear-gradient(135deg,#F59E0B,#E5484D); }
.ixc-wicon.add { background:linear-gradient(135deg,#22A06B,#0EA5E9); }
.ixc-wtile b { font-size:15px; color:#1F2340; }
.ixc-wtile small { font-size:12.5px; color:#6B7090; line-height:1.35; font-weight:500; }
.ixc-wtile:has(input:checked) { border-color:#6D5DF6; background:#F3F1FF; box-shadow:0 0 0 3px rgba(109,93,246,.18); }
.ixc-wtile:has(input:checked)::after { content:'\f00c'; font-family:'Font Awesome 6 Free'; font-weight:900; position:absolute; top:10px; right:12px; width:22px; height:22px; border-radius:50%; background:#6D5DF6; color:#fff; font-size:11px; display:grid; place-items:center; }
@media (max-width: 560px) { .ixc-where-tiles { grid-template-columns:1fr; } }

/* ── Dark themes (the app flags them with data-theme="dark"; headings are forced by themes, so colours carry !important) ── */
[data-theme="dark"] .ixc-dialog { background:#171B2E; color:#E6E8F4; box-shadow:0 40px 90px -30px rgba(0,0,0,.8); }
[data-theme="dark"] .ixc-top, [data-theme="dark"] .ixc-foot { border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .ixc-foot { background:#131629; }
[data-theme="dark"] .ixc-top h2 { color:#F3F4FF !important; }
[data-theme="dark"] .ixc-top p, [data-theme="dark"] .ixc-tile small, [data-theme="dark"] .ixc-wtile small { color:#A5ABC8; }
[data-theme="dark"] .ixc-x, [data-theme="dark"] .ixc-btn { background:#262B45; color:#E6E8F4; }
[data-theme="dark"] .ixc-tile, [data-theme="dark"] .ixc-wtile { background:#1E2238; border-color:#2E3452; }
[data-theme="dark"] .ixc-tile b, [data-theme="dark"] .ixc-wtile b, [data-theme="dark"] .ixc-field, [data-theme="dark"] .ixc-where-title { color:#F3F4FF; }
[data-theme="dark"] .ixc-tile:has(input:checked), [data-theme="dark"] .ixc-wtile:has(input:checked) { background:#2A2650; border-color:#8B7CFF; }
[data-theme="dark"] .ixc-field select, [data-theme="dark"] .ixc-field input[type=text] { background:#1E2238; border-color:#2E3452; color:#F3F4FF; }
[data-theme="dark"] .ixc-muted { color:#A5ABC8; }
