@eric-emg/symphiq-components 1.2.213 → 1.2.215

package/fesm2022/symphiq-components.mjs

@@ -56262,17 +56262,39 @@ var areaChart_component = /*#__PURE__*/Object.freeze({
 
 const _c0$r = ["absoluteInputRef"];
 const _c1$b = ["percentageInputRef"];
-function InitialTargetSettingComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 10);
+function InitialTargetSettingComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵtextInterpolate1(" Your ", ctx_r0.currentYear(), " Revenue Target ");
+} }
+function InitialTargetSettingComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵtextInterpolate1(" Calculate Your ", ctx_r0.currentYear(), " Revenue Target ");
+} }
+function InitialTargetSettingComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 11);
-    i0.ɵɵelement(2, "path", 31);
+    i0.ɵɵelementStart(0, "svg", 34);
+    i0.ɵɵelement(1, "path", 35);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("chevron-rotate-expanded", ctx_r0.detailsExpanded());
+    i0.ɵɵproperty("ngClass", ctx_r0.chevronClasses());
+} }
+function InitialTargetSettingComponent_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 12);
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(1, "svg", 13);
+    i0.ɵɵelement(2, "path", 36);
     i0.ɵɵelementEnd();
     i0.ɵɵnamespaceHTML();
-    i0.ɵɵelementStart(3, "div")(4, "p", 13);
+    i0.ɵɵelementStart(3, "div")(4, "p", 15);
     i0.ɵɵtext(5, " Current Pace Projection ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "p", 14);
+    i0.ɵɵelementStart(6, "p", 16);
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -56286,14 +56308,14 @@ function InitialTargetSettingComponent_Conditional_18_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.currentPaceProjection()), " ");
 } }
-function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 34)(1, "span", 36);
+    i0.ɵɵelementStart(0, "div", 39)(1, "span", 41);
     i0.ɵɵtext(2, " $ ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "input", 37, 0);
-    i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template_input_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.absoluteInput, $event) || (ctx_r0.absoluteInput = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template_input_ngModelChange_3_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onAbsoluteInputChange()); });
+    i0.ɵɵelementStart(3, "input", 42, 0);
+    i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template_input_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.absoluteInput, $event) || (ctx_r0.absoluteInput = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template_input_ngModelChange_3_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onAbsoluteInputChange()); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
@@ -56303,13 +56325,13 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template(rf,
     i0.ɵɵtwoWayProperty("ngModel", ctx_r0.absoluteInput);
     i0.ɵɵproperty("ngClass", ctx_r0.inputClasses());
 } }
-function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 34)(1, "input", 38, 1);
-    i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.percentageInput, $event) || (ctx_r0.percentageInput = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template_input_ngModelChange_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onPercentageInputChange()); });
+    i0.ɵɵelementStart(0, "div", 39)(1, "input", 43, 1);
+    i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.percentageInput, $event) || (ctx_r0.percentageInput = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template_input_ngModelChange_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onPercentageInputChange()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 39);
+    i0.ɵɵelementStart(3, "span", 44);
     i0.ɵɵtext(4, " % ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -56320,10 +56342,10 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template(rf,
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngClass", ctx_r0.inputSuffixClasses());
 } }
-function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_25_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 35)(1, "button", 40);
-    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleCancel()); });
+    i0.ɵɵelementStart(0, "div", 40)(1, "button", 45);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Conditional_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleCancel()); });
     i0.ɵɵtext(2, " Cancel ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -56331,18 +56353,18 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.cancelButtonClasses());
 } }
-function InitialTargetSettingComponent_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 32)(1, "button", 33);
-    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("absolute")); });
+    i0.ɵɵelementStart(0, "div", 37)(1, "button", 38);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("absolute")); });
     i0.ɵɵtext(2, " Absolute Amount ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 33);
-    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("percentage")); });
+    i0.ɵɵelementStart(3, "button", 38);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("percentage")); });
     i0.ɵɵtext(4, " % Increase ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_22_Conditional_5_Template, 5, 3, "div", 34)(6, InitialTargetSettingComponent_Conditional_22_Conditional_6_Template, 5, 3, "div", 34);
-    i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_22_Conditional_7_Template, 3, 1, "div", 35);
+    i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_25_Conditional_5_Template, 5, 3, "div", 39)(6, InitialTargetSettingComponent_Conditional_25_Conditional_6_Template, 5, 3, "div", 39);
+    i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_25_Conditional_7_Template, 3, 1, "div", 40);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
@@ -56354,14 +56376,14 @@ function InitialTargetSettingComponent_Conditional_22_Template(rf, ctx) { if (rf
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r0.hasStoredResponse() ? 7 : -1);
 } }
-function InitialTargetSettingComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "symphiq-area-chart", 22);
+function InitialTargetSettingComponent_Conditional_32_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "symphiq-area-chart", 24);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("chart", ctx_r0.revenueChartData())("showAxisLabels", true)("viewMode", ctx_r0.viewMode())("currencySymbol", "$")("height", "108px");
 } }
-function InitialTargetSettingComponent_Conditional_30_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 23)(1, "p", 41);
+function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 25)(1, "p", 46);
     i0.ɵɵtext(2, " No revenue data available ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -56369,52 +56391,65 @@ function InitialTargetSettingComponent_Conditional_30_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.noDataClasses());
 } }
-function InitialTargetSettingComponent_Conditional_33_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_36_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵtextInterpolate1(" > ", ctx_r0.formatCurrency(ctx_r0.calculatedRevenue()), " ");
+    i0.ɵɵtextInterpolate1(" > ", ctx_r0.formatCurrency(ctx_r0.submittedAbsoluteInput()), " ");
 } }
