/* === RESET === */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: "Segoe UI", Roboto, Arial, sans-serif;
  background: #f6f7fb;
  color: #0f172a;
  line-height: 1.4;
  font-size: 14px;
}

/* === TOPBAR === */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #0f172a;
  color: #fff;
  padding: 6px 12px;
  font-size: 14px;
}
.topbar .brand { font-weight: 700; }
.nav { display: flex; flex-wrap: wrap; gap: 6px; }
.nav a {
  color: #fff;
  text-decoration: none;
  background: #1e293b;
  padding: 4px 8px;
  border-radius: 6px;
  transition: background .15s;
}
.nav a:hover { background: #334155; }

/* === STRUKTURA === */
.content {
  width: 100%;
  max-width: 100%;
  margin: 10px auto;
  padding: 0 8px;
}
.card {
  width: 100%;
  background: #fff;
  border-radius: 10px;
  padding: 10px;
  box-shadow: 0 3px 10px rgba(2, 6, 23, 0.05);
  overflow-x: visible;
}
h2 { font-size: 20px; margin-bottom: 8px; }

/* === TABELA === */
.table-wrap { width: 100%; overflow-x: visible; }
.table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}
.table th, .table td {
  border-bottom: 1px solid #e5e7eb;
  padding: 6px 4px;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.table th {
  background: #f3f4f6;
  font-weight: 600;
  color: #111827;
  font-size: 13px;
}
.table tr:last-child td { border-bottom: 0; }

/* Kompaktowe pola */
.tbl-input, .tbl-select {
  width: 100%;
  height: 28px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 3px 6px;
  background: #fff;
  font-size: 13px;
}
.tbl-input--num { text-align: right; }
.tbl-select { height: 30px; }

/* === PRZYCISKI === */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 6px;
  border: 0;
  background: #2563eb;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  font-size: 13px;
  line-height: 1.2;
  transition: background .1s, transform .05s;
}
.btn:hover { background: #1d4ed8; }
.btn:active { transform: translateY(1px); }
.btn--danger { background: #dc2626; }
.btn--danger:hover { background: #b91c1c; }

/* kolumna Akcje */
td.actions { text-align: center; vertical-align: middle; }
td.actions .action-group {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1px;
}
td.actions .btn { padding: 3px 7px; 
font-size: 12px;
  white-space: nowrap;
}

/* === FORMULARZE === */
label {
  display: inline-block;
  margin-bottom: 2px;
  font-weight: 600;
  color: #0f172a;
  font-size: 13px;
}
input[type="text"], input[type="number"], select {
  width: 100%;
  height: 30px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 4px 6px;
  font-size: 13px;
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.form-grid .full { grid-column: 1 / -1; }

/* === ALERTY === */
.alert {
  padding: 6px 8px;
  border-radius: 6px;
  margin: 6px 0 10px;
  background: #eef2ff;
  color: #1e40af;
  border: 1px solid #c7d2fe;
  font-size: 13px;
}
.alert.success {
  background: #ecfdf5;
  color: #065f46;
  border-color: #a7f3d0;
}

/* === RESPONSYWNOŚĆ === */
@media (max-width: 992px) {
  .form-grid { grid-template-columns: 1fr; }
  .btn { padding: 4px 8px; }
}
@media (max-width: 768px) {
  .card { padding: 8px; }
  .table th, .table td { padding: 5px 4px; }
  .btn { font-size: 12px; padding: 3px 7px; }
  .tbl-input, .tbl-select { font-size: 12px; height: 26px; }
}
@media (max-width: 480px) {
  .table th, .table td { padding: 4px 3px; }
  .btn { font-size: 12px; padding: 2px 6px; }
  .tbl-input, .tbl-select { height: 24px; }
}










/* === USTAWIENIA SZEROKOŚCI KOLUMN — admin_orders.php ===
   Numeracja odpowiada kolejności kolumn:
   1: ID | 2: Numer zlecenia | 3: Numer operacji | 4: Maszyna
   5: Ilość docelowa | 6: Cel/h | 7: Wykonano | 8: Pozostało | 9: Akcje
   Zmieniaj px według potrzeb. */

.orders-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;   /* przestrzega poniższych width */
}

.orders-table th,
.orders-table td {
  padding: 3px 4px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

/* 1) ID */
.orders-table th:nth-child(1),
.orders-table td:nth-child(1) { width: 40px; }

/* 2) Numer zlecenia */
.orders-table th:nth-child(2),
.orders-table td:nth-child(2) { width: 80px; }

/* 3) Numer operacji */
.orders-table th:nth-child(3),
.orders-table td:nth-child(3) { width: 80px; }

/* 4) Maszyna */
.orders-table th:nth-child(4),
.orders-table td:nth-child(4) { width: 170px; }

/* 5) Ilość docelowa */
.orders-table th:nth-child(5),
.orders-table td:nth-child(5) { width: 90px; }

/* 6) Cel/h */
.orders-table th:nth-child(6),
.orders-table td:nth-child(6) { width: 80px; }

/* 7) Wykonano */
.orders-table th:nth-child(7),
.orders-table td:nth-child(7) { width: 100px; }

/* 8) Pozostało */
.orders-table th:nth-child(8),
.orders-table td:nth-child(8) { width: 100px; }

/* 9) Akcje (miejsce na 2 przyciski) */
.orders-table th:nth-child(9),
.orders-table td:nth-child(9) { width: 100px; }

/* Komórka Akcje – przyciski obok siebie + responsywne zawijanie */
.orders-table td.actions { text-align:center; }
.orders-table td.actions .action-group {
  display:flex; justify-content:center; gap:6px; flex-wrap:wrap;
}
.orders-table td.actions .btn { padding:4px 8px; font-size:13px; white-space:nowrap; }

/* Pola w komórkach nie rozpychają tabeli */
.orders-table .tbl-input,
.orders-table .tbl-select { width:100%; max-width:100%; height:28-32px; }

/* (opcjonalnie) kompakt na małych ekranach */
@media (max-width: 768px) {
  .orders-table th, .orders-table td { padding: 5px 6px; font-size:12px; }
}







/* === USTAWIENIA SZEROKOŚCI KOLUMN RAPORTU DZIENNEGO report.php === */
/* Wystarczy zmienić liczby px, żeby dopasować kolumny do własnych potrzeb */

.report-table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: fixed !important;   /* żeby szerokości kolumn działały */
  font-size: 13px;
}

.report-table th,
.report-table td {
  border: 1px solid #ddd;
  padding: 3px 4px;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* === SZEROKOŚCI KOLUMN (1–10) === */
.report-table th:nth-child(1),
.report-table td:nth-child(1) { width: 45px; }   /* ID */

.report-table th:nth-child(2),
.report-table td:nth-child(2) { width: 85px; }  /* Pracownik */

.report-table th:nth-child(3),
.report-table td:nth-child(3) { width: 140px; }  /* Zlecenie */

.report-table th:nth-child(4),
.report-table td:nth-child(4) { width: 80px; }  /* Operacja */

.report-table th:nth-child(5),
.report-table td:nth-child(5) { width: 140px; }   /* Maszyna */

.report-table th:nth-child(6),
.report-table td:nth-child(6) { width: 60px; }   /* Dobre */

.report-table th:nth-child(7),
.report-table td:nth-child(7) { width: 60px; }   /* Wadliwe */

.report-table th:nth-child(8),
.report-table td:nth-child(8) { width: 165px; }  /* Start */

.report-table th:nth-child(9),
.report-table td:nth-child(9) { width: 165px; }  /* Koniec */

.report-table th:nth-child(10),
.report-table td:nth-child(10) { width: 110px; } /* Akcje */

/* === STYL AKCJI === */
td.actions {
  text-align: center;
  vertical-align: middle;
}
td.actions .action-group {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
td.actions .btn {
  padding: 4px 10px;
  font-size: 13px;
  white-space: nowrap;
}

/* === RESPONSYWNOŚĆ === */
@media (max-width: 992px) {
  .report-table th,
  .report-table td {
    font-size: 12px;
    padding: 5px 6px;
  }
}
@media (max-width: 768px) {
  .report-table th,
  .report-table td {
    font-size: 11px;
    padding: 4px 5px;
  }
}





/* === OVERRIDE dla reports_all.php (mocne nadpisanie) === */
.table.report-all-table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: fixed !important;   /* żeby szerokości kolumn działały */
  font-size: 13px;
}

.table.report-all-table th,
.table.report-all-table td {
  border: 1px solid #ddd;
  padding: 3px 4px;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* USTAWIENIA SZEROKOŚCI — zmieniaj px pod siebie */
.table.report-all-table th:nth-child(1),
.table.report-all-table td:nth-child(1) { width: 50px !important; }   /* ID */

.table.report-all-table th:nth-child(2),
.table.report-all-table td:nth-child(2) { width: 85px !important; }  /* Pracownik */

.table.report-all-table th:nth-child(3),
.table.report-all-table td:nth-child(3) { width: 150px !important; }  /* Numer zlecenia */

.table.report-all-table th:nth-child(4),
.table.report-all-table td:nth-child(4) { width: 80px !important; }   /* Operacja */

.table.report-all-table th:nth-child(5),
.table.report-all-table td:nth-child(5) { width: 140px !important; }  /* Maszyna */

.table.report-all-table th:nth-child(6),
.table.report-all-table td:nth-child(6) { width: 60px !important; }   /* Dobre */

.table.report-all-table th:nth-child(7),
.table.report-all-table td:nth-child(7) { width: 60px !important; }   /* Wadliwe */

.table.report-all-table th:nth-child(8),
.table.report-all-table td:nth-child(8) { width: 140px !important; }  /* Start */

.table.report-all-table th:nth-child(9),
.table.report-all-table td:nth-child(9) { width: 140px !important; }  /* Koniec */

.table.report-all-table th:nth-child(10),
.table.report-all-table td:nth-child(10) { width: 70px !important; }  /* Czas */

.table.report-all-table th:nth-child(11),
.table.report-all-table td:nth-child(11) { width: 90px !important; text-align:center; } /* Akcje */


/* ==== ADMIN DASHBOARD (admin.php) ==== */

/* kontener strony */
.admin-wrap {
  display: grid;
  gap: 1px;
}

/* KPI – górne kafelki */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 10px;
}

.kpi-card {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(2,6,23,.06);
  padding: 14px;
}
.kpi-card h3 {
  margin: 0 0 6px 0;
  font-size: 12px;
  font-weight: 700;
  color: #0f172a;
}
.kpi-value {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .3px;
  color: #0f172a;
}

/* sekcje z listami / tabelami */
.section {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(2,6,23,.06);
  padding: 12px;
}
.section + .section { margin-top: 8px; }

.section-title {
  margin: 0 0 10px 0;
  font-size: 12px;
  font-weight: 800;
  color: #0f172a;
}

/* listy prostych pozycji (np. „Brak aktywnych …”) */
.section p {
  margin: 0;
  color: #334155;
}

/* tabela w sekcji – spójna z resztą projektu */
.section .table-wrap { width: 100%; overflow-x: auto; }
.section .table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}
.section .table th,
.section .table td {
  border-bottom: 1px solid #e5e7eb;
  padding: 8px 10px;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.section .table th {
  background: #f6f7fb;
  font-weight: 700;
  color: #0f172a;
}

/* mini-badge statusu */
.badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
  color: #334155;
}
.badge--ok { background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.badge--warn { background:#fff7ed; border-color:#fed7aa; color:#9a3412; }
.badge--err { background:#fef2f2; border-color:#fecaca; color:#991b1b; }

/* przyciski (spójne, kompakt) */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding: 8px 12px;
  border:0; border-radius: 10px;
  background:#2563eb; color:#fff; font-weight:700;
  cursor:pointer; white-space:nowrap;
  transition: background .15s, transform .05s;
}
.btn:hover { background:#1d4ed8; }
.btn:active { transform: translateY(1px); }
.btn--sm { padding:5px 9px; font-size:13px; border-radius:8px; }
.btn--ghost { background:#eef2ff; color:#1e40af; }
.btn--danger { background:#dc2626; }
.btn--danger:hover { background:#b91c1c; }

/* responsywność */
@media (max-width: 1024px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .kpi-grid { grid-template-columns: 1fr; }
  .section .table th, .section .table td { padding: 7px 8px; font-size: 13px; }
  .kpi-value { font-size: 24px; }
}


/* === TABELA - SZEROKOŚCI KOLUMN (UNIWERSALNE) === */

.table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed; /* utrzymuje proporcje kolumn */
}

.table th,
.table td {
  border: 1px solid #e2e8f0;
  padding: 8px 10px;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Kolor nagłówków */
.table th {
  background: #f1f5f9;
  font-weight: 600;
  color: #334155;
}

/* Alternatywne wiersze */
.table tr:nth-child(even) td {
  background: #f8fafc;
}

/* Wyrównanie przycisków w kolumnie Akcje */
.actions {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-start;
}


/* =============================
   Dostosowywanie szerokości kolumn worker_active.php
   (ZMIENIAJ TUTAJ!)
============================= */
/* --- Tabela: fundament --- */

/* --- Realistyczne szerokości kolumn (dostosuj wg potrzeb) --- */
.table.active th:nth-child(1), .table td:nth-child(1) { width: 60px; }   /* ID */
.table.active th:nth-child(2), .table td:nth-child(2) { width: 140px; }  /* Typ / Pracownik */
.table.active th:nth-child(3), .table td:nth-child(3) { width: 140px; }  /* Zlecenie */
.table.active th:nth-child(4), .table td:nth-child(4) { width: 140px; }  /* Operacja */
.table.active th:nth-child(5), .table td:nth-child(5) { width: 170px; }  /* Maszyna */
.table.active th:nth-child(6), .table td:nth-child(6) { width: 170px; }  /* Start (data+czas) */
.table.active th:nth-child(7), .table td:nth-child(7) { width: 100px; }  /* Czas trwania */
.table.active th:nth-child(8), .table td:nth-child(8) { width: 220px;    /* kluczowe: dajemy realną szerokość */ text-align: center;
}




/* ========= admin_orders: pełna szerokość i brak h-scrolla ========= */

/* Kontener strony na 100% szerokości */
.card, .table-wrap { max-width: 100%; width: 100%; }
.table-wrap { overflow-x: visible !important; }

/* Sam stół – bez wymuszonego fixed, niech dopasowuje */
.table.orders-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto; /* pozwala kolumnom dopasować się do zmiennych width z <col> */
}

/* Pola w komórkach nie mogą wypychać tabeli */
.table.orders-table td input,
.table.orders-table td select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Nagłówki/komórki – trochę ciaśniej, by mieściło się bez scrolla */
.table.orders-table th,
.table.orders-table td {
  padding: 3px 4px;
  white-space: nowrap;   /* nie zawijamy etykiet, żeby nie rosły w pionie */
  text-align: left;
  vertical-align: middle;
}