/* LCARS-inspired system dla DokumentCentrum
   Umiarkowana stylizacja: paleta + typografia LCARS, nowoczesny funkcjonalny układ */

@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* Paleta LCARS - TNG */
  --lcars-orange: #FF9900;
  --lcars-orange-dim: #CC7A00;
  --lcars-violet: #CC99CC;
  --lcars-violet-dim: #9966AA;
  --lcars-blue: #9999FF;
  --lcars-blue-dim: #7777DD;
  --lcars-peach: #FFCC99;
  --lcars-red: #FF6666;
  --lcars-red-deep: #CC3333;
  --lcars-gold: #FFCC66;
  --lcars-green: #99CC99;

  /* Dark mode (domyślny) */
  --bg: #000000;
  --bg-elev: #0A0A12;
  --bg-card: #10101C;
  --bg-hover: #18182A;
  --border: #222236;
  --fg: #F5F5F5;
  --fg-dim: #AAAABB;
  --fg-mute: #6B6B80;

  /* Ornamenty */
  --radius-pill: 999px;
  --radius-elbow: 28px;
  --radius-card: 6px;

  --row-h: 42px;
}

[data-theme="light"] {
  --bg: #F3EDE2;
  --bg-elev: #FFFFFF;
  --bg-card: #FFFFFF;
  --bg-hover: #F7EFE0;
  --border: #E5D8C0;
  --fg: #1A1A20;
  --fg-dim: #4A4A55;
  --fg-mute: #888894;
  --lcars-orange: #E68200;
  --lcars-violet: #A56FB0;
  --lcars-blue: #5858C8;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

body {
  min-height: 100vh;
  overflow-x: hidden;
}

.lcars-heading {
  font-family: 'Antonio', 'Arial Narrow', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.mono { font-family: 'JetBrains Mono', 'SF Mono', monospace; }

/* ===== APP SHELL ===== */
.app {
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 100vh;
}

.app.ornaments-off { grid-template-columns: 220px 1fr; }

@media (max-width: 900px) {
  .app, .app.ornaments-off { grid-template-columns: 1fr !important; }
}

/* ===== SIDEBAR - LCARS style ===== */
.sidebar {
  background: var(--bg);
  padding: 14px 12px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}

.side-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px 14px 20px;
  background: var(--lcars-orange);
  color: #1A0F00;
  border-radius: var(--radius-elbow) var(--radius-pill) var(--radius-pill) var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}

.side-brand-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #1A0F00;
  flex-shrink: 0;
}

.side-brand-sub {
  font-size: 10px;
  font-weight: 500;
  opacity: 0.7;
  letter-spacing: 0.1em;
}

.side-group-label {
  font-family: 'Antonio', sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--lcars-violet);
  padding: 12px 16px 6px 20px;
  text-transform: uppercase;
}

.side-item {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 12px;
  background: var(--bg-card);
  color: var(--fg-dim);
  border: none;
  border-radius: var(--radius-pill) 4px 4px var(--radius-pill);
  cursor: pointer;
  text-align: left;
  font-family: 'Antonio', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: background 0.12s, color 0.12s;
  width: 100%;
}

.side-item:hover {
  background: var(--bg-hover);
  color: var(--fg);
}

.side-item::before {
  content: "";
  width: 6px;
  height: 22px;
  background: var(--lcars-blue);
  border-radius: 2px;
  transition: background 0.12s, height 0.12s;
}

.side-item[aria-current="true"] {
  background: var(--lcars-orange);
  color: #1A0F00;
}

.side-item[aria-current="true"]::before {
  background: #1A0F00;
  height: 26px;
}

.side-item .side-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--fg-mute);
  font-weight: 400;
}

.side-item[aria-current="true"] .side-count {
  color: #1A0F00;
  opacity: 0.7;
}

.side-spacer { flex: 1; }

.side-footer {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 12px;
}

.side-ornament {
  height: 26px;
  background: var(--lcars-violet);
  border-radius: 4px var(--radius-pill) var(--radius-pill) 4px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 14px;
  color: #0A0510;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.side-ornament.blue { background: var(--lcars-blue); }
.side-ornament.peach { background: var(--lcars-peach); }
.side-ornament.red { background: var(--lcars-red); color: #300; }

/* ===== MAIN AREA ===== */
.main {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--bg);
}

/* Top "elbow" bar */
.topbar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 14px 28px 10px 0;
  min-height: 64px;
}

@media (max-width: 1280px) {
  .topbar { grid-template-columns: auto 1fr auto; }
  .topbar-stat { padding: 5px 10px; font-size: 10px; }
  .topbar-stat.secondary { display: none; }
}

@media (max-width: 1100px) {
  .topbar {
    grid-template-columns: 1fr auto;
    grid-template-areas: "elbow user" "stats stats";
    row-gap: 8px;
  }
  .topbar-elbow { grid-area: elbow; }
  .topbar-user { grid-area: user; }
  .topbar-center { grid-area: stats; }
}

.topbar-elbow {
  height: 48px;
  background: var(--lcars-orange);
  border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
  display: flex;
  align-items: flex-end;
  padding: 0 20px 8px 24px;
  color: #1A0F00;
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  min-width: 280px;
}

.topbar-elbow-sub {
  font-size: 11px;
  font-weight: 500;
  opacity: 0.65;
  margin-left: 12px;
  letter-spacing: 0.12em;
}

