/* Steel structure review: 疊加於 glass.css / app.css 之上的頁面專屬樣式。 */

/* 進場／柱腳等分頁的基本資料：清單式玻璃卡 */
.steel-meta-grid, .steel-measure-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 12px;
  margin-bottom: 10px;
  padding: 6px 16px;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
}
.compact-measure-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.steel-meta-grid > .field, .steel-measure-grid > .field { gap: 2px; padding: 10px 0; border-top: 1px solid var(--line); }
.steel-meta-grid > .field:nth-child(-n + 3), .steel-measure-grid > .field:nth-child(-n + 3) { border-top: 0; }
.compact-measure-grid > .field:nth-child(3) { border-top: 1px solid var(--line); }
.steel-meta-grid > .field > span, .steel-measure-grid > .field > span { font-size: 0.6875rem; font-weight: 500; }
.steel-meta-grid > .field input, .steel-measure-grid > .field input,
.steel-meta-grid > .field select, .steel-measure-grid > .field select { width: calc(100% + 20px); min-height: 32px; margin: 0 -10px; padding: 0 10px; border-radius: 10px; background: transparent; font-size: 1rem; }
.steel-meta-grid > .field select, .steel-measure-grid > .field select { padding-right: 20px; }
.steel-meta-grid > .field input[type="date"], .steel-measure-grid > .field input[type="date"] { height: 32px; max-height: 32px; }
.steel-meta-grid .native-field-display, .steel-measure-grid .native-field-display { height: 32px; padding: 0; font-size: 1rem; }

.steel-notice {
  display: grid;
  gap: 3px;
  margin-top: 10px;
  padding: 12px 16px;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
  color: var(--glass-soft);
  font-size: 0.75rem;
  line-height: 1.6;
}
.steel-notice strong { color: var(--glass-ink); font-size: 0.8125rem; font-weight: 600; }

