/* Scoped additions to the existing cream, ink and gold free-tool shell. */
[data-pgt-depthoffield] .pgt-tool-dof { text-align: left; max-width: 900px; margin-inline: auto; }
[data-pgt-depthoffield] .pgt-tool-dof *, [data-pgt-depthoffield] .pgt-tool-dof *::before { box-sizing: border-box; }
.pgt-tool-dof fieldset { border: 1px solid var(--pgt-line); border-radius: 12px; padding: 18px; margin: 20px 0; min-width: 0; }
.pgt-tool-dof legend { font-weight: 600; padding: 0 8px; }
.pgt-dof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pgt-tool-dof label { display: block; font-size: 15px; font-weight: 600; }
.pgt-tool-dof input, .pgt-tool-dof select, .pgt-tool-dof textarea { display: block; width: 100%; min-height: 48px; margin-top: 7px; padding: 12px; border: 1px solid #8c8374; border-radius: 8px; background: #fff; color: #1a1a1a; font: inherit; font-size: 16px; }
.pgt-dof-hint { display: block; font-size: 13px; line-height: 1.6; color: #595247; font-weight: 400; margin-top: 7px; }
.pgt-dof-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
[data-pgt-depthoffield] .pgt-cta, [data-pgt-depthoffield] .pgt-btn:not(.pgt-btn-secondary) { background: #70550e; color: #fff; min-height: 48px; white-space: normal; }
[data-pgt-depthoffield] .pgt-btn-secondary { color: #443511; background: #fff8e5; border: 1px solid #8c742f; min-height: 48px; }
[data-pgt-depthoffield] :is(button, input, select, textarea, a, summary, section):focus-visible { outline: 3px solid #285fa6; outline-offset: 4px; }
.pgt-tool-dof [aria-invalid="true"] { border: 2px solid #a32525; }
.pgt-tool-dof [hidden] { display: none !important; }
.pgt-tool-dof button:disabled { opacity: 0.55; cursor: not-allowed; }
.pgt-tool-dof .pgt-status { min-height: 3.4em; color: #443511; }
#pgtDofResult:not(:empty) { margin: 20px 0; padding: 22px; background: #fffaf0; border: 1px solid var(--pgt-line); border-radius: 14px; }
.pgt-dof-diagram { display: block; width: 100%; height: auto; color: #1a1a1a; }
.pgt-dof-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pgt-dof-metrics div { border: 1px solid var(--pgt-line); border-radius: 8px; padding: 12px; background: white; }
.pgt-dof-metrics dt { font-size: 13px; color: #595247; }
.pgt-dof-metrics dd { margin: 4px 0 0; font-size: 21px; font-weight: 600; overflow-wrap: anywhere; }
.pgt-tool-dof summary { cursor: pointer; min-height: 48px; padding-block: 12px; font-weight: 600; }
.pgt-dof-table { overflow-x: auto; }
.pgt-dof-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.pgt-dof-table th, .pgt-dof-table td { text-align: left; padding: 9px 5px; border-bottom: 1px solid var(--pgt-line); }
.pgt-dof-table caption { text-align: left; font-size: 13px; margin-bottom: 8px; }
#pgtDofCopyFallback { min-height: 220px; }
@media (max-width: 540px) {
  .pgt-dof-grid { grid-template-columns: 1fr; }
  .pgt-tool-dof fieldset { padding: 12px; }
  #pgtDofResult:not(:empty) { padding: 12px; }
  .pgt-dof-metrics dd { font-size: 18px; }
  .pgt-dof-actions button { width: 100%; }
  [data-pgt-depthoffield] .pgt-hero { padding-top: 34px; }
}
