import type React from 'react';

import styles from '../MoneyForCeos.module.scss';
import environment from '../../../Environments/environment';
import ToolsTitleNavigation from '../../ToolsNavigation/ToolsTitleNavigation/ToolsTitleNavigation';
import ToolsIntroAccordion from '../../ToolsNavigation/ToolsIntroAccordion/ToolsIntroAccordion';

const MoneyForCeosTitle: React.FC = (): JSX.Element => {
	const accordionContent = `
		<p class="subtitle">What is this for?</p>
		Explore the ripple effects of business decisions on both profit and cash flow — instantly.
		<p class="subtitle">What will I get?</p>
		<ul>
			<li>A clear view of how business decisions ripple through your numbers</li>
			<li>Insight into which levers unlock more cash vs. more margin</li>
			<li>A smarter plan to scale sustainably and cash-positively</li>
		</ul>
		<p class="subtitle">How do I start?</p>
		Set your base year (from financials screen) → Adjust the multipliers → Instantly see impact
		on cash and margins → Model what-if scenarios for smarter strategic moves.
		<p class="subtitle">💡 Strategy Tip</p>
		<i>Small tweaks, big impact.</i> Even minor changes in pricing, margins, or cost control can
		compound into major gains in both cash flow and business valuation. Use the simulator to
		explore how each lever affects your long-term value — without taking real-world risks.
	`;

	return (
		<div className={styles.container__header__title}>
			<ToolsTitleNavigation
				title="Multiplier Simulator"
				stepNumber={1}
				maxSteps={2}
				nextAction={{ title: 'Next', link: environment.frontendRoutes.moneyForCeosBusiness }}
				introText="How much cash are we really generating?"
			/>
			<ToolsIntroAccordion content={accordionContent} ctaTitle="Start tuning my strategy" />
			{/* <p className={styles.container__header__title__paragraph1}>
			You can tweak one or more multipliers to visualise the impact of your business decisions in
			the future. Test how different &apos;what-if&apos; scenarios affect your cash flow and profit.
		</p>
		<p className={styles.container__header__title__paragraph2}>
			Change the % or days in the multiplier input boxes below to see how adjustments impact
			<br />
			your cash flow and profit.
			<br />
			Notice how your cash flow movements compare to profit movements for each multiplier
		</p> */}
		</div>
	);
};

export default MoneyForCeosTitle;