/* ═══════════════════════════════════════════════
   School Pro – Portal CSS v3.0
   Covers: Login Page, Teacher, Student, Guardian
═══════════════════════════════════════════════ */

:root {
  --sp-primary:   #4f46e5;
  --sp-primary-l: #ede9fe;
  --sp-accent:    #06b6d4;
  --sp-success:   #10b981;
  --sp-warning:   #f59e0b;
  --sp-danger:    #ef4444;
  --sp-grey:      #6b7280;
  --sp-grey-l:    #f3f4f6;
  --sp-text:      #111827;
  --sp-text-m:    #374151;
  --sp-border:    #e5e7eb;
  --sp-white:     #ffffff;
  --sp-radius:    12px;
  --sp-radius-sm: 7px;
  --sp-shadow:    0 1px 3px rgba(0,0,0,.08);
  --sp-shadow-md: 0 4px 12px rgba(0,0,0,.1);
  --sp-shadow-lg: 0 10px 30px rgba(0,0,0,.12);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', sans-serif;
}

/* ═══ SHARED ═══ */
.schpro-portal { color: var(--sp-text); min-height: 100vh; background: #f1f5f9; }

/* Badges */
.schpro-badge { display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:.3px; }
.schpro-badge.blue   { background:#dbeafe;color:#1d4ed8; }
.schpro-badge.purple { background:#ede9fe;color:#6d28d9; }
.schpro-badge.teal   { background:#cffafe;color:#0e7490; }
.schpro-badge.green  { background:#d1fae5;color:#065f46; }
.schpro-badge.amber  { background:#fef3c7;color:#92400e; }
.schpro-badge.red    { background:#fee2e2;color:#991b1b; }
.schpro-badge.grey   { background:#f3f4f6;color:#6b7280; }
.schpro-grade-badge  { display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:700; }
.schpro-grade-badge.green { background:#d1fae5;color:#065f46; }
.schpro-grade-badge.blue  { background:#dbeafe;color:#1d4ed8; }
.schpro-grade-badge.red   { background:#fee2e2;color:#991b1b; }

/* Alerts */
.schpro-alert { padding:10px 14px;border-radius:var(--sp-radius-sm);font-size:13px;margin-bottom:12px; }
.schpro-alert.green  { background:#d1fae5;color:#065f46;border:1px solid #6ee7b7; }
.schpro-alert.red    { background:#fee2e2;color:#991b1b;border:1px solid #fca5a5; }
.schpro-alert.amber  { background:#fef3c7;color:#92400e;border:1px solid #fcd34d; }
.schpro-alert.blue   { background:#dbeafe;color:#1d4ed8;border:1px solid #93c5fd; }

/* Buttons */
.schpro-btn { display:inline-flex;align-items:center;gap:5px;padding:8px 16px;border:1px solid var(--sp-border);border-radius:var(--sp-radius-sm);background:var(--sp-white);color:var(--sp-text-m);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s; }
.schpro-btn:hover { background:var(--sp-grey-l); }
.schpro-btn.schpro-btn-sm { padding:5px 10px;font-size:12px; }
.schpro-btn-primary { display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 22px;background:var(--sp-primary);color:#fff;border:none;border-radius:var(--sp-radius-sm);font-size:14px;font-weight:600;cursor:pointer;transition:background .15s; }
.schpro-btn-primary:hover { background:#4338ca; }

/* Empty state */
.schpro-empty-state, .schpro-empty-card { text-align:center;padding:32px 20px;color:var(--sp-grey); }
.schpro-empty-icon { font-size:40px;margin-bottom:8px; }
.schpro-empty-card { background:var(--sp-white);border:1px solid var(--sp-border);border-radius:var(--sp-radius); }

/* ═══════════════════════════════════════
   LOGIN PAGE – Beautiful Split Screen
═══════════════════════════════════════ */
.schpro-login-page { min-height: 100vh; display: flex; align-items: stretch; }

.schpro-login-split { display: flex; width: 100%; min-height: 100vh; }

/* Left panel */
.schpro-login-left {
  flex: 0 0 45%;
  display: flex; align-items: center; justify-content: center;
  padding: 40px;
  position: relative; overflow: hidden;
}
.schpro-login-left::before {
  content: ''; position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='20' fill='none' stroke='rgba(255,255,255,0.08)' stroke-width='1'/%3E%3C/svg%3E") repeat;
}
.schpro-login-left-content {
  position: relative; z-index: 1;
  text-align: center; color: #fff; max-width: 340px;
}
.schpro-login-school-logo { max-height: 80px; margin-bottom: 16px; filter: drop-shadow(0 4px 8px rgba(0,0,0,.2)); }
.schpro-login-school-icon { font-size: 64px; margin-bottom: 12px; }
.schpro-login-school-name { font-size: 26px; font-weight: 800; margin: 0 0 6px; line-height: 1.2; }
.schpro-login-tagline { font-size: 14px; opacity: .85; margin: 0 0 32px; }
.schpro-login-roles-list { display: flex; flex-direction: column; gap: 14px; text-align: left; }
.schpro-login-role-item {
  display: flex; align-items: center; gap: 12px;
  background: rgba(255,255,255,.15); backdrop-filter: blur(8px);
  border-radius: 10px; padding: 12px 16px;
  border: 1px solid rgba(255,255,255,.2);
}
.schpro-role-icon { font-size: 24px; flex-shrink: 0; }
.schpro-login-role-item strong { display:block; font-size:14px; font-weight:700; }
.schpro-login-role-item small { font-size:12px; opacity:.8; }

/* Right panel */
.schpro-login-right {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 40px 32px; background: #fff;
}
.schpro-login-form-wrap { width: 100%; max-width: 380px; }
.schpro-login-form-header { margin-bottom: 28px; }
.schpro-login-form-header h2 { font-size: 26px; font-weight: 800; color: var(--sp-text); margin: 0 0 6px; }
.schpro-login-form-header p  { font-size: 14px; color: var(--sp-grey); margin: 0; }

.schpro-login-form-v2 { display: flex; flex-direction: column; gap: 16px; }
.schpro-login-field label { display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--sp-text-m);margin-bottom:6px; }
.schpro-input-wrap { position: relative; display: flex; align-items: center; }
.schpro-input-icon { position:absolute;left:12px;font-size:16px;pointer-events:none; }
.schpro-input-wrap input {
  width: 100%; padding: 12px 12px 12px 40px;
  border: 2px solid var(--sp-border); border-radius: var(--sp-radius-sm);
  font-size: 14px; color: var(--sp-text); box-sizing: border-box;
  transition: border .15s; outline: none;
}
.schpro-input-wrap input:focus { border-color: var(--sp-primary); box-shadow: 0 0 0 3px var(--sp-primary-l); }
.schpro-pw-toggle {
  position:absolute;right:10px;background:none;border:none;cursor:pointer;
  font-size:16px;color:var(--sp-grey);padding:4px;
}
.schpro-login-error-msg { background:#fee2e2;color:#991b1b;padding:10px 14px;border-radius:var(--sp-radius-sm);font-size:13px;border:1px solid #fca5a5; }
.schpro-login-submit-btn {
  width: 100%; padding: 14px; border: none; border-radius: var(--sp-radius-sm);
  color: #fff; font-size: 15px; font-weight: 700; cursor: pointer;
  transition: opacity .15s; letter-spacing: .3px;
}
.schpro-login-submit-btn:hover { opacity: .9; }
.schpro-login-submit-btn:disabled { opacity: .6; }
.schpro-login-forgot { text-align: center; font-size: 13px; }
.schpro-login-forgot a { color: var(--sp-primary); text-decoration: none; }
.schpro-login-forgot a:hover { text-decoration: underline; }
.schpro-login-contact { display:flex;gap:16px;justify-content:center;margin-top:20px;padding-top:16px;border-top:1px solid var(--sp-border);font-size:12px;color:var(--sp-grey);flex-wrap:wrap; }

/* Mobile login */
@media (max-width: 768px) {
  .schpro-login-split { flex-direction: column; }
  .schpro-login-left { flex: none; padding: 32px 24px; }
  .schpro-login-left-content { max-width: 100%; }
  .schpro-login-school-name { font-size: 20px; }
  .schpro-login-roles-list { display: none; }
  .schpro-login-right { padding: 28px 20px; }
  .schpro-login-form-header h2 { font-size: 22px; }
}

/* ═══════════════════════════════════════
   PORTAL TOPBAR
═══════════════════════════════════════ */
.schpro-portal-topbar {
  background: #fff; border-bottom: 1px solid var(--sp-border);
  padding: 12px 20px; display: flex; align-items: center;
  justify-content: space-between; gap: 12px; flex-wrap: wrap;
  position: sticky; top: 0; z-index: 100;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.schpro-portal-brand { display:flex;align-items:center;gap:10px; }
.schpro-portal-logo  { max-height: 38px; }
.schpro-portal-icon  { font-size: 26px; }
.schpro-portal-brand-text { display:flex;flex-direction:column; }
.schpro-portal-school-name { font-size: 15px; font-weight: 700; color: var(--sp-text); line-height:1.2; }
.schpro-portal-tagline { font-size: 11px; color: var(--sp-grey); }
.schpro-portal-user-info { display:flex;align-items:center;gap:10px; }
.schpro-user-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  background: linear-gradient(135deg, var(--sp-primary), var(--sp-accent));
  color: #fff; display:flex;align-items:center;justify-content:center;
  font-size: 14px; font-weight: 700; flex-shrink: 0;
}
.schpro-user-details { display:flex;flex-direction:column; }
.schpro-user-name { font-size: 13px; font-weight: 600; color: var(--sp-text); }
.schpro-user-role { font-size: 11px; color: var(--sp-grey); }
.schpro-logout-btn {
  padding: 6px 14px; background: var(--sp-grey-l); border: 1px solid var(--sp-border);
  border-radius: 20px; font-size: 12px; color: var(--sp-text-m); cursor: pointer;
  white-space: nowrap; transition: all .15s;
}
.schpro-logout-btn:hover { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }

/* ═══════════════════════════════════════
   PORTAL NAV
═══════════════════════════════════════ */
.schpro-portal-nav {
  background: #fff; border-bottom: 1px solid var(--sp-border);
  display: flex; gap: 2px; padding: 8px 16px; overflow-x: auto;
  scrollbar-width: none; flex-wrap: wrap;
}
.schpro-portal-nav::-webkit-scrollbar { display: none; }
.schpro-pnav {
  display: flex; align-items: center; gap: 5px;
  padding: 8px 14px; border: none; border-radius: 8px;
  background: transparent; color: var(--sp-grey);
  font-size: 13px; font-weight: 500; cursor: pointer;
  white-space: nowrap; transition: all .15s;
}
.schpro-pnav:hover  { background: var(--sp-grey-l); color: var(--sp-text); }
.schpro-pnav.active { background: var(--sp-primary); color: #fff; }
.nav-icon { font-size: 15px; }
.nav-label { font-size: 13px; }

/* ═══════════════════════════════════════
   PORTAL CONTENT & PANELS
═══════════════════════════════════════ */
.schpro-portal-content { padding: 20px 16px; max-width: 960px; margin: 0 auto; }
.schpro-panel { display: none; }
.schpro-panel.active { display: block; }
.schpro-panel-title { font-size: 18px; font-weight: 700; margin: 0 0 16px; color: var(--sp-text); }
.schpro-panel-sub   { font-size: 13px; color: var(--sp-grey); margin: -10px 0 14px; }

/* ═══════════════════════════════════════
   CARDS
═══════════════════════════════════════ */
.schpro-card {
  background: #fff; border: 1px solid var(--sp-border);
  border-radius: var(--sp-radius); overflow: hidden;
  box-shadow: var(--sp-shadow); margin-bottom: 14px;
}
.schpro-card-header {
  padding: 12px 16px; font-size: 13px; font-weight: 700;
  border-bottom: 1px solid var(--sp-border);
  background: var(--sp-grey-l); color: var(--sp-text-m);
}
.schpro-card-body { padding: 14px 16px; }

/* ═══════════════════════════════════════
   TEACHER PORTAL SPECIFIC
═══════════════════════════════════════ */
.schpro-page-hero {
  display: flex; align-items: center; gap: 16px;
  background: linear-gradient(135deg, var(--sp-primary), var(--sp-accent));
  border-radius: var(--sp-radius); padding: 20px;
  color: #fff; margin-bottom: 16px;
}
.schpro-hero-avatar {
  width: 60px; height: 60px; 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; border: 2px solid rgba(255,255,255,.4);
}
.schpro-hero-info h2 { margin:0 0 6px;font-size:18px;font-weight:700; }
.schpro-hero-meta { display:flex;flex-wrap:wrap;gap:8px; }
.schpro-hero-meta span { font-size:12px;background:rgba(255,255,255,.2);border-radius:20px;padding:3px 10px; }

.schpro-stat-row { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px; }
.schpro-stat-pill { text-align:center;padding:14px 10px;border-radius:var(--sp-radius);background:#fff;border:1px solid var(--sp-border);box-shadow:var(--sp-shadow); }
.schpro-stat-pill strong { display:block;font-size:22px;font-weight:700; }
.schpro-stat-pill span { font-size:11px;color:var(--sp-grey);text-transform:uppercase;letter-spacing:.4px; }
.schpro-stat-pill.blue strong   { color:var(--sp-primary); }
.schpro-stat-pill.purple strong { color:#8b5cf6; }
.schpro-stat-pill.teal strong   { color:var(--sp-accent); }
.schpro-stat-pill.amber strong  { color:var(--sp-warning); }

.schpro-class-pill { display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--sp-border);flex-wrap:wrap; }
.schpro-class-pill:last-child { border-bottom:none; }
.schpro-subject-tag { background:var(--sp-primary-l);color:var(--sp-primary);border-radius:20px;padding:2px 9px;font-size:11px;font-weight:600; }
.schpro-schedule-row { display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--sp-border);flex-wrap:wrap; }
.schpro-schedule-row:last-child { border-bottom:none; }
.schpro-schedule-time { font-size:12px;color:var(--sp-grey);min-width:140px; }
.schpro-schedule-subject { font-weight:600;font-size:13px;flex:1; }
.schpro-notice-row { display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--sp-border);font-size:13px; }
.schpro-notice-row:last-child { border-bottom:none; }
.schpro-date-chip { font-size:11px;color:var(--sp-grey);white-space:nowrap; }

/* Form grid */
.schpro-form-grid { display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end; }
.schpro-fg { display:flex;flex-direction:column;min-width:140px;flex:1; }
.schpro-fg label { font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--sp-text-m);margin-bottom:5px; }
.schpro-fg input, .schpro-fg select, .schpro-fg textarea {
  padding:9px 12px;border:1.5px solid var(--sp-border);border-radius:var(--sp-radius-sm);
  font-size:13px;color:var(--sp-text);background:#fff;box-sizing:border-box;font-family:inherit;
}
.schpro-fg input:focus,.schpro-fg select:focus,.schpro-fg textarea:focus { border-color:var(--sp-primary);outline:none;box-shadow:0 0 0 3px var(--sp-primary-l); }
.schpro-fg-btn { flex:0 0 auto;min-width:auto; }
.schpro-fg-btn button { height:38px;white-space:nowrap; }

/* Attendance */
.schpro-att-toolbar { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap; }
.schpro-att-bulk-btns { display:flex;gap:6px; }
.schpro-chip-btn { padding:6px 14px;border:none;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer; }
.schpro-chip-btn.green { background:#d1fae5;color:#065f46; }
.schpro-chip-btn.red   { background:#fee2e2;color:#991b1b; }
.schpro-att-col { width:36px;text-align:center; }
.green-col { color:#10b981; }
.red-col   { color:#ef4444; }
.amber-col { color:#f59e0b; }
.grey-col  { color:#9ca3af; }

.schpro-action-bar { display:flex;align-items:center;gap:12px;padding:12px 0;margin-top:8px; }
.schpro-success-msg { color:#10b981;font-weight:600;font-size:13px; }

/* Homework items */
.schpro-hw-item { background:#f9fafb;border:1px solid var(--sp-border);border-left:4px solid var(--sp-primary);border-radius:var(--sp-radius-sm);padding:12px;margin-bottom:10px; }
.schpro-hw-item.overdue { border-left-color:var(--sp-danger); }
.schpro-hw-item-top { display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px; }
.schpro-hw-item-top strong { font-size:14px; }
.schpro-hw-desc { font-size:12px;color:var(--sp-text-m);margin:6px 0; }
.schpro-hw-footer { font-size:12px;color:var(--sp-grey); }
.schpro-chip { display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;background:var(--sp-grey-l);color:var(--sp-text-m);font-weight:500; }
.schpro-chip.purple { background:#ede9fe;color:#6d28d9; }

/* Timetable */
.schpro-timetable-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px; }
.schpro-tt-day { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);overflow:hidden; }
.schpro-tt-day-label { background:var(--sp-primary);color:#fff;padding:8px 10px;font-size:12px;font-weight:700;text-align:center; }
.schpro-tt-slot { padding:8px 10px;border-bottom:1px solid var(--sp-border); }
.schpro-tt-slot:last-child { border-bottom:none; }
.schpro-tt-time    { font-size:10px;color:var(--sp-grey); }
.schpro-tt-subject { font-size:12px;font-weight:600;color:var(--sp-text); }
.schpro-tt-class   { font-size:11px;color:var(--sp-primary); }

/* Notice cards v2 */
.schpro-notice-card-v2 { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:14px;margin-bottom:10px; }
.schpro-notice-v2-header { display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:6px; }
.schpro-notice-v2-header h3 { font-size:14px;font-weight:600;margin:0; }
.schpro-notice-v2-body { font-size:13px;color:var(--sp-text-m); }

/* Responsive table */
.schpro-table-responsive { overflow-x:auto; }
.schpro-portal-table { width:100%;border-collapse:collapse;font-size:13px; }
.schpro-portal-table th { background:var(--sp-grey-l);padding:9px 12px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--sp-grey);font-weight:600;white-space:nowrap; }
.schpro-portal-table td { padding:10px 12px;border-bottom:1px solid var(--sp-border);vertical-align:middle; }
.schpro-portal-table tr:last-child td { border-bottom:none; }

/* ═══════════════════════════════════════
   STUDENT PORTAL
═══════════════════════════════════════ */
.schpro-profile-card {
  display:flex;align-items:center;gap:16px;
  background:linear-gradient(135deg,var(--sp-primary),var(--sp-accent));
  border-radius:var(--sp-radius);padding:20px;color:#fff;margin-bottom:16px;
}
.schpro-profile-photo { width:68px;height:68px;border-radius:50%;object-fit:cover;border:3px solid rgba(255,255,255,.4); }
.schpro-profile-initials {
  width:68px;height:68px;border-radius:50%;
  background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.4);
  display:flex;align-items:center;justify-content:center;
  font-size:24px;font-weight:700;color:#fff;flex-shrink:0;
}
.schpro-profile-initials.sm { width:44px;height:44px;font-size:16px; }
.schpro-profile-info h2 { font-size:18px;font-weight:700;margin:0 0 6px;color:#fff; }
.schpro-profile-meta { display:flex;flex-wrap:wrap;gap:6px; }
.schpro-profile-meta span { font-size:12px;background:rgba(255,255,255,.2);border-radius:20px;padding:3px 10px; }

.schpro-overview-cards { display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:14px; }
.schpro-ov-card { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:14px;text-align:center;box-shadow:var(--sp-shadow); }
.schpro-ov-label { font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--sp-grey);margin-bottom:4px; }
.schpro-ov-val { font-size:22px;font-weight:700; }
.schpro-ov-val.green  { color:var(--sp-success); }
.schpro-ov-val.red    { color:var(--sp-danger); }
.schpro-ov-val.blue   { color:var(--sp-primary); }
.schpro-ov-val.purple { color:#8b5cf6; }
.schpro-ov-val.amber  { color:var(--sp-warning); }
.schpro-ov-sub { font-size:11px;color:var(--sp-grey);margin-top:2px; }

/* Attendance circle */
.schpro-att-summary { display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:14px; }
.schpro-att-circle { width:96px;height:96px;border-radius:50%;border:8px solid var(--sp-grey-l);display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0; }
.schpro-att-circle.good { border-color:var(--sp-success); }
.schpro-att-circle.bad  { border-color:var(--sp-danger); }
.schpro-att-pct { font-size:20px;font-weight:700; }
.schpro-att-lbl { font-size:10px;color:var(--sp-grey); }
.schpro-att-breakdown { display:flex;flex-direction:column;gap:6px; }
.schpro-att-stat { display:flex;align-items:center;gap:7px;font-size:13px; }
.dot { width:10px;height:10px;border-radius:50%;flex-shrink:0; }
.dot.green { background:var(--sp-success); }
.dot.red   { background:var(--sp-danger); }
.dot.grey  { background:var(--sp-grey); }

/* Fee bar */
.schpro-fee-bar-wrap { margin-bottom:10px; }
.schpro-fee-bar { height:12px;background:var(--sp-grey-l);border-radius:9px;overflow:hidden;margin-bottom:6px; }
.schpro-fee-fill { height:100%;background:linear-gradient(90deg,var(--sp-primary),var(--sp-accent));border-radius:9px;transition:width .6s ease; }
.schpro-fee-labels { display:flex;justify-content:space-between;font-size:12px;color:var(--sp-grey); }

/* Results */
.schpro-result-block { margin-bottom:18px; }
.schpro-result-block h3 { font-size:14px;font-weight:700;color:var(--sp-primary);padding-bottom:6px;border-bottom:2px solid var(--sp-primary);margin:0 0 10px; }
.schpro-result-block h4 { font-size:13px;font-weight:700;color:var(--sp-primary);margin:0 0 8px; }

/* Homework */
.schpro-hw-card { background:#fff;border:1px solid var(--sp-border);border-left:4px solid var(--sp-primary);border-radius:var(--sp-radius-sm);padding:12px;margin-bottom:10px; }
.schpro-hw-card.overdue { border-left-color:var(--sp-danger); }
.schpro-hw-top { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px; }
.schpro-hw-top strong { font-size:14px; }
.schpro-hw-subject { font-size:11px;background:var(--sp-primary-l);color:var(--sp-primary);border-radius:20px;padding:2px 9px; }
.schpro-hw-desc { font-size:12px;color:var(--sp-text-m);margin:4px 0; }
.schpro-hw-due { font-size:12px;color:var(--sp-grey); }

/* Events */
.schpro-events-list { display:flex;flex-direction:column;gap:10px; }
.schpro-event-card { display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--sp-border);border-left:5px solid;border-radius:var(--sp-radius-sm);padding:12px; }
.schpro-event-date { font-size:18px;font-weight:700;min-width:40px;text-align:center;color:var(--sp-text); }
.schpro-event-info strong { font-size:13px; }
.schpro-event-info p { font-size:12px;color:var(--sp-grey);margin:3px 0 0; }

/* Docs */
.schpro-docs-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px; }
.schpro-doc-card { display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius-sm);padding:12px;text-decoration:none;color:var(--sp-text);transition:box-shadow .15s; }
.schpro-doc-card:hover { box-shadow:var(--sp-shadow-md); }
.schpro-doc-icon { font-size:22px; }
.schpro-doc-info { flex:1;overflow:hidden; }
.schpro-doc-info strong { display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.schpro-doc-info span { font-size:11px;color:var(--sp-grey); }

/* Remark form */
.schpro-remark-form { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:18px;margin-bottom:18px; }
.schpro-remark-form .schpro-fg label { font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--sp-text-m);margin-bottom:5px;display:block; }
.schpro-remark-form .schpro-fg input,
.schpro-remark-form .schpro-fg select,
.schpro-remark-form .schpro-fg textarea {
  width:100%;padding:10px 12px;border:1.5px solid var(--sp-border);border-radius:var(--sp-radius-sm);
  font-size:14px;box-sizing:border-box;font-family:inherit;
}
.schpro-remark-form .schpro-fg input:focus,
.schpro-remark-form .schpro-fg textarea:focus { border-color:var(--sp-primary);outline:none;box-shadow:0 0 0 3px var(--sp-primary-l); }
.schpro-past-remarks { margin-top:16px; }
.schpro-past-remarks h3 { font-size:14px;font-weight:700;margin-bottom:10px; }
.schpro-remark-item { background:#f9fafb;border:1px solid var(--sp-border);border-radius:var(--sp-radius-sm);padding:12px;margin-bottom:8px; }
.schpro-remark-item-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;font-weight:600;font-size:13px; }
.schpro-remark-item p { font-size:13px;color:var(--sp-text-m);margin:0 0 6px; }
.schpro-admin-reply { background:#f0fdf4;border:1px solid #bbf7d0;border-radius:6px;padding:8px 12px;font-size:12px;margin-top:6px; }

/* ═══════════════════════════════════════
   GUARDIAN PORTAL
═══════════════════════════════════════ */
.schpro-guardian-child { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:16px;margin-bottom:14px; }
.schpro-child-header { display:flex;align-items:center;gap:12px;margin-bottom:12px; }
.schpro-child-header h3 { font-size:15px;font-weight:700;margin:0 0 2px; }
.schpro-child-header span { font-size:12px;color:var(--sp-grey);display:block; }
.schpro-child-stats { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px; }
.schpro-cs-box { text-align:center;padding:10px;border-radius:var(--sp-radius-sm);border:1px solid var(--sp-border); }
.schpro-cs-box.green { border-color:#6ee7b7;background:#f0fdf4; }
.schpro-cs-box.amber { border-color:#fcd34d;background:#fffbeb; }
.schpro-cs-box.blue  { border-color:#bfdbfe;background:#eff6ff; }
.schpro-cs-box.red   { border-color:#fca5a5;background:#fef2f2; }
.schpro-cs-val   { font-size:18px;font-weight:700; }
.schpro-cs-label { font-size:11px;color:var(--sp-grey); }
.schpro-child-section { margin-top:10px;padding-top:10px;border-top:1px solid var(--sp-border); }
.schpro-child-section h4 { font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;margin:0 0 8px;color:var(--sp-grey); }
.schpro-notice-item { display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--sp-border);font-size:13px; }
.schpro-notice-item:last-child { border-bottom:none; }

/* ═══════════════════════════════════════
   SECTION BOX (overview bottom)
═══════════════════════════════════════ */
.schpro-section-box { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:14px;margin-top:12px; }
.schpro-section-box h3 { font-size:13px;font-weight:700;margin:0 0 10px;color:var(--sp-text); }

/* Notice card */
.schpro-notice-card { background:#fff;border:1px solid var(--sp-border);border-radius:var(--sp-radius);padding:14px;margin-bottom:10px; }
.schpro-notice-card-header { display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:6px; }
.schpro-notice-card-header h3 { font-size:14px;font-weight:600;margin:0; }
.schpro-notice-date { font-size:11px;color:var(--sp-grey);white-space:nowrap; }
.schpro-notice-body { font-size:13px;color:var(--sp-text-m); }

/* Misc portal message */
.schpro-portal-msg { background:#fef3c7;border:1px solid #fcd34d;border-radius:var(--sp-radius);padding:20px;font-size:14px;text-align:center;margin:20px; }
.schpro-portal-msg a { color:var(--sp-primary);font-weight:600; }

/* ═══════════════════════════════════════
   HIDE WORDPRESS UI
═══════════════════════════════════════ */
#wpadminbar,#wpadminbar * { display:none!important;visibility:hidden!important; }
html.admin-bar,html.admin-bar body { margin-top:0!important;padding-top:0!important; }

body.schpro-portal-page header:not(.schpro-portal-topbar),
body.schpro-portal-page #masthead,body.schpro-portal-page #site-header,
body.schpro-portal-page #header,body.schpro-portal-page .site-header,
body.schpro-portal-page .header-area,body.schpro-portal-page .main-navigation,
body.schpro-portal-page #main-navigation,body.schpro-portal-page nav:not(.schpro-portal-nav),
body.schpro-portal-page .nav-bar,body.schpro-portal-page .navbar,
body.schpro-portal-page .top-bar,body.schpro-portal-page .topbar,
body.schpro-portal-page .site-branding,body.schpro-portal-page #site-navigation,
body.schpro-portal-page footer,body.schpro-portal-page #colophon,
body.schpro-portal-page #footer,body.schpro-portal-page .site-footer,
body.schpro-portal-page .footer-area,body.schpro-portal-page .page-title-area,
body.schpro-portal-page .entry-header,body.schpro-portal-page h1.entry-title,
body.schpro-portal-page h1.page-title,body.schpro-portal-page .breadcrumbs,
body.schpro-portal-page .breadcrumb,body.schpro-portal-page .ast-above-header,
body.schpro-portal-page .ast-primary-header-bar,body.schpro-portal-page .ast-below-header,
body.schpro-portal-page .generate-header,body.schpro-portal-page #et_pb_nav,
body.schpro-portal-page #top-header,body.schpro-portal-page .wp-block-template-part
{ display:none!important; }

body.schpro-portal-page { background:#f1f5f9!important;padding:0!important;margin:0!important; }
body.schpro-portal-page #page,body.schpro-portal-page .site,body.schpro-portal-page #content,
body.schpro-portal-page .site-content,body.schpro-portal-page .content-area,
body.schpro-portal-page main,body.schpro-portal-page #main,body.schpro-portal-page article,
body.schpro-portal-page .hentry,body.schpro-portal-page .entry-content,
body.schpro-portal-page .container,body.schpro-portal-page #primary,
body.schpro-portal-page .wp-site-blocks,body.schpro-portal-page .site-main
{ padding:0!important;margin:0!important;max-width:100%!important;width:100%!important;float:none!important;box-shadow:none!important;background:transparent!important;border:none!important; }

/* ═══════════════════════════════════════
   MOBILE RESPONSIVE
═══════════════════════════════════════ */
@media (max-width:768px) {
  .schpro-portal-topbar { padding:10px 12px; }
  .schpro-user-details { display:none; }
  .schpro-portal-content { padding:14px 10px; }
  .schpro-stat-row { grid-template-columns:repeat(2,1fr); }
  .schpro-overview-cards { grid-template-columns:repeat(2,1fr); }
  .schpro-timetable-grid { grid-template-columns:repeat(2,1fr); }
  .schpro-docs-grid { grid-template-columns:1fr 1fr; }
  .schpro-form-grid { flex-direction:column; }
  .schpro-form-grid .schpro-fg { min-width:100%; }
  .schpro-page-hero { flex-direction:column;text-align:center;padding:16px; }
  .schpro-hero-meta { justify-content:center; }
  .schpro-child-stats { grid-template-columns:repeat(3,1fr); }
  .schpro-portal-table { font-size:12px; }
  .schpro-portal-table th,.schpro-portal-table td { padding:7px 8px; }
}
@media (max-width:480px) {
  .schpro-stat-row { grid-template-columns:repeat(2,1fr); }
  .schpro-overview-cards { grid-template-columns:repeat(2,1fr); }
  .schpro-timetable-grid { grid-template-columns:1fr; }
  .schpro-portal-nav { padding:6px 8px; }
  .schpro-pnav { padding:7px 10px;font-size:12px; }
  .nav-icon { font-size:16px; }
  .schpro-att-summary { flex-direction:column;gap:12px; }
  .schpro-profile-card { flex-direction:column;text-align:center;padding:16px; }
  .schpro-profile-meta { justify-content:center; }
}
@media print {
  .schpro-portal-topbar,.schpro-portal-nav,.schpro-btn,.schpro-btn-primary,
  button,#portal-logout,.schpro-action-bar { display:none!important; }
  .schpro-panel { display:block!important; }
  .schpro-portal-content { padding:0; }
}