:root{
  --navy:#0f3355; --navy-2:#0b2740; --green:#1f9d57; --green-2:#17864a;
  --ink:#1e293b; --muted:#64748b; --line:#e4e9f0; --bg:#eef2f7; --bg-2:#e3eaf2;
  --danger:#b91c1c; --danger-bg:#fef2f2; --ok-bg:#ecfdf5; --ok-ink:#065f46;
  --radius:14px; --shadow:0 6px 24px rgba(15,51,85,.08); --shadow-sm:0 2px 8px rgba(15,51,85,.06);
  --focus:0 0 0 3px rgba(31,157,87,.28);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  line-height:1.55; font-size:16px;
  background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);
  min-height:100vh; display:flex; flex-direction:column;
}
.wrap{width:100%; max-width:780px; margin:0 auto; padding:0 18px}

/* ---------- Nagłówek ---------- */
.topbar{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%); color:#fff; box-shadow:var(--shadow-sm)}
.topbar .wrap{display:flex; align-items:center; gap:14px; padding:16px 18px}
.topbar .logo{flex:0 0 auto; width:48px; height:48px; border-radius:50%; background:#fff; padding:2px; box-shadow:0 2px 8px rgba(0,0,0,.15)}
.brand{display:flex; flex-direction:column; line-height:1.2}
.brand strong{font-weight:700; font-size:1.05rem; letter-spacing:.2px}
.brand small{font-size:.82rem; opacity:.85}

main.wrap{flex:1; padding-top:28px; padding-bottom:48px}

/* ---------- Typografia ---------- */
h1{color:var(--navy); font-size:1.7rem; line-height:1.2; margin:.2em 0 .3em; letter-spacing:-.3px}
.intro{color:var(--muted); font-size:1.02rem; margin:.2em 0 .1em}
.org{color:var(--muted); margin:.2em 0}

/* ---------- Karta ---------- */
.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; margin-top:20px; box-shadow:var(--shadow)}
.card--narrow{max-width:440px; margin:48px auto}

/* ---------- Sekcje formularza ---------- */
fieldset{border:none; margin:0 0 22px; padding:0}
legend{font-weight:700; color:var(--navy); font-size:.95rem; text-transform:uppercase; letter-spacing:.6px; margin-bottom:10px; padding:0}
label{display:block; margin:0 0 14px; font-weight:600; font-size:.92rem; color:#334155}

/* Pola */
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=datetime-local],select,textarea{
  width:100%; padding:12px 13px; margin-top:6px; border:1.5px solid #cdd8e4; border-radius:10px;
  font:inherit; font-weight:400; color:var(--ink); background:#fff; transition:border-color .15s, box-shadow .15s;
}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--green); box-shadow:var(--focus)}
input::placeholder{color:#9aa7b6}
select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M6 8 0 0h12z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:36px}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:0 16px}
@media(max-width:560px){.grid2{grid-template-columns:1fr}}

