/* INFINITY MATHS TUTORING — Logbook styles (brand-matched) */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#0E3652; --ink-soft:#4C6478;
  --paper:#F1F5F7; --raised:#FFFFFF; --deep:#E3ECF1;
  --gold:#F2B310; --gold-deep:#C98F0A; --gold-tint:#FDF0CF;
  --blue:#1DA5DF; --blue-tint:#DFF2FB;
  --red:#D64545; --red-tint:#FBE3E3;
  --amber:#E8A317; --amber-tint:#FDF0D2;
  --green:#2E9E5B; --green-tint:#DFF3E7;
  --line:rgba(14,54,82,0.14); --line-soft:rgba(14,54,82,0.08);
  --display:'Fraunces',Georgia,serif;
  --body:'Inter',-apple-system,sans-serif;
  --mono:'IBM Plex Mono',Menlo,monospace;
}
*{ box-sizing:border-box; }
body{ margin:0; font-family:var(--body); background:var(--paper); color:var(--ink-soft); font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; }
h1,h2,h3{ font-family:var(--display); color:var(--ink); margin:0; line-height:1.15; font-weight:600; }
a{ color:var(--blue); text-decoration:none; }
a:hover{ text-decoration:underline; }
.container{ max-width:960px; margin:0 auto; padding:0 20px; }

/* top bar */
.topbar{ background:var(--ink); color:#fff; }
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; }
.topbar img{ height:54px; display:block; }
.topbar .who{ font-family:var(--mono); font-size:0.75rem; letter-spacing:0.06em; color:rgba(255,255,255,0.75); }
.topbar a.out{ color:var(--gold); font-weight:600; font-size:0.85rem; }

.page-head{ padding:34px 0 10px; }
.page-head .eyebrow{ font-family:var(--mono); font-size:0.7rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--blue); font-weight:600; }
.page-head h1{ font-size:1.7rem; margin-top:8px; }
.page-head p{ margin:8px 0 0; }

.card{ background:var(--raised); border:1px solid var(--line); border-radius:8px; padding:24px; margin:18px 0; }
.card h2{ font-size:1.15rem; margin-bottom:14px; }
.muted{ color:var(--ink-soft); font-size:0.85rem; }
.mono{ font-family:var(--mono); }