-function InitialTargetSettingComponent_Conditional_33_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_36_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.displayedTargetRevenue()), " ");
 } }
-function InitialTargetSettingComponent_Conditional_33_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_36_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 52);
-    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_33_Conditional_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleAdjustTarget()); });
+    i0.ɵɵelementStart(0, "button", 61);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_9_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.handleAdjustTarget(); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵtext(1, " Adjust Revenue Target ");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngClass", ctx_r0.secondaryButtonClasses());
 } }
-function InitialTargetSettingComponent_Conditional_33_Conditional_27_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 46)(1, "div", 47);
-    i0.ɵɵelement(2, "div", 48);
-    i0.ɵɵelementStart(3, "span", 49);
+function InitialTargetSettingComponent_Conditional_36_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 51)(1, "button", 62);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_10_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.toggleDetails(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵtext(2, " Learn More ");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", ctx_r0.learnMoreButtonClasses());
+} }
+function InitialTargetSettingComponent_Conditional_36_Conditional_30_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 54)(1, "div", 55);
+    i0.ɵɵelement(2, "div", 56);
+    i0.ɵɵelementStart(3, "span", 57);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(5, "div", 48);
+    i0.ɵɵelement(5, "div", 56);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 50)(7, "div")(8, "p", 43);
+    i0.ɵɵelementStart(6, "div", 58)(7, "div")(8, "p", 48);
     i0.ɵɵtext(9, " Gap to Close ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "p", 51);
+    i0.ɵɵelementStart(10, "p", 59);
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(12, "div")(13, "div", 53)(14, "p", 13);
+    i0.ɵɵelementStart(12, "div")(13, "div", 63)(14, "p", 15);
     i0.ɵɵtext(15, " Additional Growth Needed ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "button", 54);
+    i0.ɵɵelementStart(16, "button", 64);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_30_Template_button_click_16_listener($event) { i0.ɵɵrestoreView(_r8); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(17, "svg", 55);
-    i0.ɵɵelement(18, "path", 56);
+    i0.ɵɵelementStart(17, "svg", 65);
+    i0.ɵɵelement(18, "path", 66);
     i0.ɵɵelementEnd()()();
     i0.ɵɵnamespaceHTML();
-    i0.ɵɵelementStart(19, "p", 51);
+    i0.ɵɵelementStart(19, "p", 59);
     i0.ɵɵtext(20);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -56442,36 +56477,49 @@ function InitialTargetSettingComponent_Conditional_33_Conditional_27_Template(rf
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate2(" ", ctx_r0.gapToClose().amount > 0 ? "+" : "", "", ctx_r0.formatPercentage(ctx_r0.gapToClose().percentage, 1), " ");
 } }
-function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 26)(1, "div", 17)(2, "div", 42)(3, "div")(4, "p", 43);
+function InitialTargetSettingComponent_Conditional_36_Conditional_31_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 60)(1, "button", 62);
+    i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_31_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.toggleDetails(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵtext(2, " Show Less ");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", ctx_r0.learnMoreButtonClasses());
+} }
+function InitialTargetSettingComponent_Conditional_36_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 28)(1, "div", 19)(2, "div", 47)(3, "div")(4, "p", 48);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "p", 44);
-    i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_33_Conditional_7_Template, 1, 1)(8, InitialTargetSettingComponent_Conditional_33_Conditional_8_Template, 1, 1);
+    i0.ɵɵelementStart(6, "p", 49);
+    i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_36_Conditional_7_Template, 1, 1)(8, InitialTargetSettingComponent_Conditional_36_Conditional_8_Template, 1, 1);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(9, InitialTargetSettingComponent_Conditional_33_Conditional_9_Template, 2, 1, "button", 45);
+    i0.ɵɵconditionalCreate(9, InitialTargetSettingComponent_Conditional_36_Conditional_9_Template, 2, 1, "button", 50);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "div", 46)(11, "div", 47);
-    i0.ɵɵelement(12, "div", 48);
-    i0.ɵɵelementStart(13, "span", 49);
-    i0.ɵɵtext(14);
+    i0.ɵɵconditionalCreate(10, InitialTargetSettingComponent_Conditional_36_Conditional_10_Template, 3, 1, "div", 51);
+    i0.ɵɵelementStart(11, "div", 52)(12, "div", 53)(13, "div", 54)(14, "div", 55);
+    i0.ɵɵelement(15, "div", 56);
+    i0.ɵɵelementStart(16, "span", 57);
+    i0.ɵɵtext(17);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(15, "div", 48);
+    i0.ɵɵelement(18, "div", 56);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "div", 50)(17, "div")(18, "p", 43);
-    i0.ɵɵtext(19, " Increase Amount ");
+    i0.ɵɵelementStart(19, "div", 58)(20, "div")(21, "p", 48);
+    i0.ɵɵtext(22, " Increase Amount ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(20, "p", 51);
-    i0.ɵɵtext(21);
+    i0.ɵɵelementStart(23, "p", 59);
+    i0.ɵɵtext(24);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(22, "div")(23, "p", 43);
-    i0.ɵɵtext(24, " % Growth ");
+    i0.ɵɵelementStart(25, "div")(26, "p", 48);
+    i0.ɵɵtext(27, " % Growth ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(25, "p", 51);
-    i0.ɵɵtext(26);
+    i0.ɵɵelementStart(28, "p", 59);
+    i0.ɵɵtext(29);
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵconditionalCreate(30, InitialTargetSettingComponent_Conditional_36_Conditional_30_Template, 21, 13, "div", 54);
+    i0.ɵɵconditionalCreate(31, InitialTargetSettingComponent_Conditional_36_Conditional_31_Template, 3, 1, "div", 60);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵconditionalCreate(27, InitialTargetSettingComponent_Conditional_33_Conditional_27_Template, 21, 13, "div", 46);
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("ngClass", ctx_r0.calculatedValuesCardClasses());
@@ -56482,10 +56530,14 @@ function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.calculatedValueClasses());
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.targets() === undefined ? 7 : 8);
+    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.targets() === undefined && ctx_r0.submittedAbsoluteInput() !== null ? 7 : 8);
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.targets() === undefined ? 9 : -1);
-    i0.ɵɵadvance(3);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && !ctx_r0.detailsExpanded() ? 10 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("details-collapse-expanded", ctx_r0.calculationState() !== "results" || ctx_r0.detailsExpanded());
+    i0.ɵɵadvance(4);
     i0.ɵɵproperty("ngClass", ctx_r0.dividerBorderClasses());
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.dividerLabelClasses());
@@ -56506,16 +56558,18 @@ function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" +", ctx_r0.formatPercentage(ctx_r0.percentageIncrease(), 1), " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r0.currentPaceProjection() > 0 && ctx_r0.gapToClose().amount !== 0 ? 27 : -1);
+    i0.ɵɵconditional(ctx_r0.currentPaceProjection() > 0 && ctx_r0.gapToClose().amount !== 0 ? 30 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.detailsExpanded() ? 31 : -1);
 } }
