/* EC Instructor Portal */
.eip-wrap { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; max-width: 1100px; margin: 0 auto; padding: 0 16px 60px; }

/* Gate */
.eip-gate { text-align:center; padding:60px 20px; }
.eip-gate p { font-size:16px; color:#666; margin-bottom:20px; }
.eip-btn { display:inline-block; background:#D62304; color:#fff; border-radius:8px; padding:12px 28px; text-decoration:none; font-weight:600; }

/* Header */
.eip-header { background:linear-gradient(135deg,#D62304,#a81b02); color:#fff; border-radius:16px; padding:28px; margin:24px 0 20px; display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.eip-header__avatar { width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:700; flex-shrink:0; }
.eip-header__info { flex:1; }
.eip-header__info h1 { font-size:22px; font-weight:700; margin:0 0 4px; color:#fff; }
.eip-header__info p  { font-size:13px; opacity:.8; margin:0; }
.eip-stats { display:flex; gap:20px; }
.eip-stat { text-align:center; }
.eip-stat__num { display:block; font-size:26px; font-weight:700; }
.eip-stat span:last-child { font-size:11px; opacity:.75; }

/* Layout */
.eip-layout { display:grid; grid-template-columns:260px 1fr; gap:16px; align-items:start; }
@media(max-width:720px){ .eip-layout{grid-template-columns:1fr;} }

/* Sidebar */
.eip-sidebar { background:#fff; border-radius:12px; border:1px solid #e8e8e8; padding:16px; position:sticky; top:20px; }
.eip-sidebar__label { font-size:10px; font-weight:700; color:#aaa; text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
.eip-batch-item { display:block; padding:12px; border-radius:8px; border:1.5px solid #e8e8e8; margin-bottom:8px; text-decoration:none; color:inherit; cursor:pointer; }
.eip-batch-item--active { border-color:#D62304; background:#fff6f5; }
.eip-batch-item--done   { opacity:.65; }
.eip-batch-item__name   { font-size:13px; font-weight:600; color:#222; }
.eip-batch-item__course { font-size:11px; color:#888; margin:2px 0 6px; }
.eip-batch-item__pct    { font-size:11px; color:#888; margin-top:4px; }

.eip-progress-bar { height:4px; background:#f0f0f0; border-radius:2px; overflow:hidden; }
.eip-progress-bar__fill { height:100%; border-radius:2px; transition:width .4s; }

.eip-tag { display:inline-block; font-size:10px; padding:2px 8px; border-radius:20px; font-weight:600; margin-top:4px; }
.eip-tag--done { background:#eafbea; color:#27a000; }
.eip-tag--warn { background:#faeeda; color:#633806; }

/* Main */
.eip-main { background:#fff; border-radius:12px; border:1px solid #e8e8e8; padding:24px; min-height:300px; }
.eip-main__header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:20px; }
.eip-main__header h2 { font-size:18px; font-weight:700; margin:0 0 4px; }
.eip-main__header p  { font-size:13px; color:#888; margin:0; }

/* Circular progress indicator */
.eip-pct-ring { position:relative; width:64px; height:64px; flex-shrink:0; }
.eip-pct-ring::before {
    content:'';position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(#D62304 calc(var(--pct)*1%), #f0f0f0 0);
}
.eip-pct-ring span { position:absolute;inset:6px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#333; }

/* Notice & banners */
.eip-notice { background:#fff8e6; border:1px solid #f5d98c; border-radius:8px; padding:12px 16px; font-size:13px; color:#633806; margin-bottom:16px; line-height:1.5; }
.eip-complete-banner { display:flex; align-items:flex-start; gap:14px; background:#eafbea; border:1px solid #b0e6b0; border-radius:10px; padding:16px; margin-bottom:16px; }
.eip-complete-banner span { font-size:28px; }
.eip-complete-banner strong { font-size:15px; color:#1a6800; }
.eip-complete-banner p { font-size:13px; color:#3a7a00; margin:4px 0 0; }
.eip-save-notice { font-size:12px; color:#27a000; background:#eafbea; border-radius:6px; padding:6px 12px; display:inline-block; margin-bottom:12px; }

/* Module block */
.eip-module { margin-bottom:20px; }
.eip-module__header { display:flex; justify-content:space-between; align-items:center; background:#f5f5f5; border-radius:8px; padding:10px 14px; margin-bottom:4px; }
.eip-module__title { font-size:13px; font-weight:700; color:#222; text-transform:uppercase; letter-spacing:.04em; }
.eip-module__count { font-size:12px; color:#888; }

/* Session row */
.eip-session { display:flex; align-items:flex-start; gap:12px; padding:10px 12px; border-radius:8px; border:1px solid #f0f0f0; margin-bottom:4px; background:#fff; transition:background .2s; }
.eip-session--done { background:#f9fff4; border-color:#C0DD97; }
.eip-session__check { flex-shrink:0; margin-top:2px; cursor:pointer; }
.eip-session__check input { display:none; }
.eip-session__box { display:block; width:20px; height:20px; border:2px solid #ccc; border-radius:5px; position:relative; transition:all .2s; }
.eip-session__check input:checked ~ .eip-session__box { background:#27a000; border-color:#27a000; }
.eip-session__check input:checked ~ .eip-session__box::after { content:'✓'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; font-weight:700; }
.eip-session__body { flex:1; min-width:0; }
.eip-session__title { font-size:13px; color:#222; font-weight:500; }
.eip-session--done .eip-session__title { color:#666; text-decoration:line-through; }
.eip-session__meta { font-size:11px; color:#27a000; margin-top:2px; }

/* Note */
.eip-note-btn { background:none; border:none; cursor:pointer; font-size:14px; padding:2px 4px; opacity:.4; transition:opacity .2s; flex-shrink:0; }
.eip-note-btn:hover { opacity:1; }
.eip-note-form { width:100%; margin-top:8px; grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; }
.eip-note-form { display:none; }
.eip-note-text { width:100%; border:1px solid #e0e4e8; border-radius:6px; padding:8px; font-size:12px; resize:vertical; min-height:50px; font-family:inherit; }
.eip-note-form .button { font-size:11px; }

/* Empty */
.eip-empty { text-align:center; padding:60px 20px; color:#888; }
.eip-empty__icon { font-size:40px; margin-bottom:12px; }
.eip-empty h3 { font-size:16px; color:#555; margin-bottom:6px; }
.eip-empty p  { font-size:13px; }