.topbar-center {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.topbar-stat {
  font-family: 'Antonio', sans-serif;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fg-mute);
  padding: 6px 14px;
  background: var(--bg-card);
  border-radius: var(--radius-pill);
  display: flex;
  gap: 8px;
  align-items: center;
}

.topbar-stat b {
  font-family: 'JetBrains Mono', monospace;
  color: var(--fg);
  font-weight: 500;
}

.topbar-user {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 6px 6px 14px;
  background: var(--bg-card);
  border-radius: var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.topbar-user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--lcars-violet);
  color: #1A0520;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 11px;
}

/* Content */
.content {
  padding: 8px 28px 40px 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.content-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

/* ===== TABLE ===== */
.toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 0;
}

.search-input {
  flex: 1;
  min-width: 200px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--fg);
  padding: 9px 14px;
  border-radius: var(--radius-pill);
  font-family: inherit;
  font-size: 13px;
  outline: none;
  transition: border-color 0.12s;
}

.search-input:focus { border-color: var(--lcars-orange); }

.filter-chip {
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--fg-dim);
  padding: 8px 14px;
  border-radius: var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.12s;
}

.filter-chip:hover { color: var(--fg); border-color: var(--lcars-violet); }

.filter-chip.active {
  background: var(--lcars-violet);
  border-color: var(--lcars-violet);
  color: #0A0510;
}

