/* Student portal — functional app pages. Builds on the site design tokens
   in /styles.css. No motion layer here; calm, quiet, left-aligned. */

.portal-main{min-height:60vh;padding:clamp(2.5rem,5vw,4rem) 0 clamp(3rem,6vw,5rem);}
.portal-eyebrow{display:inline-block;font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:.9rem;}
.portal-title{font-family:var(--serif);color:var(--ink);font-size:clamp(1.8rem,3.4vw,2.4rem);margin:0 0 .6rem;}
.portal-sub{color:var(--body);max-width:44rem;margin:0 0 2rem;}

.portal-card{background:var(--paper);border:1px solid var(--line-cool);padding:clamp(1.4rem,3vw,2rem);max-width:44rem;}
.portal-card + .portal-card{margin-top:1.4rem;}

.portal-banner{max-width:44rem;margin:0 0 1.6rem;padding:1rem 1.25rem;border:1px solid var(--teal-line);background:var(--teal-soft);color:var(--ink-soft);font-size:.95rem;}
.portal-banner.error{border-color:#e3c1bb;background:#faf1ef;color:#7a3b2e;}

/* admin cross-link on the student dashboard (only rendered for admin_users) */
.portal-admin-strip{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin:0 0 1.6rem;padding:.85rem 1.25rem;border:1px solid var(--teal-line);background:var(--teal-soft);
  color:var(--ink-soft);font-size:.95rem;}

.portal-form{display:flex;flex-direction:column;gap:.9rem;max-width:26rem;}
.portal-form label{font-weight:600;color:var(--ink);font-size:.92rem;}
.portal-input{font-family:var(--sans);font-size:1rem;padding:.7rem .85rem;border:1px solid var(--line-cool);background:#fff;color:var(--ink);width:100%;}
.portal-input:focus{outline:2px solid var(--teal);outline-offset:0;}
.portal-hint{font-size:.85rem;color:var(--muted);margin:0;}

.module-list{list-style:none;margin:1.4rem 0 0;padding:0;}
.module-row{display:flex;align-items:flex-start;gap:1rem;padding:1.1rem 0;border-top:1px solid var(--line-cool);}
.module-row:last-child{border-bottom:1px solid var(--line-cool);}
.module-state{flex:none;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-cool);font-weight:600;font-size:.9rem;color:var(--muted);background:var(--mist);}
.module-row.done .module-state{background:var(--teal);border-color:var(--teal);color:#fff;}
.module-row.current .module-state{border-color:var(--teal);color:var(--teal);background:#fff;}
.module-info{flex:1;}
.module-info h3{font-family:var(--serif);font-size:1.08rem;color:var(--ink);margin:0 0 .2rem;}
.module-row.locked .module-info h3{color:var(--muted);}
.module-meta{font-size:.85rem;color:var(--muted);margin:0;}
.module-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.7rem;}
.btn-sm{padding:.5rem 1rem;font-size:.88rem;}
.btn-quiet{background:none;border:1px solid var(--line-cool);color:var(--ink-soft);cursor:pointer;font-family:var(--sans);}
.btn-quiet:hover{border-color:var(--teal);color:var(--teal);}

.lesson-list{list-style:none;margin:.7rem 0 0;padding:0;}
.lesson-row{display:flex;align-items:baseline;gap:.55rem;padding:.35rem 0;font-size:.93rem;}
.lesson-state{flex:none;width:1.2rem;text-align:center;font-weight:600;color:var(--muted);}
.lesson-row.done .lesson-state{color:var(--teal);}
.lesson-row a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid var(--line-cool);}
.lesson-row a:hover{color:var(--teal);border-bottom-color:var(--teal);}
.lesson-row.done a{color:var(--muted);}

.quiz-question{padding:1.4rem 0;border-top:1px solid var(--line-cool);}
.quiz-question h3{font-family:var(--sans);font-weight:600;font-size:1rem;color:var(--ink);margin:0 0 .8rem;line-height:1.55;}
.quiz-choices{display:flex;flex-direction:column;gap:.45rem;}
.quiz-choice{display:flex;align-items:flex-start;gap:.6rem;padding:.55rem .7rem;border:1px solid transparent;cursor:pointer;color:var(--body);font-size:.95rem;line-height:1.5;}
.quiz-choice:hover{background:var(--mist);}
.quiz-choice:has(input:checked){border-color:var(--teal);background:var(--teal-soft);color:var(--ink);}
.quiz-choice input{margin-top:.25rem;accent-color:var(--teal);}
.quiz-progress{font-size:.85rem;color:var(--muted);}

.result-score{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3rem);color:var(--ink);margin:.4rem 0 .8rem;}
.result-pass .result-score{color:var(--teal);}

.status-chip{display:inline-block;font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.25rem .6rem;border:1px solid var(--teal-line);color:var(--teal);background:var(--teal-soft);}

