/* ============================================================
   NW-Forms — design system
   Modern, clean, Bootstrap 5 + custom layer
   ============================================================ */

:root {
  --nw-bg: #f6f8fa;
  --nw-surface: #ffffff;
  --nw-border: #e5e9f0;
  --nw-border-strong: #d3dae6;
  --nw-text: #1f2937;
  --nw-text-soft: #4b5563;
  --nw-muted: #6b7280;
  --nw-faint: #9aa4b2;
  --nw-primary: #2563eb;
  --nw-primary-soft: #eff4ff;
  --nw-success: #16a34a;
  --nw-success-soft: #ecfdf3;
  --nw-danger: #dc2626;
  --nw-danger-soft: #fef2f2;
  --nw-warning: #d97706;
  --nw-warning-soft: #fff7e8;
  --nw-info: #0891b2;
  --nw-info-soft: #ecfeff;
  --nw-radius: 10px;
  --nw-radius-lg: 14px;
  --nw-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --nw-shadow: 0 1px 3px rgba(16, 24, 40, 0.08), 0 4px 16px rgba(16, 24, 40, 0.05);
  --nw-shadow-lg: 0 8px 30px rgba(16, 24, 40, 0.12);
  --nw-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Motyw ciemny (przełącznik w menu, klucz localStorage "nw-theme") ---------- */
[data-theme="dark"] {
  --nw-bg: #0b1220;
  --nw-surface: #131c2e;
  --nw-border: #25314b;
  --nw-border-strong: #34425f;
  --nw-text: #e6ebf3;
  --nw-text-soft: #c2cddd;
  --nw-muted: #8b97ab;
  --nw-faint: #67748c;
  --nw-primary: #4f8dfd;
  --nw-primary-soft: rgba(59, 130, 246, 0.16);
  --nw-success-soft: rgba(22, 163, 74, 0.16);
  --nw-danger-soft: rgba(220, 38, 38, 0.16);
  --nw-warning-soft: rgba(217, 119, 6, 0.16);
  --nw-info-soft: rgba(8, 145, 178, 0.18);
  --nw-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --nw-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 4px 16px rgba(0, 0, 0, 0.35);
  --nw-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5);
  /* zmienne Bootstrap — .card i nagłówki dziedziczą --bs-body-color, nie --nw-text */
  --bs-body-bg: #0b1220;
  --bs-body-color: #e6ebf3;
  --bs-secondary-color: rgba(230, 235, 243, 0.72);
  --bs-tertiary-bg: #101827;
  --bs-border-color: #25314b;
  --bs-heading-color: inherit;
  --bs-emphasis-color: #f8fafc;
  --bs-link-color: #4f8dfd;
  --bs-link-hover-color: #7db0ff;
}
[data-theme="dark"] .nw-card > .nw-card-head { background: linear-gradient(#1a2440, #131c2e); }
[data-theme="dark"] .btn-outline-primary,
[data-theme="dark"] .btn-outline-secondary,
[data-theme="dark"] .btn-outline-success,
[data-theme="dark"] .btn-outline-danger,
[data-theme="dark"] .btn-outline-warning { background: transparent; }
[data-theme="dark"] .btn-outline-secondary { color: var(--nw-text-soft); }
[data-theme="dark"] .btn-outline-secondary:hover { background: #1c2740; color: var(--nw-text); }
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select { background-color: #0e1729; }
[data-theme="dark"] .form-check-input:not(:checked) { background-color: #0e1729; border-color: var(--nw-border-strong); }
[data-theme="dark"] table.table.nw-table { --bs-table-hover-bg: #182238; }
[data-theme="dark"] table.table.nw-table thead th { background: #101827; }
[data-theme="dark"] table.table.nw-table tbody tr:hover { background: #182238; }
[data-theme="dark"] table.table.nw-table tfoot td,
[data-theme="dark"] table.table.nw-table tfoot th { background: #101827; }
[data-theme="dark"] .nw-att { background: #101827; }
[data-theme="dark"] .nw-timeline li::before { background: var(--nw-surface); }
[data-theme="dark"] .page-item.disabled .page-link { background: var(--nw-surface); }
[data-theme="dark"] .nw-badge--in-edit { background: rgba(3, 105, 161, 0.18); color: #7cc4f8; border-color: rgba(124, 196, 248, 0.3); }
[data-theme="dark"] .nw-badge--submitted { color: #67c7e0; border-color: rgba(103, 199, 224, 0.3); }
[data-theme="dark"] .nw-badge--accepted { color: #7ed88f; border-color: rgba(126, 216, 143, 0.3); }
[data-theme="dark"] .nw-badge--paid { background: rgba(99, 102, 241, 0.18); color: #a5b4fc; border-color: rgba(165, 180, 252, 0.3); }
[data-theme="dark"] .nw-badge--rejected { color: #f3a0a0; border-color: rgba(243, 160, 160, 0.3); }
[data-theme="dark"] .nw-badge--deleted,
[data-theme="dark"] .nw-badge--muted { background: #1a2438; }
[data-theme="dark"] .alert-danger { color: #fca5a5; }
[data-theme="dark"] .alert-success { color: #86efac; }
[data-theme="dark"] .alert-warning { color: #fcd34d; }
[data-theme="dark"] a:hover { color: #7db0ff; }
[data-theme="dark"] .errorlist { color: #f87171; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #34425f; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #46557a; }

html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

body {
  font-family: var(--nw-font);
  background: var(--nw-bg);
  color: var(--nw-text);
  font-size: 0.925rem;
  line-height: 1.5;
}

/* ---------- Navbar ---------- */
.nw-navbar {
  background: #111827 !important;
  box-shadow: var(--nw-shadow);
  padding-block: 0.6rem;
}
.nw-navbar .navbar-brand {
  font-weight: 700;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 1.05rem;
}
.nw-navbar .brand-mark {
  width: 26px; height: 26px;
  border-radius: 7px;
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}
.nw-navbar .nav-link {
  color: #cbd5e1 !important;
  font-weight: 500;
  margin-inline: 0.15rem;
  border-radius: 8px;
  padding-inline: 0.75rem !important;
  transition: background 0.15s, color 0.15s;
}
.nw-navbar .nav-link:hover { background: rgba(255, 255, 255, 0.08); color: #fff !important; }
.nw-navbar .nav-link.active { background: rgba(255, 255, 255, 0.12); color: #fff !important; }
.nw-navbar .nav-user {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #e5e7eb !important;
}
.nw-navbar .avatar {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #374151;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
}
.nw-navbar .btn-link { color: #94a3b8 !important; font-weight: 500; }
.nw-navbar .btn-link:hover { color: #f87171 !important; }

/* ---------- Layout ---------- */
main.container { max-width: 1160px; }
.nw-page { padding-block: 1.5rem 3rem; }

.nw-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
}
.nw-page-head h1 {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}
.nw-page-head .lead-muted { color: var(--nw-muted); margin: 0.15rem 0 0; font-size: 0.9rem; }

/* ---------- Cards ---------- */
.nw-card {
  background: var(--nw-surface);
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius-lg);
  box-shadow: var(--nw-shadow-sm);
  margin-bottom: 1.25rem;
  overflow: hidden;
}
.nw-card > .nw-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--nw-border);
  background: linear-gradient(#fff, #fbfcfe);
}
.nw-card > .nw-card-head .nw-card-title {
  font-weight: 650;
  font-size: 1rem;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.nw-card > .nw-card-body { padding: 1.25rem; }
.nw-card--flat { box-shadow: none; }

/* ---------- Buttons ---------- */
.btn {
  font-weight: 550;
  border-radius: 8px;
  padding: 0.42rem 0.95rem;
  transition: all 0.15s ease;
  font-size: 0.9rem;
}
.btn:focus-visible { box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.25); }
.btn-primary {
  background: var(--nw-primary);
  border-color: var(--nw-primary);
  box-shadow: var(--nw-shadow-sm);
}
.btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; transform: translateY(-1px); box-shadow: var(--nw-shadow); }
.btn-outline-primary { color: var(--nw-primary); border-color: #c7d7fe; background: #fff; }
.btn-outline-primary:hover { background: var(--nw-primary-soft); border-color: var(--nw-primary); color: var(--nw-primary); }
.btn-outline-secondary { color: var(--nw-text-soft); border-color: var(--nw-border-strong); background: #fff; }
.btn-outline-secondary:hover { background: #f3f4f6; border-color: var(--nw-faint); color: var(--nw-text); }
.btn-outline-success { color: var(--nw-success); border-color: #bbf7d0; background: #fff; }
.btn-outline-success:hover { background: var(--nw-success-soft); border-color: var(--nw-success); color: var(--nw-success); }
.btn-outline-danger { color: var(--nw-danger); border-color: #fecaca; background: #fff; }
.btn-outline-danger:hover { background: var(--nw-danger-soft); border-color: var(--nw-danger); color: var(--nw-danger); }
.btn-outline-warning { color: var(--nw-warning); border-color: #fde68a; background: #fff; }
.btn-outline-warning:hover { background: var(--nw-warning-soft); border-color: var(--nw-warning); color: var(--nw-warning); }
.btn-danger { box-shadow: var(--nw-shadow-sm); }
.btn-danger:hover { transform: translateY(-1px); box-shadow: var(--nw-shadow); }
.btn-sm { padding: 0.3rem 0.65rem; font-size: 0.82rem; }

.btn-group > .btn + .btn { margin-left: -1px; }

/* ---------- Badges (status) ---------- */
.nw-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.28em 0.7em;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.nw-badge::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.85;
}
.nw-badge--in-edit    { background: #e0f2fe;               color: #0369a1; border-color: #bae6fd; }
.nw-badge--submitted  { background: var(--nw-info-soft);   color: #0e7490; border-color: #a5f3fc; }
.nw-badge--accepted   { background: var(--nw-success-soft); color: #15803d; border-color: #bbf7d0; }
.nw-badge--paid       { background: #f0f5ff;               color: #4338ca; border-color: #c7d2fe; }
.nw-badge--rejected   { background: var(--nw-danger-soft); color: #b91c1c; border-color: #fecaca; }
.nw-badge--deleted    { background: #f3f4f6;               color: var(--nw-muted); border-color: var(--nw-border-strong); }
.nw-badge--muted      { background: #f3f4f6;               color: var(--nw-muted); border-color: var(--nw-border); }
.nw-badge--deleted::before, .nw-badge--muted::before { display: none; }

/* ---------- Tables ---------- */
.nw-table-wrap { overflow-x: auto; }
table.table.nw-table {
  margin: 0;
  --bs-table-hover-bg: #f8fafc;
}
table.table.nw-table thead th {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--nw-muted);
  font-weight: 650;
  background: #fafbfc;
  border-bottom: 1px solid var(--nw-border);
  padding: 0.7rem 1rem;
  white-space: nowrap;
}
table.table.nw-table tbody td {
  padding: 0.75rem 1rem;
  border-color: var(--nw-border);
  vertical-align: middle;
  color: var(--nw-text-soft);
}
table.table.nw-table tbody tr:first-child td { border-top: 0; }
table.table.nw-table tbody tr:hover { background: #f8fafc; }
table.table.nw-table .cell-strong { color: var(--nw-text); font-weight: 600; }
table.table.nw-table .cell-link {
  color: var(--nw-primary);
  text-decoration: none;
  font-weight: 550;
}
table.table.nw-table .cell-link:hover { text-decoration: underline; }
table.table.nw-table tfoot td, table.table.nw-table tfoot th {
  background: #fafbfc;
  font-weight: 650;
  color: var(--nw-text);
}

/* ---------- Forms ---------- */
.form-label { font-weight: 600; font-size: 0.85rem; color: var(--nw-text-soft); margin-bottom: 0.3rem; }
.form-control, .form-select {
  border-color: var(--nw-border-strong);
  border-radius: 8px;
  font-size: 0.9rem;
  color: var(--nw-text);
  background-color: #fff;
}
.form-control:focus, .form-select:focus {
  border-color: var(--nw-primary);
  box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.15);
}
.form-control::placeholder { color: var(--nw-faint); }
.form-check-input:checked { background-color: var(--nw-primary); border-color: var(--nw-primary); }

/* Filter bar */
.nw-filter {
  background: var(--nw-surface);
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius-lg);
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
  box-shadow: var(--nw-shadow-sm);
}
.nw-filter .form-control, .nw-filter .form-select { font-size: 0.85rem; }
.nw-filter .nw-date { width: 148px; }
.nw-filter .nw-amt { width: 108px; }
.nw-adv-caret { display: inline-block; transition: transform 0.15s ease; font-size: 0.75em; }
.nw-adv-toggle[aria-expanded="true"] .nw-adv-caret { transform: rotate(180deg); }

/* ---------- Misc ---------- */
a { color: var(--nw-primary); }
a:hover { color: #1d4ed8; }
.text-muted { color: var(--nw-muted) !important; }
.text-nowrap { white-space: nowrap; }

.nw-divider { border-top: 1px solid var(--nw-border); margin: 1.25rem 0; }

.nw-empty {
  text-align: center;
  color: var(--nw-faint);
  padding: 2.5rem 1rem !important;
  font-size: 0.9rem;
}
.nw-empty .nw-empty-icon { font-size: 1.8rem; opacity: 0.6; margin-bottom: 0.5rem; }

/* Detail meta grid */
.nw-meta { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; }
.nw-meta .nw-meta-item { }
.nw-meta .nw-meta-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--nw-faint);
  font-weight: 650;
  margin-bottom: 0.2rem;
}
.nw-meta .nw-meta-value { font-weight: 600; color: var(--nw-text); font-size: 0.95rem; }
.nw-meta .nw-meta-value.big { font-size: 1.35rem; font-weight: 700; letter-spacing: -0.01em; }

/* Timeline / history */
.nw-timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.nw-timeline::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: var(--nw-border);
}
.nw-timeline li {
  position: relative;
  padding: 0 0 1rem 1.9rem;
}
.nw-timeline li:last-child { padding-bottom: 0; }
.nw-timeline li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 5px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--nw-primary);
}
.nw-timeline li.nw-tl-muted::before { border-color: var(--nw-faint); }
.nw-timeline .nw-tl-time { font-size: 0.75rem; color: var(--nw-faint); font-weight: 600; }
.nw-timeline .nw-tl-text { color: var(--nw-text-soft); }
.nw-timeline .nw-tl-text .who { font-weight: 600; color: var(--nw-text); }

/* Comments */
.nw-comment {
  display: flex;
  gap: 0.75rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--nw-border);
}
.nw-comment:last-child { border-bottom: 0; }
.nw-comment .nw-comment-avatar {
  flex: 0 0 34px;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #64748b, #334155);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
}
.nw-comment .nw-comment-body { flex: 1; min-width: 0; }
.nw-comment .nw-comment-head { display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.nw-comment .nw-comment-author { font-weight: 650; color: var(--nw-text); }
.nw-comment .nw-comment-time { font-size: 0.75rem; color: var(--nw-faint); }
.nw-comment .nw-comment-text { color: var(--nw-text-soft); margin-top: 0.1rem; word-wrap: break-word; }

/* Attachment list */
.nw-att {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius);
  background: #fbfcfe;
  margin-bottom: 0.5rem;
}
.nw-att:last-child { margin-bottom: 0; }
.nw-att .nw-att-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: var(--nw-primary-soft);
  color: var(--nw-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex: 0 0 36px;
}
.nw-att .nw-att-name { font-weight: 600; color: var(--nw-text); text-decoration: none; }
.nw-att .nw-att-name:hover { color: var(--nw-primary); }
.nw-att .nw-att-meta { font-size: 0.75rem; color: var(--nw-faint); }

/* Alerts */
.alert { border: 0; border-radius: var(--nw-radius); font-size: 0.9rem; }
.alert-danger { background: var(--nw-danger-soft); color: #991b1b; }
.alert-success { background: var(--nw-success-soft); color: #166534; }
.alert-warning { background: var(--nw-warning-soft); color: #92400e; }

/* Login */
.nw-login-wrap { min-height: calc(100vh - 64px); display: flex; align-items: center; }
.nw-login-card { max-width: 400px; width: 100%; }
.nw-login-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}
.nw-login-brand .brand-mark {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 800;
  font-size: 1.1rem;
  box-shadow: var(--nw-shadow);
}

/* Pagination */
.pagination { margin: 1.5rem 0 0; }
.page-link { color: var(--nw-primary); border-color: var(--nw-border-strong); font-weight: 500; }
.page-item.disabled .page-link { background: #fff; }

/* Action bar (detail top) */
.nw-actionbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  background: var(--nw-surface);
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius-lg);
  padding: 0.9rem 1.25rem;
  margin-bottom: 1.25rem;
  box-shadow: var(--nw-shadow-sm);
}
.nw-actionbar .nw-actionbar-title { font-weight: 700; font-size: 1.15rem; }

/* Section label */
.nw-section-label {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--nw-faint);
  font-weight: 700;
  margin: 0 0 0.6rem;
}

/* Global busy overlay (T16: double-submit guard) */
.nw-busy-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(31, 41, 55, 0.45);
}
.nw-busy-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  background: var(--nw-surface);
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
  padding: 1.5rem 2.25rem;
}
.nw-busy-text {
  color: var(--nw-text-soft);
  font-weight: 600;
  font-size: 0.95rem;
}

/* Scrollbar (subtle) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; border: 2px solid var(--nw-bg); }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Print */
@media print {
  .nw-navbar, .nw-actionbar, .btn, .nw-filter, .nw-busy-overlay { display: none !important; }
  /* motyw ciemny nie może wypaść w druku: wymuś jasne kolory na białym papierze */
  * { background: transparent !important; color: #1f2937 !important; }
  body { background: #fff !important; }
  .nw-card { box-shadow: none; border: 1px solid #ddd; break-inside: avoid; }
}

/* ── Wskaźnik siły hasła ─────────────────────────────────────────── */
.pw-indicator { margin: 0.25rem 0 0.75rem; max-width: 360px; }
.pw-bar { height: 6px; border-radius: 3px; background: var(--nw-border); overflow: hidden; }
.pw-bar__fill { display: block; height: 100%; border-radius: 3px; transition: width 0.15s ease, background-color 0.15s ease; }
.pw--weak { background-color: #b91c1c; }
.pw--ok { background-color: #b45309; }
.pw--good { background-color: #15803d; }
.pw--strong { background-color: #16a34a; }
.pw-label { font-size: 0.8rem; margin-top: 0.25rem; color: var(--nw-muted); }
.pw-criteria { list-style: none; padding: 0; margin: 0.4rem 0 0; font-size: 0.8rem; display: flex; flex-wrap: wrap; gap: 0.25rem 0.9rem; }
.pw-criterion { color: var(--nw-muted); }
.pw-criterion::before { content: "✗"; color: #b91c1c; margin-right: 0.3rem; }
.pw-criterion.is-pass { color: #15803d; }
.pw-criterion.is-pass::before { content: "✓"; color: #15803d; }
.pw-match { display: block; font-size: 0.8rem; margin-top: 0.3rem; }
.pw-match--ok { color: #15803d; }
.pw-match--bad { color: #b91c1c; }