/* Integration-only rules; visual tokens and components are in styles.css (Fidavel handoff). */
.mvp-form-actions { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin-top:1.25rem; }
.mvp-form-actions form { display:inline; }
/* Learner shell: centre the swapped content region like the handoff's single .public-main child. */
.mvp-learning-region { width:100%; display:flex; flex-direction:column; align-items:center; }
.mvp-learning-region > .mvp-transport-error { width:100%; max-width:46rem; }
/* Live lesson links inside canonical outline rows keep the row's own colour. */
.mvp-okraj-odkaz { color:inherit; }
.mvp-okraj-odkaz:hover { text-decoration:underline; }
/* Semantic h1 carrying the handoff's .kurz-lekce h2 lesson heading style. */
.mvp-lekce-nadpis { letter-spacing:-.015em; color:var(--color-text-primary); margin:0; font-size:clamp(1.25rem,1.05rem + .8vw,1.5rem); font-weight:700; line-height:1.25; }
.mvp-lekce-paticka { padding-top:1.25rem; border-top:1px solid var(--color-border-default); }
/* Course search: utility .flex would otherwise override [hidden]. */
[data-course-card][hidden] { display:none; }
.mvp-course-search { max-width:14rem; }
/* Page-local rules of the handoff learner pages (not part of styles.css):
   .kurz-mriz in 22-katalog-kurzu.html (min() added so 320px screens never overflow)
   and .prog in 04-employee-skoleni.html. */
.mvp-course-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(min(17rem,100%),1fr)); }
.mvp-progress { height:.5rem; background:var(--color-bg-muted); border-radius:var(--radius-full); overflow:hidden; }
.mvp-progress > span { display:block; height:100%; background:var(--color-primary); border-radius:var(--radius-full); }
.mvp-progress.is-done > span { background:var(--color-status-done); }
.mvp-password { position:relative; }
.mvp-password .form-input { padding-right:3rem; }
.mvp-password .icon-btn { position:absolute; right:.25rem; top:50%; transform:translateY(-50%); }
.mvp-sidebar-scrim { display:none; }
.mvp-dialog { width:min(34rem, calc(100% - 2rem)); border:0; border-radius:var(--radius-card); box-shadow:var(--shadow-lg); padding:1.25rem; color:var(--color-text-primary); background:var(--color-bg-surface); }
.mvp-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.mvp-dialog::backdrop { background:rgb(15 23 42 / .45); }
/* No-JS fallback: "+ Nový kurz" links to #create-course. */
.mvp-dialog:target:not([open]) { display:block; position:static; margin:1.5rem 0 0; width:100%; }
.mvp-logout { display:inline; }
/* Progressive navigation/submit states (app.js). */
[data-fidavel-region="content"] { transition:opacity var(--motion-normal, .15s) ease; }
.is-navigating [data-fidavel-region="content"] { opacity:.6; }
form.is-pending { cursor:progress; }
form.is-pending [type="submit"] { opacity:.7; cursor:progress; }
.mvp-transport-error a { font-weight:600; }
[data-fidavel-region] h1:focus, [data-form-errors]:focus, [data-flash]:focus, .mvp-transport-error:focus, main:focus { outline:none; }
[data-fidavel-region] h1:focus-visible, [data-form-errors]:focus-visible, [data-flash]:focus-visible, .mvp-transport-error:focus-visible { outline:2px solid var(--color-primary); outline-offset:2px; }
@media (max-width: 1023px) {
  .mvp-sidebar-scrim { position:fixed; inset:0; z-index:20; background:rgb(15 23 42 / .45); }
  .app-sidebar.is-open + .mvp-sidebar-scrim { display:block; }
  /* No-JS drawer: the hamburger is a link to #app-drawer; app.js removes the hash. */
  .app-sidebar:target { visibility:visible; transform:translate(0); transition-delay:0s,0s; }
  .app-sidebar:target + .mvp-sidebar-scrim { display:block; }
  .drawer-open, .drawer-open body { overflow:hidden; }
}
/* A07 lesson rich text (RichText allowlist). Preflight resets lists and headings, so the
   few allowed elements get readable defaults inside lesson bodies and previews only. */
