:root { color-scheme: light dark;
  /* barvy ze znaku obce */
  --modra:#0b5cc4; --modra-tmava:#08438f; --zluta:#f7c900; --cervena:#c8102e; --zelena:#2c8a3f;
  --color-fg:#1b2433; --color-fg-muted:#5a6678; --color-bg:#fff; --color-panel:#fff; --color-border-line:#d9e2ef;
  --color-ok:#1f7a36; --color-bad:#c8102e; --page-bg:#eef3fa; --akcent:#0b5cc4; --th-bg:#e6eefa; --radek-hover:#fff9dc; --pv-bg:#fff7cf;
  --ui-chart-grid:#e8edf5; --ui-chart-axis:#aab6c8; --ui-surface-popover:#fff; --ui-border:#cfd9e8; --ui-shadow-popover:0 4px 14px rgba(11,60,130,.18); --ui-text-secondary:#5a6678;
  --font-sans:"Fira Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ui-font-size-caption:.8125rem; --ui-font-size-body:.9375rem; --ui-font-size-heading:1.0625rem; --ui-font-size-title:1.75rem; --ui-font-weight-medium:600;
  --ui-gap-xs:.25rem; --ui-gap-sm:.5rem; --ui-gap-md:1rem; --ui-gap-lg:1.5rem;
  --ui-pad-xs:.375rem; --ui-pad-sm:.625rem; --ui-pad-md:1rem; --ui-pad-lg:1.25rem; --ui-radius:.5rem; }
