
/* ClassHub V4 — halaman penugasan, pengingat, jadwal & moderasi */
.v4-container{max-width:1200px;margin:0 auto;padding:28px 24px 100px}
.v4-container>.panel{margin-top:26px}.v4-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:16px}
.v4-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0}
.v4-card,.v4-task{border:1px solid var(--border,rgba(150,160,190,.19));border-radius:17px;padding:22px;background:rgba(139,143,180,.04);min-width:0}
.v4-card h3,.v4-task h2{font-size:20px;margin:12px 0}.v4-card>small{display:block;color:var(--muted,#a1a9c2);margin:7px 0}
.v4-task-grid{grid-template-columns:repeat(auto-fit,minmax(315px,1fr));margin-top:22px}
.v4-task{background:var(--panel,#161e35)}.v4-task-top{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
.v4-due{padding:7px 11px;border-radius:20px;background:rgba(34,197,94,.12);color:#54d7a4;font-size:12px;font-weight:700}.v4-due.past{background:rgba(251,146,60,.1);color:#fbbf80}
.v4-task>p{line-height:1.7}.v4-submission{border-top:1px solid var(--border,rgba(160,160,200,.2));margin-top:16px;padding-top:10px}
.v4-form{display:grid;gap:14px;margin-top:18px}.v4-form label{display:grid;gap:8px;font-size:13px;font-weight:600}.v4-form input,.v4-form select,.v4-form textarea,.v4-review input{width:100%;min-width:0;border:1px solid var(--border,rgba(159,170,206,.23));border-radius:12px;padding:11px 13px;background:var(--bg,#0c1426);color:var(--text,#f5f5fa);font:inherit}
.v4-form textarea{resize:vertical;min-height:84px}.v4-form small{display:block;font-weight:400}.v4-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.v4-wide{grid-column:1/-1}.v4-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.v4-alert{padding:15px 18px;border-radius:13px;border:1px solid color-mix(in srgb,var(--accent,#a58bff) 42%,transparent);background:color-mix(in srgb,var(--accent,#a58bff) 10%,transparent);margin:16px 0;line-height:1.6}
.v4-person{display:flex;align-items:center;gap:11px;margin:12px 0}.v4-person img,.v4-person>span{width:44px;height:44px;flex:0 0 44px;border-radius:13px;object-fit:cover;display:grid;place-items:center;background:rgba(130,130,210,.18)}.v4-person small{display:block;font-size:12px;color:var(--muted,#a7adc0);margin-top:3px}
.v4-review{display:grid;gap:12px}.v4-position{text-align:center;padding:25px 16px;display:grid;justify-items:center;align-content:start;gap:10px}
.v4-avatar-lg{height:100px;width:100px;display:grid;place-items:center;font-size:48px;border-radius:25px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent,#a58bff) 25%,transparent),rgba(64,80,140,.15));overflow:hidden}.v4-avatar-lg img{height:100%;width:100%;object-fit:cover}
.v4-people-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.v4-position h3{margin:0}.v4-duty-day .v4-person{text-align:left}
.v4-video{width:100%;aspect-ratio:16/9;margin:16px 0;border-radius:12px;overflow:hidden}.v4-video iframe{border:0;width:100%;height:100%}
.v4-schedule-hero{border-radius:20px;padding:30px;background:radial-gradient(circle at 90% 0%,color-mix(in srgb,var(--accent,#a58bff) 28%,transparent),transparent 44%),linear-gradient(135deg,#172347,#13192e);margin-bottom:22px}.v4-schedule-hero h2{font-size:clamp(27px,4vw,46px);line-height:1.15;margin:12px 0}.v4-schedule-hero em{color:var(--accent,#a58bff);font-style:normal}
.v4-days{overflow-x:auto;white-space:nowrap;scrollbar-width:thin}.v4-timeline{display:grid;gap:13px}.v4-lesson{display:grid;grid-template-columns:100px minmax(0,1fr);gap:20px;background:rgba(130,135,200,.055);border-radius:15px;padding:17px;border-left:3px solid var(--accent,#a58bff)}.v4-lesson-time{display:grid;align-content:start;gap:6px}.v4-lesson-time>b{font-size:21px;color:var(--accent,#a58bff)}.v4-lesson-time small{color:var(--muted,#9ba5b9)}.v4-lesson-info h3{font-size:21px;margin:7px 0}.v4-change{border:1px solid rgba(251,191,36,.34);border-radius:12px;background:rgba(251,191,36,.07);padding:12px;margin:13px 0}.v4-change p{margin:7px 0}
.v4-bell{position:relative}.v4-bell summary{list-style:none;cursor:pointer;border:1px solid rgba(150,170,205,.25);padding:8px 11px;border-radius:24px;white-space:nowrap;background:rgba(125,130,170,.13)}.v4-bell summary::-webkit-details-marker{display:none}.v4-bell summary span{border-radius:20px;background:var(--accent,#a58bff);color:#0a1020;padding:1px 6px;font-size:11px}.v4-notify{position:absolute;z-index:110;right:0;top:calc(100% + 8px);width:min(350px,85vw);max-height:420px;overflow:auto;background:#151e36;color:#f5f5ff;border:1px solid #34405e;border-radius:17px;box-shadow:0 22px 60px rgba(0,0,0,.35);padding:16px}.v4-notify h3{font-size:17px;margin:4px 0 12px}.v4-notify a{display:block;color:inherit;text-decoration:none;border-top:1px solid #303a55;padding:10px 0}.v4-notify small{color:#b8c5d7;display:block;margin-top:5px}.v4-notify button{background:var(--accent,#a58bff);border:0;border-radius:9px;padding:10px;color:#091020;font-weight:700;cursor:pointer;width:100%}
.tag.pending,.tag.submitted{background:rgba(251,191,36,.16);color:#e6b658}.tag.approved,.tag.accepted{background:rgba(16,185,129,.13);color:#5bdfb2}.tag.rejected,.tag.revision{background:rgba(248,113,113,.14);color:#ff9797}
@media(max-width:700px){.v4-container{padding:18px 15px 80px}.v4-summary{grid-template-columns:1fr 1fr}.v4-two{grid-template-columns:1fr}.v4-task-grid{grid-template-columns:1fr}.v4-lesson{grid-template-columns:75px minmax(0,1fr);gap:10px;padding:13px}.v4-lesson-time>b{font-size:16px}.v4-people-grid{grid-template-columns:1fr 1fr}.v4-position{padding:15px 8px}}

.v4-material-photo img{width:100%;max-height:310px;object-fit:contain;border-radius:14px;background:rgba(0,0,0,.1);margin:8px 0}.v4-material-video{width:100%;max-height:350px;border-radius:14px;margin:10px 0}

.v4-ai-answer{white-space:pre-wrap;line-height:1.8;padding:21px;border:1px solid rgba(175,150,250,.35);border-radius:14px;background:rgba(142,120,255,.065);margin-top:15px}
.v4-ai-answer[hidden]{display:none}
.v4-container .table-scroll{max-width:100%;overflow:auto}.v4-container .admin-table{width:100%;border-collapse:collapse}.v4-container .admin-table td,.v4-container .admin-table th{padding:12px;border-bottom:1px solid rgba(130,140,200,.2);text-align:left}
.v4-demo-notice{padding:12px 18px;margin:16px auto;border-radius:15px;background:rgba(125,90,230,.13);border:1px solid rgba(159,125,245,.3)}
