/* Negotiation ticket (design: Negotiation Ticket), take-terms card and trades. */
.ticket-head { display: flex; flex-direction: column; gap: 8px; }
.ticket-head__refs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ticket-head__row { display: flex; justify-content: space-between; gap: 24px; align-items: flex-end; flex-wrap: wrap; }
.ticket-head__title { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ticket-head__name { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ticket-head__who { display: flex; align-items: center; gap: 20px; }
.ticket-head__counterparty { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; padding-right: 20px; border-right: 1px solid var(--border); }
.ticket-head__counterparty strong { font-size: var(--text-md); }

/* History · the terms and forms · own economics and the index. */
.ticket { display: grid; grid-template-columns: 270px minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.ticket--ended { grid-template-columns: 270px minmax(0, 720px); }
.ticket__rail { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius-panel); padding: 18px 0 16px; display: flex; flex-direction: column; gap: 12px; }
.ticket__rail-title { font-size: var(--text-md); font-weight: 600; padding-inline: 18px; }
.ticket__rail-subtitle { font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.ticket__centre, .ticket__side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ticket__tranches { border-top: 1px solid var(--hairline); margin-inline: 18px; padding-top: 12px; }

.timeline { display: flex; flex-direction: column; }
.timeline__item { position: relative; padding: 9px 18px 9px 42px; font-size: 13px; display: flex; flex-direction: column; gap: 2px; }
.timeline__item::before { content: ""; position: absolute; left: 19px; top: 14px; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--ink-2); }
.timeline__item--pending { background: var(--accent-tint); }
.timeline__item--pending::before { background: var(--accent); border-color: var(--accent); }
.timeline__item--accepted::before { border-radius: 0; background: var(--agreed); border-color: var(--agreed); }
.timeline__item--declined::before, .timeline__item--withdrawn::before { border-radius: 0; border-color: var(--failed); }
.timeline__who { display: flex; gap: 4px; font-size: 13px; font-weight: 600; }
.timeline__time { margin-left: auto; font-weight: 400; }
.timeline__status { color: var(--muted); }
.timeline__item--pending .timeline__status { color: var(--accent-ink); }
.timeline__item--accepted .timeline__status { color: var(--agreed-ink); font-weight: 600; }
.timeline__item--declined .timeline__status, .timeline__item--withdrawn .timeline__status { color: var(--failed-ink); }

/* The terms on the table: figures, validity bar, action bar. */
.terms { gap: 12px; }
.terms__whose { font-size: 13px; color: var(--muted); }
.terms__figures { display: flex; align-items: baseline; gap: 24px; flex-wrap: wrap; }
.terms__quantity { font-size: 22px; }
.terms__validity { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.terms__validity-row { display: flex; justify-content: space-between; gap: 12px; }
.terms__bar { appearance: none; width: 100%; height: 4px; border: 0; border-radius: 2px; background: var(--hairline); overflow: hidden; }
.terms__bar::-webkit-progress-bar { background: var(--hairline); }
.terms__bar::-webkit-progress-value { background: var(--accent); }
.terms__bar::-moz-progress-bar { background: var(--accent); }
.terms__validity.is-urgent { color: var(--attention-ink); }
.terms__validity.is-urgent .terms__bar::-webkit-progress-value { background: var(--attention-bar); }
.terms__validity.is-urgent .terms__bar::-moz-progress-bar { background: var(--attention-bar); }
.terms__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 16px 24px; margin: 4px -24px -20px; background: var(--panel-sunken); border-radius: 0 0 var(--radius-panel) var(--radius-panel); }
.terms__actions .terms__end { margin-left: auto; }
.terms__note { flex: 1; min-width: 200px; font-size: 13px; color: var(--ink-2); }
.terms__extend-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.terms__extend-foot p { flex: 1; min-width: 200px; }
.segmented--wrap { flex-wrap: wrap; }

/* Right column: own economics on the table, the index and the suggestion. */
.economics-card__rows { display: grid; grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; font-size: 13px; }
.economics-card__rows dd { padding-left: 12px; }
.economics-card__rows dd { margin: 0; text-align: right; }
.economics-card__result { padding-top: 10px; border-top: 1px solid var(--hairline); font-weight: 600; font-size: var(--text-md); }
.economics-card__total { color: var(--muted); font-size: var(--text-sm); }
.suggestion { gap: 10px; }
.suggestion__legend { display: flex; justify-content: space-between; gap: 8px; font-size: var(--text-xs); }
.suggestion__box { background: var(--accent-tint); border-radius: var(--radius-control); padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.suggestion__box--empty { background: var(--panel-sunken); color: var(--ink-2); }
.suggestion__value { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.suggestion__price { font-size: var(--text-xl); color: var(--accent-ink); }
.index-scale { width: 100%; height: 20px; overflow: visible; }
.index-scale__axis { stroke: var(--border); stroke-width: 1; }
.index-scale__range { stroke: var(--agreed-tint); stroke-width: 6; stroke-linecap: round; }
.index-scale__tick { stroke: var(--ink); stroke-width: 1.5; }
.index-scale__you { fill: var(--panel); stroke: var(--ink); stroke-width: 1.5; }
.index-scale__them { fill: var(--panel); stroke: var(--ink); stroke-width: 1.5; }

/* A closed negotiation. */
.ended__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 24px; border-bottom: 1px solid var(--hairline); }
.ended__body { padding: 20px 24px; display: flex; flex-direction: column; gap: 14px; }
.ended__title { font-size: var(--text-lg); font-weight: 600; }
.ended__note { background: var(--panel-sunken); border-radius: var(--radius-control); padding: 14px; display: flex; flex-direction: column; gap: 4px; }
.ended__own-pending { color: var(--attention-ink); }
.ended__foot { display: flex; justify-content: flex-end; align-items: center; gap: 16px; padding: 16px 24px; background: var(--panel-sunken); flex-wrap: wrap; }
.ended__foot p { flex: 1; color: var(--ink-2); }

.take-terms { background: var(--panel-sunken); border-radius: var(--radius-control); padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.take-terms__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.respond { display: flex; flex-direction: column; gap: 10px; }

.grid-table--negotiations .grid-table__head, .grid-table--negotiations .grid-table__row { grid-template-columns: 110px minmax(0, 1fr) 120px 170px 60px; }
.owner-negs__yours { color: var(--accent-ink); font-weight: 600; }
.grid-table--negotiations .is-soon { color: var(--attention-ink); font-weight: 600; }
.grid-table--trades .grid-table__head, .grid-table--trades .grid-table__row {
  grid-template-columns: 90px 90px minmax(0, 1.4fr) 80px 90px 110px 150px minmax(0, 1fr);
}
.panel__foot { padding: 10px 20px; border-top: 1px solid var(--hairline); }

@media (max-width: 1180px) {
  .ticket { grid-template-columns: 270px minmax(0, 1fr); }
  .ticket__side { grid-column: 2; }
}
@media (max-width: 960px) {
  .ticket, .ticket--ended { grid-template-columns: minmax(0, 1fr); }
  .ticket__side { grid-column: auto; }
  .grid-table--trades .grid-table__head { display: none; }
  .grid-table--trades .grid-table__row, .grid-table--negotiations .grid-table__row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 4px; }
}

/* The custom time shows only when "Custom" is chosen (works without JavaScript). */
.validity__custom { display: none; flex-direction: column; gap: 6px; }
fieldset:has(input[value="custom"]:checked) .validity__custom { display: flex; }

/* Deal recap: an A4 record. Toolbar and report form are screen-only. */
.recap-toolbar { display: flex; justify-content: space-between; align-items: center; max-width: 794px; }
.recap { background: var(--panel); border: 1px solid var(--border); max-width: 794px; padding: 48px 56px; display: flex; flex-direction: column; gap: 24px; border-radius: var(--radius-panel); }
.recap__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--ink); }
.recap__brand { font-size: var(--text-md); margin-bottom: 4px; }
.recap__head h1 { font-size: 28px; }
.recap__meta { display: grid; grid-template-columns: auto auto; gap: 3px 14px; font-size: 13px; text-align: right; }
.recap__meta dt { color: var(--muted); }
.recap__meta dd { margin: 0; }
.recap__figures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--ink); }
.recap__figures > div { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; }
.recap__figures > div + div { border-left: 1px solid var(--ink); }
.recap__figure-label, .recap__figure-unit { font-size: var(--text-sm); color: var(--muted); }
.recap__figure { display: flex; flex-direction: column; gap: 4px; }
.recap__figure .mono { font-size: 24px; font-weight: 500; letter-spacing: -.02em; }
.recap__parties { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.recap__parties .definition { grid-template-columns: 100px minmax(0, 1fr); }
.recap__party-name { font-weight: 600; font-size: var(--text-md); }
.recap__section { display: flex; flex-direction: column; gap: 10px; }
.recap__section h2 { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .06em; color: var(--ink); font-weight: 600; }
.recap .definition { font-size: 13px; }
.fee-statement { font-size: 13px; }
.fee-statement__row { display: grid; grid-template-columns: minmax(0, 1fr) 100px 100px 130px; gap: 12px; padding: 7px 0; border-top: 1px solid var(--hairline); }
.fee-statement__row > :not(:first-child) { text-align: right; }
.fee-statement__head { color: var(--muted); border-top: 0; border-bottom: 1px solid var(--ink); }
.fee-statement__total { border-top: 1px solid var(--ink); font-weight: 600; }
.recap-report, .recap-note { max-width: 794px; }

.admin-table__row--disputes, .admin-table__row--deals { grid-template-columns: 100px minmax(0, 1fr) 150px 130px 120px; }

@media print {
  .top-bar, .verification-banner, .flash-bar, .recap-toolbar, .recap-report, .recap-note { display: none !important; }
  body { background: #fff; }
  .page { padding: 0; }
  .recap { padding: 0; border: 0; border-radius: 0; }
}

/* Trades: tabs on the left, state and filters on the right. */
.trades-bar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; border-bottom: 1px solid var(--border); }
.trades-bar .tabs { margin-bottom: -1px; }
.trades-bar__filters { padding-bottom: 8px; }
.trades__next--mine { font-weight: 600; }