@media (prefers-color-scheme: dark) { :root {
  --color-fg:#e8edf5; --color-fg-muted:#a2afc2; --color-bg:#141c29; --color-panel:#1b2535; --color-border-line:#2f3d53;
  --color-ok:#5ccb7c; --color-bad:#ff7d86; --page-bg:#101722; --akcent:#7db2ff; --th-bg:#22314a; --radek-hover:#2a3347; --pv-bg:#33301a;
  --ui-chart-grid:#2a3649; --ui-chart-axis:#55647c; --ui-surface-popover:#222e42; --ui-border:#3a4a63; --ui-text-secondary:#a2afc2; } }
body { margin:0; background:var(--page-bg); padding:clamp(12px,2.5vw,32px); }
.lp-auto { width:auto !important; }
.lp.lp-login { max-width:28rem; margin:8vh auto 0; }
.lp { font-family: var(--font-sans); color: var(--color-fg); max-width: 1200px; margin-inline: auto; display: grid; gap: var(--ui-gap-lg); }
.lp-hero { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-gap-md); color: #fff; background: linear-gradient(115deg, var(--modra-tmava), var(--modra)); border-bottom: 5px solid var(--zluta); border-radius: var(--ui-radius); padding: var(--ui-pad-md) var(--ui-pad-lg); }
.lp-znak { width: 68px; height: auto; flex: none; background: #fff; border-radius: var(--ui-radius); padding: 5px; box-sizing: content-box; }
.lp-hero-text { flex: 1 1 16rem; min-width: 0; }
.lp-obec { margin: 0; color: var(--zluta); font-weight: var(--ui-font-weight-medium); letter-spacing: .02em; }
.lp-title { font-weight: 600; font-size: var(--ui-font-size-title); line-height: 1.2; margin: 0; }
.lp-sub { margin: var(--ui-gap-xs) 0 0; color: #dbe7fa; }
.lp-sub b { font-weight: var(--ui-font-weight-medium); color: #fff; }
.lp-ucet { display: flex; flex-wrap: wrap; gap: var(--ui-gap-sm); align-self: flex-start; }
.lp-ucet { align-items: center; }
.lp-ucet .lp-mini { color: #fff; }
.lp-kdo { color: var(--zluta); font-size: var(--ui-font-size-caption); font-weight: var(--ui-font-weight-medium); }
.lp-bar { display: flex; flex-wrap: wrap; gap: var(--ui-gap-sm); align-items: center; justify-content: space-between; }
.lp-tabs { display: flex; flex-wrap: wrap; gap: var(--ui-gap-xs); }
.lp-tab { font: inherit; padding: var(--ui-pad-xs) var(--ui-pad-md); border: 1px solid var(--color-border-line); border-radius: var(--ui-radius); background: transparent; color: var(--akcent); background: var(--color-panel); font-weight: var(--ui-font-weight-medium); cursor: pointer; }
.lp-tab:hover { border-color: var(--modra); }
.lp-tab.lp-on { background: var(--modra); color: #fff; border-color: var(--modra); }
.lp-right { display: flex; flex-wrap: wrap; gap: var(--ui-gap-sm); align-items: center; }
.lp-card { background: var(--color-panel); border: 1px solid var(--color-border-line); border-radius: var(--ui-radius); padding: var(--ui-pad-lg); display: grid; align-content: start; gap: var(--ui-gap-md); min-width: 0; }
.lp-card h2 { font-size: var(--ui-font-size-heading); font-weight: var(--ui-font-weight-medium); margin: 0; color: var(--akcent); }
.lp-note { margin: 0; color: var(--color-fg-muted); font-size: var(--ui-font-size-caption); }
.lp-sec { display: grid; gap: var(--ui-gap-md); }
.lp-sec[hidden], .lp-card[hidden] { display: none; }
.lp-grid { display: grid; gap: var(--ui-gap-md); grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.lp-kpis { display: grid; gap: var(--ui-gap-md); grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
.lp-kpi { background: var(--color-panel); border: 1px solid var(--color-border-line); border-top: 4px solid var(--modra); border-radius: var(--ui-radius); padding: var(--ui-pad-md) var(--ui-pad-lg); }
.lp-kpi:nth-child(2) { border-top-color: var(--zelena); }
.lp-kpi:nth-child(3) { border-top-color: var(--zluta); }
.lp-kpi:nth-child(4) { border-top-color: var(--cervena); }
.lp-kpi span { display: block; color: var(--color-fg-muted); font-size: var(--ui-font-size-caption); }
.lp-kpi strong { display: block; font-weight: 600; font-size: var(--ui-font-size-title); font-variant-numeric: tabular-nums; }
.lp-form { display: flex; flex-wrap: wrap; gap: var(--ui-gap-sm); align-items: flex-end; }
.lp-f { display: grid; gap: 4px; font-size: var(--ui-font-size-caption); color: var(--color-fg-muted); min-width: 0; }
.lp-f.lp-w { flex: 1 1 18rem; }
.lp-f.lp-c { flex-direction: row; display: flex; align-items: center; gap: var(--ui-gap-xs); padding-bottom: var(--ui-pad-xs); color: var(--color-fg); font-size: var(--ui-font-size-body); }
.lp input:not([type=checkbox]), .lp select { font: inherit; font-size: var(--ui-font-size-body); color: var(--color-fg); background: var(--color-bg); border: 1px solid var(--color-border-line); border-radius: var(--ui-radius); padding: var(--ui-pad-xs) var(--ui-pad-sm); min-width: 0; width: 100%; box-sizing: border-box; }
.lp select { width: auto; }
.lp-n { max-width: 7rem; }
.lp-btn { font: inherit; font-size: var(--ui-font-size-body); padding: var(--ui-pad-xs) var(--ui-pad-md); border: 1px solid var(--color-border-line); border-radius: var(--ui-radius); background: transparent; color: var(--color-fg); cursor: pointer; }
.lp-btn.lp-pri { background: var(--modra); color: #fff; border-color: var(--modra); font-weight: var(--ui-font-weight-medium); }
.lp-btn.lp-pri:hover { background: var(--modra-tmava); }
.lp-btn:not(.lp-pri):hover { border-color: var(--modra); }
.lp-btn[hidden] { display: none; }
.lp-btn:disabled, .lp input:disabled { opacity: .6; cursor: not-allowed; }
.lp-mini { font: inherit; font-size: var(--ui-font-size-caption); background: none; border: 0; padding: 0 var(--ui-pad-xs); color: var(--akcent); text-decoration: underline; cursor: pointer; }
.lp-mini.lp-bad { color: var(--color-bad); }
.lp-msg { margin: 0; min-height: 1.3em; font-size: var(--ui-font-size-caption); }
.lp-msg.lp-e { color: var(--color-bad); }
.lp-msg.lp-k { color: var(--color-ok); }
.lp-pozor:empty { display: none; }
.lp-pozor { display: grid; gap: var(--ui-gap-sm); }
.lp-pozor p { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-gap-sm); background: var(--pv-bg); border-left: 4px solid var(--zluta); border-radius: var(--ui-radius); padding: var(--ui-pad-sm) var(--ui-pad-md); }
.lp-pv { margin: 0; min-height: 1.4em; font-variant-numeric: tabular-nums; background: var(--pv-bg); border-left: 4px solid var(--zluta); border-radius: var(--ui-radius); padding: var(--ui-pad-xs) var(--ui-pad-sm); }
.lp-cb { position: relative; }
.lp-cbl { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: var(--ui-pad-xs) 0; list-style: none; background: var(--ui-surface-popover); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); box-shadow: var(--ui-shadow-popover); max-height: 18rem; overflow: auto; display: none; color: var(--color-fg); font-size: var(--ui-font-size-body); }
.lp-cbl.lp-open { display: block; }
.lp-cbl li { padding: var(--ui-pad-xs) var(--ui-pad-sm); cursor: pointer; display: flex; justify-content: space-between; gap: var(--ui-gap-md); }
.lp-cbl li.lp-a, .lp-cbl li:hover { background: var(--th-bg); }
.lp-cbl li span { color: var(--color-fg-muted); white-space: nowrap; }
.lp-scroll { overflow: auto; max-height: 34rem; }
.lp-t { width: 100%; border-collapse: collapse; font-size: var(--ui-font-size-body); font-variant-numeric: tabular-nums; }
.lp-t tbody tr:hover td { background: var(--radek-hover); }
.lp-t th { position: sticky; top: 0; background: var(--th-bg); text-align: left; font-weight: var(--ui-font-weight-medium); font-size: var(--ui-font-size-caption); color: var(--akcent); padding: var(--ui-pad-xs) var(--ui-pad-sm); border-bottom: 2px solid var(--modra); white-space: nowrap; }
.lp-t td { padding: var(--ui-pad-xs) var(--ui-pad-sm); border-bottom: 1px solid var(--ui-chart-grid); }
.lp-t .lp-r { text-align: right; }
.lp-t tfoot td { font-weight: var(--ui-font-weight-medium); border-bottom: 0; border-top: 2px solid var(--modra); background: var(--th-bg); }
.lp-t .lp-act { white-space: nowrap; text-align: right; }
.lp-th { font: inherit; background: none; border: 0; padding: 0; color: inherit; cursor: pointer; }
.lp-who { color: var(--color-fg-muted); font-size: var(--ui-font-size-caption); }
.lp-track { display: block; min-width: 4rem; height: 8px; border-radius: var(--ui-radius); background: var(--ui-chart-grid); }
.lp-fill { display: block; height: 100%; border-radius: var(--ui-radius); }
.lp-graf { position: relative; min-height: 240px; }
.lp-graf svg { display: block; }
.lp-tip { position: absolute; pointer-events: none; background: var(--ui-surface-popover); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); box-shadow: var(--ui-shadow-popover); padding: var(--ui-pad-xs) var(--ui-pad-sm); font-size: var(--ui-font-size-caption); white-space: nowrap; }
.lp-tip b { display: block; font-weight: var(--ui-font-weight-medium); color: var(--ui-text-secondary); }
@media (max-width: 640px) { .lp-hide { display: none; } }
