/*=====================================
  Quick Legend (PAR, PPF, Height, Angle)
=====================================*/
.par-legend {
  background: var(--bg-panel);
  padding: 2em 1.5em;
  margin: 2em auto;
  max-width: 600px;
  border-radius: 0.8em;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
}
.par-legend h2 {
  font-size: 1.6em;
  color: var(--accent);
  text-align: center;
  margin-bottom: 1em;
}
.par-legend ul {
  list-style: none;
  padding-left: 0;
}
.par-legend li {
  margin-bottom: 0.6em;
  font-size: 1em;
  color: var(--text-main);
}
.par-legend strong {
  color: var(--heading-color);
}

/*=====================================
  PAR Simulator & Light Scheduler Tool Styling
=====================================*/
.toolzone-app {
  background-color: var(--bg-panel);
  padding: 2em 1.5em;
  margin: 2em auto;
  max-width: 600px;
  border-radius: 0.8em;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
  text-align: center;
}

/* Scoping heading style to override global content rules */
.toolzone-main .toolzone-app h2 {
  font-size: 1.6em;
  color: var(--accent);
  margin-bottom: 1em;
  text-align: center;
}

/* Grid layout for scheduler & simulator */
#scheduler-app,
#par-sim-app {
  display: grid;
  gap: 1em;
  text-align: left;
}

/* Form field structure: Light Scheduler */
#light-form > label,
#light-form > input,
#light-form > select,
#light-form > fieldset {
  display: block;
  width: 100%;
  margin-bottom: 1.3em;
}

/* Form field structure: PAR Simulator */
#par-sim-form > label,
#par-sim-form > select,
#par-sim-form > button {
  display: block;
  width: 100%;
  margin-bottom: 1.3em;
}

/* Fieldset styling */
#light-form fieldset {
  border: 1px solid #ccc;
  padding: 1em;
  border-radius: 0.5em;
}
#light-form fieldset legend {
  font-weight: bold;
  margin-bottom: 0.6em;
}
#light-form fieldset label {
  display: block;
  margin-bottom: 0.5em;
}

/* Inputs & selects */
#light-form input,
#light-form select,
#par-sim-form select {
  padding: 0.6em;
  font-size: 1em;
  border: 1px solid var(--accent-light, #ccc);
  border-radius: 4px;
  background: #fff;
  color: var(--text-main);
}

/* Buttons */
.button-group,
#par-sim-form button {
  text-align: center;
}
.button-group {
  display: flex;
  justify-content: center;
  gap: 1em;
  margin-top: 1.4em;
}
.button-group button,
#par-sim-form button {
  padding: 0.6em 1.4em;
  background: var(--accent);
  color: var(--bg-page);
  border: none;
  font-weight: 700;
  border-radius: 2em;
  cursor: pointer;
  transition: background 0.25s ease;
}
.button-group button:hover,
#par-sim-form button:hover {
  background: var(--heading-color);
}

/* Output box styling */
.scheduler-output,
#light-output,
#par-sim-output {
  margin-top: 1.5em;
  padding: 1em;
  background: #f9f9f9;
  border-left: 4px solid var(--accent);
  border-radius: 4px;
  font-size: 1em;
  color: var(--text-main);
}
#light-output .result-line {
  margin: 0.35em 0;
  font-size: 1.05em;
  line-height: 1.4em;
}

/* Instructions & legend descriptions */
.tool-instructions {
  max-width: 500px;
  margin: 1em auto 2em;
  font-size: 1.05em;
  color: var(--text-main);
  text-align: center;
}

.tool-legend {
  max-width: 500px;
  margin: 2em auto;
  font-size: 0.95em;
  color: var(--text-main);
}
.tool-legend dt {
  font-weight: 700;
  margin-top: 0.8em;
}
.tool-legend dd {
  margin-left: 1em;
  margin-bottom: 0.5em;
  line-height: 1.4;
}

/* Export note & output titles */
.export-note {
  font-size: 0.95em;
  color: var(--text-main);
  margin: 1em 0 0.5em;
  text-align: left;
}
.output-title {
  font-size: 1.2em;
  font-weight: 700;
  margin-bottom: 0.6em;
  color: var(--heading-color);
}
.output-divider {
  border: none;
  border-top: 2px solid var(--accent);
  margin: -0.9em 0 1em;
  width: 100%;
}