.filter-chip.active.orange { background: var(--lcars-orange); border-color: var(--lcars-orange); color: #1A0F00; }
.filter-chip.active.blue { background: var(--lcars-blue); border-color: var(--lcars-blue); color: #050530; }

.btn {
  background: var(--lcars-orange);
  border: none;
  color: #1A0F00;
  padding: 9px 18px;
  border-radius: var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: filter 0.12s, transform 0.05s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.btn:hover { filter: brightness(1.1); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: 0.4; cursor: not-allowed; }

.btn.violet { background: var(--lcars-violet); color: #0A0510; }
.btn.blue { background: var(--lcars-blue); color: #050530; }
.btn.ghost { background: transparent; color: var(--fg-dim); border: 1px solid var(--border); }
.btn.ghost:hover { color: var(--fg); border-color: var(--lcars-orange); }
.btn.red { background: var(--lcars-red); color: #300; }

/* Table */
.data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--bg-card);
  border-radius: var(--radius-card);
  overflow: hidden;
}

.data-table th {
  font-family: 'Antonio', sans-serif;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lcars-peach);
  text-align: left;
  padding: 12px 14px;
  background: var(--bg-elev);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  position: sticky;
  top: 0;
  cursor: pointer;
  user-select: none;
}

[data-theme="light"] .data-table th { color: var(--lcars-orange); }

.data-table th.sort-active { color: var(--lcars-orange); }
.data-table th .sort-indicator { font-family: 'JetBrains Mono', monospace; margin-left: 4px; opacity: 0.7; }

.data-table td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: var(--fg);
  white-space: nowrap;
  vertical-align: middle;
}

.data-table tr:last-child td { border-bottom: none; }

.data-table tbody tr { transition: background 0.1s; cursor: pointer; }
.data-table tbody tr:hover { background: var(--bg-hover); }

.data-table td.num { font-family: 'JetBrains Mono', monospace; text-align: right; font-variant-numeric: tabular-nums; }
.data-table td.mono { font-family: 'JetBrains Mono', monospace; font-size: 12px; }

.col-kontrahent { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }

/* KSeF Status */
.ksef-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px 4px 4px;
  border-radius: var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500;
  background: var(--bg-elev);
}

.ksef-status-dot {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
}

.ksef-zaakceptowano .ksef-status-dot { background: var(--lcars-green); color: #063; }
.ksef-zaakceptowano { color: var(--lcars-green); }

.ksef-oczekuje .ksef-status-dot { background: var(--lcars-gold); color: #642; }
.ksef-oczekuje { color: var(--lcars-gold); }

.ksef-odrzucono .ksef-status-dot { background: var(--lcars-red); color: #300; }
.ksef-odrzucono { color: var(--lcars-red); }

.ksef-nie_dotyczy .ksef-status-dot { background: var(--fg-mute); color: var(--bg); }
.ksef-nie_dotyczy { color: var(--fg-mute); }

.ksef-wysylanie .ksef-status-dot {
  background: var(--lcars-blue);
  color: #050530;
  animation: pulse 0.8s ease-in-out infinite;
}
.ksef-wysylanie { color: var(--lcars-blue); }

@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(0.85); opacity: 0.6; }
}

/* Payment indicator */
.pay-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.pay-ring { flex-shrink: 0; }
.pay-ring-bg {
  fill: none;
  stroke: var(--border);
  stroke-width: 2.5;
}
.pay-ring-fg {
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.3s;
}
.pay-paid .pay-ring-fg { stroke: var(--lcars-green); }
.pay-partial .pay-ring-fg { stroke: var(--lcars-gold); }
.pay-empty .pay-ring-fg { stroke: transparent; }

.pay-empty { color: var(--fg-mute); }

/* Row action buttons */
.row-actions { display: flex; gap: 4px; justify-content: flex-end; }
.icon-btn {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--bg-elev);
  border: 1px solid transparent;
  color: var(--fg-dim);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: all 0.12s;
  flex-shrink: 0;
}
.icon-btn:hover {
  background: var(--lcars-orange);
  color: #1A0F00;
}
.icon-btn.blue:hover { background: var(--lcars-blue); color: #050530; }
.icon-btn.violet:hover { background: var(--lcars-violet); color: #0A0510; }
.icon-btn svg { width: 14px; height: 14px; }

/* ===== EMPTY / SKELETON STATES ===== */
.skeleton-wrap {
  background: var(--bg-card);
  border-radius: var(--radius-card);
  padding: 48px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  text-align: center;
  border: 1px dashed var(--border);
}

.skeleton-ornament {
  width: 80px;
  height: 80px;
  border-radius: 999px 8px 8px 999px;
  background: var(--lcars-violet);
  position: relative;
}

.skeleton-ornament::after {
  content: "";
  position: absolute;
  right: -20px;
  top: 20px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: var(--lcars-blue);
}

.skeleton-title {
  font-family: 'Antonio', sans-serif;
  font-size: 22px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fg);
}

.skeleton-sub {
  color: var(--fg-dim);
  max-width: 460px;
}

/* ===== MODAL / DRAWER ===== */
.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(4px);
  z-index: 40;
  display: grid;
  place-items: center;
  animation: fadeIn 0.18s;
}

.drawer {
  position: fixed;
  right: 0;
  top: 0;
  bottom: 0;
  width: min(720px, 92vw);
  background: var(--bg);
  z-index: 50;
  box-shadow: -20px 0 40px rgba(0, 0, 0, 0.5);
  animation: slideRight 0.22s;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

@keyframes slideRight {
  from { transform: translateX(40px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.drawer-header {
  padding: 20px 28px 16px;
  border-bottom: 1px solid var(--border);
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 16px;
  align-items: center;
}

.drawer-elbow {
  height: 44px;
  background: var(--lcars-violet);
  border-radius: var(--radius-pill);
  padding: 0 18px;
  display: flex;
  align-items: center;
  color: #0A0510;
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.drawer-title {
  font-family: 'Antonio', sans-serif;
  font-size: 22px;
  letter-spacing: 0.04em;
}

.drawer-body {
  padding: 24px 28px;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.drawer-footer {
  padding: 16px 28px;
  border-top: 1px solid var(--border);
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}

/* Grid of detail cards */
.detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.detail-card {
  background: var(--bg-card);
  padding: 14px 16px;
  border-radius: var(--radius-card);
  border-left: 4px solid var(--lcars-blue);
}

.detail-card.violet { border-left-color: var(--lcars-violet); }
.detail-card.orange { border-left-color: var(--lcars-orange); }

.detail-label {
  font-family: 'Antonio', sans-serif;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--fg-mute);
  text-transform: uppercase;
  margin-bottom: 4px;
}

.detail-value {
  font-size: 14px;
  color: var(--fg);
  font-weight: 500;
}

.detail-value.big {
  font-family: 'JetBrains Mono', monospace;
  font-size: 20px;
  font-weight: 500;
}

/* Items table */
.items-table {
  width: 100%;
  font-size: 12px;
  border-collapse: collapse;
}
.items-table th, .items-table td {
  padding: 8px 10px;
  text-align: left;
}
.items-table th {
  font-family: 'Antonio', sans-serif;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fg-mute);
  border-bottom: 1px solid var(--border);
}
.items-table td { border-bottom: 1px solid var(--border); }
.items-table td.num { font-family: 'JetBrains Mono', monospace; text-align: right; font-variant-numeric: tabular-nums; }

/* KSeF error banner */
.ksef-error {
  background: rgba(255, 102, 102, 0.08);
  border: 1px solid var(--lcars-red);
  border-radius: var(--radius-card);
  padding: 14px 16px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
}
.ksef-error-icon {
  width: 28px; height: 28px;
  border-radius: 999px;
  background: var(--lcars-red);
  color: #300;
  display: grid;
  place-items: center;
  font-weight: 700;
}
.ksef-error-title {
  font-family: 'Antonio', sans-serif;
  color: var(--lcars-red);
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

/* KSeF sending overlay */
.ksef-send-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(6px);
  display: grid;
  place-items: center;
  z-index: 10;
}

.ksef-send-core {
  text-align: center;
  padding: 32px 40px;
  background: var(--bg-card);
  border-radius: var(--radius-card);
  border: 1px solid var(--lcars-blue);
  min-width: 340px;
}

.ksef-spinner {
  width: 64px;
  height: 64px;
  margin: 0 auto 16px;
  border-radius: 999px;
  border: 4px solid var(--border);
  border-top-color: var(--lcars-orange);
  border-right-color: var(--lcars-violet);
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.ksef-send-title {
  font-family: 'Antonio', sans-serif;
  font-size: 16px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lcars-orange);
}

.ksef-send-sub {
  margin-top: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--fg-dim);
}

.ksef-send-log {
  margin-top: 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: var(--fg-mute);
  text-align: left;
  padding: 10px 12px;
  background: var(--bg);
  border-radius: 4px;
  max-height: 120px;
  overflow: hidden;
}

.ksef-send-log-line { opacity: 0; animation: logIn 0.3s forwards; }
.ksef-send-log-line.ok { color: var(--lcars-green); }
.ksef-send-log-line.err { color: var(--lcars-red); }

@keyframes logIn {
  to { opacity: 1; }
}

/* ===== LOGIN PAGE ===== */
.login-wrap {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 280px 1fr;
  background: var(--bg);
}

.login-side {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.login-side .side-ornament { height: 38px; font-size: 11px; padding: 0 16px; align-items: center !important; justify-content: flex-end; }
.login-side .side-ornament.tall { height: 120px; align-items: center !important; padding: 0 16px !important; }
.login-side .side-ornament.short { height: 18px; }

.login-brand {
  background: var(--lcars-orange);
  color: #1A0F00;
  padding: 20px 22px;
  border-radius: var(--radius-elbow) var(--radius-pill) var(--radius-pill) var(--radius-pill);
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 0.04em;
  line-height: 1.1;
  margin-bottom: 4px;
}

.login-brand-sub {
  font-size: 11px;
  font-weight: 500;
  opacity: 0.7;
  letter-spacing: 0.14em;
  margin-top: 4px;
}

.login-main {
  display: grid;
  place-items: center;
  padding: 40px;
  position: relative;
}

.login-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 153, 0, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 153, 0, 0.04) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
}

.login-card {
  background: var(--bg-card);
  border-radius: var(--radius-card);
  padding: 0;
  width: min(420px, 100%);
  overflow: hidden;
  position: relative;
  z-index: 1;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.login-header {
  background: var(--lcars-violet);
  color: #0A0510;
  padding: 14px 22px 14px 22px;
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.login-header b { color: #0A0510; font-weight: 700; }

.login-form {
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.login-title {
  font-family: 'Antonio', sans-serif;
  font-size: 26px;
  letter-spacing: 0.04em;
  line-height: 1.1;
  margin-bottom: 4px;
}

.login-sub {
  color: var(--fg-dim);
  font-size: 13px;
  margin-bottom: 12px;
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-label {
  font-family: 'Antonio', sans-serif;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lcars-peach);
}
[data-theme="light"] .form-label { color: var(--lcars-orange); }

.form-input {
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--fg);
  padding: 12px 14px;
  border-radius: 4px;
  font-family: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color 0.12s, background 0.12s;
}

.form-input:focus {
  border-color: var(--lcars-orange);
  background: var(--bg-elev);
}

.form-input.error { border-color: var(--lcars-red); }

.form-error {
  background: rgba(255, 102, 102, 0.08);
  border-left: 3px solid var(--lcars-red);
  color: var(--lcars-red);
  padding: 10px 14px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  border-radius: 2px;
  animation: shake 0.3s;
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}

.login-hint {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--fg-mute);
  padding: 12px 14px;
  background: var(--bg);
  border-radius: 4px;
  line-height: 1.6;
  border-left: 3px solid var(--lcars-blue);
}

.login-footer {
  background: var(--bg-elev);
  padding: 12px 22px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: var(--fg-mute);
  display: flex;
  justify-content: space-between;
  border-top: 1px solid var(--border);
}

/* Boot sequence */
.boot-screen {
  position: fixed;
  inset: 0;
  background: #000;
  z-index: 100;
  display: flex;
  flex-direction: column;
  padding: 60px;
  font-family: 'JetBrains Mono', monospace;
  color: var(--lcars-orange);
  font-size: 12px;
  animation: fadeIn 0.2s;
}

.boot-line { opacity: 0; animation: logIn 0.2s forwards; margin-bottom: 4px; }
.boot-line.ok { color: var(--lcars-green); }
.boot-line.big { font-family: 'Antonio', sans-serif; font-size: 32px; letter-spacing: 0.1em; margin: 20px 0; color: var(--lcars-orange); }

/* ===== SETTINGS / INVITE DIALOG ===== */
.settings-grid {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 16px;
  min-height: 480px;
}

.settings-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.settings-nav button {
  background: var(--bg-card);
  border: none;
  color: var(--fg-dim);
  padding: 10px 14px;
  border-radius: 4px var(--radius-pill) var(--radius-pill) 4px;
  text-align: left;
  cursor: pointer;
  font-family: 'Antonio', sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-left: 4px solid var(--lcars-violet);
  transition: all 0.12s;
}

.settings-nav button:hover { color: var(--fg); }
.settings-nav button[aria-current="true"] {
  background: var(--lcars-violet);
  color: #0A0510;
  border-left-color: var(--lcars-orange);
}

.settings-panel {
  background: var(--bg-card);
  border-radius: var(--radius-card);
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.settings-panel h2 {
  font-family: 'Antonio', sans-serif;
  font-size: 18px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 8px;
  color: var(--lcars-orange);
}

/* Ornaments-off simplification */
.ornaments-off .side-ornament { display: none; }
.ornaments-off .side-brand { border-radius: 6px; }
.ornaments-off .topbar-elbow { border-radius: 6px; margin-left: 14px; }
.ornaments-off .side-item { border-radius: 4px; }
.ornaments-off .side-item::before { display: none; }
.ornaments-off .side-item { grid-template-columns: 1fr auto; padding-left: 16px; }

/* Invite list */
.user-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.user-row {
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 10px 14px;
  background: var(--bg-elev);
  border-radius: 4px;
}

.user-avatar {
  width: 32px; height: 32px;
  border-radius: 999px;
  background: var(--lcars-blue);
  color: #050530;
  display: grid;
  place-items: center;
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
}

.user-status {
  font-family: 'Antonio', sans-serif;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--bg);
}
.user-status.active { color: var(--lcars-green); }
.user-status.pending { color: var(--lcars-gold); }

/* ===== CONFIRM DIALOG ===== */
.confirm-dialog {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0,0,0,0.65);
  backdrop-filter: blur(4px);
  animation: fadeIn 0.18s;
}

.confirm-card {
  background: var(--bg-card);
  border-radius: var(--radius-card);
  overflow: hidden;
  width: min(460px, 100%);
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  animation: slideRight 0.22s;
}

.confirm-header {
  background: var(--lcars-orange);
  color: #1A0F00;
  padding: 14px 22px;
  font-family: 'Antonio', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.confirm-body {
  padding: 24px 24px 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.confirm-title {
  font-family: 'Antonio', sans-serif;
  font-size: 22px;
  letter-spacing: 0.04em;
  line-height: 1.15;
}

.confirm-text {
  color: var(--fg-dim);
  font-size: 13px;
  line-height: 1.55;
}

.confirm-summary {
  background: var(--bg);
  border-radius: 4px;
  padding: 12px 14px;
  border-left: 3px solid var(--lcars-blue);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 14px;
  font-size: 12px;
}

.confirm-summary dt {
  font-family: 'Antonio', sans-serif;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fg-mute);
  margin: 0;
}

.confirm-summary dd {
  margin: 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--fg);
}

.confirm-footer {
  padding: 14px 24px;
  background: var(--bg-elev);
  border-top: 1px solid var(--border);
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

/* ===== RESPONSIVE TABLE — cards on narrow screens ===== */
/* Dane mobile-card mode; aktywne tylko w media query */
@media (max-width: 900px) {
  .app { grid-template-columns: 1fr; }
  .sidebar {
    position: static;
    z-index: 30;
    height: auto;
    flex-direction: row;
    overflow: visible;
    gap: 6px;
    padding: 8px 10px;
    flex-wrap: wrap;
    align-items: center;
    background: var(--bg-elev);
    border-bottom: 1px solid var(--border);
  }
  .sidebar .side-group-label,
  .sidebar .side-footer,
  .sidebar .side-spacer { display: none; }
  .side-brand {
    flex-shrink: 0;
    margin: 0;
    padding: 8px 14px;
    font-size: 13px;
    border-radius: var(--radius-pill);
  }
  .side-brand-sub { display: none; }
  .side-brand > div > div:first-child { line-height: 1; }

  .side-item {
    flex-shrink: 0;
    width: auto;
    border-radius: var(--radius-pill);
    padding: 8px 14px;
    font-size: 12px;
    grid-template-columns: auto auto;
    gap: 8px;
  }
  .side-item::before { display: none; }
  .side-item .side-count { display: none; }
  .ornaments-off .side-item { padding: 8px 14px; }

  .detail-grid { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }
  .login-wrap { grid-template-columns: 1fr; }
  .login-side { display: none; }
  .content { padding: 0 12px 40px; }
  .topbar {
    padding: 10px 12px 8px 0;
    grid-template-columns: 1fr;
    grid-template-areas: "elbow" "stats";
    row-gap: 8px;
  }
  .topbar-user { display: none; }
  .topbar-center { grid-area: stats; flex-wrap: wrap; }
  .topbar-elbow { min-width: 0; padding: 0 16px; height: 38px; font-size: 15px; border-radius: 0 var(--radius-pill) var(--radius-pill) 0; align-items: center; }
  .topbar-elbow-sub { display: none; }
  .topbar-stat { padding: 5px 10px; font-size: 10px; }
}

/* Card-mode for sales table (także na tablecie i małym desktopie do 1320px gdzie tabela nie mieści się bez scrolla) */
@media (max-width: 1320px) {
  .sales-table thead { display: none; }
  .sales-table, .sales-table tbody, .sales-table tr, .sales-table td {
    display: block;
    width: 100%;
  }
  .sales-table tr {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    margin-bottom: 10px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    position: relative;
  }
  .sales-table tr:hover { background: var(--bg-card); }
  .sales-table td {
    border: none !important;
    padding: 3px 0 !important;
    white-space: normal !important;
    text-align: left !important;
  }
  .sales-table td.num { text-align: left !important; }

  /* Row 1: status + numer na jednej linii */
  .sales-table td[data-col="ksef"] {
    display: inline-flex !important;
    width: auto !important;
    margin-right: 10px;
    vertical-align: middle;
  }
  /* Na mobile: tylko ikona bez tekstu statusu */
  .sales-table td[data-col="ksef"] .ksef-status {
    padding: 2px;
    background: transparent;
    font-size: 0;
    gap: 0;
  }
  .sales-table td[data-col="ksef"] .ksef-status-dot {
    width: 26px;
    height: 26px;
  }
  .sales-table td[data-col="numer"] {
    display: inline-block !important;
    width: auto !important;
    vertical-align: middle;
    font-size: 13px;
    font-weight: 500;
    margin-right: 10px;
  }

  /* Termin i data razem jako metadata pod numerem */
  .sales-table td[data-col="data"],
  .sales-table td[data-col="termin"] {
    display: inline !important;
    width: auto !important;
    color: var(--fg-mute);
    font-size: 11px;
    margin-right: 10px;
  }
  .sales-table td[data-col="data"]::before { content: "◷ "; }
  .sales-table td[data-col="termin"]::before { content: "→ "; }
  .sales-table tr::after {
    content: "";
    display: block;
    height: 1px;
    background: var(--border);
    margin: 8px 0;
  }

  /* Nabywca */
  .sales-table td[data-col="nabywca"] {
    font-weight: 500;
    font-size: 14px;
    padding-bottom: 6px !important;
    white-space: normal !important;
    max-width: none !important;
  }

  /* Brutto + zaplacono w grid */
  .sales-table td[data-col="brutto"],
  .sales-table td[data-col="zaplacono"] {
    display: inline-flex !important;
    width: 49% !important;
    flex-direction: column;
    gap: 2px;
    padding-top: 6px !important;
  }
  .sales-table td[data-col="brutto"]::before,
  .sales-table td[data-col="zaplacono"]::before {
    font-family: 'Antonio', sans-serif;
    font-size: 9px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fg-mute);
  }
  .sales-table td[data-col="brutto"]::before { content: "Brutto"; }
  .sales-table td[data-col="zaplacono"]::before { content: "Zapłacono"; }

  /* Row actions absolute top-right of card */
  .sales-table td[data-col="actions"] {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 0 !important;
  }
}

/* Toolbar na mobile — search na pełną szerokość, chipy zawijają */
@media (max-width: 900px) {
  .toolbar { gap: 6px; flex-wrap: wrap; }
  .toolbar > div:first-child { flex-basis: 100%; min-width: 0; }
  .toolbar .search-input { min-width: 0; width: 100%; }
  .filter-chip { font-size: 11px; padding: 6px 10px; }
  .toolbar .btn { flex-shrink: 0; }
}

/* Tablet: 2-wierszowy układ z większą ilością danych w gridzie — także do 1320px gdzie pełna tabela nie mieści się bez scrolla */
@media (min-width: 561px) and (max-width: 1320px) {
  .sales-table tr {
    display: grid !important;
    grid-template-columns: auto 1fr auto auto !important;
    grid-template-areas:
      "ksef numer brutto actions"
      "data nabywca nabywca zaplacono" !important;
    column-gap: 12px;
    row-gap: 4px;
    align-items: center;
  }
  .sales-table tr::after { display: none !important; }
  .sales-table td[data-col="ksef"] { grid-area: ksef; margin-right: 0 !important; }
  .sales-table td[data-col="numer"] { grid-area: numer; padding-right: 8px !important; }
  .sales-table td[data-col="brutto"] {
    grid-area: brutto;
    width: auto !important;
    padding: 0 !important;
    text-align: right !important;
    font-weight: 500;
    font-size: 14px;
  }
  .sales-table td[data-col="brutto"]::before { display: none !important; }
  .sales-table td[data-col="actions"] {
    grid-area: actions;
    position: static !important;
  }

  .sales-table td[data-col="data"] {
    grid-area: data;
    display: block !important;
    font-size: 11px;
    color: var(--fg-mute);
  }
  .sales-table td[data-col="termin"] { display: none !important; }
  .sales-table td[data-col="nabywca"] {
    grid-area: nabywca;
    padding: 0 !important;
    font-size: 13px;
  }
  .sales-table td[data-col="zaplacono"] {
    grid-area: zaplacono;
    width: auto !important;
    padding: 0 !important;
    text-align: right !important;
    font-size: 11px;
  }
  .sales-table td[data-col="zaplacono"]::before { display: none !important; }
}

/* Naprawdę małe — ukryj kolumnę data + termin, zostaw tylko brutto */
@media (max-width: 440px) {
  .sales-table td[data-col="data"],
  .sales-table td[data-col="termin"] { display: none !important; }
  .sales-table td[data-col="zaplacono"] { display: none !important; }
  .sales-table td[data-col="brutto"] { width: 100% !important; }
}

/* Inne tabele (zakup, magazyn, kontrahenci) — card mode do 1320px */
@media (max-width: 1320px) {
  .purchase-table thead,
  .warehouse-table thead,
  .contractors-table thead { display: none; }

  .purchase-table, .purchase-table tbody, .purchase-table tr, .purchase-table td,
  .warehouse-table, .warehouse-table tbody, .warehouse-table tr, .warehouse-table td,
  .contractors-table, .contractors-table tbody, .contractors-table tr, .contractors-table td {
    display: block;
    width: 100%;
  }

  .purchase-table tr, .warehouse-table tr, .contractors-table tr {
    background: var(--bg-card);
    border-radius: var(--radius-card);
    margin-bottom: 10px;
    padding: 12px 14px 14px;
    border: 1px solid var(--border);
    position: relative;
  }
  .purchase-table tr:hover, .warehouse-table tr:hover, .contractors-table tr:hover { background: var(--bg-card); }

  .purchase-table td, .warehouse-table td, .contractors-table td {
    border: none !important;
    padding: 3px 0 !important;
    white-space: normal !important;
    text-align: left !important;
  }
  .purchase-table td.num, .warehouse-table td.num, .contractors-table td.num { text-align: left !important; }

  /* Actions: prawy górny róg karty */
  .purchase-table td[data-col="actions"],
  .warehouse-table td[data-col="actions"],
  .contractors-table td[data-col="actions"] {
    position: absolute;
    top: 10px;
    right: 10px;
    width: auto !important;
    padding: 0 !important;
  }
}

/* ZAKUPY — mobile (do 560px): karta 1-kolumnowa jak sales */
@media (max-width: 560px) {
  .purchase-table td[data-col="ksef"] {
    display: inline-flex !important;
    width: auto !important;
    vertical-align: middle;
    margin-right: 10px;
  }
  .purchase-table td[data-col="ksef"] .ksef-status {
    padding: 2px;
    background: transparent;
    font-size: 0;
    gap: 0;
  }
  .purchase-table td[data-col="ksef"] .ksef-status-dot {
    width: 26px;
    height: 26px;
  }
  .purchase-table td[data-col="numer"] {
    display: inline-block !important;
    width: auto !important;
    font-weight: 600;
    font-size: 15px;
    vertical-align: middle;
  }
  .purchase-table td[data-col="data"],
  .purchase-table td[data-col="termin"] {
    display: inline !important;
    width: auto !important;
    font-size: 12px;
    color: var(--fg-mute);
    margin-right: 10px;
  }
  .purchase-table td[data-col="data"]::before { content: "◷ "; }
  .purchase-table td[data-col="termin"]::before { content: "→ "; }
  .purchase-table tr::after {
    content: "";
    display: block;
    height: 1px;
    background: var(--border);
    margin: 8px 0;
  }
  .purchase-table td[data-col="dostawca"] {
    font-weight: 500;
    font-size: 14px;
    padding-bottom: 6px !important;
  }
  .purchase-table td[data-col="brutto"],
  .purchase-table td[data-col="zaplacono"] {
    display: inline-flex !important;
    width: 49% !important;
    flex-direction: column;
    gap: 2px;
    padding-top: 6px !important;
  }
  .purchase-table td[data-col="brutto"]::before,
  .purchase-table td[data-col="zaplacono"]::before {
    font-family: 'Antonio', sans-serif;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fg-mute);
  }
  .purchase-table td[data-col="brutto"]::before { content: "Brutto"; }
  .purchase-table td[data-col="zaplacono"]::before { content: "Zapłacono"; }
}

/* ZAKUPY — tablet 561-1320: 2-wierszowy grid */
@media (min-width: 561px) and (max-width: 1320px) {
  .purchase-table tr {
    display: grid !important;
    grid-template-columns: auto 1fr auto auto !important;
    grid-template-areas:
      "ksef numer brutto actions"
      "data dostawca zaplacono actions";
    gap: 4px 12px;
    align-items: center;
  }
  .purchase-table td[data-col="ksef"] { grid-area: ksef; }
  .purchase-table td[data-col="ksef"] .ksef-status {
    padding: 2px;
    background: transparent;
    font-size: 0;
    gap: 0;
  }
  .purchase-table td[data-col="ksef"] .ksef-status-dot {
    width: 22px;
    height: 22px;
  }
  .purchase-table td[data-col="numer"] { grid-area: numer; font-weight: 600; font-size: 14px; }
  .purchase-table td[data-col="data"] {
    grid-area: data;
    font-size: 11px;
    color: var(--fg-mute);
  }
  .purchase-table td[data-col="data"]::before { content: "◷ "; }
  .purchase-table td[data-col="termin"] { display: none !important; }
  .purchase-table td[data-col="dostawca"] { grid-area: dostawca; font-size: 13px; }
  .purchase-table td[data-col="brutto"] {
    grid-area: brutto;
    text-align: right !important;
    font-weight: 600;
    font-size: 14px;
  }
  .purchase-table td[data-col="zaplacono"] {
    grid-area: zaplacono;
    text-align: right !important;
    font-size: 11px;
  }
  .purchase-table td[data-col="actions"] {
    grid-area: actions;
    position: static !important;
  }
}

/* MAGAZYN — mobile */
@media (max-width: 560px) {
  .warehouse-table td[data-col="typ"] {
    display: inline-block !important;
    width: auto !important;
    margin-right: 10px;
    vertical-align: middle;
  }
  .warehouse-table td[data-col="numer"] {
    display: inline-block !important;
    width: auto !important;
    font-weight: 600;
    font-size: 15px;
    vertical-align: middle;
  }
  .warehouse-table td[data-col="data"] {
    font-size: 12px;
    color: var(--fg-mute);
  }
  .warehouse-table td[data-col="data"]::before { content: "◷ "; }
  .warehouse-table tr::after {
    content: "";
    display: block;
    height: 1px;
    background: var(--border);
    margin: 8px 0;
  }
  .warehouse-table td[data-col="kontrahent"] {
    font-weight: 500;
    font-size: 14px;
    padding-bottom: 6px !important;
  }
  .warehouse-table td[data-col="pozycji"],
  .warehouse-table td[data-col="wartosc"] {
    display: inline-flex !important;
    width: 49% !important;
    flex-direction: column;
    gap: 2px;
    padding-top: 6px !important;
  }
  .warehouse-table td[data-col="pozycji"]::before,
  .warehouse-table td[data-col="wartosc"]::before {
    font-family: 'Antonio', sans-serif;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fg-mute);
  }
  .warehouse-table td[data-col="pozycji"]::before { content: "Pozycji"; }
  .warehouse-table td[data-col="wartosc"]::before { content: "Wartość"; }
}

/* MAGAZYN — tablet */
@media (min-width: 561px) and (max-width: 1320px) {
  .warehouse-table tr {
    display: grid !important;
    grid-template-columns: auto 1fr auto auto !important;
    grid-template-areas:
      "typ numer wartosc actions"
      "data kontrahent pozycji actions";
    gap: 4px 12px;
    align-items: center;
  }
  .warehouse-table td[data-col="typ"] { grid-area: typ; }
  .warehouse-table td[data-col="numer"] { grid-area: numer; font-weight: 600; font-size: 14px; }
  .warehouse-table td[data-col="data"] {
    grid-area: data;
    font-size: 11px;
    color: var(--fg-mute);
  }
  .warehouse-table td[data-col="data"]::before { content: "◷ "; }
  .warehouse-table td[data-col="kontrahent"] { grid-area: kontrahent; font-size: 13px; }
  .warehouse-table td[data-col="wartosc"] {
    grid-area: wartosc;
    text-align: right !important;
    font-weight: 600;
    font-size: 14px;
  }
  .warehouse-table td[data-col="pozycji"] {
    grid-area: pozycji;
    text-align: right !important;
    font-size: 11px;
    color: var(--fg-mute);
  }
  .warehouse-table td[data-col="pozycji"]::before {
    content: "Pozycji: ";
    font-family: 'Antonio', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 10px;
  }
  .warehouse-table td[data-col="actions"] {
    grid-area: actions;
    position: static !important;
  }
}

/* KONTRAHENCI — mobile */
@media (max-width: 560px) {
  .contractors-table td[data-col="nazwa"] {
    font-weight: 600;
    font-size: 15px;
    padding-bottom: 4px !important;
    padding-right: 40px !important;
  }
  .contractors-table td[data-col="nip"] {
    display: inline !important;
    width: auto !important;
    font-size: 12px;
    color: var(--fg-mute);
    margin-right: 10px;
  }
  .contractors-table td[data-col="nip"]::before {
    content: "NIP ";
    font-family: 'Antonio', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 10px;
  }
  .contractors-table tr::after {
    content: "";
    display: block;
    height: 1px;
    background: var(--border);
    margin: 8px 0;
  }
  .contractors-table td[data-col="adres"] {
    font-size: 12px;
    color: var(--fg-dim);
    padding-bottom: 4px !important;
  }
  .contractors-table td[data-col="typ"] {
    font-size: 12px;
    padding-top: 4px !important;
  }
}

/* KONTRAHENCI — tablet */
@media (min-width: 561px) and (max-width: 1320px) {
  .contractors-table tr {
    display: grid !important;
    grid-template-columns: 1fr auto auto !important;
    grid-template-areas:
      "nazwa typ actions"
      "adres nip actions";
    gap: 4px 12px;
    align-items: center;
  }
  .contractors-table td[data-col="nazwa"] {
    grid-area: nazwa;
    font-weight: 600;
    font-size: 14px;
  }
  .contractors-table td[data-col="nip"] {
    grid-area: nip;
    font-size: 11px;
    color: var(--fg-mute);
    text-align: right !important;
  }
  .contractors-table td[data-col="adres"] {
    grid-area: adres;
    font-size: 12px;
    color: var(--fg-dim);
  }
  .contractors-table td[data-col="typ"] {
    grid-area: typ;
    text-align: right !important;
    font-size: 12px;
  }
  .contractors-table td[data-col="actions"] {
    grid-area: actions;
    position: static !important;
  }
}

/* Na małych ekranach (<=530px) Netto/VAT/Brutto jedno pod drugim */
@media (max-width: 530px) {
  .detail-grid.summary-grid { grid-template-columns: 1fr !important; }
}

/* Tabela pozycji — desktop: kolumny kompaktowe, nazwa z ellipsis */
.drawer-positions .col-lp { width: 32px; color: var(--fg-mute); font-size: 12px; }
.drawer-positions .col-kod { width: 140px; font-size: 12px; color: var(--fg-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.drawer-positions .col-nazwa {
  max-width: 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.drawer-positions { table-layout: fixed; }

/* Na małych ekranach (<=630px) tabela pozycji w drawer: 3 wiersze na pozycję */
@media (max-width: 630px) {
  .drawer-positions thead { display: none; }
  .drawer-positions, .drawer-positions tbody, .drawer-positions tr, .drawer-positions td {
    display: block;
    width: 100%;
  }
  .drawer-positions tr {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-card);
    padding: 10px 12px;
    margin-bottom: 8px;
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    grid-template-areas:
      "kod nazwa ilosc"
      "cena netto vat"
      "brutto brutto brutto";
    column-gap: 10px;
    row-gap: 6px;
    align-items: center;
  }
  .drawer-positions td { border: none !important; padding: 0 !important; min-width: 0; }

  /* Lp jako mały superscript w komórce nazwy */
  .drawer-positions td.col-lp {
    display: none !important;
  }
  .drawer-positions td.col-kod {
    grid-area: kod;
    width: auto !important;
    max-width: 120px;
    font-size: 11px;
    color: var(--fg-mute);
    font-family: 'JetBrains Mono', monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .drawer-positions td.col-nazwa {
    grid-area: nazwa;
    max-width: none !important;
    width: auto !important;
    font-weight: 500;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .drawer-positions td:nth-child(4) { grid-area: ilosc; font-size: 12px; color: var(--fg-mute); text-align: right !important; }
  .drawer-positions td:nth-child(5) { grid-area: cena; font-size: 11px; color: var(--fg-mute); }
  .drawer-positions td:nth-child(5)::before { content: "cena "; opacity: 0.6; }
  .drawer-positions td:nth-child(6) { grid-area: netto; font-size: 11px; color: var(--fg-mute); text-align: center !important; }
  .drawer-positions td:nth-child(6)::before { content: "netto "; opacity: 0.6; }
  .drawer-positions td:nth-child(7) { grid-area: vat; font-size: 11px; color: var(--fg-mute); text-align: right !important; }
  .drawer-positions td:nth-child(7)::before { content: "VAT "; opacity: 0.6; }
  .drawer-positions td:nth-child(8) {
    grid-area: brutto;
    font-weight: 500;
    text-align: right !important;
    padding-top: 4px !important;
    border-top: 1px solid var(--border) !important;
    margin-top: 2px;
  }
  .drawer-positions td:nth-child(8)::before {
    content: "brutto ";
    font-family: 'Antonio', sans-serif;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fg-mute);
    font-weight: 400;
    margin-right: 6px;
  }
}

/* Kolumna Netto w tabeli pozycji — widoczna zawsze (też na desktopie) */