/*
 * Единый внешний вид этапов планирования эксперимента (поверх Bootstrap).
 * Подключается после experiment-tables.css.
 */

.ep-stage-content {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

@media (min-width: 768px) {
  .ep-stage-content {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

/* Карточка «факторы» (этап 1) */
.ep-stage-factors-card {
  max-width: min(100%, 52rem);
}

.ep-factor-grid {
  display: grid;
  gap: 3px;
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: center;
}

.ep-factor-grid--10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.ep-factor-grid--11 {
  grid-template-columns: repeat(11, minmax(0, 1fr));
}

.ep-fg-name {
  background-color: var(--bs-secondary-bg);
  padding: 0.4rem 0.2rem;
  border-radius: 0.25rem;
}

.ep-fg-val {
  background-color: var(--bs-tertiary-bg);
  padding: 0.4rem 0.2rem;
  border-radius: 0.25rem;
}

/* Оболочка таблиц этапов */
.ep-table-outer {
  width: 100%;
}

.ep-table-shell {
  background: var(--bs-body-bg);
  box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.07);
}

.ep-table-shell.ep-table-elevated {
  box-shadow: 0 0.2rem 0.65rem rgba(0, 0, 0, 0.1);
}

/* Таблицы внутри этапов: согласование с legacy .cellHeader / .borderCell */
.ep-stage-table thead th,
.ep-stage-table thead td {
  background-color: var(--bs-tertiary-bg) !important;
  color: var(--bs-emphasis-color);
  font-weight: 600;
  font-size: 0.8125rem;
  padding: 0.35rem 0.4rem !important;
  vertical-align: middle;
}

.ep-stage-table tbody td,
.ep-stage-table tbody th {
  font-size: 0.8125rem;
  padding: 0.2rem 0.3rem !important;
  vertical-align: middle;
}

.ep-stage-table input[type="number"]:not(.app-table-input--tall) {
  min-height: 1.75rem;
  font-size: 0.8125rem;
  padding: 0.1rem 0.25rem;
}

.ep-stage-table td.borderCell > button {
  font-size: 0.75rem;
  padding: 0.2rem 0.4rem;
}

/* Сетка 4.2: три блока в ряд на больших экранах */
.ep-stage-42-layout {
  display: grid;
  gap: 1rem;
  width: 100%;
  max-width: 100%;
  margin-top: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 992px) {
  .ep-stage-42-layout {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
  }
}

.ep-stage-42-panel .card-body {
  padding: 0.5rem;
}

@media (min-width: 768px) {
  .ep-stage-42-panel .card-body {
    padding: 0.75rem;
  }
}

/* Валидация (validation.js: классы success / error на input) */
.ep-stage-table input.success,
.ep-stage-table .form-control.success {
  border-color: var(--bs-success) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-success-rgb), 0.25);
}

.ep-stage-table input.error,
.ep-stage-table .form-control.error {
  border-color: var(--bs-danger) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-danger-rgb), 0.25);
}