/* Komponenty pre katalóg, predajné stránky, členskú sekciu a admin */

.narrow { width: min(560px, 100% - 32px); }
.center { text-align: center; }
.right { text-align: right; }
.muted { color: var(--ink-soft); }
.small { font-size: .9rem; }
.grow { flex: 1; min-width: 0; }
.more { margin-top: 40px; }
.h-page { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; }
.h-page.small { font-size: clamp(1.7rem, 3.4vw, 2.3rem); }
.h-sec { font-size: 1.6rem; margin: 48px 0 20px; }
.h-sec:first-of-type { margin-top: 8px; }
.section-tight { padding: 56px 0 96px; }
.filters.left { justify-content: flex-start; margin: 28px 0 0; }
a.chip { text-decoration: none; }
.btn[disabled], .btn[disabled]:hover { opacity: .45; cursor: not-allowed; transform: none; box-shadow: 0 3px 0 var(--ink); }
code { background: var(--tint); padding: 2px 6px; border-radius: 6px; font-size: .9em; }

.flash {
  background: #D3F4EC; border: 2px solid var(--ink); border-radius: 14px;
  padding: 12px 16px; font-weight: 700; margin-bottom: 24px; box-shadow: 0 3px 0 var(--ink);
}
.flash-err { background: #FFE3DC; }

.empty { text-align: center; background: var(--white); border: 2px dashed var(--ink); border-radius: var(--radius); padding: 48px 24px; }
.empty.small { padding: 28px 20px; margin-bottom: 8px; }
.empty.small p { margin-bottom: 14px; }
.empty-icon { font-size: 3rem; margin-bottom: 8px; }

/* ---------- Page hero ---------- */
.page-hero { padding: 56px 0 8px; }
.page-hero .lead { margin-bottom: 0; }

/* ---------- Course cards (katalóg) ---------- */
.card-link { text-decoration: none; color: inherit; }
.card-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 18px; }
.card-link h3 { font-size: 1.35rem; }
.card-link::before { content: ""; position: absolute; inset: 0 0 auto; height: 10px; background: var(--c); border-radius: 20px 20px 0 0; }
.kind { display: inline-block; font-size: .78rem; font-weight: 700; padding: 5px 11px; border-radius: 999px; border: 2px solid var(--ink); white-space: nowrap; }
.kind-elearning { background: #D3F4EC; }
.kind-prezencny { background: #FFEEC2; }
.price-tag { font: 800 1.2rem/1 var(--font-head); }

.progress { height: 12px; background: var(--tint); border: 2px solid var(--ink); border-radius: 999px; overflow: hidden; margin: 14px 0 4px; }
.progress span { display: block; height: 100%; width: 0; background: var(--c, var(--mint)); border-radius: 999px; transition: width .3s; }
.progress.thin { height: 8px; border-width: 1.5px; margin: 6px 0 0; }

/* ---------- Sales page ---------- */
.preview-bar { background: var(--sun); border-bottom: 2px solid var(--ink); text-align: center; padding: 10px; font-weight: 700; }
.sales-hero {
  position: relative; overflow: hidden;
  background: color-mix(in srgb, var(--c) 18%, var(--cream));
  border-bottom: 2px solid var(--ink);
  padding: 64px 0;
}
.sales-hero::after {
  content: ""; position: absolute; width: 420px; height: 420px; right: -120px; top: -140px;
  background: var(--c); border: 2px solid var(--ink); opacity: .9;
  border-radius: 46% 54% 58% 42% / 48% 42% 58% 52%;
  animation: morph 12s ease-in-out infinite;
}
.sales-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 360px; gap: 48px; align-items: center; }
.sales-facts { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 24px 0 0; }
.sales-facts li { background: var(--white); border: 2px solid var(--ink); border-radius: 999px; padding: 8px 14px; font-weight: 700; font-size: .92rem; }
.buy-box { background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: 28px; box-shadow: 0 6px 0 var(--ink); }
.buy-price { font: 800 2.8rem/1 var(--font-head); margin-bottom: 20px; }
.buy-note { font-size: .88rem; color: var(--ink-soft); text-align: center; margin: 12px 0 18px; }
.ticks.small li { font-size: .9rem; }

.sales-body { max-width: 860px; }
.sales-body h2 { font-size: 2rem; margin: 48px 0 20px; }
.sales-body h2:first-child { margin-top: 0; }
.prose p { font-size: 1.08rem; color: var(--ink-soft); }
.outcomes { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.outcomes li { background: var(--white); border: 2px solid var(--ink); border-left: 10px solid var(--c); border-radius: 14px; padding: 14px 16px; font-weight: 500; }
.curriculum { list-style: none; padding: 0; margin: 0; border: 2px solid var(--ink); border-radius: 18px; overflow: hidden; background: var(--white); }
.curriculum li { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.curriculum li:last-child { border-bottom: 0; }
.curriculum .t { flex: 1; font-weight: 500; }
.num { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center; background: var(--tint); border: 2px solid var(--ink); font-weight: 800; font-size: .88rem; }
.dates.wide { max-width: none; }
.date-row.is-past { opacity: .6; }
.date-row form { margin: 0; }
.cta-band { padding: 72px 0; }
.cta-band p { color: #CFCBE6; }

/* ---------- Auth ---------- */
.auth-bg { background: radial-gradient(circle at 15% 20%, #FFE3DC 0, transparent 30%), radial-gradient(circle at 85% 80%, #D3F4EC 0, transparent 30%); }
.auth-card { position: relative; background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: 40px 34px 30px; box-shadow: 0 6px 0 var(--ink); }
.auth-bubble {
  position: absolute; top: -30px; right: 28px; width: 64px; height: 56px; display: grid; place-items: center; font-size: 1.6rem;
  background: var(--sun); border: 2px solid var(--ink); border-radius: 18px; box-shadow: 0 4px 0 var(--ink); transform: rotate(6deg);
}
.switch { margin: 18px 0 0; font-size: .95rem; }
.summary { border: 2px dashed var(--line); border-radius: 14px; padding: 6px 16px; margin: 20px 0; }
.summary div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.summary div:last-child { border: 0; }

/* ---------- Member ---------- */
.member-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.actions form { margin: 0; }
.table-wrap { overflow-x: auto; background: var(--white); border: 2px solid var(--ink); border-radius: 18px; }
.panel .table-wrap { border: 0; border-radius: 0; }
.table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.table th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft); padding: 14px 16px; border-bottom: 2px solid var(--ink); background: var(--tint); white-space: nowrap; }
.table td { padding: 14px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table tr.is-past td { opacity: .55; }
.table a { text-decoration: none; }
.table a:hover { text-decoration: underline; }

/* ---------- Learn ---------- */
.learn { padding: 36px 0 96px; }
.learn-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 28px; }
.learn-head h1 { margin: 6px 0 0; }
.learn-progress { min-width: 240px; }
.back { text-decoration: none; font-weight: 700; color: var(--ink-soft); font-size: .92rem; }
.back:hover { color: var(--ink); }
.learn-grid { display: grid; grid-template-columns: 300px 1fr; gap: 28px; align-items: start; }
.lesson-list { background: var(--white); border: 2px solid var(--ink); border-radius: 18px; padding: 10px; position: sticky; top: 92px; box-shadow: 0 4px 0 var(--ink); }
.lesson-list ol { list-style: none; margin: 0; padding: 0; }
.lesson-list a { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 12px; text-decoration: none; font-weight: 500; font-size: .95rem; }
.lesson-list a:hover { background: var(--tint); }
.lesson-list .current a { background: color-mix(in srgb, var(--c) 25%, white); font-weight: 700; }
.lesson-list .done .num { background: var(--mint); }
.lesson-list .num .ico { display: none; width: 18px; height: 18px; stroke-width: 3; }
.lesson-list .done .num .ico { display: block; }
.lesson-list .done .num .n { display: none; }
.tasks-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 700; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--c, var(--coral)); }
.tasks-link .ico { --icon-acc: var(--c, var(--coral)); }
.tasks-page { width: min(820px, 100% - 32px); }
.tasks-page .lesson-box { background: var(--white); }
.tasks-page .lesson-box h3 a { color: inherit; }

/* Súbory a úlohy v lekcii */
.lesson-box { margin: 24px 0 0; padding: 18px 20px; background: var(--cream); border: 2px solid var(--ink); border-radius: 16px; box-shadow: 0 3px 0 var(--ink); }
.lesson-box h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 1.15rem; }
.lesson-box h3 .ico { width: 24px; height: 24px; --icon-acc: var(--c, var(--coral)); }
.task-count { margin-left: auto; padding: 2px 10px; border: 2px solid var(--ink); border-radius: 99px; background: var(--white); font: 700 .85rem var(--font-head); }
.file-list, .task-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.file-list a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: var(--white); border: 2px solid var(--ink); border-radius: 12px; color: var(--ink); text-decoration: none; font-weight: 600; transition: transform .15s; }
.file-list a:hover { transform: translateY(-2px); box-shadow: 0 3px 0 var(--ink); }
.file-list .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.file-list small { color: var(--ink-soft); white-space: nowrap; }
.file-ext { min-width: 46px; padding: 4px 6px; border: 2px solid var(--ink); border-radius: 8px; background: var(--c, var(--coral)); color: var(--white); font: 800 .72rem/1 var(--font-head); text-align: center; text-transform: uppercase; }
.task-list form { margin: 0; }
.task { display: flex; align-items: flex-start; gap: 12px; width: 100%; padding: 10px 12px; background: var(--white); border: 2px solid var(--ink); border-radius: 12px; color: var(--ink); font: 500 1rem/1.45 var(--font-body); text-align: left; cursor: pointer; transition: background .15s; }
.task:hover { background: var(--tint); }
.task:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; }
.task-box { display: grid; place-items: center; flex-shrink: 0; width: 26px; height: 26px; margin-top: -1px; border: 2px solid var(--ink); border-radius: 8px; background: var(--white); }
.task-box .ico { width: 18px; height: 18px; stroke-width: 3; opacity: 0; transform: scale(.4); transition: opacity .15s, transform .15s; }
.task.is-done { background: #D3F4EC; }
.task.is-done .task-box { background: var(--mint); }
.task.is-done .task-box .ico { opacity: 1; transform: none; }
.task.is-done > span:last-child { text-decoration: line-through; text-decoration-thickness: 2px; color: var(--ink-soft); }
.task-hint { margin: 10px 0 0; }
.lesson-state { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 2px dashed var(--line); border-radius: 99px; color: var(--ink-soft); font-weight: 600; }
.lesson-state .ico { display: none; width: 20px; height: 20px; stroke-width: 3; }
.lesson-state .on, .lesson-state.is-done .off { display: none; }
.lesson-state.is-done { border: 2px solid var(--ink); background: #D3F4EC; color: var(--ink); }
.lesson-state.is-done .on, .lesson-state.is-done .ico { display: inline; }
.lesson { background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: 28px; box-shadow: 0 4px 0 var(--ink); }
.player { width: 100%; aspect-ratio: 16 / 9; background: var(--ink); border-radius: 14px; border: 2px solid var(--ink); margin-bottom: 26px; }
.player.small { max-width: 520px; margin-bottom: 10px; }

/* Vlastný prehrávač videí lekcií (public/player.js) */
.vp { --vp-acc: var(--c, var(--coral)); position: relative; aspect-ratio: 16 / 9; margin-bottom: 26px; background: var(--ink); border: 2px solid var(--ink); border-radius: 14px; overflow: hidden; box-shadow: 0 4px 0 var(--ink); outline: none; }
.vp:focus-visible { box-shadow: 0 4px 0 var(--ink), 0 0 0 4px var(--sun); }
.vp-video { display: block; width: 100%; height: 100%; object-fit: contain; background: var(--ink); }
.vp-big, .vp-bar { display: none; }
.vp.is-ready .vp-big, .vp.is-ready .vp-bar { display: flex; }
.vp-big { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; align-items: center; justify-content: center; border: 2px solid var(--ink); border-radius: 50%; background: var(--sun); box-shadow: 0 4px 0 var(--ink); cursor: pointer; transition: transform .15s, opacity .2s; }
.vp-big .ico { width: 38px; height: 38px; margin-left: 5px; --icon-acc: var(--vp-acc); }
.vp-big:hover { transform: scale(1.06); }
.vp.is-playing .vp-big { opacity: 0; pointer-events: none; transform: scale(.85); }
.vp.is-ended .vp-big { display: none; }
.vp-end { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 20px; background: rgba(31, 27, 58, .78); text-align: center; }
.vp-end[hidden] { display: none; }
.vp-end-msg { margin: 0; color: var(--white); font: 700 1.25rem/1.3 var(--font-head); }
.vp-end-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.vp.is-waiting.is-playing .vp-big { opacity: 1; animation: vp-pulse 1s ease-in-out infinite; }
@keyframes vp-pulse { 50% { transform: scale(.92); } }
.vp-bar { position: absolute; left: 12px; right: 12px; bottom: 12px; flex-direction: column; gap: 4px; padding: 8px 10px 6px; background: var(--cream); border: 2px solid var(--ink); border-radius: 14px; box-shadow: 0 3px 0 var(--ink); transition: opacity .25s, transform .25s; }
.vp.is-playing.is-idle .vp-bar { opacity: 0; transform: translateY(10px); pointer-events: none; }
.vp.is-playing.is-idle { cursor: none; }
.vp-seek { position: relative; height: 18px; cursor: pointer; touch-action: none; outline: none; }
.vp-seek::before, .vp-buf, .vp-fill { content: ""; position: absolute; left: 0; top: 50%; height: 8px; margin-top: -4px; border-radius: 99px; }
.vp-seek::before { right: 0; background: var(--white); border: 2px solid var(--ink); margin-top: -5px; height: 10px; }
.vp-buf { width: var(--vp-buf, 0%); background: var(--line); margin-left: 2px; }
.vp-fill { width: var(--vp-pos, 0%); background: var(--vp-acc); margin-left: 1px; }
.vp-thumb { position: absolute; top: 50%; left: var(--vp-pos, 0%); width: 18px; height: 18px; margin: -9px 0 0 -9px; background: var(--sun); border: 2px solid var(--ink); border-radius: 50%; transition: transform .15s; }
.vp-seek:hover .vp-thumb, .vp.is-seeking .vp-thumb, .vp-seek:focus-visible .vp-thumb { transform: scale(1.2); }
.vp-seek:focus-visible::before { box-shadow: 0 0 0 3px var(--sun); }
.vp-row { display: flex; align-items: center; gap: 2px; min-width: 0; }
.vp-grow { flex: 1; }
.vp-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 6px; border: 0; border-radius: 10px; background: transparent; color: var(--ink); font: 700 15px/1 var(--font-head); cursor: pointer; --icon-acc: var(--vp-acc); }
.vp-btn:hover { background: var(--tint); }
.vp-btn:focus-visible { outline: 3px solid var(--sun); outline-offset: -1px; }
.vp-btn .ico { width: 24px; height: 24px; vertical-align: 0; }
.vp-speed { min-width: 50px; }
.vp-play .ico-pause, .vp.is-playing .vp-play .ico-play { display: none; }
.vp.is-playing .vp-play .ico-pause { display: inline-block; }
.vp-mute .ico-mute, .vp.is-muted .vp-mute .ico-volume { display: none; }
.vp.is-muted .vp-mute .ico-mute { display: inline-block; }
.vp-fs .ico-fullscreen-exit, .vp.is-fullscreen .vp-fs .ico-fullscreen { display: none; }
.vp.is-fullscreen .vp-fs .ico-fullscreen-exit { display: inline-block; }
.vp-time { margin-left: 8px; font-size: 14px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.vp-vol { width: 84px; height: 18px; min-height: 0; margin: 0 6px 0 2px; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; cursor: pointer; -webkit-appearance: none; appearance: none; }
.vp-vol::-webkit-slider-runnable-track { height: 8px; border: 2px solid var(--ink); border-radius: 99px; background: linear-gradient(90deg, var(--vp-acc) var(--vp-vol, 100%), var(--white) var(--vp-vol, 100%)); }
.vp-vol::-moz-range-track { height: 4px; border: 2px solid var(--ink); border-radius: 99px; background: linear-gradient(90deg, var(--vp-acc) var(--vp-vol, 100%), var(--white) var(--vp-vol, 100%)); }
.vp-vol::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; margin-top: -6px; border: 2px solid var(--ink); border-radius: 50%; background: var(--sun); }
.vp-vol::-moz-range-thumb { width: 12px; height: 12px; border: 2px solid var(--ink); border-radius: 50%; background: var(--sun); }
.vp-vol:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; border-radius: 99px; }
.vp.is-fullscreen { border: 0; border-radius: 0; box-shadow: none; aspect-ratio: auto; width: 100%; height: 100%; }
.vp.is-fullscreen .vp-bar { left: 50%; right: auto; width: min(960px, calc(100% - 24px)); transform: translateX(-50%); bottom: 20px; }
.vp.is-fullscreen.is-playing.is-idle .vp-bar { transform: translate(-50%, 10px); }
@media (max-width: 640px) {
  .vp { border-radius: 12px; }
  .vp-bar { left: 6px; right: 6px; bottom: 6px; padding: 4px 6px 2px; border-radius: 10px; }
  .vp-vol, .vp-back, .vp-fwd { display: none; }
  .vp-btn { min-width: 34px; height: 34px; }
  .vp-time { font-size: 13px; margin-left: 4px; }
  .vp-big { width: 64px; height: 64px; margin: -32px 0 0 -32px; }
  .vp-big .ico { width: 30px; height: 30px; }
}
.lesson h2 { font-size: 1.9rem; }
.lesson-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 22px; margin-top: 10px; border-top: 2px dashed var(--line); }
.lesson-nav form { margin: 0; }