.mvp-rich-text { color:var(--color-text-secondary); overflow-wrap:anywhere; }
.mvp-rich-text > * + * { margin-top:.75rem; }
.mvp-rich-text p { margin:0; }
.mvp-rich-text ul { list-style:disc; padding-left:1.25rem; }
.mvp-rich-text ol { list-style:decimal; padding-left:1.25rem; }
.mvp-rich-text li + li { margin-top:.25rem; }
.mvp-rich-text h2, .mvp-rich-text h3, .mvp-rich-text h4 { color:var(--color-text-primary); font-weight:600; line-height:1.3; }
.mvp-rich-text h2 { font-size:1.25rem; } .mvp-rich-text h3 { font-size:1.125rem; } .mvp-rich-text h4 { font-size:1rem; }
.mvp-rich-text blockquote { border-left:3px solid var(--color-border-default); padding-left:.75rem; }
.mvp-rich-text code, .mvp-rich-text pre { font-family:'IBM Plex Mono', monospace; font-size:.875em; background:var(--color-bg-muted); border-radius:.25rem; }
.mvp-rich-text code { padding:.05rem .25rem; }
.mvp-rich-text pre { padding:.75rem; overflow-x:auto; white-space:pre-wrap; }
.mvp-rich-text a { color:var(--color-primary); text-decoration:underline; }
/* A07 builder outline (02-kurz-builder.html): ordered lists without markers. */
.mvp-outline, .mvp-outline-lessons { list-style:none; margin:0; padding:0; }
/* The drag handle is a JavaScript enhancement; .icon-btn would otherwise override [hidden]. */
.mvp-drag-handle[hidden] { display:none; }
.mvp-drag-handle { cursor:grab; touch-action:none; }
.no-js .mvp-js-only { display:none; }
[data-sortable-item].is-dragging { opacity:.55; }
[data-sortable-item].is-drop-target { outline:2px dashed var(--color-primary); outline-offset:2px; }
/* A12 public employee portal (strict CSP: these classes replace inline styles). */
.portal-card { max-width:34rem; width:100%; display:flex; flex-direction:column; gap:.75rem; }
.portal-title { margin:0; }
.portal-form { margin:.25rem 0 0; display:flex; flex-direction:column; gap:.75rem; }
.portal-note { margin:0; }
.portal-help { background:var(--color-bg-muted); border:none; }
.portal-help-title { margin-bottom:.5rem; }
.portal-list { margin:0; padding-left:1.1rem; list-style:disc; display:flex; flex-direction:column; gap:.4rem; }
.portal-state { padding:1rem; text-align:left; }
.portal-code-input { font-family:'IBM Plex Mono', ui-monospace, monospace; letter-spacing:.08em; text-transform:uppercase; }
/* A12 personal-code print sheet (server-generated, no remote content). */
.sheet-body { background:#fff; color:#0f172a; }
.sheet { max-width:60rem; margin:0 auto; padding:1.5rem; }
.sheet-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem; border-bottom:1px solid var(--color-border-default); padding-bottom:.75rem; }
.sheet-meta { margin:0; font-size:.875rem; }
.sheet-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(15rem, 1fr)); gap:.75rem; margin-top:1rem; }
.sheet-card { border:1px dashed var(--color-border-default); border-radius:.5rem; padding:.75rem; break-inside:avoid; overflow-wrap:anywhere; }
.sheet-code { font-family:'IBM Plex Mono', ui-monospace, monospace; font-size:1.25rem; font-weight:600; letter-spacing:.06em; margin:.25rem 0; }
.sheet-entry { font-family:'IBM Plex Mono', ui-monospace, monospace; overflow-wrap:anywhere; }
.sheet-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.dev-outbox { border:2px dashed var(--color-status-progress, #b45309); }
.dev-outbox code { overflow-wrap:anywhere; word-break:break-all; }
@media print {
  .sheet-actions, .skip-link { display:none; }
  .sheet { padding:0; max-width:none; }
}
.mvp-m0 { margin:0; }
.mvp-notice { display:flex; gap:.75rem; padding:.875rem 1rem; border:1px solid var(--color-status-progress); background:var(--color-status-progress-soft); border-radius:.5rem; }
.mvp-notice .state-title { font-weight:600; }
/* A13 employee learner portal (strict CSP: no inline style; progress is a native <progress>). */
.portal-main-wide { align-items:flex-start; }
.portal-wide { width:100%; max-width:64rem; display:flex; flex-direction:column; align-items:center; gap:1.25rem; min-width:0; }
.portal-wide > * { min-width:0; }
.portal-status-card { width:100%; margin-bottom:1.25rem; }
.portal-progress { display:block; width:100%; height:.5rem; border:0; border-radius:var(--radius-full); overflow:hidden; background:var(--color-bg-muted); color:var(--color-primary); appearance:none; }
.portal-progress::-webkit-progress-bar { background:var(--color-bg-muted); border-radius:var(--radius-full); }
.portal-progress::-webkit-progress-value { background:var(--color-primary); border-radius:var(--radius-full); }
.portal-progress::-moz-progress-bar { background:var(--color-primary); border-radius:var(--radius-full); }
.portal-section-title { font-size:1.0625rem; }
.portal-module + .portal-module { margin-top:1.5rem; }
.portal-module-title { margin-bottom:.75rem; }
.portal-outline { margin-bottom:1.75rem; }
.portal-outline-link { color:inherit; }
.portal-outline-link:hover { text-decoration:underline; }
.kurz-osnova-telo, .kurz-okraj-krok > a, .kurz-okraj-krok > span { min-width:0; overflow-wrap:anywhere; }
.portal-step-locked { opacity:.7; }
.portal-session-footer { width:100%; max-width:46rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem; padding-top:1rem; border-top:1px solid var(--color-border-default); }
.portal-session-footer .portal-note { flex:1 1 16rem; }
.portal-finish, .portal-inline-form { margin:0; }
/* A14 quiz steps (kurz-*-kviz.html): the prototype's inline fieldset/legend resets as classes (strict CSP, no inline style). */
.portal-fieldset { border:0; padding:0; margin:0; min-width:0; }
.portal-legend { margin:0; padding:0; float:none; overflow-wrap:anywhere; }
.kurz-odpoved > span { min-width:0; overflow-wrap:anywhere; }
/* A15 certificate panel on the pass page: facts as a two-column list that wraps long values (SHA-256) at 320 px. */
.portal-certificate-facts { display:grid; grid-template-columns:minmax(0, 9rem) minmax(0, 1fr); gap:.35rem .75rem; margin:0; }
.portal-certificate-facts dt { color:var(--color-text-muted); }
.portal-certificate-facts dd { margin:0; min-width:0; overflow-wrap:anywhere; }
.portal-mono { font-family:'IBM Plex Mono', ui-monospace, monospace; word-break:break-all; }
/* A16: employee transcript (flows/08-verejne/21-muj-prehled.html) inside the wide portal column. */
.portal-transcript { width:100%; max-width:56rem; min-width:0; }
.portal-transcript .kpi-strip { width:100%; }
.portal-recert { width:100%; border-color:color-mix(in srgb, var(--color-status-progress) 45%, transparent); }
.portal-chip { flex:0 0 auto; }
.portal-transcript-card { width:100%; }
.portal-transcript-validity { display:block; margin-top:.25rem; }
.portal-transcript-link { width:100%; max-width:46rem; margin-bottom:1rem; }
@media (max-width: 30rem) { .portal-certificate-facts { grid-template-columns:minmax(0, 1fr); } .portal-certificate-facts dd { margin-bottom:.35rem; } }
/* A17 employee catalogue (22-katalog-kurzu.html): card title size of the prototype's inline style. */
.portal-catalogue { width:100%; max-width:56rem; min-width:0; }
.portal-catalogue-title { font-size:1.0625rem; }
