@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f7fa;--ink:#172c42;--muted:#778698;--line:#e7edf2;--green:#16846c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px Manrope,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}aside{position:fixed;width:238px;height:100vh;background:white;border-right:1px solid var(--line);padding:32px 22px;display:flex;flex-direction:column}.brand{font-size:24px;font-weight:800;letter-spacing:-1px}.symbol{background:var(--green);color:white;padding:7px 11px;border-radius:12px;margin-right:8px}.sub{font-size:11px;color:var(--muted);margin:13px 0 48px;letter-spacing:1px}nav button{display:block;border:0;background:none;color:#617386;padding:15px;width:100%;text-align:left;border-radius:10px;margin-bottom:8px}nav button.active{background:#e9f5f0;color:var(--green);font-weight:800}.bottom{margin-top:auto;color:var(--muted);font-size:12px;line-height:1.9}main{margin-left:238px;padding:0 44px 35px;max-width:1600px}header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.muted{color:var(--muted)}.avatar{background:#e1eee8;color:var(--green);padding:11px;border-radius:50%;font-weight:bold}.topright{display:flex;gap:15px;align-items:center}.demo{background:#fff7e7;color:#8a692d;padding:12px 17px;border:1px solid #efe0bc;border-radius:9px;font-size:12px;margin-top:24px}h1{font-size:30px;letter-spacing:-1px;margin:30px 0 8px}h2{font-size:17px;margin:0 0 6px}p{line-height:1.7}.row{display:flex;align-items:center;justify-content:space-between;gap:15px}.badge{font-size:11px;background:#e5f5ee;color:#198261;padding:6px 10px;border-radius:6px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:19px;margin:26px 0}.card{background:white;border:1px solid var(--line);border-radius:13px;padding:24px}.number{font-size:36px;font-weight:800;margin:14px 0 8px;letter-spacing:-1px}.number small{font-size:18px;color:#a3aeba}.bar{height:7px;background:#edf1f4;border-radius:9px;margin-top:18px;overflow:hidden}.bar i{display:block;height:100%;background:var(--green)}.grid{display:grid;grid-template-columns:1.7fr 1fr;gap:22px}.lesson{border:1px solid var(--line);border-radius:9px;padding:17px;margin-top:15px;display:flex;align-items:center;justify-content:space-between}.lesson strong{display:block;margin-bottom:7px}.time{color:var(--muted);font-size:12px}.primary{background:var(--green);color:white;border:0;border-radius:8px;padding:12px 18px;font-weight:700}.secondary{background:white;border:1px solid #dce5eb;color:var(--ink);border-radius:8px;padding:11px 17px}.primary:disabled{opacity:.5;cursor:default}table{width:100%;border-collapse:collapse;margin-top:20px;text-align:left}th{font-size:11px;color:var(--muted);background:#f8fafb;font-weight:600}td,th{padding:16px 12px;border-bottom:1px solid var(--line)}.absent{background:#fff0ed;color:#cb6756}.notice{padding:15px;background:#f5f8fb;border-radius:9px;margin-top:20px;color:#6b7c8b;font-size:12px;line-height:1.8}.ring{width:148px;height:148px;border-radius:50%;background:conic-gradient(#16846c 0 67%,#edf2f5 67% 100%);margin:26px auto;display:grid;place-items:center}.ring div{background:white;border-radius:50%;width:122px;height:122px;display:flex;flex-direction:column;align-items:center;justify-content:center}.ring strong{font-size:32px}.hidden{display:none!important}select,input{padding:11px;border:1px solid #dce5eb;border-radius:8px;background:white;color:var(--ink);max-width:100%}.section{margin-top:25px}.toast{position:fixed;bottom:30px;left:50%;background:#172c42;color:white;padding:15px 24px;border-radius:10px;box-shadow:0 8px 35px #0002;z-index:3}.code{font-size:36px;letter-spacing:6px;font-weight:800;text-align:center;padding:26px;background:#f2f7f5;margin:18px 0;border-radius:12px}.label{display:block;font-size:12px;color:var(--muted);margin:16px 0 8px}footer{font-size:11px;color:var(--muted);margin-top:28px}.dot{height:7px;width:7px;background:var(--green);display:inline-block;border-radius:50%;margin-right:6px}@media(max-width:1000px){aside{width:195px}main{margin-left:195px;padding:0 23px}.grid{grid-template-columns:1fr}.cards{gap:10px}.card{padding:19px}}@media(max-width:700px){aside{position:static;height:auto;width:auto;padding:20px}.sub,.bottom{display:none}nav{display:flex;margin-top:20px;overflow:auto}nav button{min-width:125px;margin:0}main{margin:0;padding:0 16px}header{height:75px}.cards{grid-template-columns:1fr}.number{margin:5px 0}.row{flex-wrap:wrap}h1{font-size:25px}.topright .muted{display:none}.card{overflow:auto}}
dialog{border:1px solid #e7edf2;border-radius:16px;padding:28px;width:min(560px,92vw);color:#172c42}dialog::backdrop{background:#172c4266}textarea{width:100%;padding:12px;font:inherit;border:1px solid #dce5eb;border-radius:8px}.danger{color:#b74734}.request-text{white-space:pre-wrap;overflow-wrap:anywhere}.request{margin-top:16px;padding:20px;border:1px solid var(--line);border-radius:10px}button:disabled{opacity:.5;cursor:default}.pending{background:#fff6df;color:#916b1f}.link{border:0;background:none;color:var(--green);text-align:left}.cloud{background:#eaf5ef;color:#287157;border-color:#d9ebdf}.errorbox{background:#fff0ed;color:#9f4437;padding:15px;border-radius:9px}.empty{text-align:center;padding:38px 15px;color:var(--muted)}[hidden]{display:none!important}input[type=checkbox]{width:22px;height:22px;accent-color:var(--green)}.wrap{overflow:auto}.schoolday{display:inline-block;padding:8px 12px;background:#edf3f7;border-radius:8px;margin:4px}

/* ── Σελίδα σύνδεσης ─────────────────────────────────────────────── */
.login-page{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{background:white;border:1px solid var(--line);border-radius:16px;padding:36px 32px;width:min(420px,100%);box-shadow:0 18px 60px #172c4212}
.login-brand{font-size:28px;font-weight:800;letter-spacing:-1px;text-align:center}
.login-sub{font-size:11px;color:var(--muted);letter-spacing:1px;text-align:center;margin:12px 0 28px}
.login-card label.label{margin-top:18px}
.login-card input{width:100%}
.login-card .primary{width:100%;margin-top:24px;padding:14px}
.login-help{font-size:12px;color:var(--muted);line-height:1.8;margin-top:22px;text-align:center}
.login-page .errorbox{margin-bottom:18px}
@media(max-width:700px){.login-card{padding:26px 20px}}

/* ── Προσθήκες διαχείρισης ───────────────────────────────────────── */
.logout{background:none;border:1px solid #dce5eb;color:#617386;border-radius:8px;padding:9px 14px;font-size:12px}
.disabled-row{opacity:.55}
.role-pill{font-size:11px;padding:5px 9px;border-radius:6px;background:#eef2f6;color:#5b6b7c}
.role-pill.teacher{background:#e5f5ee;color:#198261}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.actions button{font-size:12px;padding:8px 12px}
.audit-detail{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;white-space:pre-wrap;overflow-wrap:anywhere;color:#5b6b7c;margin:8px 0 0}
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.slot-edit{display:grid;grid-template-columns:48px 1fr 120px 92px 92px 70px;gap:8px;align-items:center;margin-top:8px}
.slot-edit input,.slot-edit select{padding:8px;font-size:12px}
@media(max-width:860px){.slot-edit{grid-template-columns:1fr 1fr;}}
.tempcode{font-size:24px;letter-spacing:3px;font-weight:800;text-align:center;padding:22px;background:#f2f7f5;margin:16px 0;border-radius:12px;overflow-wrap:anywhere;user-select:all}
.warn{background:#fff7e7;color:#8a692d;border:1px solid #efe0bc;border-radius:9px;padding:14px;font-size:12px;line-height:1.7;margin-top:16px}

/* ── Σελίδα δήλωσης παρουσίας (σάρωση QR) ───────────────────────────── */
.checkin-done { text-align: center; padding: 18px 0 6px; }
.checkin-mark {
  width: 64px; height: 64px; margin: 0 auto 12px;
  border-radius: 50%; background: #16846c; color: #fff;
  font-size: 34px; line-height: 64px; font-weight: 700;
}
.checkin-headline { font-size: 20px; font-weight: 700; margin: 0 0 6px; }

/* ── Οθόνη QR του καθηγητή ──────────────────────────────────────────── */
.qr-stage { text-align: center; }
.qr-stage img {
  width: min(78vw, 420px); height: auto; display: block; margin: 0 auto;
  background: #fff; padding: 14px; border-radius: 12px;
}
.qr-url {
  margin: 14px auto 0; max-width: 520px; word-break: break-all;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px;
}

/* ── Σάρωση QR από την κάμερα ───────────────────────────────────────── */
.scan-stage {
  position: relative; max-width: 480px; margin: 0 auto;
  background: #0b1f1a; border-radius: 14px; overflow: hidden;
}
.scan-stage video { width: 100%; display: block; aspect-ratio: 1 / 1; object-fit: cover; }
.scan-frame {
  position: absolute; inset: 14%; border: 3px solid rgba(255, 255, 255, 0.9);
  border-radius: 12px; pointer-events: none;
}
.scan-status { margin: 12px auto 0; max-width: 480px; }

/* ── Εμφάνιση και απόκρυψη της πλαϊνής μπάρας ───────────────────────────
 * Μία κλάση στο body: `nav-closed` σημαίνει κρυμμένη.
 *
 * Οι δύο όψεις είναι σε ΞΕΧΩΡΙΣΤΑ, μη επικαλυπτόμενα media queries. Όταν
 * μοιράζονταν κανόνες, ο κανόνας του υπολογιστή κρατούσε το συρτάρι έξω
 * από την οθόνη στο κινητό.
 */
.headline { display: flex; align-items: center; gap: 14px; }
.nav-toggle {
  background: white; border: 1px solid #dce5eb; color: var(--ink);
  border-radius: 9px; padding: 10px 13px; line-height: 1; font-size: 15px;
  flex: none;
}
.nav-toggle:hover { background: #f5f8fb; }

.nav-backdrop { position: fixed; inset: 0; background: #0f22333d; z-index: 4; }
.nav-backdrop[hidden] { display: none; }

/* ── Υπολογιστής: η μπάρα συμπτύσσεται και το περιεχόμενο απλώνει ─────── */
@media (min-width: 701px) {
  aside { transition: transform .18s ease; }
  main { transition: margin-left .18s ease; }
  body.nav-closed aside { transform: translateX(-100%); }
  body.nav-closed main { margin-left: 0; }
}

/* ── Κινητό: συρτάρι πάνω από το περιεχόμενο ──────────────────────────── */
@media (max-width: 700px) {
  aside {
    position: fixed; top: 0; left: 0; bottom: 0; width: 264px; height: auto;
    padding: 22px; overflow-y: auto; z-index: 5;
    box-shadow: 0 0 40px #0f223326;
    transform: translateX(-100%);
    transition: transform .18s ease;
  }
  body:not(.nav-closed) aside { transform: translateX(0); }
  aside .sub, aside .bottom { display: revert; }
  nav { display: block; margin-top: 24px; overflow: visible; }
  nav button { min-width: 0; margin: 0 0 8px; }
  main, body.nav-closed main { margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
  aside, main { transition: none; }
}

/* ── Συνημμένα και αντίστροφη μέτρηση του QR ────────────────────────── */
.qr-countdown {
  width: min(78vw, 420px); height: 6px; margin: 10px auto 0;
  background: #e7edf2; border-radius: 99px; overflow: hidden;
}
.qr-countdown i { display: block; height: 100%; width: 100%; background: var(--green); }

.files { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; }
.file {
  margin: 0; width: 132px; border: 1px solid var(--line);
  border-radius: 10px; overflow: hidden; background: white;
}
.file a { display: block; }
.file img, .file-kind {
  display: block; width: 100%; height: 96px; object-fit: cover; background: #f2f6f9;
}
.file-kind {
  display: grid; place-items: center; font-size: 12px; font-weight: 700;
  color: #5b6b7c; letter-spacing: 1px;
}
.file figcaption { padding: 9px 10px; font-size: 11px; line-height: 1.6; }
.file-name {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.file .link { font-size: 11px; padding: 0; margin-top: 4px; }
input[type=file] {
  width: 100%; padding: 10px; background: #f8fafb; font-size: 12px;
}

/* ── Παρουσιολόγιο ημέρας, αργίες και εκτυπώσεις ────────────────────── */
.matrix { min-width: 520px; }
.matrix th.sticky {
  position: sticky; left: 0; background: white; z-index: 1;
  text-align: left; font-size: 13px; font-weight: 600; color: var(--ink);
  max-width: 220px;
}
.matrix thead th.sticky { background: #f8fafb; font-size: 11px; color: var(--muted); }
.matrix thead th { text-align: center; vertical-align: bottom; }
.matrix td { text-align: center; position: relative; }
.matrix th.off, .matrix td.off { background: #fbfcfd; opacity: .55; }
.col-period { display: block; font-size: 13px; font-weight: 800; color: var(--ink); }
.col-subject { display: block; font-size: 10px; line-height: 1.4; max-width: 110px; margin: 2px auto 0; }
.col-time { display: block; font-size: 10px; color: var(--muted); }
.col-all { display: block; font-size: 10px; margin-top: 6px; white-space: nowrap; }
.col-all input { width: 15px; height: 15px; vertical-align: -3px; }
.qr-dot {
  position: absolute; top: 10px; right: calc(50% - 18px);
  width: 6px; height: 6px; border-radius: 50%; background: var(--green);
}
.tempcode-inline {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 700; letter-spacing: 1px; user-select: all;
}

@media print {
  /* Τυπώνονται μόνο οι κωδικοί της μαζικής εισαγωγής, χωρίς το περιβάλλον. */
  body.has-credentials aside,
  body.has-credentials header,
  body.has-credentials footer,
  body.has-credentials .nav-backdrop,
  body.has-credentials .no-print,
  body.has-credentials #content > *:not(.credentials),
  body.has-credentials h1,
  body.has-credentials #content > .muted { display: none !important; }
  body.has-credentials main { margin: 0 !important; padding: 0 !important; }
  body.has-credentials .credentials { border: 0; padding: 0; }
  @page { margin: 14mm; }
}