/* ==========================================================================
   pulse-6.css — MARKETING › NEW ARRIVAL PIPELINE (2026-07-26)

   A new stylesheet rather than an edit to pulse-1..5, for the same reason
   app-9/app-10 are new files: the surface extends the shell without touching
   the files every other tab shares. All colour comes from the :root tokens in
   pulse-1.css — nothing here invents a value.

   Peter asked for "clean" twice. So: one accent (gold), one ink, status told
   by a small dot rather than a block of colour, and no row chrome that isn't
   carrying information.
   ========================================================================== */

/* ---------- breadcrumb-as-title (§13.2 nameplate voice) ----------
   ⚠️ Pulse styles crumbs by SUBVIEW ID, not by class — pulse-2.css lists
   #sv-purchase-orders / #sv-vendor-master / #sv-receiving / #sv-image-studio /
   #sv-copy-studio explicitly. A new subview therefore inherits NOTHING and its
   crumb renders as a raw browser button. Caught by the first render test, not
   by reading the markup. Any future subview needs this block too. */
#sv-new-arrivals .sv-title {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600; letter-spacing: .3em;
  text-transform: uppercase; color: #8a6940; line-height: 1.5; margin: -4px 0 10px;
}
#sv-new-arrivals .po-cr-link {
  background: none; border: 0; padding: 0; font: inherit; letter-spacing: inherit;
  text-transform: inherit; color: #8a6940; cursor: pointer;
}
#sv-new-arrivals .po-cr-link:hover { color: #4a2c17; }
#sv-new-arrivals .po-cr-sep  { color: #c5a572; }
#sv-new-arrivals .crumb-leaf { color: #4a2c17; }

/* ---------- head ---------- */
.nap-head { padding-bottom: 2px; }
.nap-sub  { font-family: 'Jost', sans-serif; font-size: 13px; color: var(--text-dim); margin-top: 2px; }

/* Stat strip. Reads as one line of facts, not four cards — Marketing needs the
   shape of the week at a glance, not a dashboard. */
