:root{ --b:#111; --muted:#6b7280; --bd:#e5e7eb; --bg:#fff; --bg2:#f6f7fb; }

/* Bazowa wielkość fontu dla całego komponentu */
.dwpt-table{ font-size: var(--wp--preset--font-size--small); }

/* Tabela */
.dwpt-table table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  border:1px solid var(--bd);
}
.dwpt-table thead th{
  background:#f3f5f7;
  text-align:left;
  font-weight:600;
  border:1px solid var(--bd);
  padding:.6em .7em;
  vertical-align:middle;
}
.dwpt-table td{
  border:1px solid #e5e9ef;
  padding:.6em .7em;
  vertical-align:middle;
}
.dwpt-table tbody tr:nth-child(odd){ background:#fff }
.dwpt-table tbody tr:nth-child(even){ background:#fff }
.dwpt-table th a{ text-decoration:none; color:var(--b) }

/* Nowoczesne przyciski (front) */
.dwpt-table button,
.dwpt-filters button{
  appearance:none;
  border:none;
  border-radius:10px;
  padding:.55em 1em;
  font-weight:600;
  background:#111;
  color:#fff;
  box-shadow:0 1px 1px rgba(0,0,0,.05), 0 6px 14px rgba(17,17,17,.12);
  transition:transform .06s ease, box-shadow .2s ease, background .2s ease;
  cursor:pointer;
}
.dwpt-table button:hover,
.dwpt-filters button:hover{
  background:#1f2937;
  box-shadow:0 2px 3px rgba(0,0,0,.08), 0 10px 20px rgba(17,17,17,.18);
}
.dwpt-table button:active,
.dwpt-filters button:active{ transform:translateY(1px); }
.dwpt-table button:focus-visible,
.dwpt-filters button:focus-visible{
  outline:2px solid #111;
  outline-offset:2px;
}

/* Dodatkowe dopracowanie dla przycisku historii (opcjonalnie) */
.dwpt-history-btn{
  background:#0f172a; /* granatowy akcent */
}
.dwpt-history-btn:hover{
  background:#111827;
}

/* Statusy */
.dwpt-badge{ padding:0; background:none; display:inline; font-weight:600 }
.dwpt-ok{ color:#22863a; background:none }
.dwpt-warn{ color:#a65e00; background:none }
.dwpt-bad{ color:#a60000; background:none }

/* Filtry */
.dwpt-filters{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0 0 12px
}
.dwpt-filters label{
  font-size: var(--wp--preset--font-size--small);
  color:var(--muted)
}
.dwpt-filters input,
.dwpt-filters select{
  display:block;
  margin-top:4px;
  padding:.45em .6em;
  border:1px solid var(--bd);
  border-radius:8px;
  background:#fff
}

/* Paginacja (linki jak lekkie przyciski) */
.dwpt-pagination{ margin-top:10px; display:flex; gap:6px; flex-wrap:wrap }
.dwpt-pagination a{ padding:.3em .6em; border:1px solid var(--bd); border-radius:3px; background:#fff; text-decoration:none; color:#222 }
.dwpt-pagination a.current{ background:#eef3f9; border-color:#cfd7e3; font-weight:600 }

/* Modal historii (frontend) */
.dwpt-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999
}
.dwpt-modal .box{
  background:#fff;
  max-width:720px;
  width:95%;
  padding:18px;
  border-radius:12px;
  box-shadow:0 12px 36px rgba(0,0,0,.2)
}
.dwpt-modal table{ width:100%; border-collapse:collapse }
.dwpt-modal th,
.dwpt-modal td{
  border-bottom:1px solid var(--bd);
  padding:.6em;
  text-align:left;
  vertical-align:middle; /* middle również w modalu */
}
.dwpt-modal .close{
  float:right;
  cursor:pointer;
  font-size:20px
}