/* Izvod ↔ otvorene fakture. Uses the site's CSS variables; fallbacks only for standalone preview. */
.izf {
  --izf-bg: var(--bg, #fff);
  --izf-fg: var(--fg, #111);
  --izf-muted: var(--muted, #5c5c5c);
  --izf-accent: var(--accent, #1f5eff);
  --izf-ink: var(--accent-ink, #006b4f);
  --izf-line: var(--line, #d9d9d9);
  --izf-card: var(--card, #f6f6f6);
  color: var(--izf-fg);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}
.izf > *, .izf-out > *, .izf-map > *, .izf-sec > * { min-width: 0; }
.izf *, .izf *::before, .izf *::after { box-sizing: border-box; }
.izf [hidden] { display: none !important; }
.izf :focus-visible { outline: 2px solid var(--izf-accent); outline-offset: 2px; }

.izf-dir { margin: 0; padding: 0; border: 0; display: grid; gap: .5rem; }
.izf-dir legend { font-weight: 600; margin-bottom: .5rem; padding: 0; }
.izf-dir label { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: .5rem .75rem; border: 1px solid var(--izf-line); border-radius: 8px; background: var(--izf-bg); cursor: pointer; }
.izf-dir input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--izf-fg); }

.izf-drops { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.izf-drop {
  display: grid; gap: .35rem; align-content: start;
  padding: 1.25rem; min-height: 8rem;
  border: 2px dashed var(--izf-line); border-radius: 12px; background: var(--izf-card);
  cursor: pointer;
}
.izf-drop.izf-over { border-color: var(--izf-accent); }
.izf-drop strong { font-size: 1.05rem; }
.izf-picked { color: var(--izf-ink); font-weight: 600; overflow-wrap: anywhere; }
.izf-picked:empty { display: none; }
.izf-file { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.izf-drop:has(.izf-file:focus-visible) { outline: 2px solid var(--izf-accent); outline-offset: 2px; }
.izf-privacy { margin: 0; font-weight: 600; color: var(--izf-ink); }

.izf-hint { margin: 0; font-size: .9rem; color: var(--izf-muted); }
.izf-hint a { color: var(--izf-ink); }
.izf-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); margin: .75rem 0; }
.izf-field { display: grid; gap: .35rem; align-content: start; }
.izf-field > label { font-weight: 600; }
.izf input[type="text"], .izf input[type="number"], .izf select {
  width: 100%; min-height: 2.75rem; padding: .5rem .75rem; font: inherit;
  color: var(--izf-fg); background: var(--izf-bg); border: 1px solid var(--izf-line); border-radius: 8px;
}
.izf-opts, .izf-sources { border: 1px solid var(--izf-line); border-radius: 12px; padding: 0 1rem; background: var(--izf-card); }
.izf-opts[open], .izf-sources[open] { padding-bottom: 1rem; }
.izf-opts summary, .izf-sources summary, .izf-sec summary { cursor: pointer; font-weight: 600; min-height: 2.75rem; display: flex; align-items: center; gap: .25rem; }

.izf-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.izf-btn, .izf-btn-s {
  min-height: 2.75rem; padding: .6rem 1.25rem; font: inherit; font-weight: 600; border-radius: 8px; cursor: pointer;
}
.izf-btn { color: var(--izf-bg); background: var(--izf-fg); border: 0; }
.izf-btn-s { color: var(--izf-fg); background: transparent; border: 1px solid var(--izf-fg); }
.izf-btn:disabled, .izf-btn-s:disabled { opacity: .55; cursor: progress; }
.izf-busy { cursor: progress; }

.izf-mem { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: .75rem 1rem; border: 1px solid var(--izf-line); border-left: 3px solid var(--izf-accent); border-radius: 0 8px 8px 0; background: var(--izf-card); font-size: .9rem; }
.izf-map { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; padding: 1.25rem; border: 1px solid var(--izf-line); border-radius: 12px; background: var(--izf-card); }
.izf-map h3 { margin: 0; font-size: 1.1rem; }
.izf-check { display: flex; gap: .5rem; align-items: flex-start; font-size: .95rem; }
.izf-check input { margin-top: .2rem; width: 1.1rem; height: 1.1rem; accent-color: var(--izf-fg); flex: none; }

.izf-status { margin: 0; color: var(--izf-muted); }
.izf-status:empty { display: none; }
.izf-error { margin: 0; color: #c62828; font-weight: 600; }
.izf-error:empty { display: none; }

.izf-out { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.izf-out:empty { display: none; }
.izf-summary { margin: 0; font-size: 1.1rem; }
.izf-tiles { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); }
.izf-tile { display: grid; gap: .15rem; padding: .9rem 1rem; border: 1px solid var(--izf-line); border-radius: 12px; background: var(--izf-card); }
.izf-tile strong { font-size: 1.6rem; line-height: 1.1; }
.izf-tile span { font-size: .9rem; color: var(--izf-muted); }
.izf-out > .izf-btn { justify-self: start; }
.izf-checks { margin: 0; padding-left: 1.1rem; display: grid; gap: .3rem; font-size: .95rem; }
.izf-checks:empty { display: none; }
.izf-ok::marker { color: var(--izf-ink); }
.izf-bad { color: #c62828; font-weight: 600; }
.izf-note { color: var(--izf-muted); }
.izf-sec { border-top: 1px solid var(--izf-line); padding-top: .25rem; }
.izf-count { color: var(--izf-muted); font-weight: 400; }

.izf-scroll { overflow-x: auto; }
.izf-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.izf-table caption { caption-side: top; text-align: left; font-weight: 600; padding: 0 0 .5rem; color: var(--izf-fg); }
/* Reset the site-wide th/td look inside the tool. */
.izf-table th, .izf-table td {
  padding: .5rem .6rem .5rem 0; font: inherit; letter-spacing: normal; text-transform: none; color: inherit;
  border-bottom: 1px solid var(--izf-line); text-align: left; vertical-align: top;
}
.izf-table thead th { font-size: .82rem; color: var(--izf-muted); font-weight: 600; white-space: nowrap; }
.izf-table td:nth-child(3) { white-space: nowrap; text-align: right; }
.izf-preview td { white-space: nowrap; }
.izf-table tr.izf-flag td:first-child { box-shadow: inset 3px 0 0 #b26a00; padding-left: .5rem; }

.izf-bridge { margin: 0; padding: 1rem 1.25rem; border-left: 3px solid var(--izf-accent); background: var(--izf-card); border-radius: 0 8px 8px 0; }
.izf-bridge a { color: var(--izf-ink); font-weight: 600; }
.izf-sources { font-size: .9rem; color: var(--izf-muted); }
.izf-sources strong { color: var(--izf-fg); }
.izf-sources a { color: var(--izf-ink); }
.izf-sources q { overflow-wrap: anywhere; }
.izf-rules { padding-left: 1.1rem; display: grid; gap: .4rem; }

@media (max-width: 480px) {
  .izf-drop { padding: 1rem; min-height: 0; }
  .izf-actions > * { flex: 1 1 100%; }
  .izf-out > .izf-btn { justify-self: stretch; }
}