/* ============================================================
   BabyBite Growth Tracker Tool Styles (v1.0)
   ============================================================ */

/* --------------------------------------------------------
   Growth Tracker (gt-*) — Replaced Inline Styles
   -------------------------------------------------------- */
.gt-submit-btn { width: 100%; padding: 18px; font-size: var(--text-xl); border-radius: var(--radius-2xl); }
.gt-results-card { display: none; margin-top: var(--space-8); background: var(--color-bg-soft); border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: var(--space-6); }
.gt-results-card.is-visible { display: block; }
.gt-results-title { color: var(--color-primary); margin-top: 0; margin-bottom: var(--space-4); font-size: var(--text-2xl); }
.gt-results-grid { display: grid; gap: var(--space-4); }
.gt-result-item { background: var(--color-surface); padding: var(--space-4); border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.gt-result-item-title { margin: 0 0 var(--space-2) 0; color: var(--color-text-secondary); font-size: var(--text-base); }
.gt-result-value { margin: 0; font-size: var(--text-2xl); font-weight: 700; color: #0ea5e9; }
.gt-result-text { margin: 0; color: var(--color-text); line-height: 1.5; }
.gt-result-note { margin: 4px 0 0 0; font-size: var(--text-sm); color: var(--color-text-muted); }
.gt-disclaimer { margin-top: var(--space-6); }
.gt-next-step { margin-top: var(--space-6); padding: var(--space-4); background: linear-gradient(135deg, #ede9fe, #f5f3ff); border: 1px solid #c4b5fd; border-radius: var(--radius-xl); display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; }
.gt-next-step-text { margin: 0; font-size: var(--text-sm); color: var(--color-text-secondary); }
.gt-next-step-text strong { color: var(--color-primary); }


/* Growth tracker example state inline fix */
.gt-example-highlight { color: var(--color-primary); font-weight: 700; }
.gt-example-note { margin: 0; font-size: var(--text-sm); color: var(--color-text-muted); }