/* Approvals inbox and decision cards (owner: WP4).
   Each waiting request is a card that reads top to bottom like a briefing: who asked and why,
   the facts as a definition list, then the decision in a sunken footer. Pink stays the colour
   of "a person must act": the Waiting for you count and the Approve button. Tokens only. */

.ts-approvals__tabs { margin-bottom: 24px; }
.ts-approvals__tabs .nav-tabs { flex-wrap: wrap; }
.ts-approvals__tabs .nav-link { font-family: var(--ts-font); }
.ts-approvals__tabs .ts-count { min-width: 22px; padding: 1px 7px; border-radius: var(--ts-radius-pill); background: var(--ts-slate-100); color: var(--ts-slate-700); font-size: var(--ts-fs-micro); line-height: 18px; font-weight: 600; text-align: center; }
.ts-approvals__tabs .nav-link.active .ts-count { background: var(--ts-blue-900); color: var(--ts-white); }
.ts-approvals__tabs .ts-count--attention, .ts-approvals__tabs .nav-link.active .ts-count--attention { background: var(--ts-pink-200); color: var(--ts-blue-900); }
.ts-approvals .tab-content > .tab-pane.active { display: flex; flex-direction: column; gap: 20px; }
@media (max-width: 767.98px) {
  /* The row scrolls sideways, which clips: 4px of room above and below keeps the focus ring whole */
  .ts-approvals__tabs { margin: -4px -16px 16px; padding: 4px 16px; overflow-x: auto; scrollbar-width: none; }
  .ts-approvals__tabs::-webkit-scrollbar { display: none; }
  .ts-approvals__tabs .nav-tabs { flex-wrap: nowrap; gap: 4px 22px; width: max-content; min-width: 100%; }
}

/* Decision card ----------------------------------------------------------------- */
.ts-decision__head { padding: 20px 24px 18px; border-bottom: 1px solid var(--ts-border-subtle); }
.ts-decision__kicker { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; font-size: var(--ts-fs-small); line-height: var(--ts-lh-small); color: var(--ts-text-secondary); }
.ts-decision__type { color: var(--ts-text-muted); }
.ts-decision__asked { margin-left: auto; color: var(--ts-text-muted); }
.ts-decision__title { margin: 12px 0 0; font-size: var(--ts-fs-section); line-height: var(--ts-lh-section); font-weight: 700; letter-spacing: var(--ts-ls-section); }
.ts-decision__title a { color: var(--ts-text); text-decoration: none; }
.ts-decision__title a:hover { color: var(--ts-link-hover); text-decoration: underline; text-underline-offset: 4px; }
.ts-decision__request { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 10px 14px; margin-top: 12px; }
.ts-decision__request > .ts-person { padding-top: 4px; font-size: var(--ts-fs-small); font-weight: 600; }
.ts-decision__quote { position: relative; flex: 1 1 280px; max-width: 72ch; margin: 0; padding: 8px 14px; border-radius: var(--ts-radius-md); background: var(--ts-sand-100); border: 1px solid var(--ts-border-subtle); }
.ts-decision__quote::before { content: ""; position: absolute; left: -6px; top: 11px; width: 10px; height: 10px; background: var(--ts-sand-100); border-left: 1px solid var(--ts-border-subtle); border-bottom: 1px solid var(--ts-border-subtle); transform: rotate(45deg); }
.ts-decision__quote p { margin: 0; overflow-wrap: anywhere; }
.ts-decision__no-note { padding-top: 6px; color: var(--ts-text-muted); font-size: var(--ts-fs-small); }

