/* ── SEPA Generator ── */

/* Izvori podataka */
.source-row {
  display: grid; grid-template-columns: 1fr 280px; gap: 16px; margin-bottom: 24px;
}
.source-row .upload-zone { padding: 32px 24px; }
.upload-zone.loading { opacity: 0.6; pointer-events: none; }
.source-card {
  border: 1px solid var(--border); border-radius: var(--radius);
  background: var(--surface); padding: 24px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center; gap: 10px;
}
.source-card h3 { font-size: 15px; font-weight: 600; }
.source-card p { font-size: 13px; color: var(--text-muted); }
.source-card .btn-sepa { margin-top: 6px; }

@media (max-width: 768px) {
  .source-row { grid-template-columns: 1fr; }
}

/* Popis plaćanja */
.list-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 12px;
}
.list-toolbar .sepa-date-row { margin-bottom: 0; }
.list-footer {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px;
}
.list-footer .sepa-total { margin-left: auto; }

.source-badge {
  display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 11px; font-weight: 600;
}
.source-badge.file { background: rgba(251,146,60,0.12); color: #fb923c; }
.source-badge.mer  { background: var(--accent-dim); color: var(--accent); }

.sepa-table-wrap td.col-iban { min-width: 230px; }
.sepa-table-wrap input.invalid { border-color: #ff6b6b !important; background: rgba(255,80,80,0.06); }
.sepa-table-wrap tr.row-invalid td.row-num { color: #ff6b6b; }

.row-remove-btn {
  width: 26px; height: 26px; border-radius: var(--radius-sm);
  border: 1px solid var(--border); background: transparent; color: var(--text-dim);
  cursor: pointer; display: inline-grid; place-items: center; transition: all 0.15s;
}
.row-remove-btn:hover { border-color: #ff6b6b; color: #ff6b6b; background: rgba(255,80,80,0.08); }
.row-remove-btn svg { width: 14px; height: 14px; }

/* Podaci platitelja mogu se otvoriti iznad popupa moj-eRačun */
#payerModal { z-index: 210; }

/* Popup moj-eRačun */
.modal-card.modal-wide {
  width: min(1100px, 95vw); max-height: 90vh;
  display: flex; flex-direction: column; padding: 24px 28px;
}
.modal-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px;
}
.modal-head h2 { margin-bottom: 0; }
.modal-head .header-meta { font-size: 12px; }
.mer-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 12px;
}
.mer-table-wrap { flex: 1; min-height: 200px; overflow: auto; }
.mer-table-wrap .table-scroll { overflow: visible; }
.mer-footer {
  display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap;
}
.mer-footer .action-bar-left { margin-right: auto; }
.mer-loading { padding: 48px; text-align: center; color: var(--text-muted); font-size: 13px; }
.mer-loading .sepa-loading-spinner { margin: 0 auto 12px; }
.link-btn {
  background: none; border: none; color: var(--text-muted); font-family: inherit;
  font-size: 12px; cursor: pointer; text-decoration: underline;
}
.link-btn:hover { color: var(--accent); }

/* Podnožje */
.page-footer {
  margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: var(--text-dim); flex-wrap: wrap; gap: 8px;
}