-function InitialTargetSettingComponent_Conditional_34_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "symphiq-area-chart", 22);
+function InitialTargetSettingComponent_Conditional_37_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "symphiq-area-chart", 24);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("chart", ctx_r0.revenueChartData())("showAxisLabels", true)("viewMode", ctx_r0.viewMode())("currencySymbol", "$")("height", "320px");
 } }
-function InitialTargetSettingComponent_Conditional_34_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 23)(1, "p", 41);
+function InitialTargetSettingComponent_Conditional_37_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 25)(1, "p", 46);
     i0.ɵɵtext(2, " No revenue data available ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -56523,12 +56577,12 @@ function InitialTargetSettingComponent_Conditional_34_Conditional_5_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.noDataClasses());
 } }
-function InitialTargetSettingComponent_Conditional_34_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 27)(1, "p", 20);
+function InitialTargetSettingComponent_Conditional_37_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 29)(1, "p", 22);
     i0.ɵɵtext(2, " Year-over-Year Revenue Trend ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 21);
-    i0.ɵɵconditionalCreate(4, InitialTargetSettingComponent_Conditional_34_Conditional_4_Template, 1, 5, "symphiq-area-chart", 22)(5, InitialTargetSettingComponent_Conditional_34_Conditional_5_Template, 3, 1, "div", 23);
+    i0.ɵɵelementStart(3, "div", 23);
+    i0.ɵɵconditionalCreate(4, InitialTargetSettingComponent_Conditional_37_Conditional_4_Template, 1, 5, "symphiq-area-chart", 24)(5, InitialTargetSettingComponent_Conditional_37_Conditional_5_Template, 3, 1, "div", 25);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -56539,14 +56593,14 @@ function InitialTargetSettingComponent_Conditional_34_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r0.revenueChartData() ? 4 : 5);
 } }
-function InitialTargetSettingComponent_Conditional_37_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 3)(1, "div", 57)(2, "h2", 58);
+function InitialTargetSettingComponent_Conditional_40_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 32)(1, "div", 67)(2, "h2", 68);
     i0.ɵɵtext(3, " Contributing Metrics ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p", 41);
