/* The price helper (seller tools, step T9). */

.prices__intro { margin: 0 0 var(--space-3); }
.prices__empty { margin: var(--space-3) 0 0; color: var(--text-muted); }
.prices__empty[hidden] { display: none; }
.prices__list { margin-top: var(--space-3); }
.prices__each { margin: var(--space-1) 0 0; font-weight: 800; }
/* Profit or loss: in words, not colour alone. */
.prices__profit { margin: 0 0 var(--space-2); color: var(--success-text); font-weight: 800; }
.prices__loss { margin: 0 0 var(--space-2); color: var(--danger-text); font-weight: 800; }

.prices__form[hidden] { display: none; }
.page__body .prices__form h2 { margin-top: 0; overflow-wrap: anywhere; }
.page__body .prices__form h3 { margin: var(--space-5) 0 var(--space-2); padding-top: var(--space-4); border-top: 2px dashed var(--card-border); font-size: var(--fs-lg); }

.page__body .prices__ingredients { display: grid; gap: var(--space-3); margin: var(--space-2) 0; padding: 0; list-style: none; }
.page__body .prices__ingredients li + li { margin-top: 0; }
.prices__ingredient .fieldset { padding: var(--space-3); background: var(--surface-sunk); border-radius: var(--radius); }
.prices__legend { font-weight: 800; }
/* "You buy [1] [kg] for S$ [2.80]" wraps on a phone. */
.prices__line { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-2); margin-bottom: var(--space-2); }
.prices__line .field { margin: 0; }
.prices__amount { width: 6.5rem; }
.prices__unit { width: auto; min-width: 5.5rem; }
.prices__pair { display: flex; flex-wrap: wrap; gap: 0 var(--space-3); }

.prices__result { margin-top: var(--space-4); padding: var(--space-3); background: var(--info-bg); border-radius: var(--radius); }
.page__body .prices__result h3 { margin: 0 0 var(--space-2); padding: 0; border: 0; }
.prices__sums { margin: 0; }
.prices__sums div { display: flex; justify-content: space-between; gap: var(--space-3); padding: var(--space-1) 0; border-bottom: 1px solid var(--card-border); }
.prices__sums div:last-child { border-bottom: 0; }
.prices__sums dt { min-width: 0; overflow-wrap: anywhere; }
.prices__sums dd { margin: 0; font-weight: 700; white-space: nowrap; }
.prices__sums .prices__big { font-size: var(--fs-lg); font-weight: 800; }
.prices__sums .prices__big dd { font-weight: 800; }

.prices__buttons { display: grid; gap: var(--space-2); margin-top: var(--space-4); }
.prices__remove { margin-top: var(--space-4); }
.prices__remove[hidden] { display: none; }
.prices__sure { display: grid; gap: var(--space-2); }
.prices__sure p { margin: 0; font-weight: 600; }
.prices__back { margin: var(--space-5) 0 0; text-align: center; }
.prices__back a { display: inline-block; padding-block: .75rem; } /* a bigger tap area */