/* buttons & forms */
.btn{ display:inline-flex; align-items:center; gap:6px; padding:10px 18px; border-radius:4px; font-weight:600; font-size:0.85rem; border:1.5px solid transparent; cursor:pointer; font-family:var(--body); text-decoration:none !important; }
.btn-gold{ background:var(--gold); color:var(--ink); }
.btn-gold:hover{ background:var(--gold-deep); }
.btn-ink{ background:var(--ink); color:#fff; }
.btn-outline{ background:transparent; border-color:var(--ink); color:var(--ink); }
.btn-danger{ background:transparent; border-color:var(--red); color:var(--red); }
.btn-sm{ padding:6px 12px; font-size:0.78rem; }

label{ display:block; font-size:0.78rem; font-weight:600; color:var(--ink); margin:12px 0 5px; }
input[type=text], input[type=date], input[type=password], select, textarea{
  width:100%; border:1.5px solid var(--line); border-radius:4px; padding:10px 12px;
  font-family:var(--body); font-size:0.95rem; color:var(--ink); background:#fff;
}
input:focus, select:focus, textarea:focus{ border-color:var(--blue); outline:none; }
textarea{ min-height:80px; resize:vertical; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.actions{ margin-top:16px; display:flex; gap:10px; flex-wrap:wrap; }

/* alerts */
.flash{ border-radius:6px; padding:12px 16px; margin:14px 0; font-size:0.9rem; }
.flash.ok{ background:var(--green-tint); color:#1d6b3d; border:1px solid rgba(46,158,91,0.35); }
.flash.err{ background:var(--red-tint); color:#9c2f2f; border:1px solid rgba(214,69,69,0.35); }

/* student table */
table.list{ width:100%; border-collapse:collapse; }
table.list th, table.list td{ text-align:left; padding:11px 12px; border-bottom:1px solid var(--line-soft); font-size:0.9rem; }
table.list th{ font-family:var(--mono); font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); }
table.list tr:hover td{ background:var(--deep); }

/* status chips + colour-coded topic pills */
.legend{ display:flex; gap:14px; flex-wrap:wrap; margin:10px 0 18px; font-size:0.78rem; }
.legend span{ display:inline-flex; align-items:center; gap:6px; }
.dot{ width:11px; height:11px; border-radius:50%; display:inline-block; }
.st-none  { --c:#9AA9B5; --ct:#EAEFF3; }
.st-red   { --c:var(--red);   --ct:var(--red-tint); }
.st-amber { --c:var(--amber); --ct:var(--amber-tint); }
.st-green { --c:var(--green); --ct:var(--green-tint); }
.dot.st-none{ background:#9AA9B5; } .dot.st-red{ background:var(--red); }
.dot.st-amber{ background:var(--amber); } .dot.st-green{ background:var(--green); }

.topic-group{ margin-bottom:20px; }
.topic-group h3{ font-size:0.95rem; font-family:var(--body); font-weight:700; color:var(--ink); margin-bottom:8px; }
.topics{ display:flex; flex-wrap:wrap; gap:8px; }
.topic{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--ct); color:var(--ink);
  border:1.5px solid var(--c); border-radius:20px;
  padding:6px 13px; font-size:0.82rem; font-weight:500;
}
.topic .dot{ width:9px; height:9px; background:var(--c); }
button.topic{ cursor:pointer; font-family:var(--body); }
button.topic:hover{ filter:brightness(0.96); }
.topic .del{ color:var(--ink-soft); font-weight:700; margin-left:2px; text-decoration:none; }
.topic .del:hover{ color:var(--red); }

/* progress bar */
.progress{ height:10px; border-radius:6px; background:var(--deep); overflow:hidden; display:flex; margin:6px 0 2px; }
.progress i{ display:block; height:100%; }
.progress .p-green{ background:var(--green); } .progress .p-amber{ background:var(--amber); }
.progress .p-red{ background:var(--red); } .progress .p-none{ background:#C4CFD8; }

/* dashboard stat cards */
.stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:18px 0; }
.stat{ background:var(--raised); border:1px solid var(--line); border-radius:8px; padding:18px; display:flex; flex-direction:column; }
.stat .num{ font-family:var(--mono); font-size:1.8rem; font-weight:600; color:var(--ink); line-height:1.1; }
.stat .lbl{ font-size:0.76rem; color:var(--ink-soft); margin-top:6px; }

.duo{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.duo .card{ margin:4px 0 14px; }

.point-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.point-list li{ display:flex; gap:10px; align-items:flex-start; font-size:0.92rem; color:var(--ink); }
.pt-ic{ flex:none; width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:700; margin-top:-1px; }
.pt-ic.ok{ background:var(--green-tint); color:var(--green); }
.pt-ic.aim{ background:var(--amber-tint); color:var(--gold-deep); }

/* session log */
.session{ border-left:3px solid var(--gold); padding:2px 0 2px 16px; margin:18px 0; }
.session .date{ font-family:var(--mono); font-size:0.78rem; color:var(--gold-deep); font-weight:600; }
.session h4{ margin:6px 0 2px; font-size:0.82rem; color:var(--ink); font-family:var(--mono); text-transform:uppercase; letter-spacing:0.08em; }
.session p{ margin:2px 0 8px; white-space:pre-line; }

/* share box */
.share{ background:var(--blue-tint); border:1px solid rgba(29,165,223,0.35); border-radius:6px; padding:14px 16px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.share input{ flex:1; min-width:220px; font-family:var(--mono); font-size:0.8rem; }

/* login */
.login-wrap{ max-width:400px; margin:70px auto; }

/* footer */
.lb-footer{ text-align:center; padding:30px 0 40px; font-size:0.78rem; color:var(--ink-soft); }

/* print (for parents saving a PDF) */
@media print{
  .topbar, .no-print, .lb-footer{ display:none !important; }
  body{ background:#fff; }
  .card{ border:none; padding:0; margin:22px 0; }
}
@media (max-width:640px){
  .form-row{ grid-template-columns:1fr; }
  .stat-grid{ grid-template-columns:1fr 1fr; }
  .duo{ grid-template-columns:1fr; }
  table.list th:nth-child(3), table.list td:nth-child(3){ display:none; }
}