+    i0.ɵɵelementStart(4, "p", 46);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(6, "symphiq-funnel-metrics-visualization", 59);
+    i0.ɵɵelement(6, "symphiq-funnel-metrics-visualization", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -56578,6 +56632,8 @@ class InitialTargetSettingComponent {
         this.percentageInput = signal(null, ...(ngDevMode ? [{ debugName: "percentageInput" }] : []));
         this.calculationState = signal('input', ...(ngDevMode ? [{ debugName: "calculationState" }] : []));
         this.storedResponse = signal(null, ...(ngDevMode ? [{ debugName: "storedResponse" }] : []));
+        this.submittedAbsoluteInput = signal(null, ...(ngDevMode ? [{ debugName: "submittedAbsoluteInput" }] : []));
+        this.detailsExpanded = signal(false, ...(ngDevMode ? [{ debugName: "detailsExpanded" }] : []));
         this.priorYearRevenue = computed(() => {
             return sumMetricFromUiData(this.mainUiData(), MetricEnum.PURCHASE_REVENUE, 'priorYear');
         }, ...(ngDevMode ? [{ debugName: "priorYearRevenue" }] : []));
@@ -56834,6 +56890,7 @@ class InitialTargetSettingComponent {
     handleCalculateRequest() {
         if (!this.isValid())
             return;
+        this.submittedAbsoluteInput.set(this.calculatedRevenue());
         this.calculationState.set('calculating');
         const request = {
             shopId: this.shopId(),
@@ -56854,17 +56911,25 @@ class InitialTargetSettingComponent {
         this.calculationState.set('input');
     }
     handleCancel() {
-        const response = this.storedResponse();
-        if (response && response.targetRevenue) {
-            this.absoluteInput.set(response.targetRevenue);
+        const submittedValue = this.submittedAbsoluteInput();
+        if (submittedValue !== null) {
+            this.absoluteInput.set(submittedValue);
             const priorRevenue = this.priorYearRevenue();
             if (priorRevenue > 0) {
-                const pct = ((response.targetRevenue - priorRevenue) / priorRevenue) * 100;
+                const pct = ((submittedValue - priorRevenue) / priorRevenue) * 100;
                 this.percentageInput.set(pct);
             }
         }
         this.calculationState.set('results');
     }
+    onCardClick() {
+        if (this.calculationState() === 'results') {
+            this.toggleDetails();
+        }
+    }
+    toggleDetails() {
+        this.detailsExpanded.set(!this.detailsExpanded());
+    }
     formatCurrency(value) {
         return formatCurrency(value);
     }
@@ -56980,6 +57045,16 @@ class InitialTargetSettingComponent {
             ? 'bg-slate-700 text-slate-300 border-2 border-slate-600 hover:bg-slate-600'
             : 'bg-slate-100 text-slate-600 border-2 border-slate-300 hover:bg-slate-200';
     }
+    chevronClasses() {
+        return this.viewMode() === ViewModeEnum.DARK
+            ? 'text-slate-400'
+            : 'text-slate-500';
+    }
+    learnMoreButtonClasses() {
+        return this.viewMode() === ViewModeEnum.DARK
+            ? 'text-purple-400 hover:text-purple-300'
+            : 'text-purple-600 hover:text-purple-700';
+    }
     baselineMetricsCardClasses() {
         return this.viewMode() === ViewModeEnum.DARK
             ? 'bg-slate-800/60 border border-slate-700'
@@ -57038,53 +57113,62 @@ class InitialTargetSettingComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.absoluteInputRef = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.percentageInputRef = _t.first);
-        } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], reverseCalculationResponse: [1, "reverseCalculationResponse"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueRequest: "calculateRevenueRequest" }, decls: 39, vars: 33, consts: [["absoluteInputRef", ""], ["percentageInputRef", ""], [1, "space-y-8", "pb-32"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [1, "text-2xl", "font-bold", "mb-6", 3, "ngClass"], [1, "flex", "flex-col", "gap-8"], [1, "grid", "lg:grid-cols-2", "gap-8"], [1, "flex", "flex-col", "gap-4"], [1, "p-6", "rounded-xl", "border-2", 3, "ngClass"], [1, "flex", "flex-wrap", "gap-4", "place-content-between"], [1, "flex", "items-center", "gap-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], [1, "form-area-collapse"], [1, "form-area-content"], [1, "space-y-6"], [1, "chart-in-column"], [1, "chart-in-column-content"], [1, "text-sm", "font-semibold", "mb-3", 3, "ngClass"], [1, "rounded-xl", "border", "p-4", 3, "ngClass"], [3, "chart", "showAxisLabels", "viewMode", "currencySymbol", "height"], [1, "h-64", "flex", "items-center", "justify-center"], [1, "calculated-card-enter", "order-first", "lg:order-last"], [1, "calculated-card-content"], [1, "p-6", "rounded-xl", "border-2", "h-full", 3, "ngClass"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], [1, "flex", "gap-2"], [1, "flex-1", "py-2", "px-4", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "relative"], [1, "flex", "justify-end"], [1, "absolute", "left-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "step", "1000", 1, "w-full", "pl-10", "pr-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "max", "1000", "step", "0.1", 1, "w-full", "pr-10", "pl-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], [1, "absolute", "right-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "ngClass"], [1, "relative", "pt-6", "mt-6"], [1, "absolute", "top-0", "left-0", "right-0", "flex", "items-center", "-translate-y-1/2"], [1, "flex-1", "h-px", 3, "ngClass"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "grid", "grid-cols-2", "gap-4", "pt-2"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-1", "mb-1"], ["type", "button", "tooltipType", "markdown", "tooltipPosition", "top", 1, "flex-shrink-0", "w-4", "h-4", "rounded-full", "inline-flex", "items-center", "justify-center", "transition-colors", 3, "ngClass", "libSymphiqTooltip"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewMode", "calculations", "pacingMetrics"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], reverseCalculationResponse: [1, "reverseCalculationResponse"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueRequest: "calculateRevenueRequest" }, decls: 42, vars: 36, consts: [["absoluteInputRef", ""], ["percentageInputRef", ""], [1, "space-y-8", "pb-32"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "click", "ngClass"], [1, "flex", "items-center", "justify-between", "mb-6"], [1, "text-2xl", "font-bold", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "chevron-rotate-expanded", "ngClass"], [1, "flex", "flex-col", "gap-8"], [1, "grid", "lg:grid-cols-2", "gap-8"], [1, "flex", "flex-col", "gap-4"], [1, "p-6", "rounded-xl", "border-2", 3, "click", "ngClass"], [1, "flex", "flex-wrap", "gap-4", "place-content-between"], [1, "flex", "items-center", "gap-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], [1, "form-area-collapse"], [1, "form-area-content"], [1, "space-y-6"], [1, "chart-in-column"], [1, "chart-in-column-content"], [1, "text-sm", "font-semibold", "mb-3", 3, "ngClass"], [1, "rounded-xl", "border", "p-4", 3, "ngClass"], [3, "chart", "showAxisLabels", "viewMode", "currencySymbol", "height"], [1, "h-64", "flex", "items-center", "justify-center"], [1, "calculated-card-enter", "order-first", "lg:order-last"], [1, "calculated-card-content"], [1, "p-6", "rounded-xl", "border-2", "h-full", 3, "ngClass"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], [1, "flex", "gap-2"], [1, "flex-1", "py-2", "px-4", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "relative"], [1, "flex", "justify-end"], [1, "absolute", "left-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "step", "1000", 1, "w-full", "pl-10", "pr-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "max", "1000", "step", "0.1", 1, "w-full", "pr-10", "pl-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], [1, "absolute", "right-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "ngClass"], [1, "mt-4"], [1, "details-collapse"], [1, "details-collapse-content"], [1, "relative", "pt-6", "mt-6"], [1, "absolute", "top-0", "left-0", "right-0", "flex", "items-center", "-translate-y-1/2"], [1, "flex-1", "h-px", 3, "ngClass"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "grid", "grid-cols-2", "gap-4", "pt-2"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "mt-6", "flex", "justify-center"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "click", "ngClass"], [1, "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-1", "mb-1"], ["type", "button", "tooltipType", "markdown", "tooltipPosition", "top", 1, "flex-shrink-0", "w-4", "h-4", "rounded-full", "inline-flex", "items-center", "justify-center", "transition-colors", 3, "click", "ngClass", "libSymphiqTooltip"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewMode", "calculations", "pacingMetrics"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
             i0.ɵɵelement(1, "symphiq-tooltip-container");
-            i0.ɵɵelementStart(2, "div", 3)(3, "h2", 4);
-            i0.ɵɵtext(4);
+            i0.ɵɵelementStart(2, "div", 3);
+            i0.ɵɵlistener("click", function InitialTargetSettingComponent_Template_div_click_2_listener() { return ctx.onCardClick(); });
+            i0.ɵɵelementStart(3, "div", 4)(4, "h2", 5);
+            i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_5_Template, 1, 1)(6, InitialTargetSettingComponent_Conditional_6_Template, 1, 1);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(5, "div", 5)(6, "div", 6)(7, "div", 7)(8, "div", 8)(9, "div", 9)(10, "div", 10);
+            i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_7_Template, 2, 3, ":svg:svg", 6);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "div", 7)(9, "div", 8)(10, "div", 9)(11, "div", 10);
+            i0.ɵɵlistener("click", function InitialTargetSettingComponent_Template_div_click_11_listener($event) { return $event.stopPropagation(); });
+            i0.ɵɵelementStart(12, "div", 11)(13, "div", 12);
             i0.ɵɵnamespaceSVG();
-            i0.ɵɵelementStart(11, "svg", 11);
-            i0.ɵɵelement(12, "path", 12);
+            i0.ɵɵelementStart(14, "svg", 13);
+            i0.ɵɵelement(15, "path", 14);
             i0.ɵɵelementEnd();
             i0.ɵɵnamespaceHTML();
-            i0.ɵɵelementStart(13, "div")(14, "p", 13);
-            i0.ɵɵtext(15);
+            i0.ɵɵelementStart(16, "div")(17, "p", 15);
+            i0.ɵɵtext(18);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(16, "p", 14);
-            i0.ɵɵtext(17);
+            i0.ɵɵelementStart(19, "p", 16);
+            i0.ɵɵtext(20);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵconditionalCreate(18, InitialTargetSettingComponent_Conditional_18_Template, 8, 4, "div", 10);
+            i0.ɵɵconditionalCreate(21, InitialTargetSettingComponent_Conditional_21_Template, 8, 4, "div", 12);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(19, "div", 15)(20, "div", 16)(21, "div", 17);
-            i0.ɵɵconditionalCreate(22, InitialTargetSettingComponent_Conditional_22_Template, 8, 4);
+            i0.ɵɵelementStart(22, "div", 17)(23, "div", 18)(24, "div", 19);
+            i0.ɵɵconditionalCreate(25, InitialTargetSettingComponent_Conditional_25_Template, 8, 4);
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(23, "div", 18)(24, "div", 19)(25, "div")(26, "p", 20);
-            i0.ɵɵtext(27, " Year-over-Year Revenue Trend ");
+            i0.ɵɵelementStart(26, "div", 20)(27, "div", 21)(28, "div")(29, "p", 22);
+            i0.ɵɵtext(30, " Year-over-Year Revenue Trend ");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(28, "div", 21);
-            i0.ɵɵconditionalCreate(29, InitialTargetSettingComponent_Conditional_29_Template, 1, 5, "symphiq-area-chart", 22)(30, InitialTargetSettingComponent_Conditional_30_Template, 3, 1, "div", 23);
+            i0.ɵɵelementStart(31, "div", 23);
+            i0.ɵɵconditionalCreate(32, InitialTargetSettingComponent_Conditional_32_Template, 1, 5, "symphiq-area-chart", 24)(33, InitialTargetSettingComponent_Conditional_33_Template, 3, 1, "div", 25);
             i0.ɵɵelementEnd()()()()();
-            i0.ɵɵelementStart(31, "div", 24)(32, "div", 25);
-            i0.ɵɵconditionalCreate(33, InitialTargetSettingComponent_Conditional_33_Template, 28, 17, "div", 26);
+            i0.ɵɵelementStart(34, "div", 26)(35, "div", 27);
+            i0.ɵɵconditionalCreate(36, InitialTargetSettingComponent_Conditional_36_Template, 32, 21, "div", 28);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵconditionalCreate(34, InitialTargetSettingComponent_Conditional_34_Template, 6, 3, "div", 27);
+            i0.ɵɵconditionalCreate(37, InitialTargetSettingComponent_Conditional_37_Template, 6, 3, "div", 29);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(35, "div", 28)(36, "div", 29);
-            i0.ɵɵconditionalCreate(37, InitialTargetSettingComponent_Conditional_37_Template, 7, 7, "div", 3);
+            i0.ɵɵelementStart(38, "div", 30)(39, "div", 31);
+            i0.ɵɵconditionalCreate(40, InitialTargetSettingComponent_Conditional_40_Template, 7, 7, "div", 32);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(38, "symphiq-sticky-submit-bar", 30);
-            i0.ɵɵlistener("submitClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_submitClick_38_listener() { return ctx.handleSubmitClick(); })("cancelClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_cancelClick_38_listener() { return ctx.handleCancel(); });
+            i0.ɵɵelementStart(41, "symphiq-sticky-submit-bar", 33);
+            i0.ɵɵlistener("submitClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_submitClick_41_listener() { return ctx.handleSubmitClick(); })("cancelClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_cancelClick_41_listener() { return ctx.handleCancel(); });
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
             i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("cursor-pointer", ctx.calculationState() === "results");
             i0.ɵɵproperty("ngClass", ctx.sectionCardClasses());
-            i0.ɵɵadvance();
+            i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngClass", ctx.sectionTitleClasses());
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate1(" Calculate Your ", ctx.currentYear(), " Revenue Target ");
+            i0.ɵɵconditional(ctx.calculationState() === "results" ? 5 : 6);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.calculationState() === "results" ? 7 : -1);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("ngClass", ctx.formAreaClasses());
             i0.ɵɵadvance();
@@ -57100,36 +57184,36 @@ class InitialTargetSettingComponent {
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate1(" ", ctx.formatCurrency(ctx.priorYearRevenue()), " ");
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.currentPaceProjection() > 0 ? 18 : -1);
+            i0.ɵɵconditional(ctx.currentPaceProjection() > 0 ? 21 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassProp("form-area-collapse-hidden", ctx.calculationState() === "results");
             i0.ɵɵadvance(3);
-            i0.ɵɵconditional(ctx.calculationState() !== "results" ? 22 : -1);
+            i0.ɵɵconditional(ctx.calculationState() !== "results" ? 25 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵclassProp("chart-in-column-active", ctx.calculationState() === "results");
+            i0.ɵɵclassProp("chart-in-column-active", ctx.calculationState() === "results" && ctx.detailsExpanded());
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngClass", ctx.chartTitleClasses());
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngClass", ctx.chartContainerClasses());
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.revenueChartData() ? 29 : 30);
+            i0.ɵɵconditional(ctx.revenueChartData() ? 32 : 33);
             i0.ɵɵadvance(2);
             i0.ɵɵclassProp("calculated-card-enter-active", ctx.calculatedRevenue() > 0);
             i0.ɵɵadvance(2);
-            i0.ɵɵconditional(ctx.calculatedRevenue() > 0 ? 33 : -1);
+            i0.ɵɵconditional(ctx.calculatedRevenue() > 0 ? 36 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.calculationState() !== "results" ? 34 : -1);
+            i0.ɵɵconditional(ctx.calculationState() !== "results" ? 37 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassProp("metrics-section-enter-active", ctx.showMetricsVisualization());
             i0.ɵɵadvance(2);
-            i0.ɵɵconditional(ctx.showMetricsVisualization() ? 37 : -1);
+            i0.ɵɵconditional(ctx.showMetricsVisualization() ? 40 : -1);
             i0.ɵɵadvance();
             i0.ɵɵproperty("viewMode", ctx.viewMode())("isValid", ctx.isValid())("isSubmitting", ctx.isCalculating())("validationMessage", ctx.validationMessage())("buttonText", ctx.submitButtonText())("showCancelButton", ctx.calculationState() === "input" && ctx.hasStoredResponse());
         } }, dependencies: [CommonModule, i1$1.NgClass, FormsModule, i2$1.DefaultValueAccessor, i2$1.NumberValueAccessor, i2$1.NgControlStatus, i2$1.MinValidator, i2$1.MaxValidator, i2$1.NgModel, FunnelMetricsVisualizationComponent,
             StickySubmitBarComponent,
             AreaChartComponent,
             TooltipDirective,
-            TooltipContainerComponent], styles: [".calculated-card-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.calculated-card-content[_ngcontent-%COMP%]{overflow:hidden}.form-area-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.form-area-content[_ngcontent-%COMP%]{overflow:hidden}.chart-section-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.chart-section-content[_ngcontent-%COMP%]{overflow:hidden}.chart-in-column[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.chart-in-column-content[_ngcontent-%COMP%]{overflow:hidden}.metrics-section-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.metrics-section-content[_ngcontent-%COMP%]{overflow:hidden}"], changeDetection: 0 }); }
+            TooltipContainerComponent], styles: [".calculated-card-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.calculated-card-content[_ngcontent-%COMP%]{overflow:hidden}.form-area-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.form-area-content[_ngcontent-%COMP%]{overflow:hidden}.chart-section-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.chart-section-content[_ngcontent-%COMP%]{overflow:hidden}.chart-in-column[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.chart-in-column-content[_ngcontent-%COMP%]{overflow:hidden}.metrics-section-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.metrics-section-content[_ngcontent-%COMP%]{overflow:hidden}.details-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.details-collapse-expanded[_ngcontent-%COMP%]{grid-template-rows:1fr}.details-collapse-content[_ngcontent-%COMP%]{overflow:hidden}.chevron-rotate[_ngcontent-%COMP%]{transition:transform .3s ease-out}.chevron-rotate-expanded[_ngcontent-%COMP%]{transform:rotate(180deg)}"], changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InitialTargetSettingComponent, [{
         type: Component,
@@ -57144,15 +57228,34 @@ class InitialTargetSettingComponent {
                 ], changeDetection: ChangeDetectionStrategy.OnPush, template: `
     <div class="space-y-8 pb-32">
       <symphiq-tooltip-container />
-      <div [ngClass]="sectionCardClasses()" class="rounded-2xl border shadow-lg p-8">
-        <h2 [ngClass]="sectionTitleClasses()" class="text-2xl font-bold mb-6">
-          Calculate Your {{ currentYear() }} Revenue Target
-        </h2>
+      <div [ngClass]="sectionCardClasses()" class="rounded-2xl border shadow-lg p-8"
+           [class.cursor-pointer]="calculationState() === 'results'"
+           (click)="onCardClick()">
+        <div class="flex items-center justify-between mb-6">
+          <h2 [ngClass]="sectionTitleClasses()" class="text-2xl font-bold">
+            @if (calculationState() === 'results') {
+              Your {{ currentYear() }} Revenue Target
+            } @else {
+              Calculate Your {{ currentYear() }} Revenue Target
+            }
+          </h2>
+          @if (calculationState() === 'results') {
+            <svg
+              class="w-6 h-6 chevron-rotate"
+              [class.chevron-rotate-expanded]="detailsExpanded()"
+              [ngClass]="chevronClasses()"
+              fill="none"
+              stroke="currentColor"
+              viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+            </svg>
+          }
+        </div>
 
         <div class="flex flex-col gap-8">
           <div class="grid lg:grid-cols-2 gap-8">
             <div class="flex flex-col gap-4">
-              <div [ngClass]="formAreaClasses()" class="p-6 rounded-xl border-2">
+              <div [ngClass]="formAreaClasses()" class="p-6 rounded-xl border-2" (click)="$event.stopPropagation()">
                 <div class="flex flex-wrap gap-4 place-content-between" [class.mb-6]="calculationState() !== 'results'">
                   <div class="flex items-center gap-2">
                     <svg class="w-4 h-4" [ngClass]="baselineIconClasses()" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -57254,7 +57357,7 @@ class InitialTargetSettingComponent {
                 </div>
               </div>
 
-              <div class="chart-in-column" [class.chart-in-column-active]="calculationState() === 'results'">
+              <div class="chart-in-column" [class.chart-in-column-active]="calculationState() === 'results' && detailsExpanded()">
                 <div class="chart-in-column-content">
                   <div>
                     <p [ngClass]="chartTitleClasses()" class="text-sm font-semibold mb-3">
@@ -57293,8 +57396,8 @@ class InitialTargetSettingComponent {
                             {{ currentYear() }} Revenue Target
                           </p>
                           <p [ngClass]="calculatedValueClasses()" class="text-3xl font-bold">
-                            @if (calculationState() === 'results' && targets() === undefined) {
-                              > {{ formatCurrency(calculatedRevenue()) }}
+                            @if (calculationState() === 'results' && targets() === undefined && submittedAbsoluteInput() !== null) {
+                              > {{ formatCurrency(submittedAbsoluteInput()!) }}
                             } @else {
                               {{ formatCurrency(displayedTargetRevenue()) }}
                             }
@@ -57302,7 +57405,7 @@ class InitialTargetSettingComponent {
                         </div>
                         @if (calculationState() === 'results' && targets() === undefined) {
                           <button
-                            (click)="handleAdjustTarget()"
+                            (click)="handleAdjustTarget(); $event.stopPropagation()"
                             [ngClass]="secondaryButtonClasses()"
                             class="px-4 py-2 rounded-lg text-sm font-semibold transition-all whitespace-nowrap">
                             Adjust Revenue Target
@@ -57310,76 +57413,103 @@ class InitialTargetSettingComponent {
                         }
                       </div>
 
-                      <div class="relative pt-6 mt-6">
-                        <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
-                          <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
-                          <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
-                            vs. {{ priorYear() }}
-                          </span>
-                          <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
-                        </div>
-                        <div class="grid grid-cols-2 gap-4 pt-2">
-                          <div>
-                            <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
-                              Increase Amount
-                            </p>
-                            <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
-                              {{ formatCurrency(calculatedRevenue() - priorYearRevenue()) }}
-                            </p>
-                          </div>
-                          <div>
-                            <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
-                              % Growth
-                            </p>
-                            <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
-                              +{{ formatPercentage(percentageIncrease(), 1) }}
-                            </p>
-                          </div>
+                      @if (calculationState() === 'results' && !detailsExpanded()) {
+                        <div class="mt-4">
+                          <button
+                            (click)="toggleDetails(); $event.stopPropagation()"
+                            [ngClass]="learnMoreButtonClasses()"
+                            class="text-sm font-semibold transition-all">
+                            Learn More
+                          </button>
                         </div>
-                      </div>
+                      }
 
-                      @if (currentPaceProjection() > 0 && gapToClose().amount !== 0) {
-                        <div class="relative pt-6 mt-6">
-                          <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
-                            <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
-                            <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
-                              {{ currentYear() }} YTD Gap
-                            </span>
-                            <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
-                          </div>
-                          <div class="grid grid-cols-2 gap-4 pt-2">
-                            <div>
-                              <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
-                                Gap to Close
-                              </p>
-                              <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
-                                {{ formatCurrency(absValue(gapToClose().amount)) }}
-                              </p>
+                      <div class="details-collapse" [class.details-collapse-expanded]="calculationState() !== 'results' || detailsExpanded()">
+                        <div class="details-collapse-content">
+                          <div class="relative pt-6 mt-6">
+                            <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
+                              <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
+                              <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
+                                vs. {{ priorYear() }}
+                              </span>
+                              <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
                             </div>
-                            <div>
-                              <div class="flex items-center gap-1 mb-1">
-                                <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider">
-                                  Additional Growth Needed
+                            <div class="grid grid-cols-2 gap-4 pt-2">
+                              <div>
+                                <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
+                                  Increase Amount
+                                </p>
+                                <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
+                                  {{ formatCurrency(calculatedRevenue() - priorYearRevenue()) }}
+                                </p>
+                              </div>
+                              <div>
+                                <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
+                                  % Growth
+                                </p>
+                                <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
+                                  +{{ formatPercentage(percentageIncrease(), 1) }}
                                 </p>
-                                <button
-                                  type="button"
-                                  [ngClass]="infoIconClasses()"
-                                  class="flex-shrink-0 w-4 h-4 rounded-full inline-flex items-center justify-center transition-colors"
-                                  [libSymphiqTooltip]="additionalGrowthTooltip"
-                                  tooltipType="markdown"
-                                  tooltipPosition="top">
-                                  <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                                  </svg>
-                                </button>
                               </div>
-                              <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
-                                {{ gapToClose().amount > 0 ? '+' : '' }}{{ formatPercentage(gapToClose().percentage, 1) }}
-                              </p>
                             </div>
                           </div>
+
+                          @if (currentPaceProjection() > 0 && gapToClose().amount !== 0) {
+                            <div class="relative pt-6 mt-6">
+                              <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
+                                <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
+                                <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
+                                  {{ currentYear() }} YTD Gap
+                                </span>
+                                <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
+                              </div>
+                              <div class="grid grid-cols-2 gap-4 pt-2">
+                                <div>
+                                  <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
+                                    Gap to Close
+                                  </p>
+                                  <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
+                                    {{ formatCurrency(absValue(gapToClose().amount)) }}
+                                  </p>
+                                </div>
+                                <div>
+                                  <div class="flex items-center gap-1 mb-1">
+                                    <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider">
+                                      Additional Growth Needed
+                                    </p>
+                                    <button
+                                      type="button"
+                                      [ngClass]="infoIconClasses()"
+                                      class="flex-shrink-0 w-4 h-4 rounded-full inline-flex items-center justify-center transition-colors"
+                                      [libSymphiqTooltip]="additionalGrowthTooltip"
+                                      tooltipType="markdown"
+                                      tooltipPosition="top"
+                                      (click)="$event.stopPropagation()">
+                                      <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+                                      </svg>
+                                    </button>
+                                  </div>
+                                  <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
+                                    {{ gapToClose().amount > 0 ? '+' : '' }}{{ formatPercentage(gapToClose().percentage, 1) }}
+                                  </p>
+                                </div>
+                              </div>
+                            </div>
+                          }
+
+                          @if (calculationState() === 'results' && detailsExpanded()) {
+                            <div class="mt-6 flex justify-center">
+                              <button
+                                (click)="toggleDetails(); $event.stopPropagation()"
+                                [ngClass]="learnMoreButtonClasses()"
+                                class="text-sm font-semibold transition-all">
+                                Show Less
+                              </button>
+                            </div>
+                          }
                         </div>
-                      }
+                      </div>
                     </div>
                   </div>
                 }
@@ -57448,7 +57578,7 @@ class InitialTargetSettingComponent {
         (cancelClick)="handleCancel()"
       />
     </div>
-  `, styles: [".calculated-card-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active{grid-template-rows:1fr}.calculated-card-content{overflow:hidden}.form-area-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden{grid-template-rows:0fr}.form-area-content{overflow:hidden}.chart-section-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden{grid-template-rows:0fr}.chart-section-content{overflow:hidden}.chart-in-column{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active{grid-template-rows:1fr}.chart-in-column-content{overflow:hidden}.metrics-section-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active{grid-template-rows:1fr}.metrics-section-content{overflow:hidden}\n"] }]
+  `, styles: [".calculated-card-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active{grid-template-rows:1fr}.calculated-card-content{overflow:hidden}.form-area-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden{grid-template-rows:0fr}.form-area-content{overflow:hidden}.chart-section-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden{grid-template-rows:0fr}.chart-section-content{overflow:hidden}.chart-in-column{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active{grid-template-rows:1fr}.chart-in-column-content{overflow:hidden}.metrics-section-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active{grid-template-rows:1fr}.metrics-section-content{overflow:hidden}.details-collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.details-collapse-expanded{grid-template-rows:1fr}.details-collapse-content{overflow:hidden}.chevron-rotate{transition:transform .3s ease-out}.chevron-rotate-expanded{transform:rotate(180deg)}\n"] }]
     }], () => [], { absoluteInputRef: [{
             type: ViewChild,
             args: ['absoluteInputRef']
@@ -57456,7 +57586,7 @@ class InitialTargetSettingComponent {
             type: ViewChild,
             args: ['percentageInputRef']
         }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], funnelMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "funnelMetrics", required: false }] }], mainUiData: [{ type: i0.Input, args: [{ isSignal: true, alias: "mainUiData", required: false }] }], trendUiData: [{ type: i0.Input, args: [{ isSignal: true, alias: "trendUiData", required: false }] }], shopId: [{ type: i0.Input, args: [{ isSignal: true, alias: "shopId", required: false }] }], pacingMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "pacingMetrics", required: false }] }], dataResults: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataResults", required: false }] }], reverseCalculationResponse: [{ type: i0.Input, args: [{ isSignal: true, alias: "reverseCalculationResponse", required: false }] }], targets: [{ type: i0.Input, args: [{ isSignal: true, alias: "targets", required: false }] }], targetsCreated: [{ type: i0.Output, args: ["targetsCreated"] }], calculateRevenueRequest: [{ type: i0.Output, args: ["calculateRevenueRequest"] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 433 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 501 }); })();
 
 function IndeterminateSpinnerComponent_For_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "div", 5);