/* ---------- Admin ---------- */
.admin-body { background: var(--cream); }
.admin { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.admin-side { background: var(--ink); color: #fff; padding: 26px 18px; display: flex; flex-direction: column; gap: 32px; position: sticky; top: 0; height: 100vh; align-self: start; }
.admin-side .logo { font-size: 1.05rem; }
.admin-nav { display: grid; gap: 6px; }
.admin-nav a { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; text-decoration: none; font-weight: 600; color: #CFCBE6; transition: background .15s, color .15s; }
.admin-nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.admin-nav a.active { background: var(--sun); color: var(--ink); border: 2px solid var(--ink); box-shadow: 0 3px 0 rgba(0,0,0,.35); }
.admin-side-foot { margin-top: auto; display: grid; gap: 10px; font-size: .92rem; }
.admin-side-foot a, .admin-side-foot button { color: #CFCBE6; text-decoration: none; background: none; border: 0; font: inherit; padding: 0; cursor: pointer; text-align: left; }
.admin-side-foot a:hover, .admin-side-foot button:hover { color: var(--sun); }
.admin-side-foot form { margin: 0; }
.admin-main { padding: 36px clamp(16px, 4vw, 48px) 80px; min-width: 0; }
.admin-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; flex-wrap: wrap; margin-bottom: 28px; }
.admin-head h1 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin: 4px 0 8px; }

.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-bottom: 26px; }
.stat { background: var(--white); border: 2px solid var(--ink); border-radius: 18px; padding: 20px; box-shadow: 0 4px 0 var(--ink); border-top: 12px solid var(--c); }
.stat span { display: block; color: var(--ink-soft); font-size: .88rem; font-weight: 600; }
.stat b { font: 800 2rem/1.2 var(--font-head); }

.panel { background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: 26px; box-shadow: 0 4px 0 var(--ink); margin-bottom: 26px; }
.panel.flush { padding: 0; overflow: hidden; }
.panel .pad { padding: 26px; margin: 0; }
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; }
.panel-head h2 { font-size: 1.3rem; margin: 0; }
.panel-head a { font-weight: 700; font-size: .9rem; text-decoration: none; color: var(--coral-dark); }
.admin-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: start; }
.admin-cols .panel { margin-bottom: 0; }
.admin-cols + .panel { margin-top: 26px; }

