:root {
  /* Цвета состояний */
  --info-bg: #d9edf7;
  --info-border: #bce8f1;
  --info-color: #31708f;

  --warning-bg: #fcf8e3;
  --warning-border: #faebcc;
  --warning-color: #8a6d3b;

  --danger-bg: #f2dede;
  --danger-border: #ebccd1;
  --danger-color: #a94442;

  --success-bg: #dff0d8;
  --success-border: #d6e9c6;
  --success-color: #3c763d;

  --card-bg: #fff;
  --card-border: #ddd;
  --shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.board-wrapper {
  padding: 1rem 1.5rem;
  display: grid;
  gap: 1.25rem;
}

.board {
  background-color: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 8px;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.panel-heading {
  padding: 0.75rem 1rem;
  font-weight: 400;
}

.panel-footer {
  padding: 0.5rem 0.75rem;
  background-color: #f9f9f9;
  border-top: 1px solid var(--card-border);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.panel-info   { border-color: var(--info-border);   }
.panel-info .panel-heading {
  background: var(--info-bg);
  color: var(--info-color);
}

.panel-warning { border-color: var(--warning-border); }
.panel-warning .panel-heading {
  background: var(--warning-bg);
  color: var(--warning-color);
}

.panel-danger { border-color: var(--danger-border); }
.panel-danger .panel-heading {
  background: var(--danger-bg);
  color: var(--danger-color);
}

.panel-success { border-color: var(--success-border); }
.panel-success .panel-heading {
  background: var(--success-bg);
  color: var(--success-color);
}

.text-right { text-align: right; }

.btn-refresh {
  background: none;
  border: none;
  color: #157fcc;
  font-size: 14px;
  cursor: pointer;
  padding: 2px 6px;
  transition: color 0.2s;
}

.btn-refresh:hover {
  color: #0d5fa3;
}