/*
 * Halfpix Dayoo v1.2.35 - Discover firing schedule.
 * Mirrors the APP's DiscoverFiringScheduleCard: chips, a to-scale chart,
 * and the controller program as a table. Colours come from the palette
 * tokens only, so the dark scheme follows without its own rules.
 */
.firing-schedule__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.firing-schedule__head h2 { margin: 0; }

.firing-unit {
  display: inline-flex;
  border: 1px solid var(--hp-line);
  border-radius: var(--radius-pill);
  overflow: hidden;
  flex: none;
}
.firing-unit button {
  min-width: 44px;
  min-height: 32px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: var(--hp-muted);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.firing-unit button[aria-pressed="true"] {
  background: var(--hp-primary);
  color: var(--hp-surface, #fff);
}
.firing-unit button:focus-visible { outline: 2px solid var(--hp-primary); outline-offset: -2px; }

.firing-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.firing-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 5px 12px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--hp-line);
  background: var(--hp-surface-soft);
  color: var(--hp-ink);
  font-size: var(--text-sm, 13px);
  font-weight: 700;
}
.firing-chip b { font-weight: 800; }
.firing-chip i { font-style: normal; }
.firing-chip--fire { color: var(--hp-warn); }
.firing-chip--cone { color: var(--hp-clay); }
.firing-chip--air { color: var(--hp-blue); }

.firing-chart { width: 100%; margin: 4px 0 12px; }
/* style.css styles every <svg> as an icon (fill none, stroke currentColor,
   stroke-width 1.8, 20px square). SVG stroke is inherited, so without this
   reset every chart label was drawn with a 1.8px outline. Each chart part sets
   its own fill and stroke below. */
.firing-chart svg { display: block; width: 100%; height: auto; overflow: visible; fill: none; stroke: none; stroke-width: 0; }
.firing-chart svg text { stroke: none; }
.firing-chart .fc-grid { stroke: var(--hp-line); stroke-width: 1; }
.firing-chart .fc-axis { fill: var(--hp-muted); font-size: 11px; font-weight: 600; }
.firing-chart .fc-note { fill: var(--hp-muted); font-size: 11px; font-weight: 600; }
.firing-chart .fc-peak { fill: var(--hp-primary); font-size: 12px; font-weight: 800; }
.firing-chart .fc-fill { fill: var(--hp-primary); opacity: 0.08; }
.firing-chart .fc-line { stroke: var(--hp-primary); stroke-width: 2.6; stroke-linecap: round; }
.firing-chart .fc-hold { stroke: var(--hp-warn); stroke-width: 4; }
.firing-chart .fc-full { stroke-dasharray: 6 5; }
.firing-chart .fc-dot { fill: var(--hp-primary); }
.firing-chart .fc-quartz { stroke: var(--hp-muted); stroke-width: 1; stroke-dasharray: 2 4; opacity: 0.7; }
.firing-chart .fc-reduction { fill: var(--hp-clay); opacity: 0.12; }
.firing-chart .fc-cooling { fill: none; stroke: var(--hp-primary); stroke-width: 2; stroke-dasharray: 5 4; opacity: 0.5; }

.firing-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: -4px 0 12px; color: var(--hp-muted); font-size: 12px; font-weight: 600; }
.fc-key { display: inline-flex; align-items: center; gap: 6px; }
.fc-key i { display: inline-block; width: 18px; height: 0; border-top: 2px solid var(--hp-primary); }
.fc-key--hold i { border-top: 4px solid var(--hp-warn); }
.fc-key--full i { border-top: 2px dashed var(--hp-primary); }
.fc-key--quartz i { border-top: 1px dotted var(--hp-muted); }
.fc-key--reduction i { height: 10px; border: 0; background: var(--hp-clay); opacity: 0.25; }
.fc-key--cooling i { border-top: 2px dashed var(--hp-primary); opacity: 0.5; }

.firing-schedule__start { margin: 0 0 4px; color: var(--hp-muted); font-size: var(--text-sm, 13px); }
.firing-table-wrap { overflow-x: auto; }
.firing-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-sm, 13px);
  font-variant-numeric: tabular-nums;
}
.firing-table th,
.firing-table td { padding: 6px 4px; text-align: right; border-bottom: 1px solid var(--hp-line); white-space: nowrap; }
.firing-table th:first-child,
.firing-table td:first-child { text-align: left; width: 28px; }
.firing-table th { color: var(--hp-muted); font-weight: 800; font-size: 12px; }
.firing-table td i { font-style: normal; }
.firing-table tbody tr:last-child td { border-bottom: 0; }

.firing-notes { margin: 8px 0 0; padding-left: 22px; color: var(--hp-muted); font-size: var(--text-sm, 13px); }
.firing-schedule__note { margin: 8px 0 0; color: var(--hp-muted); font-size: var(--text-sm, 13px); line-height: 1.5; }

.firing-cone { display: grid; gap: 6px; margin: 0; }
.firing-cone div { display: flex; justify-content: space-between; gap: 12px; }
.firing-cone dt { color: var(--hp-muted); }
.firing-cone dd { margin: 0; font-weight: 700; }

@media (max-width: 480px) {
  .firing-table th,
  .firing-table td { padding: 6px 2px; }
}