/* scene-specific styles: tender group (today, tenders, tender-profile).
   Classes are prefixed dm-tender-; core pieces (rows, tiles, tags, stepper)
   come from core.css. Every rule set below has a stacked variant for the
   split column (.split-visual) and for narrow viewports. */

/* the site body runs at line-height 1.7; a product screen sits tighter */
.dm-tender-today, .dm-tender-table, .dm-tender-profile { line-height: 1.3; padding: 16px; }

/* --- today ------------------------------------------------------------------ */
.dm-tender-today .dm-kpis { margin-bottom: 12px; }
.dm-tender-today .dm-kpi u.amber { color: var(--warn); }
.dm-tender-lanes .dm-row { padding: 5px 9px; margin-bottom: 2px; }
.dm-tender-date > u { flex: none; min-width: 78px; color: var(--faint); font-size: 0.7rem; }
.dm-tender-date b { font-size: 0.76rem; }
[dir="rtl"] .dm-tender-date > u { text-align: right; }

/* --- tenders table --------------------------------------------------------- */
.dm-tender-table { display: grid; grid-template-columns: 172px minmax(0, 1fr); gap: 16px; }
.dm-tender-rail .dm-chip { gap: 6px; }
.dm-tender-rail .dm-chip u { text-decoration: none; color: var(--faint); font-variant-numeric: tabular-nums; font-size: 0.62rem; }
.dm-tender-rail .dm-chip.sel u { color: var(--ink); }
.dm-tender-rail .dm-search { justify-content: flex-start; }
.dm-tender-main { min-width: 0; }
.dm-tender-strip { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.dm-tender-strip b { color: var(--ink); font-weight: 650; font-size: 0.8rem; white-space: nowrap; }
.dm-tender-strip .dm-faint { color: var(--faint); font-size: 0.7rem; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-tender-strip .dm-toggle { flex: none; }
.dm-tender-main .dm-thead b { padding-inline-start: 30px; }
.dm-tender-main .dm-thead u { white-space: nowrap; }
.dm-tender-title { text-align: left; transition: opacity 0.28s ease; }
[dir="rtl"] .dm-tender-title { text-align: right; }
.dm-tender-title.fade { opacity: 0; }
.dm-tender-title > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-tender-sub { display: none; }
.dm-tender-table .dm-tender-buyer { flex: none; width: 136px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-tender-table .dm-tender-tagcol { flex: none; width: 88px; display: flex; }
.dm-tender-table .dm-tender-datecol { flex: none; width: 64px; text-decoration: none; }
.dm-tender-table .dm-tender-valcol { flex: none; width: 82px; text-decoration: none; text-align: right; font-variant-numeric: tabular-nums; }
[dir="rtl"] .dm-tender-table .dm-tender-valcol { text-align: left; }
.dm-tender-table .dm-row .dm-tender-buyer, .dm-tender-table .dm-row .dm-tender-datecol, .dm-tender-table .dm-row .dm-tender-valcol { color: var(--muted); font-size: 0.72rem; }
.dm-tender-bidders { flex: none; width: 58px; display: inline-flex; align-items: center; justify-content: flex-end; gap: 3px; }
[dir="rtl"] .dm-tender-bidders { justify-content: flex-start; }
.dm-tender-bidders i { width: 6px; height: 6px; border-radius: 50%; background: #079FBF; }
.dm-tender-bidders u { text-decoration: none; color: var(--muted); font-size: 0.7rem; font-variant-numeric: tabular-nums; margin-inline-start: 3px; }
.dm-thead .dm-tender-bidders { width: 58px; text-decoration: none; }

/* --- tender profile -------------------------------------------------------- */
.dm-tender-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.dm-tender-head .dm-mark { width: 30px; height: 30px; font-size: 0.7rem; border-radius: 8px; }
.dm-tender-head > div { flex: 1; min-width: 0; }
.dm-tender-head b { display: block; color: var(--ink); font-family: var(--font-display); font-size: 0.96rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-tender-head small { display: block; color: var(--faint); font-size: 0.68rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-tender-stepper { margin-bottom: 14px; }
.dm-tender-stepper .dm-tlnode b { white-space: normal; line-height: 1.2; }
.dm-tender-cols > div:first-child { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.dm-tender-profile .dm-kpi b { font-size: 1.15rem; }
.dm-tender-details .dm-field b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dm-tender-details .dm-field b::after { display: none; } /* core's typing caret is for typed fields, not static values */
.dm-tender-bidpanel .dm-ph > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dm-tender-bidpanel .dm-ph .dm-btn { flex: none; padding: 4px 11px; font-size: 0.7rem; }
.dm-tender-bids .dm-row { padding: 5px 9px; position: relative; }
.dm-tender-bids .dm-row.win { z-index: 1; }
.dm-tender-price { min-width: 84px; }
.dm-tender-delta { flex: none; width: 46px; text-align: right; text-decoration: none; color: var(--faint); font-size: 0.7rem; font-variant-numeric: tabular-nums; }
[dir="rtl"] .dm-tender-delta { text-align: left; }
.dm-tender-bids .dm-tender-tagcol { flex: none; min-width: 44px; display: flex; justify-content: flex-end; }
[dir="rtl"] .dm-tender-bids .dm-tender-tagcol { justify-content: flex-start; }
.dm-tender-foot { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); color: var(--faint); font-size: 0.7rem; }
.dm-tender-foot b { color: var(--ink); font-variant-numeric: tabular-nums; font-weight: 650; }
/* the toast lands in the empty corner under the Details panel; in a stacked layout it joins the flow */
.dm-tender-profile .dm-toast { position: absolute; left: 16px; bottom: 16px; z-index: 5; }
[dir="rtl"] .dm-tender-profile .dm-toast { left: auto; right: 16px; }

/* --- the split column (560px) ---------------------------------------------- */
/* today: the hero and split columns run 460 to 600px wide and the frame must stay
   under 460px tall, so the five tiles fill two rows on a six-track grid (three, then
   two wider), the sublines go, labels may take two lines with the count aligned along
   the tile floor, the "Next 14 days" lane is dropped and the new-tenders lane keeps
   three rows. The standalone stage keeps the full screen. The spans are !important
   because tender.js writes inline spans from the frame width at mount, and a split
   column measures as its narrow case. */
:is(.split-visual, .flow-step) .dm-tender-today .dm-kpis.k5 { grid-template-columns: repeat(6, 1fr) !important; gap: 8px; }
:is(.split-visual, .flow-step) .dm-tender-today .dm-kpi { grid-column: span 2 !important; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px 11px; }
:is(.split-visual, .flow-step) .dm-tender-today .dm-kpi:nth-child(4), :is(.split-visual, .flow-step) .dm-tender-today .dm-kpi:nth-child(5) { grid-column: span 3 !important; }
:is(.split-visual, .flow-step) .dm-tender-today .dm-kpi span { white-space: normal; overflow: hidden; text-overflow: clip; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.25; font-size: 0.6rem; letter-spacing: 0.05em; }
:is(.split-visual, .flow-step) .dm-tender-today .dm-kpi u { display: none; }
:is(.split-visual, .flow-step) .dm-tender-lanes .dm-panel:last-child { display: none; }
:is(.split-visual, .flow-step) .dm-tender-lanes .dm-panel:first-child .dm-row:nth-child(n+5) { display: none; }
/* lane rows: the name keeps room before the status pill; date-lane pills shrink instead of running off the edge */
.dm-tender-lanes .dm-row > b { min-width: 120px; }
.dm-tender-date .dm-tag { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
:is(.split-visual, .flow-step) .dm-tender-table { grid-template-columns: minmax(0, 1fr); gap: 12px; }
:is(.split-visual, .flow-step) .dm-tender-rail { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
:is(.split-visual, .flow-step) .dm-tender-rail .dm-search { display: none; }
:is(.split-visual, .flow-step) .dm-tender-rail h6:last-of-type { display: none; }
:is(.split-visual, .flow-step) .dm-tender-table .dm-tender-buyer, :is(.split-visual, .flow-step) .dm-tender-table .dm-tender-valcol { display: none; }
:is(.split-visual, .flow-step) .dm-tender-sub { display: block; }
:is(.split-visual, .flow-step) .dm-tender-cols .dm-kpis.k3 { grid-template-columns: repeat(3, 1fr); }
:is(.split-visual, .flow-step) .dm-tender-stepper .dm-tlnode b { font-size: 0.64rem; }
:is(.split-visual, .flow-step) .dm-tender-profile .dm-toast, [dir="rtl"] .split-visual .dm-tender-profile .dm-toast { position: static; width: max-content; max-width: 100%; margin: 12px 0 0 auto; }
[dir="rtl"] .split-visual .dm-tender-profile .dm-toast { margin: 12px auto 0 0; }

/* --- narrow viewports ------------------------------------------------------- */
@media (max-width: 860px) {
  .dm-tender-today .dm-kpi:last-child { grid-column: 1 / -1; }
  .dm-tender-table { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .dm-tender-rail { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
  .dm-tender-rail .dm-search { display: none; }
  .dm-tender-rail h6:last-of-type { display: none; }
  .dm-tender-table .dm-tender-buyer, .dm-tender-table .dm-tender-valcol { display: none; }
  .dm-tender-sub { display: block; }
  .dm-tender-cols .dm-kpis.k3, :is(.split-visual, .flow-step) .dm-tender-cols .dm-kpis.k3 { grid-template-columns: repeat(3, 1fr); }
  .dm-tender-stepper, :is(.split-visual, .flow-step) .dm-tender-stepper { grid-template-columns: repeat(5, 1fr); gap: 4px; row-gap: 0; }
  .dm-tender-stepper .dm-tlline { display: block; }
  .dm-tender-stepper .dm-tlnode b { font-size: 0.6rem; }
  .dm-tender-stepper .dm-tlnode span { font-size: 0.58rem; }
  .dm-tender-profile .dm-toast, [dir="rtl"] .dm-tender-profile .dm-toast { position: static; width: max-content; max-width: 100%; margin: 12px 0 0 auto; }
  [dir="rtl"] .dm-tender-profile .dm-toast { margin: 12px auto 0 0; }
}
@media (max-width: 480px) {
  /* today: tiles keep their full label; lane rows put the title on its own line */
  .dm-tender-today .dm-kpi { padding: 10px 11px; }
  .dm-tender-today .dm-kpi span { font-size: 0.56rem; letter-spacing: 0.04em; }
  .split-visual .dm-tender-today .dm-kpi, :is(.split-visual, .flow-step) .dm-tender-today .dm-kpi:nth-child(4) { grid-column: span 3 !important; }
  .split-visual .dm-tender-today .dm-kpi:nth-child(5) { grid-column: span 6 !important; }
  .dm-tender-lanes .dm-row > b { min-width: 0; }
  .dm-tender-lanes .dm-row { flex-wrap: wrap; row-gap: 3px; }
  .dm-tender-lanes .dm-row > b { flex-basis: 100%; order: 3; }
  .dm-tender-lanes .dm-row > b small { display: inline; margin-inline-start: 6px; }
  .dm-tender-lanes .dm-row > .dm-tag { order: 1; }
  .dm-tender-lanes .dm-row > u.num { order: 2; margin-inline-start: auto; text-align: left; min-width: 0; }
  .dm-tender-date > u { order: 0; }
  .dm-tender-lanes .dm-row .dm-mark { display: none; }
  /* profile: tiles become one strip each, the title wraps */
  .dm-tender-head b { white-space: normal; line-height: 1.2; font-size: 0.9rem; }
  .dm-tender-profile .dm-kpis.k3, :is(.split-visual, .flow-step) .dm-tender-cols .dm-kpis.k3 { grid-template-columns: 1fr; gap: 6px; }
  .dm-tender-profile .dm-kpi { display: flex; align-items: baseline; gap: 10px; padding: 8px 12px; }
  .dm-tender-profile .dm-kpi span { flex: none; margin: 0; }
  .dm-tender-profile .dm-kpi b { flex: none; font-size: 0.95rem; }
  .dm-tender-profile .dm-kpi u { flex: 1; min-width: 0; margin: 0; text-align: end; }
  .dm-tender-table .dm-tender-bidders, .dm-tender-table .dm-tender-datecol { display: none; }
  .dm-tender-strip .dm-faint { display: none; }
  .dm-tender-delta { display: none; }
  .dm-tender-head .dm-tag:first-of-type { display: none; }
  .dm-tender-date > u { min-width: 66px; font-size: 0.64rem; }
}

/* Half-width columns: one lane and the bidder table only. Two lanes stacked ran
   Today to 885px; the details column ran the tender profile to 735px. */
:is(.split-visual, .flow-step) .dm-tender-lanes > :nth-child(2) { display: none; }
:is(.split-visual, .flow-step) .dm-tender-lanes .dm-row:nth-of-type(n+6) { display: none; }
:is(.split-visual, .flow-step) .dm-tender-cols .dm-field { display: none; }
:is(.split-visual, .flow-step) .dm-tender-cols { grid-template-columns: 1fr; }