.nap-stats { display: flex; flex-wrap: wrap; gap: 26px; margin: 16px 0 4px; }
.nap-stat  { min-width: 74px; }
.nap-stat .n {
  font-family: 'Inter', sans-serif; font-size: 21px; font-weight: 600; line-height: 1.1;
  color: #4a2c17; font-variant-numeric: lining-nums tabular-nums; display: block;
}
.nap-stat .l {
  font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase; color: var(--ink-muted);
  margin-top: 3px; display: block;
}
.nap-stat.late .n { color: #a85842; }
.nap-stat.here .n { color: #2d9a4a; }

/* ---------- controls ---------- */
.nap-controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 14px 0 10px; }
.nap-search {
  flex: 1 1 240px; min-width: 180px; max-width: 340px;
  font-family: 'Jost', sans-serif; font-size: 13px; color: var(--text);
  background: var(--bg-3); border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px;
  transition: border-color .15s;
}
.nap-search:focus { outline: none; border-color: var(--gold); }
.nap-search::placeholder { color: var(--ink-muted); }

.nap-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.nap-chip {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .04em;
  color: var(--text-dim); background: var(--bg-2); border: 1px solid var(--line);
  border-radius: 999px; padding: 7px 13px; cursor: pointer;
  transition: border-color .15s, color .15s, background .15s;
}
.nap-chip:hover  { border-color: var(--line-bright); color: #4a2c17; }
.nap-chip.on     { border-color: var(--gold); color: var(--gold-bright); background: var(--bg-3); }
.nap-chip .c     { font-variant-numeric: lining-nums tabular-nums; opacity: .65; margin-left: 5px; }

.nap-btn {
  font-family: 'Inter', sans-serif; font-size: 12px; color: var(--text-dim);
  background: var(--bg-2); border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 12px; cursor: pointer; transition: border-color .15s, color .15s;
}
.nap-btn:hover { border-color: var(--gold); color: var(--gold-bright); }

/* ---------- list ---------- */
.nap-collabels {
  display: grid; align-items: center; gap: 14px;
  grid-template-columns: 108px minmax(96px,1fr) minmax(150px,1.9fr) minmax(80px,1fr) 96px 92px;
  padding: 0 17px 7px; border-bottom: 1px solid var(--line); /* 17px = row 16px pad + 1px row border */
  font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase; color: var(--ink-muted);
}
.nap-collabels .r { text-align: right; }

.nap-list { display: flex; flex-direction: column; gap: 5px; padding-top: 6px; }
.nap-row {
  display: grid; align-items: center; gap: 14px;
  grid-template-columns: 108px minmax(96px,1fr) minmax(150px,1.9fr) minmax(80px,1fr) 96px 92px;
  background: var(--bg-2); border: 1px solid var(--line); border-radius: 8px; padding: 13px 16px;
  cursor: pointer; position: relative; overflow: hidden;
  transition: border-color .15s, background .15s;
  font-family: 'Inter', sans-serif; font-size: 12px; line-height: 1.25; text-align: left;
  width: 100%;
}
.nap-row:hover { border-color: var(--gold); background: var(--bg-3); }
/* The same left-edge wipe the PO and Receiving rows use — one gesture across
   every list in Pulse. */
.nap-row::after {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
  background: #c8a98a; transform: scaleY(0); transform-origin: bottom; transition: transform .25s ease;
}
.nap-row:hover::after { transform: scaleY(1); }
.nap-row span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; color: #4a2c17; }

.nap-row .nap-c-date  { font-variant-numeric: lining-nums tabular-nums; font-weight: 500; }
.nap-row .nap-c-date.late { color: #a85842; }
.nap-row .nap-c-date .est { color: var(--ink-muted); font-weight: 400; }
.nap-row .nap-c-brand { color: var(--gold-bright); font-weight: 500; }
.nap-row .nap-c-name  { color: #4a2c17; }
.nap-row .nap-c-name .sc { color: var(--ink-muted); }
.nap-row .nap-c-col   { color: var(--text-dim); }
.nap-row .nap-c-units { text-align: right; font-variant-numeric: lining-nums tabular-nums; color: var(--text-dim); }

/* Status + kind read as small dots, not filled badges: at 400 rows a column of
   coloured pills becomes the loudest thing on screen, which is the opposite of
   what was asked for. */
.nap-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 7px; vertical-align: 1px; }
.nap-dot.expected { background: var(--ink-muted); }
.nap-dot.partial  { background: #e08a2a; }
.nap-dot.received { background: #2d9a4a; }
.nap-kind { font-size: 11px; letter-spacing: .02em; }
.nap-kind.new        { color: var(--gold-bright); font-weight: 600; }
.nap-kind.new_colour { color: var(--text-dim); }

.nap-empty { font-style: italic; color: var(--text-dim); padding: 26px 0; font-family: 'Jost', sans-serif; font-size: 13px; }
.nap-more  { font-family: 'Jost', sans-serif; font-size: 12px; color: var(--ink-muted); text-align: center; padding: 14px 0 4px; }

/* ---------- detail ---------- */
.nap-detail { max-width: 940px; margin: 2px auto 0; }
.nap-card {
  background: #fffcf8; border: 1px solid var(--line); border-radius: 12px; padding: 22px 24px;
  display: grid; grid-template-columns: 232px 1fr; gap: 26px;
}
.nap-thumb {
  aspect-ratio: 3 / 4; border-radius: 10px; border: 1px dashed var(--line-bright);
  background: var(--bg-4); display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; padding: 18px; gap: 8px;
}
.nap-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
.nap-thumb .ic { font-size: 22px; opacity: .5; }
.nap-thumb .tx { font-family: 'Jost', sans-serif; font-size: 11.5px; line-height: 1.5; color: var(--ink-muted); }

.nap-d-eyebrow {
  font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin-bottom: 6px;
}
.nap-d-title { font-family: 'Jost', sans-serif; font-size: 25px; font-weight: 500; color: #4a2c17; line-height: 1.15; }
.nap-d-sub   { font-family: 'Jost', sans-serif; font-size: 14px; color: var(--text-dim); margin-top: 4px; }

.nap-d-status {
  margin-top: 14px; padding: 11px 14px; border-radius: 9px;
  background: var(--bg-3); border: 1px solid var(--line);
  font-family: 'Inter', sans-serif; font-size: 12.5px; color: #4a2c17;
}
.nap-d-status.late { border-color: #e2c4bb; background: #fdf4f2; }
.nap-d-status.here { border-color: #cfe3d2; background: #f3faf4; }
.nap-d-status .fx-num { font-variant-numeric: lining-nums tabular-nums; }

/* ⚠️ Grid items default to min-width:auto, so an unbreakable token widens the
   TRACK rather than wrapping. Category strings like "BRA/UNDERWIRE/Contour/
   Plunge" and vendor names like "CHANTELLE LINGERIE INC." did exactly that:
   measured 44px of overflow past the card's right border at 390px wide. Both
   halves are needed — min-width:0 lets the track shrink, overflow-wrap lets
   the token break once it has. Found by measuring the boxes, not by looking. */
.nap-card > * { min-width: 0; }
.nap-d-grid > div { min-width: 0; }

.nap-d-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px 20px; margin-top: 18px; }
.nap-d-grid.two { grid-template-columns: repeat(2, 1fr); }
.nap-k {
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 10px;
  letter-spacing: .13em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 4px;
}
.nap-v { font-family: 'Inter', sans-serif; font-size: 14px; color: #4a2c17; min-height: 1.35em;
         overflow-wrap: anywhere; }
.nap-v.num  { font-variant-numeric: lining-nums tabular-nums; }
.nap-v.big  { font-size: 17px; font-weight: 600; }
/* Unknown is stated, never rendered as 0 or blank — the Plan Review discipline
   applied here: a null price that reads as $0.00 gets acted on. */
.nap-v.unk  { color: var(--ink-muted); font-style: italic; font-size: 13px; }
.nap-note   { font-family: 'Jost', sans-serif; font-size: 12px; color: var(--ink-muted); margin-top: 16px; line-height: 1.6; }

@media (max-width: 900px) {
  .nap-card { grid-template-columns: 1fr; gap: 18px; padding: 18px; }
  .nap-thumb { aspect-ratio: 16 / 9; }
  .nap-d-grid, .nap-d-grid.two { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 820px) {
  .nap-collabels { display: none; }
  .nap-row { grid-template-columns: 1fr auto; row-gap: 4px; gap: 10px; padding: 12px 14px; }
  .nap-row .nap-c-date  { order: 1; }
  .nap-row .nap-c-stat  { order: 2; text-align: right; }
  .nap-row .nap-c-name  { order: 3; grid-column: 1 / -1; }
  .nap-row .nap-c-brand { order: 4; }
  .nap-row .nap-c-col   { order: 5; text-align: right; }
  .nap-row .nap-c-kind, .nap-row .nap-c-units { display: none; }
  .nap-stats { gap: 18px; }
  .nap-stat .n { font-size: 18px; }
}