/* Talvemo v5.1 — higher-contrast interface.
   Load after app.css and checkout.css. Layout, backgrounds and resume output
   are deliberately preserved; these tokens apply only to the app interface. */
:root {
  --ink: #18271f;
  --text: #18271f;
  --muted: #526358;
  --ui-text: #18271f;
  --ui-secondary: #3d5145;
  --ui-muted: #526358;
  --ui-placeholder: #5b6b60;
  --ui-link: #205b50;
  --ui-control-line: #a2b1a7;
  --ui-focus: #24645e;
  --ui-danger: #923e30;
  --ui-warning: #77552b;
}

/* Headings and primary information: near-black rather than pale green. */
.brand,
#project-title,
.sidebar-top h2,
.step-heading h1,
.list-card-header h3,
.empty-state h3,
.section-small-heading h3,
.template-meta h3,
.selected-template-note strong,
.project-open strong,
.success-panel h3,
.help-step h3,
.modal-header h2,
.format-dialog .format-intro,
.format-option-copy strong,
.purchase-heading h1,
.purchase-file-details h2,
.purchase-offer h2,
.purchase-payment-heading h2,
.purchase-total,
.purchase-success h2,
.purchase-success-file strong,
.purchase-loading h1 {
  color: var(--ui-text);
}

/* Body copy, labels and navigation keep a clear second level. */
.sidebar-top p,
.step-heading p,
.step-button,
.field > label,
.field-label,
.photo-details .order-help,
.list-card-header p,
.check-row,
.empty-state p,
.section-helper,
.section-small-heading span,
.collection-intro,
.selected-template-note p,
.settings-section summary,
.color-row > span,
.order-item,
.project-open,
.modal-content > p,
.success-panel p,
.help-step p,
.format-dialog .format-included,
.format-option-copy > span,
.purchase-heading > p,
.purchase-file-details p,
.purchase-preview-note p,
.purchase-benefits li,
.purchase-payment-body .field > label,
.purchase-disclosure,
.purchase-format-choice > span,
.purchase-word-note,
.purchase-demo-tools,
.checkout-policy p,
.purchase-success > p,
.purchase-loading p {
  color: var(--ui-secondary);
}
.field > label,
.field-label,
.purchase-payment-body .field > label { font-weight: 600; }
.step-button { font-weight: 550; }

/* Fine print is quieter through hierarchy, never washed out. */
.brand-label,
.draft-badge,
.save-status,
.eyebrow,
.step-number,
.step-button.active .step-number,
.step-kicker,
.step-heading .heading-tag,
.completion-card > div:first-child,
.completion-card p,
.local-note,
.footer-left,
.editor-footer .step-fraction,
.field label .optional,
.field-hint,
.photo-copy p,
.preview-top .eyebrow,
.preview-label,
.preview-label #preview-template,
.dot-separator,
#preview-updating,
.preview-placeholder > span,
.page-navigation span,
.preview-bottom-note,
.suggestions-label,
.character-count,
.tip-chip,
.template-meta span,
.selected-template-note strong span,
.selected-template-note small,
.gallery-note,
.parsing-note,
.order-help,
.project-open small,
.shortcut-note,
.badge-local,
.format-dialog .format-footnote,
.purchase-progress,
.purchase-eyebrow,
.purchase-offer .purchase-eyebrow,
.purchase-local-badge,
.purchase-file-details p span,
.purchase-pages > span,
.purchase-price span,
.checkout-demo-tag,
.purchase-payment-body .field .optional,
.purchase-payment-body .field-hint,
.purchase-total small,
.purchase-no-charge,
.purchase-footer .purchase-container,
.purchase-footer .purchase-container > span > span,
.purchase-success-file span {
  color: var(--ui-muted);
}
/* Existing inline/important legacy colors need narrowly scoped overrides. */
.editor-footer .step-fraction > span { color: var(--ui-muted) !important; }
.modal-note { color: var(--ui-muted) !important; }

