/* Base */
:root {
  --bg: #fff;
  --bg-subtle: #f8fafc;    /* header & hover */
  --border: #e5e7eb;
  --border-strong: #e2e8f0;
  --text: #0f172a;
  --muted: #64748b;
  font: 14px/1.35 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto,
        "Helvetica Neue", Arial;
}

/* Link */
.link-plain,
.link-plain:visited,
.link-plain:hover,
.link-plain:active,
.link-plain:focus {
  color: inherit;          /* no blue, inherit from parent */
  text-decoration: none;   /* no underline */
}

/* Sheet */
.sheet {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 5px;
  overflow: hidden;
  color: var(--text);
}

/* Table */
.grid {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;          /* key for predictable column widths */
}
.grid thead th:nth-child(2) { width: 160px; }
.grid thead th:nth-child(4) { width: 20%; }    /* Job */
.grid thead th:nth-child(5) { width: 45%; }    /* Last Message */
.grid thead th:nth-child(6) { width: 20%; }    /* Progress */
.grid thead th:nth-child(3),
.grid thead th:nth-child(7),
.grid thead th:nth-child(8),
.grid thead th:nth-child(9) {
  width: 80px;
}
.grid thead th {
  background: var(--bg-subtle);
  font-weight: 600;
  text-align: left;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-strong);
  position: relative;
  white-space: nowrap;
}
.grid thead .th::after {
  content: "";
  display: inline-block;
  margin-left: 8px;
  border: 5px solid transparent;
  transform: translateY(-1px);
}
.grid thead .th.is-asc::after {
  border-bottom-color: var(--muted);
}
.grid thead .th.is-desc::after {
  border-top-color: var(--muted);
}

/* Cells */
.grid tbody td {
  height: 32px;
  padding: 0px 12px;
  border-top: 1px solid var(--border);
  vertical-align: middle;
}
.grid tbody tr:hover td { background: var(--bg-subtle); }
.cell--truncate {
  max-width: 320px;                 
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Buttons */
.btn-primary {
  background-color: #3a76b7;      
  color: #fff;
  font: 600 14px/1.2 "Inter", system-ui, -apple-system, sans-serif;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  cursor: pointer;
  display: inline-block;
  max-width: 120px;
}
.btn-primary:hover {
  background-color: #3a76b7;     
}
.btn-primary:active {
  transform: scale(0.97);          
}
.btn-primary:focus {
  outline: 2px solid #f8ccd8;      
  outline-offset: 2px;
}
.btn {
  background-color: #3a76b7;
  color: #fff;
  border-radius: 8px;
  padding: 10px 18px;
  max-width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 1px 2px rgba(0,0,0,0.12);
}
.btn:hover {
  background-color: #9d0f33;
}
.btn:active {
  transform: scale(0.97);
}
.btn:focus {
  outline: 2px solid #f8ccd8;
  outline-offset: 2px;
}
.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Printer CSS */
.printer-card {
  --accent: #3a76b7;
  --accent-soft: rgba(18,97,181,0.08);
}
.printer-card[data-state="PRINTING"] { --accent:#2fbf71; --accent-soft:rgba(47,191,113,0.15); }
.printer-card[data-state="PAUSED"]   { --accent:#ffd95b; --accent-soft:rgba(255,217,91,0.15); }
.printer-card[data-state="OFFLINE"]  { --accent:#8b95a7; --accent-soft:rgba(93,100,112,0.15); }
.printer-card[data-state="ATTENTION"],
.printer-card[data-state="ERROR"] {
  --accent:#ef476f; --accent-soft:rgba(239,71,111,0.15);
}
.printer-card[data-state="ACTION"] {
  --accent:#3a76b7; --accent-soft:rgba(58,118,183,0.15);
}
.printer-card[data-state="ACTION"] .bar {
  animation: pulse-bar 1.5s ease-in-out infinite;
}
@keyframes pulse-bar {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}
.progress .bar{
    background: var(--accent);
}
.grid tbody tr.printer-card[data-state] td {
  background: var(--accent-soft);
}
.grid tbody tr.printer-card[data-state]:hover td {
  background: var(--accent-soft);
}