.ts-decision__facts { margin: 0; padding: 4px 24px; }
.ts-decision__fact { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 4px 16px; padding: 12px 0; border-top: 1px solid var(--ts-border-subtle); }
.ts-decision__fact:first-child { border-top: 0; }
.ts-decision__changes { margin: 0; padding-left: 1.1rem; }
.ts-decision__changes li + li { margin-top: 2px; }
.ts-decision__fact dt { display: flex; align-items: flex-start; gap: 8px; font-size: var(--ts-fs-small); line-height: 20px; font-weight: 600; color: var(--ts-text-secondary); }
.ts-decision__fact dt .bi { font-size: 15px; line-height: 20px; color: var(--ts-slate-400); }
.ts-decision__fact dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.ts-decision__arms { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.ts-decision__arms .ts-var { font-weight: 500; }
.ts-decision__hypothesis { display: block; max-width: 80ch; margin-top: 6px; padding-left: 12px; border-left: 2px solid var(--ts-border); color: var(--ts-text-secondary); font-size: var(--ts-fs-small); line-height: var(--ts-lh-small); font-style: italic; }
.ts-decision__aside { display: block; margin-top: 2px; color: var(--ts-text-muted); font-size: var(--ts-fs-small); line-height: var(--ts-lh-small); }
.ts-decision__missing { color: var(--ts-amber-700); font-weight: 600; }
.ts-decision__muted { color: var(--ts-text-muted); font-size: var(--ts-fs-small); }
.ts-decision__checks { list-style: none; display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; }
.ts-decision__checks li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; }
.ts-decision__checks .bi { font-size: 16px; line-height: 20px; }
.ts-decision__checks .is-ok .bi { color: var(--ts-green-600); }
.ts-decision__checks .is-warn .bi { color: var(--ts-amber-600); }
.ts-decision__checks .is-fail { color: var(--ts-red-700); font-weight: 600; }
.ts-decision__checks .is-fail .bi { color: var(--ts-red-600); }
.ts-decision__preview { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ts-decision__link .ts-var { color: var(--ts-text); }
.ts-decision__link .bi-box-arrow-up-right { font-size: 12px; color: var(--ts-slate-400); }
.ts-decision__link:hover .bi-box-arrow-up-right { color: currentColor; }
.ts-decision__full { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; }
.ts-decision__full .bi { font-size: 14px; }

.ts-decision__foot { padding: 16px 24px 20px; background: var(--ts-surface-sunken); border-top: 1px solid var(--ts-border-subtle); border-radius: 0 0 var(--ts-radius-lg) var(--ts-radius-lg); }
.ts-decision__form { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 12px 16px; margin: 0; }
.ts-decision__note { flex: 1 1 320px; min-width: 0; }
.ts-decision__note .form-label { margin-bottom: 6px; font-size: var(--ts-fs-small); }
.ts-decision__optional { font-weight: 400; color: var(--ts-text-muted); }
.ts-decision__actions { display: flex; gap: 8px; }
.ts-decision__foot:not(:has(form.ts-decision__form)) { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; }
.ts-decision__status { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ts-text-secondary); font-size: var(--ts-fs-small); }
.ts-decision__status .bi { color: var(--ts-slate-400); font-size: 16px; }
.ts-decision__foot form:not(.ts-decision__form) { margin: 0; }

@media (max-width: 991.98px) {
  .ts-decision__quote { flex-basis: 100%; }
  .ts-decision__quote::before { display: none; }
}
@media (max-width: 767.98px) {
  .ts-decision__head { padding: 16px; }
  .ts-decision__asked { margin-left: 0; flex-basis: 100%; }
  .ts-decision__title { font-size: 18px; line-height: 24px; letter-spacing: -0.3px; }
  .ts-decision__facts { padding: 0 16px; }
  .ts-decision__fact { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ts-decision__full { margin-left: 0; flex-basis: 100%; }
  .ts-decision__foot { padding: 16px; }
  .ts-decision__note { flex-basis: 100%; }
  .ts-decision__actions { width: 100%; }
  .ts-decision__actions > .btn[type="submit"] { flex: 1 1 auto; white-space: normal; }
  .ts-decision__foot form:not(.ts-decision__form), .ts-decision__foot form:not(.ts-decision__form) .btn { width: 100%; }
}

/* Decided ------------------------------------------------------------------------- */
.ts-decided__list { list-style: none; margin: 0; padding: 0; }
.ts-decided__item { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 16px; padding: 16px 24px; border-top: 1px solid var(--ts-border-subtle); }
.ts-decided__item:first-child { border-top: 0; }
.ts-decided__chip { padding-top: 1px; }
.ts-decided__name { margin: 0; font-weight: 600; }
.ts-decided__name a { color: var(--ts-text); text-decoration: none; }
.ts-decided__name a:hover { color: var(--ts-link-hover); text-decoration: underline; text-underline-offset: 3px; }
.ts-decided__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 16px; margin: 4px 0 0; color: var(--ts-text-muted); font-size: var(--ts-fs-small); }
.ts-decided__by { margin: 6px 0 0; color: var(--ts-text-secondary); font-size: var(--ts-fs-small); line-height: var(--ts-lh-small); }
.ts-decided__by q { color: var(--ts-text); }
@media (max-width: 767.98px) {
  .ts-decided__item { grid-template-columns: minmax(0, 1fr); padding: 14px 16px; }
}

/* Reject dialog --------------------------------------------------------------------- */
.ts-reject .modal-body > p { margin: 0 0 16px; color: var(--ts-text-secondary); }