.steel-summary-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
  overflow: hidden;
}
.steel-summary-board:empty { display: none; }
.steel-summary-board > div { min-width: 0; padding: 12px 16px; }
.steel-summary-board > div + div { border-left: 1px solid var(--line); }
.steel-summary-board dt { color: var(--glass-label); font-size: 0.6875rem; font-weight: 500; }
.steel-summary-board dd { margin: 2px 0 0; font-family: var(--glass-font-num); font-size: 1.375rem; font-weight: 500; line-height: 1.1; font-variant-numeric: tabular-nums; }
.steel-summary-board small { color: var(--glass-soft); font-family: inherit; font-size: 0.6875rem; font-weight: 500; }
.steel-record-heading { padding-top: 24px; }
.steel-record-list {
  display: block;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
  overflow: hidden;
}
.steel-record-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 14px 16px;
  border-top: 1px solid var(--line);
}
.steel-record-list > :first-child { border-top: 0; }
.steel-record-card.is-failed { background: var(--glass-danger-wash); }
.steel-record-title { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.steel-record-title strong { min-width: 0; overflow: hidden; font-size: 0.9375rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.steel-record-title span { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; background: var(--glass-neutral-bg); color: var(--glass-neutral-ink); font-size: 0.75rem; font-weight: 600; white-space: nowrap; }
.steel-record-card.is-failed .steel-record-title span { background: var(--glass-danger-bg); color: var(--glass-danger-ink); }
.steel-record-card.is-passed .steel-record-title span { background: var(--glass-success-bg); color: var(--glass-success-ink); }
.steel-record-meta { display: flex; flex-wrap: wrap; gap: 3px 12px; margin-top: 6px; color: var(--glass-soft); font-size: 0.75rem; }
.steel-record-meta b { color: var(--glass-soft); font-weight: 500; }
.steel-check-list {
  display: block;
  margin-top: 0;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
  overflow: hidden;
}
.steel-measure-grid + .steel-check-list, .steel-meta-grid + .steel-check-list { margin-top: 10px; }
.steel-check-card { padding: 16px; border-top: 1px solid var(--line); }
.steel-check-list > :first-child { border-top: 0; }
.steel-check-card.is-failed { background: var(--glass-danger-wash); }
.steel-check-head { display: flex; align-items: baseline; gap: 10px; }
.steel-check-head > span { font-family: var(--glass-font-num); color: var(--glass-faint); font-size: 0.75rem; }
.steel-check-head strong { font-size: 0.9375rem; font-weight: 600; }
.steel-check-card p { margin: 3px 0 12px 24px; color: var(--glass-soft); font-size: 0.75rem; line-height: 1.55; }
.steel-check-fields { display: flex; align-items: center; gap: 8px; margin-left: 0; }
.steel-check-fields > .field { flex: 1 1 auto; min-width: 0; gap: 0; }
.steel-check-fields > .field > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.steel-check-fields > .field input { min-height: 42px; padding: 0 14px; border-radius: 999px; font-size: 0.875rem; }
.steel-check-fields > .result-field { flex: 0 0 auto; position: relative; }
.steel-check-card.is-failed .steel-check-fields > .field input { background: #fff; }

.optional-module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.optional-module-grid article {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  padding: 16px;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
}
.optional-module-grid strong { font-size: 0.9375rem; font-weight: 600; }
.optional-module-grid p { min-height: 4.4em; margin: 0; color: var(--glass-soft); font-size: 0.75rem; line-height: 1.55; }
.optional-module-grid button { min-height: 38px; border: 0; border-radius: 999px; background: #fff; box-shadow: var(--glass-hairline); color: var(--glass-soft); font-size: 0.8125rem; font-weight: 500; }
.optional-module-grid button.is-enabled { background: var(--glass-accent); color: var(--glass-accent-on); font-weight: 600; box-shadow: var(--glass-accent-shadow); }
.optional-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin-top: 10px;
  padding: 6px 16px;
  border-radius: var(--glass-radius-lg);
  background: var(--glass-card-bg);
  box-shadow: var(--glass-card-shadow);
}
.optional-fields[hidden] { display: none; }
.optional-fields > .field { gap: 2px; padding: 10px 0; }
.optional-fields > .field + .field { border-top: 1px solid var(--line); }
.optional-fields > .field > span:first-child { font-size: 0.6875rem; font-weight: 500; }
.optional-fields > .field textarea { width: calc(100% + 20px); min-height: 72px; margin: 0 -10px; padding: 4px 10px; border-radius: 10px; background: transparent; font-size: 1rem; }
.optional-fields .glass-segmented { justify-self: start; margin-top: 4px; }

@media (max-width: 639px) {
  .steel-meta-grid, .steel-measure-grid, .compact-measure-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steel-meta-grid > .field:nth-child(-n + 3), .steel-measure-grid > .field:nth-child(-n + 3) { border-top: 1px solid var(--line); }
  .steel-meta-grid > .field:nth-child(-n + 2), .steel-measure-grid > .field:nth-child(-n + 2) { border-top: 0; }
  .steel-meta-grid .field:last-child { grid-column: span 2; }
  .steel-summary-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steel-summary-board > div:nth-child(3) { grid-column: span 2; border-top: 1px solid var(--line); border-left: 0; }
  .optional-module-grid { grid-template-columns: 1fr; }
  .optional-module-grid p { min-height: 0; }
}

@media print {
  .steel-shell { display: none !important; }
  .print-page-empty { display: none !important; }
  .print-document-header { grid-template-columns: 72mm minmax(0, 1fr) 18mm; }
  .steel-print-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 3mm; border: 0.5pt solid #888; }
  .steel-print-meta > div { min-width: 0; padding: 1.2mm 1.6mm; border-right: 0.5pt solid #888; }
  .steel-print-meta > div:last-child { border-right: 0; }
  .steel-print-meta span { display: block; color: #555; font-size: 6pt; }
  .steel-print-meta strong { display: block; margin-top: .6mm; overflow: hidden; font-size: 8pt; text-overflow: ellipsis; white-space: nowrap; }
  .steel-print-table th:first-child { width: 6%; }
  .steel-print-table th:last-child { width: 12%; }
  .steel-print-table td, .steel-print-table th { font-size: 6.6pt; }
  .steel-print-table td { height: 6.5mm; padding: 1mm 1.2mm; }
  .steel-print-table th { padding: 1.1mm .9mm; }
  .steel-print-note { min-height: 14mm; padding: 1.8mm; border: .5pt solid #888; font-size: 7pt; white-space: pre-wrap; }
  .steel-print-page { min-height: 190mm; }
}
