/* Student & Parent Portal Foundation — presentation only */
.sp-role-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;margin-bottom:18px;border:1px solid var(--ui-border,#dfe7e3);border-radius:24px;background:linear-gradient(135deg,#f7fbf9,#fff);box-shadow:var(--ui-shadow-sm,0 10px 30px rgba(15,42,34,.06))}
.sp-role-hero.student{background:linear-gradient(135deg,#effaf4,#fff 60%,#f2f8ff)}
.sp-role-hero.parent{background:linear-gradient(135deg,#f4f8ff,#fff 58%,#f3fbf7)}
.sp-role-hero.admin{background:linear-gradient(135deg,#f1faf6,#fff 58%,#fff8e9)}
.sp-role-hero h2{margin:5px 0 6px;font-size:clamp(1.35rem,2vw,2rem);color:var(--ui-text,#10221c)}
.sp-role-hero p{margin:0;max-width:760px;color:var(--ui-muted,#64736d);line-height:1.9}
.sp-code{min-width:150px;padding:15px 18px;border:1px solid var(--ui-border,#dfe7e3);border-radius:18px;background:rgba(255,255,255,.78);text-align:center}
.sp-code small{display:block;color:var(--ui-muted,#64736d);margin-bottom:5px}
.sp-code strong{font-size:1.35rem;color:var(--ui-brand,#087c5b);direction:ltr;display:block}
.sp-kpis{margin-bottom:18px}
.sp-dashboard-grid{align-items:start;margin-bottom:18px}
.sp-dashboard-plan{margin-top:0}
.sp-section-title{display:flex;justify-content:space-between;align-items:end;margin:4px 0 16px}
.sp-section-title h2{margin:4px 0 0}
.sp-space{margin-top:18px}
.sp-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:4px}
.sp-item-card{min-width:0;padding:16px;border:1px solid var(--ui-border,#dfe7e3);border-radius:18px;background:var(--ui-surface,#fff);box-shadow:0 6px 18px rgba(21,51,42,.035)}
.sp-item-card.exam{background:linear-gradient(180deg,#fff,#f7fbff)}
.sp-item-top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--ui-muted,#64736d);font-size:.82rem}
.sp-item-top time{white-space:nowrap}
.sp-item-card h3{margin:11px 0 7px;font-size:1rem;color:var(--ui-text,#10221c)}
.sp-item-card p{margin:0 0 10px;color:var(--ui-muted,#64736d);line-height:1.8;white-space:pre-wrap}
.sp-card-foot{padding-top:9px;border-top:1px dashed var(--ui-border,#dfe7e3);font-size:.82rem;color:var(--ui-muted,#64736d)}
.sp-card-foot b{color:var(--ui-text,#10221c)}
.sp-empty{padding:28px 18px;text-align:center;color:var(--ui-muted,#64736d);border:1px dashed var(--ui-border,#dfe7e3);border-radius:16px;background:var(--ui-surface-soft,#f7faf8)}
.sp-schedule{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:4px}
.sp-schedule section{border:1px solid var(--ui-border,#dfe7e3);border-radius:18px;background:#fff;overflow:hidden}
.sp-schedule section h3{margin:0;padding:13px 16px;background:var(--ui-surface-soft,#f5f9f7);font-size:.95rem}
.sp-schedule-row{display:grid;grid-template-columns:104px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 16px;border-top:1px solid var(--ui-border,#e7eeeb)}
.sp-schedule-row:first-of-type{border-top:0}
.sp-schedule-row time{direction:ltr;font-variant-numeric:tabular-nums;color:var(--ui-brand,#087c5b);font-weight:700}
.sp-schedule-row strong{min-width:0}
.sp-schedule-row span{font-size:.8rem;color:var(--ui-muted,#64736d)}
.sp-plan-list{display:grid;gap:14px;padding:4px}
.sp-plan{padding:18px;border:1px solid var(--ui-border,#dfe7e3);border-radius:20px;background:#fff}
.sp-plan-head{display:flex;justify-content:space-between;gap:14px;align-items:start}
.sp-plan-head h3{margin:0 0 5px}
.sp-plan-head span{font-size:.82rem;color:var(--ui-muted,#64736d)}
.sp-plan-text{white-space:pre-wrap;line-height:2;padding:14px 0;margin:10px 0;border-top:1px dashed var(--ui-border,#dfe7e3);border-bottom:1px dashed var(--ui-border,#dfe7e3);color:var(--ui-text,#10221c)}
.sp-plan-progress{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:12px;color:var(--ui-muted,#64736d)}
.sp-plan-progress strong{color:var(--ui-brand,#087c5b)}
.sp-task-list{display:grid;gap:8px;margin-top:14px}
.sp-task{display:flex;gap:10px;align-items:start;padding:10px 12px;border-radius:13px;background:var(--ui-surface-soft,#f6f9f7)}
.sp-task>span{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#fff;border:1px solid var(--ui-border,#dfe7e3);color:var(--ui-brand,#087c5b)}
.sp-task.done{opacity:.72}
.sp-task.done b{text-decoration:line-through}
.sp-task div{display:flex;flex-direction:column;gap:3px;min-width:0}
.sp-task small{color:var(--ui-muted,#64736d)}
.sp-child-selector{display:flex;gap:10px;overflow:auto;padding:2px 2px 13px;margin-bottom:4px;scrollbar-width:thin}
.sp-child-selector button{display:flex;align-items:center;gap:10px;min-width:210px;padding:11px 14px;border:1px solid var(--ui-border,#dfe7e3);border-radius:16px;background:#fff;text-align:right;cursor:pointer}
.sp-child-selector button.active{border-color:var(--ui-brand,#087c5b);box-shadow:0 0 0 3px rgba(8,124,91,.09);background:#f5fbf8}
.sp-child-selector button>span{font-size:1.25rem}
.sp-child-selector button div{display:flex;flex-direction:column;gap:2px;min-width:0}
.sp-child-selector small{color:var(--ui-muted,#64736d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-child-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:4px}
.sp-child-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:17px;border:1px solid var(--ui-border,#dfe7e3);border-radius:19px;background:#fff}
.sp-child-avatar{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#e9f7f1;color:var(--ui-brand,#087c5b);font-size:1.2rem;font-weight:900}
.sp-child-card h3{margin:0 0 4px}
.sp-child-card p,.sp-child-card small{margin:0;color:var(--ui-muted,#64736d)}
.sp-communication{max-width:900px}
.sp-role-hero+.sp-child-selector{margin-top:-4px}
.credential-box .big-code{display:block;margin:12px 0;padding:12px;border-radius:12px;background:#0f211b;color:#d9fff0;font-size:1.12rem;direction:ltr;text-align:center;overflow-wrap:anywhere}

@media(max-width:980px){
  .sp-card-grid,.sp-schedule,.sp-child-grid{grid-template-columns:1fr}
  .sp-child-card{grid-template-columns:auto minmax(0,1fr)}
  .sp-child-card>button{grid-column:1/-1;width:100%}
}
@media(max-width:700px){
  .sp-role-hero{align-items:stretch;flex-direction:column;padding:19px;border-radius:20px}
  .sp-code{min-width:0;text-align:right}
  .sp-code strong{text-align:right}
  .sp-schedule-row{grid-template-columns:88px minmax(0,1fr)}
  .sp-schedule-row span{grid-column:2}
  .sp-plan-head{flex-direction:column}
  .sp-child-selector button{min-width:185px}
}
@media(max-width:520px){
  .sp-role-hero{padding:16px}
  .sp-card-grid{gap:9px}
  .sp-item-card,.sp-plan{padding:14px}
  .sp-schedule-row{padding:12px;gap:8px}
  .sp-child-card{padding:14px}
}
@media(prefers-reduced-motion:reduce){
  .sp-child-selector button,.sp-item-card,.sp-plan{scroll-behavior:auto;transition:none!important}
}


/* Student reminder acknowledgement Quick Action */
.sp-student-reminders{margin-top:16px}
.sp-reminder-list{display:grid;gap:10px}
.sp-reminder-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid var(--border,#e5e7eb);border-radius:14px;background:rgba(255,255,255,.55)}
.sp-reminder-card>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.sp-reminder-card small{opacity:.72}
.sp-reminder-card button{flex:0 0 auto}
@media(max-width:650px){.sp-reminder-card{align-items:stretch;flex-direction:column}.sp-reminder-card button{width:100%}}