:root {
  --bg: #f4f6f8;
  --card: #ffffff;
  --text: #18212a;
  --muted: #64748b;
  --line: #d8e0e8;
  --accent: #2457a7;
  --accent-dark: #173d77;
  --success: #17663a;
  --warning: #8a5a00;
  --danger: #a52828;
  --radius: 10px;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); line-height: 1.45; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.topbar { background: #152536; color: #fff; min-height: 58px; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.topbar strong { font-size: 1.12rem; }
.topbar .version { margin-left: 8px; font-size: .75rem; opacity: .65; }
.topbar nav { display: flex; flex-wrap: wrap; gap: 16px; }
.topbar nav a { color: #fff; font-size: .93rem; }
.container { max-width: 1440px; margin: 0 auto; padding: 24px; }
.container.narrow { max-width: 760px; }
h1 { margin: 0 0 22px; font-size: 1.8rem; }
h2 { margin-top: 0; font-size: 1.18rem; }
h3 { margin: 4px 0; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; box-shadow: 0 2px 8px rgba(21,37,54,.04); margin-bottom: 20px; }
.card.compact { padding: 14px 16px; }
.alert { padding: 12px 14px; border-radius: 8px; margin-bottom: 16px; border: 1px solid transparent; }
.alert-success { background: #e8f6ed; color: var(--success); border-color: #bce2ca; }
.alert-error { background: #fdecec; color: var(--danger); border-color: #f3bcbc; }
.alert-info { background: #edf4ff; color: #244e84; border-color: #c7dcf7; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 8px 14px; border-radius: 7px; border: 1px solid var(--accent); background: var(--accent); color: #fff; cursor: pointer; font-weight: 600; font: inherit; }
.button:hover { background: var(--accent-dark); text-decoration: none; }
.button.secondary { background: #fff; color: var(--accent); }
.button.secondary:hover { background: #edf4ff; }
.button.danger { background: var(--danger); border-color: var(--danger); }
.actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 20px; }
.inline-form { display: inline-flex; }
.form-grid { display: grid; gap: 14px; }
.form-grid h2 { margin: 10px 0 0; padding-top: 8px; border-top: 1px solid var(--line); }
label { display: grid; gap: 6px; font-weight: 600; font-size: .92rem; }
label.check { display: flex; align-items: center; gap: 8px; }
label.check input { width: auto; }
input, select, textarea { width: 100%; border: 1px solid #b9c4cf; border-radius: 6px; padding: 9px 10px; background: #fff; font: inherit; color: inherit; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(36,87,167,.22); border-color: var(--accent); }
.hint { color: var(--muted); font-size: .9rem; margin: 0; }
.login-card { max-width: 460px; margin: 60px auto; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: 16px; margin-bottom: 20px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; }
.stat span { display: block; color: var(--muted); font-size: .88rem; }
.stat strong { display: block; margin-top: 4px; font-size: 1.55rem; }
.table-wrap { overflow: auto; }
table { border-collapse: collapse; width: 100%; min-width: 720px; }
th, td { padding: 10px 11px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: #425466; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; background: #f7f9fb; }
td { font-size: .92rem; }
.badge { display: inline-block; padding: 3px 8px; border-radius: 999px; background: #e8edf2; color: #334155; font-size: .78rem; white-space: nowrap; }
.badge-review, .badge-needs_split { background: #fff3d7; color: var(--warning); }
.badge-approved, .badge-split_source { background: #e5f5eb; color: var(--success); }
.badge-error { background: #fde4e4; color: var(--danger); }
.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; }
.filters label { min-width: 170px; }
.compare-grid { display: grid; grid-template-columns: minmax(420px, 1.12fr) minmax(420px, .88fr); gap: 20px; align-items: start; }
.pdf-panel { padding-bottom: 10px; }
.pdf-panel iframe { width: 100%; height: 78vh; min-height: 620px; border: 1px solid var(--line); border-radius: 6px; background: #eef1f4; }
.meta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.meta-grid div { display: grid; gap: 3px; }
.meta-grid strong { font-size: .78rem; text-transform: uppercase; color: var(--muted); }
.invoice-head { display: grid; grid-template-columns: 1fr auto; gap: 24px; border-bottom: 2px solid #1f2937; padding-bottom: 18px; }
.invoice-number { text-align: right; display: grid; gap: 4px; align-content: start; }
.invoice-number strong { font-size: 1.25rem; }
.invoice-number small { color: var(--muted); }
.eyebrow { display: block; color: var(--muted); text-transform: uppercase; font-size: .72rem; letter-spacing: .06em; }
.invoice-buyer { padding: 18px 0; border-bottom: 1px solid var(--line); }
.invoice-buyer p, .invoice-head p { margin: 4px 0; }
.date-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 16px 0; }
.date-grid div { background: #f7f9fb; padding: 10px; border-radius: 6px; }
.date-grid span { display: block; font-size: .75rem; color: var(--muted); }
.date-grid strong { display: block; margin-top: 3px; }
.totals { margin-left: auto; margin-top: 16px; width: min(360px, 100%); }
.totals div { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px solid var(--line); }
.totals .grand { font-size: 1.12rem; border-bottom: 3px double #1f2937; }
.project-box { margin-top: 20px; padding: 12px; background: #f7f9fb; border-radius: 6px; }
.extracted-text pre { white-space: pre-wrap; max-height: 520px; overflow: auto; background: #0e1720; color: #d8e4ef; padding: 14px; border-radius: 6px; }
.details { display: grid; grid-template-columns: 180px 1fr; gap: 8px 14px; }
.details dt { color: var(--muted); }
.details dd { margin: 0; font-weight: 600; }
.big-address { font-size: 1.4rem; font-weight: 700; }
.code-block { display: block; background: #101820; color: #ecf4fb; padding: 12px; border-radius: 6px; overflow-wrap: anywhere; }
.two-panel { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(500px, 1.2fr); gap: 20px; align-items: start; }
.wide-form .form-section { border-top: 1px solid var(--line); padding-top: 14px; }
.wide-form .form-section:first-of-type { border-top: 0; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.wide-form table input { min-width: 110px; }
.wide-form table td:first-child input { min-width: 260px; }
.document-list { padding-left: 20px; }
.footer { color: var(--muted); text-align: center; padding: 20px; font-size: .85rem; }
.report-totals { grid-template-columns: repeat(4, minmax(180px,1fr)); }
@media (max-width: 1050px) {
  .compare-grid, .two-panel, .two-col { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .pdf-panel iframe { height: 62vh; }
}
@media (max-width: 700px) {
  .container { padding: 16px; }
  .topbar { align-items: flex-start; flex-direction: column; padding: 14px 16px; }
  .stats-grid { grid-template-columns: 1fr; }
  .date-grid { grid-template-columns: repeat(2, 1fr); }
  .invoice-head { grid-template-columns: 1fr; }
  .invoice-number { text-align: left; }
}

/* v0.2.2 */
.field-info { margin: 0; border: 1px solid var(--line); border-radius: 7px; padding: 9px 11px; background: #f7f9fb; }
.field-info summary { cursor: pointer; font-weight: 700; color: var(--accent); }
.field-info p { margin: 8px 0 0; color: var(--muted); font-size: .9rem; }
.form-error { border-color: var(--danger) !important; background: #fff8f8; }
.status-review-needed { color: var(--warning); font-weight: 700; }
.upload-inline { border: 1px dashed #9aabbc; border-radius: 8px; padding: 14px; background: #f9fbfd; }
.radio-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.radio-row label { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.radio-row input { width: auto; }
[hidden] { display: none !important; }
.small-muted { color: var(--muted); font-size: .82rem; }

/* v0.2.3 */
.button.small { min-height: 32px; padding: 5px 9px; font-size: .82rem; }
.row-actions { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.section-heading h2 { margin-bottom: 4px; }
.manage-card { scroll-margin-top: 20px; }
@media (max-width: 700px) {
  .section-heading { flex-direction: column; }
}

/* v0.2.4 NAV */
.nav-connection-form { max-width: 920px; }
.nav-status { padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: #f7f9fb; }
.nav-connection-form input::placeholder { color: #7b8794; font-size: .82rem; }


/* v0.2.11 strukturált navigáció és projektmunkatér */
.topbar { position: sticky; top: 0; z-index: 100; padding: 0 28px; min-height: 70px; box-shadow: 0 4px 18px rgba(10,24,40,.16); }
.brand { color:#fff; display:flex; align-items:baseline; gap:8px; white-space:nowrap; }
.brand:hover { text-decoration:none; }
.main-nav { display:flex; align-items:stretch; gap:2px !important; min-height:70px; }
.nav-item { position:relative; display:flex; align-items:stretch; }
.nav-item>a { display:flex; align-items:center; padding:0 15px; font-weight:650; border-bottom:3px solid transparent; }
.nav-item>a:hover { background:rgba(255,255,255,.08); border-bottom-color:#7fb0ff; text-decoration:none; }
.nav-menu { display:none; position:absolute; top:100%; left:0; min-width:235px; background:#fff; border:1px solid var(--line); border-radius:0 0 10px 10px; box-shadow:0 14px 30px rgba(14,30,48,.18); padding:8px; }
.nav-menu a { display:block; color:var(--text)!important; padding:10px 12px; border-radius:6px; white-space:nowrap; }
.nav-menu a:hover { background:#edf4ff; text-decoration:none; }
.has-menu:hover .nav-menu, .has-menu:focus-within .nav-menu { display:block; }
.nav-item.logout { margin-left:8px; }
.project-context { max-width:1440px; margin:0 auto; padding:9px 24px; display:flex; gap:9px; align-items:center; color:#536273; font-size:.88rem; }
.project-context strong { color:var(--text); }
.project-context a { margin-left:auto; }
.hero { min-height:210px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:34px; background:linear-gradient(125deg,#fff 0%,#eef5ff 100%); }
.hero h2 { font-size:2rem; margin:6px 0; }
.hero p { color:var(--muted); margin:0; }
.landing-grid { display:grid; grid-template-columns:repeat(3,minmax(220px,1fr)); gap:18px; }
.landing-card { min-height:170px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px; display:flex; flex-direction:column; box-shadow:0 5px 16px rgba(21,37,54,.06); transition:.18s ease; color:var(--text); }
.landing-card:hover { transform:translateY(-3px); box-shadow:0 10px 25px rgba(21,37,54,.12); text-decoration:none; border-color:#a9c5ed; }
.landing-card span { color:var(--accent); font-weight:800; font-size:.78rem; }
.landing-card strong { font-size:1.35rem; margin-top:auto; }
.landing-card small { color:var(--muted); margin-top:5px; }
.project-selector-card { background:#f8fbff; }
.project-selector-form { display:grid; grid-template-columns:minmax(320px,1fr) auto auto auto; gap:10px; align-items:end; }
.project-detail { width:100%; padding:30px; }
.project-detail-grid { display:grid; grid-template-columns:190px 1fr 190px 1fr; gap:14px 22px; margin:0; }
.project-detail-grid dt { color:var(--muted); font-weight:700; }
.project-detail-grid dd { margin:0; font-weight:650; }
@media(max-width:1000px){.landing-grid{grid-template-columns:repeat(2,1fr)}.project-selector-form{grid-template-columns:1fr 1fr}.project-detail-grid{grid-template-columns:160px 1fr}.topbar{position:relative;align-items:flex-start;flex-direction:column;padding:14px 18px}.main-nav{min-height:auto;flex-wrap:wrap}.nav-item>a{padding:9px 10px}.nav-menu{top:100%}}
@media(max-width:650px){.landing-grid{grid-template-columns:1fr}.hero{align-items:flex-start;flex-direction:column}.project-selector-form{grid-template-columns:1fr}.project-detail-grid{grid-template-columns:1fr}.project-detail-grid dt{margin-top:8px}}

@media(max-width:1000px){.has-menu.menu-open .nav-menu{display:block;position:relative;width:100%;box-shadow:none;border-radius:8px}.has-menu.menu-open{flex-direction:column}}

/* v0.2.12 – számlalista projekt-hozzárendelés és tömeges NAS-feldolgozás */
.invoice-grid .project-check-col,
.invoice-grid .row-check-col {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}
.invoice-grid .project-check-col input,
.invoice-grid .row-check-col input {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.invoice-grid thead .project-check-col label {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  cursor: pointer;
}
.bulk-toolbar {
  align-items: center;
  margin: 0 0 1rem;
}
.bulk-toolbar .muted {
  color: var(--muted, #687386);
}

/* v0.2.13 – letisztított számlalista és soronkénti NAS-művelet */
.project-selector-form-compact {
  grid-template-columns: minmax(320px, 1fr) auto;
}
.invoice-grid .invoice-nas-col {
  min-width: 190px;
}
.invoice-nas-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
}
.small-button {
  padding: 7px 10px;
  font-size: .84rem;
}
@media(max-width:650px){
  .project-selector-form-compact { grid-template-columns: 1fr; }
}



/* v0.2.14 – számlakijelölés, kattintható projektkapcsolat és automatikus szűrés */
.invoice-grid .row-check-col {
  width: 42px;
  min-width: 42px;
  text-align: center;
}
.invoice-grid .row-check-col input {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.invoice-grid .project-check-col {
  width: 84px;
  min-width: 84px;
  text-align: center;
}
.connection-state {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 5px 11px;
  min-width: 52px;
  font: inherit;
  font-size: .82rem;
  font-weight: 750;
  cursor: pointer;
}
.connection-state.is-connected {
  background: #e5f6eb;
  color: #176b38;
}
.connection-state.is-unconnected {
  background: #eef1f5;
  color: #586474;
}
.connection-state:hover:not(:disabled) {
  box-shadow: 0 0 0 2px rgba(35, 99, 235, .18);
}
.connection-state:disabled {
  cursor: not-allowed;
  opacity: .55;
}
#invoice-filter-form {
  align-items: end;
}


/* v0.2.15 – új kézi számla oldal */
.invoice-create-methods .actions-row {
  align-items: center;
  flex-wrap: wrap;
}
.button.is-active {
  box-shadow: 0 0 0 3px rgba(35, 99, 235, .16);
}
.button.is-disabled {
  cursor: not-allowed;
  opacity: .52;
  pointer-events: none;
}
.manual-invoice-form .form-section {
  grid-column: 1 / -1;
}
.manual-invoice-form .full-width {
  grid-column: 1 / -1;
}
#manual-items-table {
  min-width: 1120px;
}
#manual-items-table input {
  min-width: 92px;
}
#manual-items-table td:first-child input {
  min-width: 250px;
}


/* v0.2.16 – külön számlafeltöltő és előnézeti ablak */
.manual-upload-selection{margin-top:.9rem;padding:.75rem 1rem;border:1px dashed #bac3d1;border-radius:10px;background:#f7f9fc;color:#667085}.manual-upload-selection.has-file{border-style:solid;border-color:#92d2aa;background:#edf9f1;color:#176b38}.invoice-upload-popup{margin:0;background:#eef2f7}.popup-shell{width:min(1180px,calc(100% - 28px));margin:14px auto 28px}.popup-header,.popup-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.popup-header{margin-bottom:14px}.popup-header h1,.popup-preview-heading h2{margin:0}.popup-upload-card,.popup-preview-card{margin-bottom:14px}.popup-upload-form{grid-template-columns:minmax(320px,1fr) auto;align-items:end}.popup-upload-form input[type=file]{min-height:46px}.status-badge.success{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#e5f6eb;color:#176b38;font-size:.84rem;font-weight:700}.manual-upload-preview{width:100%;height:calc(100vh - 315px);min-height:560px;border:1px solid #d8dee8;border-radius:8px;background:white}.manual-upload-image-wrap{display:flex;justify-content:center;overflow:auto;max-height:calc(100vh - 315px);min-height:560px;padding:12px;border:1px solid #d8dee8;border-radius:8px;background:#dfe4eb}.manual-upload-image{display:block;max-width:100%;height:auto;object-fit:contain;background:white;box-shadow:0 4px 18px rgba(28,39,56,.18)}@media(max-width:720px){.popup-header,.popup-preview-heading{flex-direction:column}.popup-upload-form{grid-template-columns:1fr}.manual-upload-preview,.manual-upload-image-wrap{min-height:420px}}


/* v0.2.18 – kézi számla szerkezete és beszállítók */
.manual-upload-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}
.manual-upload-toolbar .manual-upload-selection {
  flex: 0 1 34rem;
  margin-top: 0;
  min-height: 40px;
  padding: 8px 12px;
}
.manual-core-field {
  width: calc((100% - 22px) / 2);
  max-width: 680px;
}
.project-beneficiary-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  padding: 10px 12px;
  width: calc((100% - 22px) / 2);
  max-width: 680px;
  background: #f7f9fb;
  border: 1px solid var(--line);
  border-radius: 7px;
}
.manual-date-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: end;
}
.manual-date-row label {
  width: max-content;
  min-width: 0;
}
.manual-date-row input[type="date"] {
  width: 11.4rem;
  min-width: 11.4rem;
}
.manual-invoice-form input[readonly],
.manual-invoice-form textarea[readonly] {
  background: #f4f6f8;
  color: #465568;
}
@media(max-width:1050px) {
  .manual-core-field,
  .project-beneficiary-preview {
    width: 100%;
    max-width: none;
  }
}
@media(max-width:650px) {
  .manual-date-row {
    display: grid;
    grid-template-columns: 1fr;
  }
  .manual-date-row label,
  .manual-date-row input[type="date"] {
    width: 100%;
    min-width: 0;
  }
}


/* v0.2.19 – kézi ügyfélválasztás, módosítható befogadó és ÁFA-összesítés */
.manual-parties-section select,
.manual-parties-section input,
.manual-parties-section textarea {
  width: 100%;
}
.manual-parties-section input[readonly],
.manual-parties-section textarea[readonly] {
  background: #f4f6f8;
  color: #465568;
}
.manual-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 14px 22px;
  align-items: end;
}
.manual-summary-grid .summary-currency {
  grid-column: 1 / 2;
}
.manual-summary-grid label {
  margin: 0;
}
@media(max-width: 760px) {
  .manual-summary-grid {
    grid-template-columns: 1fr;
  }
  .manual-summary-grid .summary-currency {
    grid-column: auto;
  }
}


/* v0.2.20 – ügyféltörzs törzsszám-ellenőrzés */
.client-master-check-table td:first-child {
  width: 120px;
  white-space: nowrap;
}
.client-collision-entry {
  margin: 0 0 .45rem;
}
.client-collision-entry:last-child {
  margin-bottom: 0;
}
.client-collision-entry .muted {
  margin-left: .4rem;
  font-size: .86rem;
}
.client-duplicate-row > td {
  background: #fff7df;
}
.client-duplicate-row > td:first-child {
  box-shadow: inset 4px 0 0 #d99b16;
}


/* v0.4.1 – biztonságos írási API tesztoldal */
.api-test-intro ol {
  margin: .8rem 0 1rem 1.4rem;
}
.api-test-intro li {
  margin-bottom: .55rem;
}
.api-test-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}
.api-test-status-grid > div {
  padding: .8rem 1rem;
  border: 1px solid #dbe2ec;
  border-radius: 10px;
  background: #f7f9fc;
}
.api-test-status-grid span {
  display: block;
  margin-bottom: .25rem;
  color: #667085;
  font-size: .84rem;
}
.api-test-confirm {
  margin: 1rem 0;
  padding: .85rem 1rem;
  border: 1px solid #dbe2ec;
  border-radius: 10px;
  background: #fafbfc;
}
.api-test-results {
  margin-top: 1rem;
}
.api-test-summary {
  margin-top: 1rem;
}
.api-test-table th:first-child,
.api-test-table td:first-child {
  width: 42px;
  text-align: center;
}
.api-test-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 999px;
  font-weight: 800;
}
.test-pass .api-test-indicator {
  background: #e5f6eb;
  color: #176b38;
}
.test-fail .api-test-indicator {
  background: #fde8e8;
  color: #a12626;
}
.api-test-table details {
  margin-top: .4rem;
}
.api-test-table pre,
.api-test-summary pre {
  max-width: 720px;
  overflow: auto;
  padding: .75rem;
  border-radius: 8px;
  background: #182230;
  color: #eef2f6;
  font-size: .82rem;
  white-space: pre-wrap;
}
@media (max-width: 900px) {
  .api-test-status-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}
@media (max-width: 560px) {
  .api-test-status-grid {
    grid-template-columns: 1fr;
  }
}