.mini-term, .mini-order { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; }
.mini-term:last-child, .mini-order:last-of-type { border-bottom: 0; }
.mini-term b, .mini-order b { display: block; }
.mini-term small, .mini-order small { color: var(--ink-soft); }
.mini-term:hover b { text-decoration: underline; }
.date.small { width: 52px; padding: 6px 0; border-radius: 12px; flex-shrink: 0; }
.date.small b { font-size: 1.2rem; }
.avatar.small { width: 34px; height: 34px; font-size: .9rem; background: var(--sun); display: inline-grid; vertical-align: middle; }

.badge { display: inline-block; font-size: .76rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--tint); border: 1.5px solid var(--ink-soft); color: var(--ink-soft); }
.badge.on { background: #D3F4EC; border-color: var(--ink); color: var(--ink); }
.dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--c); border: 2px solid var(--ink); margin-right: 8px; }
.occ { display: flex; align-items: center; gap: 10px; min-width: 130px; }
.occ .progress { flex: 1; margin: 0; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.form-grid.four { grid-template-columns: repeat(4, 1fr); }
.form-grid.five { grid-template-columns: 1.2fr 1fr 1.4fr .8fr .8fr; }
.span2 { grid-column: span 2; }
.form-foot { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
.prefix { display: flex; align-items: stretch; }
.prefix span { display: grid; place-items: center; padding: 0 12px; background: var(--tint); border: 2px solid var(--line); border-right: 0; border-radius: 12px 0 0 12px; color: var(--ink-soft); font-size: .95rem; }
.prefix input { border-radius: 0 12px 12px 0; }
.swatches { display: flex; gap: 10px; padding-top: 4px; }
.swatches input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.swatches span { display: block; width: 38px; height: 38px; border-radius: 50%; background: var(--c); border: 2px solid var(--ink); cursor: pointer; transition: transform .15s; }
.swatches input:checked + span { box-shadow: 0 0 0 3px var(--cream), 0 0 0 5px var(--ink); transform: scale(1.05); }
.swatches input:focus-visible + span { outline: 3px solid var(--violet); outline-offset: 4px; }
.toggle { display: flex; align-items: center; gap: 12px; font-weight: 700; cursor: pointer; margin: 4px 0 20px; }
.toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.toggle span { width: 52px; height: 30px; border-radius: 999px; background: var(--tint); border: 2px solid var(--ink); position: relative; transition: background .2s; flex-shrink: 0; }
.toggle span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--white); border: 2px solid var(--ink); transition: transform .2s; }
.toggle input:checked + span { background: var(--mint); }
.toggle input:checked + span::after { transform: translateX(22px); }
.toggle input:focus-visible + span { outline: 3px solid var(--violet); outline-offset: 2px; }
input[type=file] { background: var(--white); border-style: dashed; cursor: pointer; }

.sub-form { margin-top: 24px; padding: 22px; border: 2px dashed var(--ink); border-radius: 18px; background: var(--cream); }
.sub-form h3 { margin-bottom: 16px; }
.upload-progress { margin-bottom: 16px; }
.upload-progress .progress span { background: var(--coral); }

