/* PrairieOps — parts-fluids.css
   Shared Option-C parts/fluids input (swap mode). Used by Service tasks +
   Log Service so they match. Segmented toggle = the exact Option-C mockup look
   (owner-specified): pill container with a SOLID-GOLD active segment. Dark
   theme tokens from base.css. */

.pf-head { display: flex; justify-content: flex-end; margin-bottom: 10px; }
.pf-seg {
  display: inline-flex; gap: 2px; padding: 2px;
  background: var(--bg-surface); border: 1px solid var(--border); border-radius: 999px;
}
.pf-seg-btn {
  background: none; border: none; color: var(--text-muted);
  font-size: 12px; font-weight: 600; font-family: inherit;
  padding: 6px 14px; border-radius: 999px; cursor: pointer;
}
.pf-seg-btn.is-on { background: var(--brand, #c49060); color: #1a1205; }
.pf-ct { font-size: 10px; opacity: .6; font-weight: 700; margin-left: 5px; }
.pf-seg-btn.is-on .pf-ct { opacity: .85; }

.pf-row { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.pf-in {
  flex: 1 1 0; min-width: 0;
  background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px;
  color: var(--text-primary); font-size: 14px; font-family: inherit; padding: 9px 10px; outline: none;
}
.pf-in:focus { border-color: var(--brand, #c49060); }
.pf-in::placeholder { color: var(--text-muted); }
.pf-qty, .pf-amt { flex: 0 0 70px; }
.pf-unit { flex: 0 0 78px; }

.pf-del {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 6px;
  background: none; border: 1px solid var(--border); color: var(--text-muted);
  font-size: 15px; cursor: pointer;
}
.pf-del:hover { border-color: var(--text-muted); color: var(--text-secondary); }

.pf-add {
  width: 100%; background: none; border: 1px solid var(--border); color: var(--text-secondary);
  border-radius: var(--radius-md, 8px); padding: 10px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.pf-add:hover { border-color: var(--brand, #c49060); color: var(--brand, #c49060); }