/* Sage panels stay light; text and their meaningful icons become darker. */
.market-note strong,
.info-box strong,
.purchase-preview-note strong,
.purchase-word-note strong,
.purchase-disclosure strong {
  color: var(--ui-text);
}
.market-note span:not(.market-note-icon),
.info-box,
.purchase-demo-note { color: var(--ui-secondary); }
.info-box.blue { color: #36586a; }
.info-box svg,
.info-box.blue svg,
.local-note svg,
.market-note-icon,
.completion-card strong,
.live-pill,
.success-filename,
.purchase-ready,
.purchase-ready svg,
.purchase-file-tag,
.purchase-preview-note,
.purchase-document-icon,
.purchase-benefits li svg,
.purchase-success-icon,
.purchase-success-file,
.purchase-footer .purchase-container > span {
  color: var(--ui-link);
}
.live-pill i,
.badge-local i { background: var(--ui-link); }
.progress-track > span { background: #497851; }

/* Form values and examples remain distinguishable without low contrast. */
.input,
textarea,
select,
.fixed-setting,
.purchase-payment-body .input {
  color: var(--ui-text);
  border-color: var(--ui-control-line);
  caret-color: var(--ui-link);
}
.input::placeholder,
textarea::placeholder,
.purchase-payment-body .input::placeholder {
  color: var(--ui-placeholder);
  -webkit-text-fill-color: var(--ui-placeholder);
  opacity: 1;
}
.input:focus,
textarea:focus,
select:focus {
  border-color: var(--ui-focus);
  box-shadow: 0 0 0 3px #24645e26;
}
.input:disabled,
textarea:disabled,
select:disabled,
.purchase-payment-body .input:disabled {
  color: var(--ui-muted);
  -webkit-text-fill-color: var(--ui-muted);
  opacity: 1;
  cursor: not-allowed;
}
.input-icon,
.purchase-input-icon svg { color: var(--ui-muted); }

/* Interactive text retains the existing teal identity. */
.brand-dot,
.button-quiet,
.footer-left .button,
.editor-footer .button-quiet,
.text-button,
.example-button,
.fresh-example,
.preview-toolbar .text-button,
.add-button,
.suggestion,
.chip,
.chip button,
.collection-label,
.template-filter,
.recommended,
.help-step-number,
.success-icon,
.format-option-copy em,
.purchase-progress .is-done,
.purchase-heading .purchase-back,
.inline-policy,
.purchase-format-button {
  color: var(--ui-link);
}
.button-quiet:hover,
.text-button:hover,
.suggestion:hover,
.inline-policy:hover { color: #143f37; }
.icon-button,
.help-button,
.step-icon,
.card-icon,
.photo-upload,
.empty-state-icon,
.project-card .project-icon,
.purchase-expand { color: var(--ui-secondary); }
.step-button.active,
.step-button.done .step-icon { color: var(--ui-link); }
.step-button.active { font-weight: 700; }
.step-button.active .step-icon,
.template-card.selected .template-radio,
.template-card.selected .recommended,
.template-filter.active,
.purchase-progress .is-active > span { color: #fff; }
.template-filter.active { background: var(--accent); border-color: var(--accent); }
.template-radio { border-color: var(--ui-control-line); }
.purchase-format-button.is-selected { color: #184c3c; font-weight: 650; }
.purchase-price strong { color: #184c3c; }
.format-pdf .format-icon { color: #82492f; }

/* A visible keyboard focus indicator on both plain and tinted surfaces. */
button:focus-visible,
a:focus-visible,
summary:focus-visible,
.format-option:focus-visible,
.purchase-format-button:focus-visible,
#project-title:focus-visible {
  outline: 3px solid var(--ui-focus);
  outline-offset: 3px;
}
button:disabled,
.format-option:disabled,
.purchase-format-button:disabled { opacity: 1; }
button:disabled { cursor: not-allowed; }
.button:disabled,
.icon-button:disabled,
.purchase-format-button:disabled {
  color: var(--ui-muted);
  background: #edf1ed;
  border-color: #d4ddd6;
}
.format-option:disabled { cursor: wait; }

/* Readable validation, warnings and recovery information. */
.save-status.error,
.field-error,
.screen-error,
.preview-error,
.purchase-error,
.purchase-preview-error { color: var(--ui-danger); }
.remove-photo { color: var(--ui-danger) !important; }
.export-warning { color: var(--ui-warning); }
.field.invalid .input { border-color: var(--ui-danger); }
.toast.error { background: #873e30; }