.admin-lessons { list-style: none; padding: 0; margin: 0; }
.admin-lessons li { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.admin-lessons li:last-child { border-bottom: 0; }
.admin-lessons b, .admin-lessons small { display: block; }
.admin-lessons form { margin: 0; }
.icon-btn { width: 34px; height: 34px; border-radius: 10px; border: 2px solid var(--ink); background: var(--white); font-weight: 800; cursor: pointer; }
.icon-btn:hover:not([disabled]) { background: var(--sun); }
.icon-btn.danger:hover { background: var(--coral); color: #fff; }
.icon-btn[disabled] { opacity: .3; cursor: default; }
.danger-zone { border-style: dashed; box-shadow: none; }
.search { display: flex; gap: 10px; }
.search input { min-width: 260px; }

/* ---------- Vstupenky ---------- */
.tickets { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 440px), 1fr)); gap: 20px; }
.ticket-card {
  display: grid; grid-template-columns: 1fr auto; text-decoration: none; color: inherit;
  background: var(--white); border: 2px solid var(--ink); border-radius: 20px; box-shadow: 0 4px 0 var(--ink);
  overflow: hidden; transition: transform .2s;
}
.ticket-card:hover { transform: translateY(-4px) rotate(-.3deg); }
.ticket-card.is-past { opacity: .65; }
.ticket-main { padding: 20px 22px; border-left: 12px solid var(--c); }
.ticket-main h3 { margin: 10px 0 2px; }
.ticket-main p { margin: 0 0 12px; font-size: .92rem; }
.ticket-date { display: inline-flex; gap: 6px; align-items: baseline; background: var(--ink); color: #fff; border-radius: 10px; padding: 4px 10px; }
.ticket-date b { font: 800 1.2rem/1 var(--font-head); }
.ticket-date span { font-size: .75rem; text-transform: uppercase; color: var(--sun); letter-spacing: .08em; }
.ticket-stub {
  position: relative; display: grid; justify-items: center; align-content: center; gap: 6px;
  padding: 16px 18px; border-left: 3px dashed var(--ink); background: var(--cream);
}
.ticket-stub::before, .ticket-stub::after {
  content: ""; position: absolute; left: -14px; width: 24px; height: 24px; border-radius: 50%;
  background: var(--cream); border: 2px solid var(--ink);
}
.ticket-stub::before { top: -14px; }
.ticket-stub::after { bottom: -14px; }
.ticket-stub small { font-weight: 700; letter-spacing: .06em; font-size: .78rem; }
.ticket-open { font-size: .8rem; font-weight: 700; color: var(--coral-dark); }
.qr svg { display: block; width: 100%; height: auto; }
.ticket-stub .qr { width: 110px; }

.ticket-page { background: radial-gradient(circle at 10% 10%, #FFE3DC 0, transparent 30%), radial-gradient(circle at 90% 90%, #D3F4EC 0, transparent 30%); }
.ticket-big { margin: 16px 0 28px; background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); box-shadow: 0 6px 0 var(--ink); overflow: hidden; }
.ticket-big header { padding: 30px 30px 24px; background: color-mix(in srgb, var(--c) 22%, white); border-bottom: 3px dashed var(--ink); position: relative; }
.ticket-big header::before, .ticket-big header::after { content: ""; position: absolute; bottom: -15px; width: 28px; height: 28px; border-radius: 50%; background: var(--cream); border: 2px solid var(--ink); }
.ticket-big header::before { left: -16px; }
.ticket-big header::after { right: -16px; }
.ticket-big h1 { margin-bottom: 16px; }
.ticket-facts { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.ticket-facts span { display: block; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft); }
.ticket-qr { display: grid; justify-items: center; gap: 12px; padding: 30px; text-align: center; }
.ticket-qr .qr { width: min(280px, 100%); border: 2px solid var(--ink); border-radius: 16px; padding: 10px; background: #fff; }
.ticket-qr .code { font: 800 1.5rem/1 var(--font-head); letter-spacing: .12em; margin: 0; }
.ticket-qr p.small { margin: 4px 0 0; max-width: 30em; }

/* ---------- Kontrola vstupov ---------- */
.staff .h-page { margin-bottom: 8px; }
.staff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: start; margin-top: 24px; }
.staff-grid .panel { margin-bottom: 0; }
.scan-view { position: relative; border-radius: 16px; overflow: hidden; border: 2px solid var(--ink); background: var(--ink); margin-bottom: 16px; aspect-ratio: 4 / 3; }
.scan-view video { width: 100%; height: 100%; object-fit: cover; display: block; }
.scan-frame { position: absolute; inset: 18% 22%; border: 4px solid var(--sun); border-radius: 18px; box-shadow: 0 0 0 999px rgba(31,27,58,.35); }
.scan-msg { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 10px; text-align: center; color: #fff; font-weight: 700; background: rgba(31,27,58,.7); }
.scan-actions { display: grid; gap: 10px; }
.scan-actions .btn { width: 100%; padding: 18px; font-size: 1.1rem; }
.code-form { margin-top: 22px; padding-top: 18px; border-top: 2px dashed var(--line); }
.code-form label { display: block; font-weight: 700; font-size: .9rem; margin-bottom: 8px; color: var(--ink-soft); }
.code-form input { text-transform: uppercase; letter-spacing: .08em; }
.mini-term.is-today { background: #FFEEC2; margin: 0 -12px; padding: 12px; border-radius: 12px; border-bottom-color: transparent; }
.mini-term.is-past { opacity: .55; }
.count { text-align: right; font-size: .95rem; color: var(--ink-soft); }
.count b { font: 800 1.4rem/1 var(--font-head); color: var(--ink); }
.count small { display: block; font-size: .75rem; }
.stats.three { grid-template-columns: repeat(3, 1fr); margin-top: 24px; }
.filter-input { margin-bottom: 10px; }
.person { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.person:last-child { border-bottom: 0; }
.person b, .person small { display: block; }
.person small { color: var(--ink-soft); }
.person form { margin: 0; }
.person.in { background: linear-gradient(90deg, #E9FAF5, transparent 70%); }

.verdict { text-align: center; border: 2px solid var(--ink); border-radius: var(--radius); padding: 30px 20px; margin: 16px 0 22px; box-shadow: 0 6px 0 var(--ink); }
.verdict h1 { font-size: clamp(1.7rem, 5vw, 2.4rem); margin: 12px 0 6px; }
.verdict p { margin: 0; font-weight: 500; }
.verdict-icon { width: 84px; height: 84px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; font: 800 2.8rem/1 var(--font-head); background: var(--white); border: 3px solid var(--ink); }
.verdict-valid { background: var(--mint); }
.verdict-valid .verdict-icon { animation: pop .4s ease; }
.verdict-used { background: var(--sun); }
.verdict-invalid { background: var(--coral); color: #fff; }
.verdict-invalid .verdict-icon { color: var(--coral-dark); }
@keyframes pop { 0% { transform: scale(.4); } 70% { transform: scale(1.12); } }
.verify-details .summary { margin-top: 0; }
.btn-big { padding: 20px; font-size: 1.2rem; }
.role-panel .radios { flex-direction: column; align-items: flex-start; margin-bottom: 18px; }
.role-panel .radios span { border-radius: 14px; font-weight: 400; }

@media print {
  .site-header, .site-footer, .no-print { display: none !important; }
  .ticket-page { background: none; padding: 0; }
  .ticket-big { box-shadow: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .stats { grid-template-columns: 1fr 1fr; }
  .admin-cols { grid-template-columns: 1fr; }
  .form-grid.four, .form-grid.five { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .sales-grid, .learn-grid, .staff-grid { grid-template-columns: 1fr; }
  .sales-hero::after { width: 260px; height: 260px; right: -110px; top: -110px; }
  .lesson-list { position: static; }
  .admin { grid-template-columns: 1fr; }
  .admin-side { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px; padding: 14px 16px; }
  .admin-nav { display: flex; flex-wrap: wrap; gap: 4px; order: 3; width: 100%; }
  .admin-nav a { padding: 8px 12px; font-size: .9rem; }
  .admin-side-foot { margin: 0 0 0 auto; display: flex; gap: 14px; }
}
@media (max-width: 600px) {
  .outcomes, .form-grid, .form-grid.four, .form-grid.five { grid-template-columns: 1fr; }
  .span2 { grid-column: auto; }
  .stats { grid-template-columns: 1fr; }
  .stats.three { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .stats.three .stat { padding: 14px 12px; }
  .stats.three .stat b { font-size: 1.5rem; }
  .ticket-card { grid-template-columns: 1fr; }
  .ticket-stub { border-left: 0; border-top: 3px dashed var(--ink); grid-template-columns: auto 1fr; justify-items: start; column-gap: 16px; }
  .ticket-stub .qr { grid-row: span 2; width: 90px; }
  .ticket-stub::before, .ticket-stub::after { display: none; }
  .ticket-facts { grid-template-columns: 1fr; }
  .auth-card { padding: 34px 20px 24px; }
  .lesson { padding: 18px; }
  .search { width: 100%; }
  .search input { min-width: 0; flex: 1; }
}

/* ---------- Check-in po dňoch, plagát ---------- */
.day-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0; }
.day-checks { list-style: none; padding: 0; margin: 4px 0 8px; width: 100%; display: grid; gap: 8px; }
.day-checks li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 2px solid var(--line); border-radius: 12px; font-size: .92rem; }
.day-checks li.done { border-color: var(--ink); background: #D3F4EC; }
.day-checks b { white-space: nowrap; }
.legend { margin: 14px 0 0; }
.verdict-otherday { background: var(--violet); color: #fff; }
.verdict-otherday .verdict-icon { font-size: 2.2rem; }
.h-sec.flat { margin: 0 0 6px; }
.panel.center .btn { margin-top: 8px; }

.poster-body { background: var(--cream); }
.poster { min-height: 100vh; display: grid; place-content: center; gap: 20px; padding: 32px 16px; }
.poster-card {
  width: min(620px, 100%); text-align: center; background: var(--white);
  border: 3px solid var(--ink); border-radius: 32px; padding: 40px 36px; box-shadow: 0 8px 0 var(--ink);
  border-top: 22px solid var(--c);
}
.poster-card .logo { justify-content: center; margin-bottom: 22px; }
.poster-card .logo svg { color: var(--coral); }
.poster-card h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); }
.poster-card h2 { font-size: 1.4rem; margin: 22px 0 4px; }
.poster-qr { width: min(360px, 100%); margin: 20px auto 0; padding: 14px; border: 3px solid var(--ink); border-radius: 22px; }
.poster-qr svg { width: 100%; height: auto; display: block; }
.poster-steps { text-align: left; max-width: 420px; margin: 20px auto 0; padding-left: 22px; }
.poster-steps li { margin-bottom: 6px; }
.poster-url { font-size: .75rem; color: var(--ink-soft); word-break: break-all; margin: 18px 0 0; }
@media print {
  .poster { min-height: 0; padding: 0; }
  .poster-card { box-shadow: none; }
}

/* ---------- Právne stránky, správy, pätička ---------- */
.legal { max-width: 820px; }
.legal h2 { font-size: 1.35rem; margin: 34px 0 10px; }
.legal p, .legal li { color: var(--ink-soft); }
.legal .table td { font-size: .9rem; vertical-align: top; }
.footer-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 26px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); font-size: .82rem; color: #A9A4C6; }
.footer-legal a { color: inherit; }
.forgot { text-align: right; margin: -8px 0 18px; font-size: .9rem; }
.consent a { color: inherit; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.msg.is-done { opacity: .6; }
.msg h2 { font-size: 1.15rem; }
.msg-text { white-space: pre-line; background: var(--cream); border-radius: 12px; padding: 14px; }

/* ---------- Pokladňa ---------- */
.checkout { display: grid; grid-template-columns: 1fr 380px; gap: 26px; align-items: start; margin-top: 20px; }
.checkout-side { position: sticky; top: 92px; }
.summary-box { border-top: 14px solid var(--c); }
.summary-box h2 { font-size: 1.4rem; margin-bottom: 4px; }
.summary .total { font-size: 1.15rem; }
.summary .total b { font: 800 1.6rem/1 var(--font-head); }
.qty { display: flex; align-items: center; gap: 8px; max-width: 180px; }
.qty input { text-align: center; font-weight: 700; font-size: 1.1rem; }
.qty .icon-btn { width: 44px; height: 44px; flex-shrink: 0; font-size: 1.2rem; }
.holders { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.holders p { grid-column: 1 / -1; }
.company-only { display: none; }
.is-company .company-only { display: block; }
.is-company .person-only { display: none; }
.coupon { margin: 18px 0; }
.coupon label { display: block; font-weight: 700; font-size: .9rem; margin-bottom: 6px; }
.ok-text { color: #1E8C73; font-weight: 700; }
.term-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.term-actions form { margin: 0; }
@media (max-width: 860px) {
  .checkout { grid-template-columns: 1fr; }
  .checkout-side { position: static; }
}
@media (max-width: 600px) {
  .holders { grid-template-columns: 1fr; }
  .date-row .term-actions { grid-column: 1 / -1; justify-content: flex-start; }
}
.ticket-tools { display: grid; gap: 8px; }
.holder-form label { display: block; margin-bottom: 8px; }
.holder-form p { margin: 10px 0; }
.self-list { text-align: left; margin: 14px 0; }

/* ---------- Faktúra ---------- */
.invoice-body { background: var(--tint); }
.invoice-wrap { width: min(860px, 100% - 32px); margin: 0 auto; padding: 28px 0 60px; }
.invoice-actions { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.invoice { background: #fff; border: 2px solid var(--ink); border-radius: 18px; padding: 40px; font-size: .95rem; }
.inv-head { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; border-bottom: 3px solid var(--ink); padding-bottom: 20px; }
.inv-head .logo svg { color: var(--coral); }
.inv-title { text-align: right; }
.inv-title h1 { font-size: 1.5rem; margin: 0 0 4px; }
.inv-title p { margin: 0; }
.inv-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 24px 0; }
.inv-parties h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-soft); margin-bottom: 6px; }
.inv-dates { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; background: var(--cream); border-radius: 12px; padding: 14px 16px; margin: 0 0 24px; }
.inv-dates dt { font-size: .75rem; color: var(--ink-soft); }
.inv-dates dd { margin: 2px 0 0; font-weight: 700; }
.inv-items { border: 2px solid var(--ink); border-radius: 12px; border-collapse: separate; overflow: hidden; }
.inv-total { margin: 18px 0 24px auto; max-width: 340px; }
.inv-total div { display: flex; justify-content: space-between; padding: 6px 0; }
.inv-total .grand { border-top: 2px solid var(--ink); margin-top: 6px; padding-top: 10px; font-size: 1.15rem; }
.inv-total .grand b { font: 800 1.5rem/1 var(--font-head); }
.ticket-main .holder { font-weight: 700; margin: 0 0 4px; font-size: .95rem; }
@media (max-width: 600px) {
  .invoice { padding: 20px; }
  .inv-parties, .inv-dates { grid-template-columns: 1fr 1fr; }
  .inv-title { text-align: left; }
}
@media print {
  .invoice-body { background: #fff; }
  .invoice { border: 0; padding: 0; }
  .invoice-wrap { width: 100%; padding: 0; }
}
.waitlist-head { margin-top: 28px; }
.coupon .search input { min-width: 0; flex: 1; }

/* ---------- Úvodné obrázky ---------- */
.card.has-cover { padding-top: 0; overflow: hidden; }
.card.has-cover::before { display: none; }
.card-cover { width: calc(100% + 52px); max-width: none; margin: 0 -26px 18px; aspect-ratio: 16 / 9; object-fit: cover; border-bottom: 2px solid var(--ink); border-top: 10px solid var(--c); }
.sales-cover { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border: 2px solid var(--ink); border-radius: var(--radius); box-shadow: 0 6px 0 var(--ink); margin-bottom: 40px; }
.cover-preview { width: 260px; aspect-ratio: 16 / 9; object-fit: cover; border: 2px solid var(--ink); border-radius: 12px; margin-bottom: 8px; }

/* ---------- Certifikáty ---------- */
.certs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; }
.cert-card { display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; background: var(--white); border: 2px solid var(--ink); border-radius: 18px; padding: 14px 16px; box-shadow: 0 3px 0 var(--ink); }
.cert-card b, .cert-card small { display: block; }
.cert-card small { color: var(--ink-soft); }
.cert-icon { font-size: 1.8rem; }
.cert-body { background: var(--tint); }
.cert-wrap { width: min(1100px, 100% - 32px); margin: 0 auto; padding: 28px 0 60px; }
.certificate { position: relative; overflow: hidden; aspect-ratio: 297 / 210; background: var(--cream); border: 3px solid var(--ink); border-radius: 22px; box-shadow: 0 8px 0 var(--ink); }
.cert-blob { position: absolute; border: 3px solid var(--ink); border-radius: 46% 54% 58% 42% / 48% 42% 58% 52%; }
.cert-blob.b1 { width: 34%; aspect-ratio: 1; background: var(--coral); top: -14%; left: -8%; }
.cert-blob.b2 { width: 24%; aspect-ratio: 1; background: var(--sun); bottom: -10%; right: -5%; }
.cert-blob.b3 { width: 10%; aspect-ratio: 1; background: var(--mint); top: 10%; right: 9%; }
.cert-inner { position: relative; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 4% 12%; }
.cert-inner .logo { margin-bottom: 2%; }
.cert-inner .logo svg { color: var(--coral); }
.cert-kicker { font: 800 clamp(.8rem, 1.6vw, 1.1rem)/1 var(--font-body); text-transform: uppercase; letter-spacing: .25em; color: var(--coral-dark); margin: 0 0 3%; }
.cert-small { margin: 0; color: var(--ink-soft); font-size: clamp(.8rem, 1.5vw, 1.05rem); }
.cert-name { font-size: clamp(1.8rem, 5.5vw, 4rem); margin: 1% 0 2%; position: relative; }
.cert-name::after { content: ""; position: absolute; left: 10%; right: 10%; bottom: -.05em; height: .18em; background: var(--sun); z-index: -1; border-radius: 6px; }
.cert-course { font-size: clamp(1.2rem, 3.2vw, 2.4rem); margin: 1% 0 1%; }
.cert-detail { color: var(--ink-soft); font-size: clamp(.75rem, 1.4vw, 1rem); margin: 0; }
.cert-foot { width: 100%; display: flex; justify-content: space-between; align-items: flex-end; margin-top: 6%; }
.cert-foot small { display: block; color: var(--ink-soft); font-size: clamp(.6rem, 1.1vw, .85rem); }
.cert-line { display: block; width: clamp(120px, 22vw, 240px); border-top: 2px solid var(--ink); margin-bottom: 6px; }
.cert-meta { text-align: right; }
@media print {
  @page { size: A4 landscape; margin: 0; }
  .cert-body { background: #fff; }
  .cert-wrap { width: 100%; padding: 0; }
  .certificate { width: 297mm; height: 210mm; aspect-ratio: auto; border-radius: 0; box-shadow: none; border: 0; }
  .cert-name { font-size: 46pt; } .cert-course { font-size: 26pt; }
}
.cancel-info p { margin: 0 0 10px; }
.danger-link { color: var(--coral-dark); font-weight: 700; }

/* ---------- Obedy ---------- */
.holders { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.holders .holder { border: 2px dashed var(--line); border-radius: 14px; padding: 14px 14px 0; background: var(--cream); }
.holders .holder .field { margin-bottom: 14px; }
.menu-box { background: #FFEEC2; border: 2px solid var(--ink); border-radius: 14px; padding: 14px 16px; margin: 6px 0 16px; }
.menu-box h3 { font-size: 1.05rem; margin-bottom: 8px; }
.menu-list { list-style: none; padding: 0; margin: 0 0 8px; }
.menu-list li { display: flex; gap: 6px; flex-wrap: wrap; padding: 6px 0; border-bottom: 1px dashed rgba(31,27,58,.2); }
.menu-list li:last-child { border-bottom: 0; }
.menu-price { margin-left: auto; font-weight: 800; }
.menu-box p { margin: 0; }
.meal-tag { display: inline-block; font-size: .8rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: #FFEEC2; border: 1.5px solid var(--ink); white-space: nowrap; }
.meals-summary { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.menu-admin { display: grid; gap: 10px; }
.menu-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.menu-row form { margin: 0; }
.menu-edit { display: grid; grid-template-columns: 1.2fr 1.6fr 120px auto; gap: 8px; flex: 1; min-width: min(100%, 520px); align-items: center; }
.price-input input { border-radius: 12px 0 0 12px; text-align: right; }
.price-input span { border-radius: 0 12px 12px 0; border-left: 0; border-right: 2px solid var(--line); }
.menu-grid { grid-template-columns: 1.2fr 1.6fr .6fr; }
@media (max-width: 760px) { .menu-edit, .menu-grid { grid-template-columns: 1fr; } }

/* ---------- Hodnotenia ---------- */
.survey-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }
.survey-stats div { background: var(--cream); border-radius: 12px; padding: 10px; text-align: center; }
.survey-stats b { display: block; font: 800 1.5rem/1.1 var(--font-head); }
.survey-stats small { color: var(--ink-soft); font-size: .78rem; }
.review { border-top: 1px solid var(--line); padding: 12px 0; }
.review-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.review p { margin: 6px 0 0; font-size: .95rem; }
.stars { color: var(--sun); letter-spacing: 1px; -webkit-text-stroke: .5px var(--ink); }
.stars span { color: var(--line); }
.small-h { font-size: 1rem; margin: 10px 0 6px; }
#dotaznik form { margin-top: 10px; }

/* ---------- Dotazník ---------- */
.survey fieldset { border: 0; padding: 0; margin: 0 0 18px; }
.survey legend { font-weight: 700; font-size: .95rem; margin-bottom: 8px; }
.star-input { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.star-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.star-input label { font-size: 2.4rem; line-height: 1; cursor: pointer; color: var(--line); -webkit-text-stroke: 1.5px var(--ink); transition: transform .1s, color .1s; }
.star-input label:hover, .star-input label:hover ~ label, .star-input input:checked ~ label { color: var(--sun); }
.star-input label:hover { transform: scale(1.12); }
.star-input input:focus-visible + label { outline: 3px solid var(--violet); outline-offset: 2px; border-radius: 6px; }
.nps-input { display: grid; grid-template-columns: repeat(11, 1fr); gap: 4px; }
.nps-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nps-input span { display: grid; place-items: center; height: 40px; border: 2px solid var(--ink); border-radius: 10px; font-weight: 700; cursor: pointer; background: var(--white); }
.nps-input input:checked + span { background: var(--mint); }
.nps-input input:focus-visible + span { outline: 3px solid var(--violet); outline-offset: 2px; }
@media (max-width: 420px) { .nps-input { grid-template-columns: repeat(6, 1fr); } }
.done-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; background: #D3F4EC; border: 2px solid var(--ink); border-radius: 18px; padding: 14px 18px; margin-bottom: 22px; box-shadow: 0 3px 0 var(--ink); }
.done-banner b, .done-banner small { display: block; }
.done-banner small { color: var(--ink-soft); }
.done-icon { font-size: 1.8rem; }
.cert-card .btn { flex-shrink: 0; }
.holder-locked { font-weight: 700; margin: 0 0 6px; }
.holder-admin { margin-bottom: 4px; }
.holder-admin input { min-width: 0; flex: 1; padding: 8px 12px; }

/* ---------- Organizačné pokyny ---------- */
.instructions h2 { font-size: 1.3rem; }
.instructions .prose ul, .term-note ul { padding-left: 22px; color: var(--ink-soft); }
.instructions .prose li { margin-bottom: 4px; }
.term-note { background: #FFEEC2; border: 2px solid var(--ink); border-radius: 14px; padding: 12px 16px; margin-top: 10px; }
.term-note p:last-child, .term-note ul:last-child { margin-bottom: 0; }
.instr-status { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0 0; }
.instr-status form { margin: 0; }
.format-help { font-size: .85rem; color: var(--ink-soft); background: var(--cream); border-radius: 10px; padding: 8px 12px; margin: -8px 0 16px; }
.preview-frame { width: 100%; height: 70vh; border: 2px solid var(--ink); border-radius: 14px; background: #fff; }
.inline-field { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.inline-field label { margin: 0; }
.inline-field input { width: 90px; }
.course-instr { background: var(--cream); border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; }
.course-instr summary { cursor: pointer; font-weight: 700; }

/* ---------- Ikony (icons.js) ---------- */
.ico { display: inline-block; width: 1.2em; height: 1.2em; vertical-align: -.22em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ico .acc { fill: var(--icon-acc, var(--sun)); }
.ico .w { fill: #fff; }
.ico .dots { stroke-width: 2.8; }
.btn .ico { width: 1.15em; height: 1.15em; margin: -.1em 0; }
.btn-sun .ico, .tag .ico, .badge .ico { --icon-acc: #fff; }
.flash { display: flex; align-items: center; gap: 10px; }
.flash .ico { width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: var(--mint); border: 2px solid var(--ink); stroke-width: 3; }
.flash-err .ico { background: var(--coral); }

/* väčšie ikony v kruhoch a bublinách */
.auth-bubble .ico { width: 32px; height: 32px; --icon-acc: #fff; }
.empty-icon .ico { width: 64px; height: 64px; stroke-width: 1.6; }
.verdict-icon .ico { width: 46px; height: 46px; stroke-width: 2.4; --icon-acc: var(--sun); }
.verdict-valid .verdict-icon .ico-check, .verdict-invalid .verdict-icon .ico-close { stroke-width: 3.2; }
.verdict-invalid .verdict-icon { color: var(--coral-dark); }
.done-icon .ico, .cert-icon .ico { width: 36px; height: 36px; --icon-acc: var(--sun); }
.admin-nav a > span { display: grid; place-items: center; }
.admin-nav .ico { width: 22px; height: 22px; --icon-acc: rgba(255, 255, 255, .18); }
.admin-nav a.active .ico { --icon-acc: #fff; }
.why-list b { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: rgba(255,255,255,.08); flex-shrink: 0; }
.why-list b .ico { width: 30px; height: 30px; color: #fff; }
.why-list li:nth-child(1) b .ico { --icon-acc: var(--coral); }
.why-list li:nth-child(2) b .ico { --icon-acc: var(--sun); }
.why-list li:nth-child(3) b .ico { --icon-acc: var(--mint); }
.why-list li:nth-child(4) b .ico { --icon-acc: var(--violet); }
.contact-list span .ico { width: 24px; height: 24px; --icon-acc: var(--sun); }
.num .ico { width: 16px; height: 16px; stroke-width: 3; }
.kind .ico { width: 14px; height: 14px; vertical-align: -2px; }
.meal-tag .ico { width: 15px; height: 15px; vertical-align: -3px; --icon-acc: #fff; }
.sales-facts .ico { --icon-acc: var(--mint); }
.bubble .ico { width: 1.1em; height: 1.1em; }
.icon-btn .ico { width: 18px; height: 18px; }
.back .ico { width: 1em; height: 1em; vertical-align: -.15em; }

/* hviezdičky v dotazníku a hodnoteniach */
.star-input label { color: var(--ink); -webkit-text-stroke: 0; }
.star-input label .ico { width: 40px; height: 40px; stroke-width: 1.6; --icon-acc: var(--line); transition: transform .1s; }
.star-input label:hover .ico, .star-input label:hover ~ label .ico, .star-input input:checked ~ label .ico { --icon-acc: var(--sun); }
.star-input label:hover .ico { transform: scale(1.12); }
.stars { -webkit-text-stroke: 0; color: var(--ink); white-space: nowrap; }
.stars .ico { width: 17px; height: 17px; stroke-width: 1.6; }
.stars .ico.off { --icon-acc: var(--line); }
h1 .ico, h2 .ico, .h-page .ico { width: .85em; height: .85em; vertical-align: -.06em; stroke-width: 1.8; }
.card-meta span, .panel-head a { white-space: nowrap; }
.certs { grid-template-columns: repeat(auto-fill, minmax(min(100%, 480px), 1fr)); }
.cert-card { flex-wrap: wrap; }
.cert-card .grow { min-width: 180px; }

/* ---------- Lektor ---------- */
.lecturer { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; }
.lecturer-photo { position: relative; max-width: 440px; width: 100%; justify-self: center; padding: 24px; }
.lp-blob { position: absolute; inset: 0 8% 6% 0; background: var(--mint); border: 2px solid var(--ink); border-radius: 46% 54% 58% 42% / 48% 42% 58% 52%; animation: morph 12s ease-in-out infinite; }
.lp-frame { position: relative; aspect-ratio: 4 / 5; border: 3px solid var(--ink); border-radius: 28px; overflow: hidden; background: var(--sun); box-shadow: 8px 8px 0 var(--ink); transform: rotate(-2deg); }
.lp-frame img { width: 100%; height: 100%; object-fit: cover; }
.lp-initials { display: grid; place-items: center; height: 100%; font: 800 6rem/1 var(--font-head); color: var(--ink); }
.lp-quote { left: -6%; bottom: 10%; max-width: 75%; white-space: normal; font-size: .95rem; background: var(--white); }
.lp-badge { position: absolute; top: 6%; right: 2%; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--coral); border: 2px solid var(--ink); box-shadow: 0 4px 0 var(--ink); transform: rotate(10deg); }
.lp-badge .ico { width: 32px; height: 32px; color: var(--ink); --icon-acc: #fff; }
.lecturer-text h2 { margin-bottom: 4px; }
.lecturer-role { font: 700 1.15rem/1.4 var(--font-head); color: var(--coral-dark); margin-bottom: 18px; }
.lecturer-text .prose p { font-size: 1.05rem; }
.lecturer-highlights { margin: 18px 0 26px; }
.lecturer-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lecturer-stats div { background: var(--white); border: 2px solid var(--ink); border-top: 10px solid var(--c); border-radius: 16px; padding: 14px; box-shadow: 0 3px 0 var(--ink); }
.lecturer-stats b { display: block; font: 800 1.6rem/1.1 var(--font-head); }
.lecturer-stats span { color: var(--ink-soft); font-size: .9rem; }

.lecturer-card-wrap { padding: 0 0 72px; }
.lecturer-card { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; text-decoration: none; color: inherit; background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: 18px 22px; box-shadow: 0 4px 0 var(--ink); transition: transform .2s; }
.lecturer-card:hover { transform: translateY(-3px); }
.lc-photo { width: 76px; height: 76px; border-radius: 50%; overflow: hidden; border: 2px solid var(--ink); background: var(--sun); display: grid; place-items: center; flex-shrink: 0; }
.lc-photo img { width: 100%; height: 100%; object-fit: cover; }
.lc-photo .ico { width: 40px; height: 40px; --icon-acc: #fff; }
.lecturer-card small { display: block; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; font-size: .75rem; color: var(--coral-dark); }
.lecturer-card b { display: block; font: 800 1.3rem/1.2 var(--font-head); }
.lc-more { font-weight: 700; color: var(--coral-dark); white-space: nowrap; }

.lpf { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.lpf-preview { width: 110px; height: 136px; border: 2px solid var(--ink); border-radius: 16px; overflow: hidden; background: var(--sun); display: grid; place-items: center; }
.lpf-preview img { width: 100%; height: 100%; object-fit: cover; }
.lpf-preview .ico { width: 48px; height: 48px; --icon-acc: #fff; }

@media (max-width: 860px) {
  .lecturer { grid-template-columns: 1fr; gap: 40px; }
  .lecturer-photo { max-width: 340px; }
}
@media (max-width: 600px) {
  .lecturer-stats { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .lecturer-stats div { padding: 10px 8px; }
  .lecturer-stats b { font-size: 1.2rem; }
  .lp-quote { font-size: .82rem; }
}

/* ---------- Generátor dizajnu ---------- */
.dropzone { position: relative; display: grid; justify-items: center; gap: 4px; text-align: center; padding: 28px 16px; margin-bottom: 20px; border: 2px dashed var(--ink); border-radius: 18px; background: var(--cream); cursor: pointer; transition: background .15s; }
.dropzone:hover { background: #FFEEC2; }
.dropzone .ico { width: 40px; height: 40px; transform: rotate(180deg); }
.dropzone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dz-name { font-weight: 700; color: var(--coral-dark); }
.mode-radios { flex-direction: column; align-items: stretch; }
.mode-radios span { border-radius: 14px; font-weight: 400; display: block; }
.designer .small-h .ico { width: 20px; height: 20px; }
.designer .ticks li { font-size: .92rem; }
.symbols-panel { margin-top: 26px; }
.symbol-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.symbol-card { display: grid; grid-template-columns: auto auto auto; justify-content: center; align-items: center; gap: 6px 8px; padding: 14px 10px 10px; background: var(--cream); border: 2px solid var(--ink); border-radius: 16px; cursor: pointer; font: inherit; color: var(--ink); transition: transform .15s, background .15s; }
.symbol-card:hover { transform: translateY(-2px); background: #FFEEC2; }
.sym-char { font-size: 1.9rem; line-height: 1; font-family: 'Segoe UI Symbol', 'Apple Symbols', 'DejaVu Sans', sans-serif; }
.sym-arrow .ico { width: 16px; height: 16px; color: var(--ink-soft); }
.sym-icon .ico { width: 32px; height: 32px; }
.sym-label { grid-column: 1 / -1; text-align: center; font-weight: 700; font-size: .88rem; }
.sym-copy { grid-column: 1 / -1; text-align: center; font-size: .75rem; color: var(--coral-dark); font-weight: 700; }

/* Admin: súbory lekcie a úlohy klientov */
.admin-files { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.admin-files li { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 12px; border: 2px solid var(--line); border-radius: 12px; background: var(--white); }
.admin-files a { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 600; color: var(--ink); text-decoration: none; }
.progress.mini { height: 8px; margin: 4px 0 0; max-width: 140px; }
.student-tasks { display: grid; gap: 8px; }
.student-tasks details { border: 2px solid var(--ink); border-radius: 14px; background: var(--white); padding: 10px 14px; }
.student-tasks summary { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; cursor: pointer; list-style: none; }
.student-tasks summary::-webkit-details-marker { display: none; }
.student-tasks details[open] summary { margin-bottom: 8px; padding-bottom: 8px; border-bottom: 2px dashed var(--line); }
.check-list { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 4px; }
.check-list li { color: var(--ink-soft); }
.check-list li .ico { width: 18px; height: 18px; stroke-width: 3; color: var(--coral); }
.check-list li.is-done { color: var(--ink); }
.check-list li.is-done .ico { color: var(--mint); }

/* ---------- Tímy a darčekové kódy ---------- */
.h-sec-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 48px 0 20px; }
.h-sec-row .h-sec { margin: 0; }
.buy-extra { display: flex; gap: 8px; margin: -6px 0 6px; }
.buy-extra a { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 10px; border: 2px solid var(--ink); border-radius: 999px; background: var(--white); color: var(--ink); font-weight: 700; font-size: .88rem; text-decoration: none; }
.buy-extra a:hover { background: var(--tint); }
.buy-extra .ico { --icon-acc: var(--sun); }

/* pokladňa: pre seba / pre tím / darček */
.purpose-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.purpose { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 16px; border: 2px solid var(--ink); border-radius: 16px; background: var(--white); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.purpose input { position: absolute; opacity: 0; pointer-events: none; }
.purpose small { color: var(--ink-soft); line-height: 1.4; }
.purpose-icon .ico { width: 30px; height: 30px; --icon-acc: var(--sun); }
.purpose:hover { transform: translateY(-2px); }
.purpose:has(input:checked) { background: color-mix(in srgb, var(--c, var(--coral)) 18%, white); box-shadow: 0 4px 0 var(--ink); }
.purpose:has(input:checked) .purpose-icon .ico { --icon-acc: var(--coral); }
.purpose:has(input:focus-visible) { outline: 3px solid var(--sun); outline-offset: 2px; }
.purpose.is-disabled { opacity: .5; cursor: not-allowed; transform: none; }
.checkout:not(.is-codes) .codes-only, .checkout.is-codes .self-only, .checkout:not(.is-gift) .gift-only, .checkout.is-gift .team-only { display: none; }

/* aktivácia */
.activate-course { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 8px 14px; border: 2px solid var(--ink); border-radius: 999px; background: color-mix(in srgb, var(--c) 22%, white); font-weight: 700; }
.code-input { font: 700 1.25rem var(--font-head); letter-spacing: .12em; text-transform: uppercase; text-align: center; }
.privacy-note { display: flex; gap: 8px; margin-top: 14px; padding: 10px 12px; background: var(--tint); border-radius: 12px; }

/* prehľad tímu */
.team-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 22px; margin-bottom: 22px; align-items: start; }
.team-grid .panel { margin: 0; }
.panel-head h2 .ico { width: 26px; height: 26px; --icon-acc: var(--sun); }
.leaders { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.leaders li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 2px solid var(--line); border-radius: 14px; }
.leaders b, .leaders small { display: block; }
.leaders .place { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border: 2px solid var(--ink); border-radius: 50%; background: var(--tint); font: 800 .95rem var(--font-head); }
.leaders .top { border-color: var(--ink); box-shadow: 0 3px 0 var(--ink); }
.leaders .top-1 .place { background: var(--sun); }
.leaders .top-2 .place { background: #E7E3FD; }
.leaders .top-3 .place { background: #FFE3DC; }
.mini-ring { --p: 0; display: grid; place-items: center; flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; font: 800 .78rem var(--font-head);
  background: radial-gradient(closest-side, var(--white) 72%, transparent 73%), conic-gradient(var(--c, var(--coral)) calc(var(--p) * 1%), var(--tint) 0); border: 2px solid var(--ink); }
.funnel { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.funnel li { display: flex; align-items: center; gap: 10px; }
.funnel .num { width: 28px; height: 28px; font-size: .8rem; }
.funnel .grow { min-width: 0; }
.funnel-title { display: block; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.funnel .progress.mini { max-width: none; }
.team-table td { vertical-align: top; }
.team-table .progress.mini { width: 120px; margin: 4px 0; }
.team-table tr.is-idle td:first-child { box-shadow: inset 4px 0 0 var(--coral); }
.team-table td.nowrap { white-space: nowrap; text-align: right; }
.team-table td.nowrap form { display: inline-block; margin: 0; }
.warn-text { color: var(--coral-dark); font-weight: 700; }
.member-detail { display: inline-block; text-align: left; }
.member-detail summary { list-style: none; cursor: pointer; }
.member-detail summary::-webkit-details-marker { display: none; }
.member-detail[open] { display: block; margin: 6px 0; padding: 10px; border: 2px solid var(--line); border-radius: 12px; background: var(--cream); white-space: normal; min-width: 260px; }
.lesson-detail { list-style: none; margin: 8px 0; padding: 0; display: grid; gap: 4px; font-size: .88rem; }
.lesson-detail li { display: flex; align-items: center; gap: 6px; color: var(--ink-soft); }
.lesson-detail li.is-done { color: var(--ink); }
.lesson-detail .ico { width: 16px; height: 16px; stroke-width: 3; color: var(--mint); }
.lesson-detail small .ico { color: inherit; stroke-width: 2; }
.lesson-detail .dot { width: 16px; height: 16px; border: 2px solid var(--line); border-radius: 50%; flex-shrink: 0; }
.lesson-detail .grow { flex: 1; }

/* kódy */
.code-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.code-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border: 2px solid var(--ink); border-radius: 14px; background: var(--white); }
.code-row.is-used { background: var(--cream); border-color: var(--line); }
.code-main { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.code { font: 800 1.05rem var(--font-head); letter-spacing: .1em; padding: 4px 10px; border: 2px dashed var(--ink); border-radius: 10px; background: var(--cream); }
.is-used .code { text-decoration: line-through; color: var(--ink-soft); border-color: var(--line); }
.code-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.code-actions form { margin: 0; }
.send-code summary { list-style: none; cursor: pointer; }
.send-code summary::-webkit-details-marker { display: none; }
.send-code[open] { flex-basis: 100%; order: 10; }
.send-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; margin-top: 10px; padding: 14px; border: 2px solid var(--line); border-radius: 12px; background: var(--cream); }
.send-form .span2, .send-form button { grid-column: 1 / -1; justify-self: start; }
.btn.is-copied { background: var(--mint); }
@media (max-width: 860px) {
  .purpose-options, .team-grid, .send-form { grid-template-columns: 1fr; }
}

/* darčeková karta na tlač (A5 na hárku A4) */
.card-wrap { width: min(1000px, 100% - 32px); margin: 0 auto; padding: 28px 0 60px; }
.gift-sheet { display: grid; place-items: center; }
.gift-card { position: relative; overflow: hidden; width: 100%; max-width: 820px; aspect-ratio: 210 / 148; background: var(--cream); border: 3px solid var(--ink); border-radius: 22px; box-shadow: 0 8px 0 var(--ink); }
.gift-inner { position: relative; height: 100%; display: grid; grid-template-columns: 1.25fr 1fr; gap: 4%; padding: 6% 6% 5%; }
.gift-left { display: flex; flex-direction: column; justify-content: center; }
.gift-left .logo { margin-bottom: 6%; }
.gift-left .logo svg { color: var(--coral); }
.gift-for { margin: 0 0 2%; font: 700 clamp(1rem, 2.4vw, 1.5rem) var(--font-head); color: var(--ink-soft); min-height: 1.3em; }
.gift-course { margin: 0 0 4%; font-size: clamp(1.5rem, 4.2vw, 2.6rem); line-height: 1.1; }
.gift-msg { margin: 0; font-size: clamp(.85rem, 1.6vw, 1.05rem); color: var(--ink-soft); min-height: 1.4em; white-space: pre-wrap; }
.gift-right { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; background: var(--white); border: 2px solid var(--ink); border-radius: 18px; padding: 6%; box-shadow: 0 4px 0 var(--ink); align-self: center; }
.gift-qr { width: 46%; aspect-ratio: 1; }
.gift-qr svg { width: 100%; height: 100%; }
.gift-label { margin: 6% 0 0; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .15em; color: var(--ink-soft); }
.gift-code { margin: 1% 0 5%; font: 800 clamp(1rem, 2.6vw, 1.6rem) var(--font-head); letter-spacing: .1em; }
.gift-steps { margin: 0; padding-left: 1.2em; text-align: left; font-size: clamp(.65rem, 1.2vw, .82rem); color: var(--ink-soft); }
[contenteditable][data-placeholder]:empty::before { content: attr(data-placeholder); color: #B8B2CC; }
[contenteditable] { outline: 2px dashed transparent; border-radius: 8px; transition: outline-color .15s; }
[contenteditable]:hover, [contenteditable]:focus { outline-color: var(--line); }
@media print {
  .card-wrap { width: 100%; padding: 0; }
  .gift-sheet { height: 100vh; }
  .gift-card { width: 210mm; max-width: none; box-shadow: none; outline: 1px dashed #999; outline-offset: 4mm; }
  [contenteditable]:empty { display: none; }
  [contenteditable] { outline: 0 !important; }
}
.funnel .progress.mini { display: block; }
.gift-card .cert-blob.b1 { top: auto; bottom: -22%; left: -9%; width: 24%; }
.gift-card .cert-blob.b2 { width: 20%; bottom: auto; top: 38%; right: -8%; }
.gift-card .cert-blob.b3 { top: 7%; right: 5%; left: auto; width: 6%; }
.staff-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.staff-list li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 2px solid var(--line); border-radius: 14px; background: var(--white); }
.staff-list b, .staff-list small { display: block; }
.staff-list form { margin: 0; }

/* Certifikát: podpis, QR na overenie; stránka overenia */
.cert-sign-box { position: relative; text-align: left; }
.cert-sign { display: block; width: clamp(110px, 20vw, 220px); max-height: clamp(40px, 7vw, 80px); object-fit: contain; object-position: left bottom; margin: 0 0 -6px 4px; mix-blend-mode: multiply; }
.cert-verify { display: flex; align-items: flex-end; gap: 12px; }
.cert-qr { width: clamp(48px, 8vw, 86px); aspect-ratio: 1; background: var(--white); padding: 4px; border: 2px solid var(--ink); border-radius: 8px; }
.cert-qr svg { width: 100%; height: 100%; }
.verify-result { display: flex; align-items: center; gap: 10px; margin: 6px 0 16px; padding: 12px 14px; border: 2px solid var(--ink); border-radius: 14px; }
.verify-result .ico { width: 24px; height: 24px; stroke-width: 3; }
.verify-result.ok { background: #D3F4EC; }
.verify-result.bad { background: #FFE3DC; }
.verify-list { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; margin: 0 0 22px; }
.verify-list dt { color: var(--ink-soft); font-size: .9rem; }
.verify-list dd { margin: 0; font-weight: 600; }
.verify-form { margin-top: 10px; padding-top: 18px; border-top: 2px dashed var(--line); }
@media print { .cert-qr { border-width: 1px; } }
.sign-section { margin: 26px 0 20px; padding-top: 20px; border-top: 2px dashed var(--line); }
.sign-section h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.sign-section h3 .ico { --icon-acc: var(--sun); }
.sign-current { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 10px 0 14px; }
.sign-current img { max-height: 70px; max-width: 260px; padding: 6px 10px; background: var(--white); border: 2px solid var(--line); border-radius: 10px; }
.sign-pad { position: relative; max-width: 600px; aspect-ratio: 3 / 1; background: var(--white); border: 2px solid var(--ink); border-radius: 14px; box-shadow: 0 3px 0 var(--ink); overflow: hidden; }
.sign-pad canvas { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: none; cursor: crosshair; z-index: 1; }
.sign-hint { position: absolute; left: 16px; top: 12px; color: #B8B2CC; font-size: .9rem; }
.sign-line { position: absolute; left: 8%; right: 8%; bottom: 26%; border-top: 2px dashed var(--line); }
.sign-pad.is-drawn .sign-hint { display: none; }
.sign-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.file-btn { cursor: pointer; }

/* Vykázanie z kurzu */
.expel-box { margin-top: 16px; padding: 12px 14px; border: 2px dashed var(--coral); border-radius: 14px; background: var(--white); }
.expel-box summary { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 700; color: var(--coral-dark); list-style: none; }
.expel-box summary::-webkit-details-marker { display: none; }
.expel-box summary .ico { --icon-acc: var(--coral); }
.expel-box.is-expelled { border-style: solid; background: #FFE3DC; }
.expel-box form { margin: 0; }
.btn-danger { background: var(--coral-dark); color: var(--white); }
.person.is-expelled { opacity: .7; }
.person.is-expelled b { text-decoration: line-through; }
.verdict-expelled { background: var(--coral); color: #fff; }
.verdict-expelled .verdict-icon { color: var(--coral-dark); }
.ticket-big.is-expelled .qr { opacity: .25; filter: grayscale(1); }
.expelled-note { display: flex; gap: 10px; align-items: flex-start; }