.module-viewer-bar{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:var(--paper);border:1px solid var(--line-cool);border-bottom:0;padding:1rem 1.25rem;}
.module-viewer-bar h2{font-family:var(--serif);color:var(--ink);font-size:1.15rem;margin:0 0 .25rem;}
.module-frame{display:block;width:100%;height:min(75vh,58rem);border:1px solid var(--line-cool);background:var(--mist);}

/* Custom pdf.js viewer — our chrome only: no toolbar, filename, or
   download/print icons. Canvas page + prev/next + dwell note. */
.pdf-viewer{border:1px solid var(--line-cool);background:var(--paper);}
.pdf-stage{background:var(--mist);padding:clamp(.6rem,2vw,1.4rem);max-height:min(72vh,56rem);overflow-y:auto;}
.pdf-stage canvas{display:block;width:100%;height:auto;box-shadow:0 1px 8px rgba(27,42,74,.12);background:#fff;}
.pdf-controls{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:.75rem 1.25rem;border-top:1px solid var(--line-cool);}
.pdf-pageinfo{font-family:var(--sans);font-weight:600;font-size:.9rem;color:var(--ink);}
.pdf-progress{display:inline-flex;align-items:center;gap:.55rem;}
.pdf-progress-track{display:inline-block;width:7rem;height:.4rem;background:var(--mist);border:1px solid var(--line-cool);overflow:hidden;}
.pdf-progress-fill{display:block;height:100%;width:100%;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .3s ease;}
.pdf-progress-label{font-family:var(--sans);font-size:.82rem;color:var(--muted);white-space:nowrap;}
.dwell-note{font-family:var(--sans);font-size:.82rem;color:var(--muted);font-variant-numeric:tabular-nums;flex:1;}
.pdf-controls .btn:disabled{opacity:.45;cursor:not-allowed;}
.pdf-controls #pdf-next{margin-left:auto;}

.portal-loading{color:var(--muted);padding:2rem 0;}
.signout-row{margin-top:2rem;font-size:.9rem;}
.signout-row a{color:var(--muted);text-decoration:underline;cursor:pointer;}

/* Google OAuth option (portal + admin logins). Hidden until the provider is
   enabled in Supabase — see googleEnabled() in portal.js/admin.js. */
.auth-divider{display:flex;align-items:center;gap:.8rem;margin:1.2rem 0;color:var(--muted);font-family:var(--sans);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line-cool);}
.btn-google{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;width:100%;background:#fff;color:var(--ink);border:1px solid var(--line-cool);font-weight:600;}
.btn-google:hover{background:var(--mist);}
.btn-google:disabled{opacity:.55;cursor:not-allowed;}

/* Course-page lesson rows: partial-progress chip + pending (content-coming) */
.lesson-progress{flex:none;margin-left:auto;font-family:var(--sans);font-size:.78rem;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;}
.lesson-row.pending .lesson-pending-title{color:var(--muted);}
.lesson-pending-title{color:var(--muted);}

/* Lesson hub — the ordered stepper of a lesson's items (videos, reading,
   activity). Mirrors .module-row states: done / current / locked. */
.lesson-item-list{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem;}
.lesson-item{border:1px solid var(--line-cool);background:var(--paper);}
.lesson-item.current{border-color:var(--teal);}
.lesson-item.locked{opacity:.6;}
.lesson-item>a,.lesson-item.locked{display:flex;align-items:center;gap:.85rem;padding:.75rem 1rem;text-decoration:none;color:inherit;}
.lesson-item>a:hover{background:var(--teal-soft);}
.lesson-item-state{flex:none;width:1.7rem;height:1.7rem;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line-cool);border-radius:50%;font-weight:600;font-size:.85rem;color:var(--muted);}
.lesson-item.done .lesson-item-state{background:var(--teal);border-color:var(--teal);color:#fff;}
.lesson-item.current .lesson-item-state{border-color:var(--teal);color:var(--teal);}
.lesson-item-body{display:flex;flex-direction:column;gap:.1rem;min-width:0;}
.lesson-item-kind{font-family:var(--sans);font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);}
.lesson-item-title{font-family:var(--sans);font-size:.95rem;color:var(--ink);}
.lesson-item.locked .lesson-item-title{color:var(--muted);}
.lesson-item-hint{flex:none;margin-left:auto;font-family:var(--sans);font-size:.8rem;font-weight:600;color:var(--muted);}
.lesson-item.current .lesson-item-hint{color:var(--teal);}

.lesson-resources{margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid var(--line-cool);}
.lesson-resources h3{font-family:var(--sans);font-weight:600;font-size:.95rem;color:var(--ink);margin:0;}
.lesson-resource-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem;}
.lesson-resource-list a{color:var(--ink-soft);font-size:.9rem;}
.lesson-resource-list a:hover{color:var(--teal);}
.lesson-complete{margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid var(--line-cool);}

/* Lesson video player — sits in the same chrome as the paced-PDF viewer. */
.video-stage{background:#0d1526;border:1px solid var(--line-cool);display:flex;justify-content:center;}
.video-stage video{display:block;width:100%;max-height:min(72vh,50rem);background:#000;}
.video-note{font-family:var(--sans);font-size:.85rem;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;}