/* PowerSchool 课表 样式 */
* { box-sizing: border-box; }

:root {
  --ink:   #20263a;
  --muted: #79839b;
  --line:  #e5e9f2;
  --bg:    #f3f6fb;
  --brand: #3f6df6;
  --rad:   12px;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--ink);
}
.hidden { display: none !important; }

/* ---------- top ---------- */
.topbar {
  background: linear-gradient(115deg, #3a5ff0, #6c4df0);
  color: #fff;
  box-shadow: 0 6px 18px rgba(31,45,95,.18);
}
.topbar-inner {
  max-width: 1240px; margin: 0 auto; padding: 15px 22px;
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.logo { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: .4px; }
.actions { display: flex; gap: 8px; }

.btn {
  border: none; cursor: pointer; border-radius: 10px;
  font-family: inherit; font-weight: 700; font-size: 14px;
  padding: 9px 16px; transition: .15s;
}
.btn-primary   { background: #fff; color: var(--brand); }
.btn-primary:hover { background: #f0f4ff; }
.btn-ghost     { background: rgba(255,255,255,.18); color: #fff; }
.btn-ghost:hover { background: rgba(255,255,255,.32); color: #fff; }
.link { background: none; border: none; color: var(--brand); font-size: inherit; cursor: pointer; }
.link:hover { text-decoration: underline; }

main { max-width: 1240px; margin: 0 auto; padding: 22px 20px 40px; }

/* empty */
.empty-state { text-align: center; padding: 90px 20px; color: var(--muted); }
.empty-icon { font-size: 62px; }
.empty-state .btn { margin-top: 8px; }
.empty-state .sub { margin-top: 14px; }

/* ---------- view ---------- */
#view { display: block; }
.weekbar {
  display: flex; align-items: center; gap: 10px;
  background:#fff; border-radius: var(--rad); padding: 10px 16px;
  margin-bottom: 14px; box-shadow: 0 4px 16px rgba(31,45,95,.06);
}
.weekbar .b {
  border: none; background:#f2f5ff; color:var(--brand); font-weight:700; cursor:pointer;
  padding: 7px 13px; border-radius: 9px; font-size: 15px;
}
.weekbar .b:hover { background:#e6edff; }
.weekbar .now { font-size: 13px; }
.weektoggle { display:flex; gap:6px; margin-left:auto; }
.weektoggle .b { font-size: 13px; padding: 7px 11px; background:#eef1f8; color:#495174; }
.weektoggle .b.active { background: var(--brand); color: #fff; }
.weekmeta { display:flex; flex-direction:column; line-height:1.2; margin:0 8px; }
.weekmeta #weekLabel { font-weight:800; }
.weekmeta #weekMark  { color: var(--muted); font-size:12px; }

.grid-scroll { overflow-x:auto; }

/* ---------- table ---------- */
table#grid { border-collapse: separate; border-spacing: 0; width:100%; min-width:640px; background:#fff;
  border-radius: var(--rad); box-shadow: 0 4px 18px rgba(31,45,95,.07); overflow:hidden; }
table#grid th, table#grid td { border-bottom:1px solid var(--line); padding:0; vertical-align:top; text-align:left; }
table#grid thead th {
  background:#f9fbff; color:var(--muted); font-size:14px; font-weight:700;
  padding: 10px 6px; text-align:center; border-bottom:2px solid var(--line);
}
table#grid thead th.today  { color: var(--brand); }
table#grid tbody tr:last-child td { border-bottom:none; }

/* 每天一列：格子里面压卡片，一格=一时间段 */
td.cellbox {
  border-right:1px solid var(--line); min-width:190px; padding:10px 9px; background:#fff;
}
thead th:last-child, tbody td:last-child { border-right:none; }
td.cellbox.emptyline { color:#c3c9d8; font-size:13px; text-align:center; padding-top:40px; }

/* ---------- course card ---------- */
.card {
  border-radius: 10px; padding: 8px 9px; margin-bottom: 8px;
  border-left:4px solid var(--t,#3f6df6);
  background: var(--b, #eef3ff);
  font-size:12.5px; line-height:1.35; box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.card:last-child { margin-bottom: 0; }
.cb-t  { font-size:11px; font-weight:600; color: var(--muted); }
.cb-name { font-weight:800; font-size:13.5px; color:#1b2a4a; margin-top:1px; }
.cb-meta { color:#5a6a8d; }
.card .cb-dur { display:inline-block; font-size:10px; margin-left:6px; color:#7c8aa8; }

/* ---------- footer ---------- */
.foot { text-align:center; color:var(--muted); font-size:12px; padding:6px 10px 30px; line-height:1.7; }
.foot small { display:block; }

/* ---------- modal ---------- */
.modal { position:fixed; inset:0; background:rgba(15,25,50,.5); display:flex; align-items:center; justify-content:center;
  padding:18px; z-index:30; }
.modal-box { background:#fff; border-radius:16px; max-width:760px; width:100%; max-height:90vh; overflow:auto;
  padding:22px 24px; box-shadow:0 20px 50px rgba(0,0,0,.25); }
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.modal-head h2 { font-size:19px; margin:0; }
.modal-head .x { border:none; background:none; font-size:28px; color:var(--muted); cursor:pointer; line-height:1; }
.hint  { color:var(--muted); font-size:13px; margin:4px 0 12px; line-height:1.5; }
.hint2 { color:var(--muted); font-size:13px; margin:16px 0 6px; }
code { background:#eef1f8; padding:1px 5px; border-radius:5px; font-size:12px; }
textarea {
  width:100%; border:1px solid var(--line); border-radius:10px; padding:10px; font-size:13px;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; resize:vertical;
}
textarea:focus { outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(63,109,246,.15); }
.row-btns { display:flex; gap:10px; margin-top:10px; align-items:center; flex-wrap:wrap; }
.btn-secondary { background:var(--brand); color:#fff; }
.btn-secondary:hover { background:#2f57d4; }
.fbtn { background:#eef1f8; padding:9px 14px; border-radius:10px; font-size:13px; color:#495174; cursor:pointer;
  font-weight:600; }
.fbtn:hover { background:#e1e7f4; }
.msg { min-height:20px; font-size:13px; margin:8px 0 2px; }
.msg.ok  { color:#168a50; }
.msg.err { color:#d33; font-weight:600; }