/* ---------- Wybór terminu (karty) ---------- */
.events{display:flex; flex-direction:column; gap:12px}
.event-card{
  position:relative; display:block; margin:0; cursor:pointer; font-weight:400;
  border:1.5px solid var(--line); border-radius:12px; padding:16px 16px 16px 50px; background:#fbfcfe;
  transition:border-color .15s, box-shadow .15s, background .15s;
}
.event-card:hover{border-color:#b7c6d8; background:#fff}
.event-card input{position:absolute; left:16px; top:18px; width:20px; height:20px; accent-color:var(--green); margin:0}
.event-card:has(input:checked){border-color:var(--green); background:var(--ok-bg); box-shadow:var(--focus)}
.event-card.disabled{opacity:.6; cursor:not-allowed}
.ev-title{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-weight:700; color:var(--navy); font-size:1.02rem}
.badge{display:inline-block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:3px 9px; border-radius:999px}
.badge.stacjonarnie{background:#e0edff; color:#1d4ed8}
.badge.online{background:#e6f7ee; color:var(--green-2)}
.badge.full{background:#fde8e8; color:var(--danger)}
.ev-date{color:var(--muted); font-size:.9rem; margin-top:4px}
.ev-spots{display:flex; align-items:center; gap:10px; margin-top:10px; font-size:.86rem; color:var(--muted)}
.bar{flex:1; height:7px; background:#e2e8f0; border-radius:999px; overflow:hidden; max-width:220px}
.bar span{display:block; height:100%; background:linear-gradient(90deg,var(--green),#37b06e); border-radius:999px}
.ev-count{font-weight:600; color:#334155; white-space:nowrap}
.ev-loc{margin-top:8px; font-size:.88rem; color:#334155}
.ev-loc a{color:var(--green-2)}

/* ---------- RODO ---------- */
.rodo{background:#f7f9fc; border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin:8px 0 20px}
.check{display:flex; gap:11px; align-items:flex-start; font-weight:500; cursor:pointer; margin:0}
.check input{flex:0 0 auto; width:19px; height:19px; margin-top:2px; accent-color:var(--green)}
.clause{margin-top:10px; color:var(--muted); font-size:.88rem}
.clause summary{cursor:pointer; color:var(--green-2); font-weight:600}
.clause p{margin:8px 0 0}

/* ---------- Przyciski ---------- */
.btn{display:inline-block; background:#eef2f7; color:var(--ink); border:1px solid var(--line); padding:12px 20px; border-radius:10px; font:inherit; font-weight:600; text-decoration:none; cursor:pointer; transition:transform .06s, box-shadow .15s, background .15s}
.btn:hover{background:#e4eaf1}
.btn:active{transform:translateY(1px)}
.btn.primary{background:linear-gradient(135deg,var(--green),var(--green-2)); color:#fff; border:none; box-shadow:0 4px 14px rgba(31,157,87,.35)}
.btn.primary:hover{filter:brightness(1.04)}
.btn.block{display:block; width:100%; text-align:center; font-size:1.05rem; padding:14px}

/* ---------- Komunikaty ---------- */
.alert{padding:13px 15px; border-radius:10px; margin:0 0 18px; font-weight:500}
.alert.error{background:var(--danger-bg); border:1px solid #fecaca; color:#991b1b}
.alert.ok{background:var(--ok-bg); border:1px solid #a7f3d0; color:var(--ok-ink)}
.field-error{display:block; color:var(--danger); font-size:.83rem; font-weight:500; margin-top:5px}
.hint{color:var(--muted); font-size:.85rem}

/* ---------- Potwierdzenie ---------- */
.success{text-align:center}
.success .check{display:inline-flex; justify-content:center; align-items:center; width:64px; height:64px; border-radius:50%; background:var(--ok-bg); color:var(--green); font-size:2rem; margin:0 auto 10px}
.success h1{color:var(--green-2)}
.summary{list-style:none; padding:0; margin:18px 0; text-align:left; background:#f7f9fc; border:1px solid var(--line); border-radius:12px; overflow:hidden}
.summary li{padding:11px 16px; border-bottom:1px solid var(--line); font-weight:400}
.summary li:last-child{border-bottom:none}
.summary strong{color:var(--navy); margin-right:6px}

/* ---------- Stopka ---------- */
.footer{color:var(--muted); font-size:.84rem; padding:24px 0; text-align:center}

/* ---------- Panel admina ---------- */
.admin-nav{display:flex; gap:6px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px 10px; margin-top:20px; flex-wrap:wrap; box-shadow:var(--shadow-sm)}
.admin-nav a{color:var(--navy); text-decoration:none; font-weight:600; padding:8px 12px; border-radius:8px; font-size:.92rem}
.admin-nav a:hover{background:#eef2f7}
.admin-nav .logout{margin-left:auto; margin-bottom:0}
.link{background:none; border:none; color:var(--danger); cursor:pointer; font:inherit; font-weight:600; padding:8px 12px; border-radius:8px}
.link:hover{background:var(--danger-bg)}
.tbl{width:100%; border-collapse:collapse; margin-top:18px; background:#fff; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm)}
.tbl th,.tbl td{border-bottom:1px solid var(--line); padding:10px 12px; text-align:left; font-size:.9rem}
.tbl th{background:var(--navy); color:#fff; font-weight:600}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:nth-child(even) td{background:#f8fafc}
.tbl td input[type=text]{margin-top:0}
.actions{display:flex; gap:8px; align-items:center}
.actions form{margin:0}
.actions a{color:var(--navy); font-weight:600; text-decoration:none}
.filter{display:flex; gap:14px; align-items:flex-end; margin-top:18px; flex-wrap:wrap}
.filter label{margin:0}
.exports{margin-left:auto; display:flex; gap:8px}
