/* Portal-specific layout, built on top of the main site's style.css variables */

.portal-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh;}
.portal-sidebar{
  background:var(--charcoal);color:var(--paper);padding:28px 22px;
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.portal-sidebar .brand{color:#fff;margin-bottom:36px;}
.portal-nav a{
  display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:8px;
  color:var(--gray-300);font-size:14px;font-weight:500;margin-bottom:4px;
}
.portal-nav a:hover{background:rgba(255,255,255,0.06);color:#fff;}
.portal-nav a.active{background:var(--ember);color:#fff;}
.portal-user{
  border-top:1px solid rgba(255,255,255,0.12);margin-top:26px;padding-top:18px;
  font-size:13px;color:var(--gray-300);
}
.portal-user .role{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ember-light);}
.portal-main{padding:44px 48px;background:var(--paper);}
.portal-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:36px;flex-wrap:wrap;gap:16px;}

.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:40px;}
.stat-box{background:var(--white);border:1px solid var(--gray-100);border-radius:12px;padding:22px 24px;}
.stat-box .val{font-family:var(--serif);font-size:32px;font-weight:600;}
.stat-box .lbl{font-size:12.5px;color:var(--gray-500);margin-top:4px;}
.stat-box.warn{border-color:#F0D9B8;background:#FFF9F0;}

.data-table{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--gray-100);border-radius:12px;overflow:hidden;}
.data-table th{background:#F2EFEA;text-align:left;padding:12px 16px;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);font-weight:600;}
.data-table td{padding:14px 16px;border-top:1px solid var(--gray-100);font-size:14px;}
.data-table tr:hover td{background:#FAF8F5;}

.status-chip{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border-radius:20px;}
.status-pending{background:#FFF4E5;color:#B15B00;}
.status-active,.status-approved,.status-confirmed,.status-done_review{background:#EAF6EE;color:#1a7a4c;}
.status-blocked,.status-rejected,.status-declined{background:#FDEAE6;color:var(--ember-deep);}
.status-not_started{background:var(--gray-100);color:var(--gray-700);}

.progress-track{width:100%;height:8px;border-radius:20px;background:var(--gray-100);overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg, var(--ember), var(--blue));}

.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--charcoal);padding:40px;}
.auth-card{background:var(--white);border-radius:16px;padding:44px;max-width:420px;width:100%;}
.auth-card .form-field{margin-bottom:18px;}
.auth-card .form-field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px;}
.auth-card .form-field input,.auth-card .form-field select{
  width:100%;padding:12px 14px;border-radius:8px;border:1px solid var(--gray-100);font-family:var(--sans);font-size:14.5px;
}
.auth-error{background:#FDEAE6;color:var(--ember-deep);padding:12px 16px;border-radius:8px;font-size:13.5px;margin-bottom:18px;display:none;}
.auth-switch{text-align:center;margin-top:22px;font-size:13.5px;color:var(--gray-500);}

.lesson-row{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--gray-100);}
.lesson-row:first-child{border-top:none;}
.lesson-check{width:22px;height:22px;border-radius:6px;border:2px solid var(--gray-300);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;}
.lesson-check.done{background:var(--blue);border-color:var(--blue);color:#fff;}

@media (max-width:900px){
  .portal-shell{grid-template-columns:1fr;}
  .portal-sidebar{position:static;height:auto;}
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .portal-main{padding:28px 20px;}
}