/**
 * @file
 * Minimal admin styles for FlowDrop Node Type configuration.
 *
 * These styles are kept minimal to work well with any admin theme.
 * Only layout and structural styles that don't override theme defaults.
 *
 * Plugin selection grid styles are in the flowdrop_ui_components:plugin-selector
 * SDC component.
 */

/* Step indicator - simple inline display */
.form-step-indicator {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 1em;
  gap: 0.5em;
}

.form-step-indicator .step-item {
  padding: 0.25em 0.5em;
  opacity: 0.6;
}

.form-step-indicator .step-item.step-current {
  opacity: 1;
  font-weight: bold;
}

.form-step-indicator .step-item.step-complete {
  opacity: 0.8;
}

.form-step-indicator .step-separator {
  opacity: 0.5;
}

/* ==========================================================================
   Plugin Selection Container
   ========================================================================== */

.plugin-selection-container {
  margin-bottom: 1.5em;
}

.plugin-selection-title {
  margin-bottom: 0.5em;
  font-size: 1.3em;
  font-weight: 600;
}

.plugin-selection-description {
  margin-bottom: 1.5em;
  color: #555;
}

/* Table legend - simple description list styling */
.table-legend {
  margin-bottom: 0.5em;
  opacity: 0.8;
  font-size: 0.9em;
}

.table-legend span {
  display: block;
  margin-bottom: 0.25em;
}

.table-legend__resolution {
  margin: 0 0 1em;
  max-width: 70ch;
  opacity: 0.8;
  font-size: 0.9em;
  line-height: 1.5;
}

/* Help cursor for headers with tooltips */
.parameters-table th[title],
.outputs-table th[title] {
  cursor: help;
}

/* Vertical alignment for table cells */
.parameters-table td,
.outputs-table td {
  vertical-align: middle;
}

/* Code styling in tables - only if theme doesn't provide it */
.parameters-table code,
.outputs-table code {
  font-size: 0.9em;
}

/* Small text in tables */
.parameters-table small,
.outputs-table small {
  display: block;
  opacity: 0.7;
}
