/* Overdragelse og gebyrer (feature F2). Series colours for the two business
   lines: categorical slots 7 (violet) and 5 (magenta), clear of the four
   company colours; validated light and dark (dataviz validator, all checks pass). */
:root{ --tr-clean:#4a3aa7; --tr-prop:#e87ba4 }
@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){ --tr-clean:#9085e9; --tr-prop:#d55181 }
}
:root[data-theme="dark"]{ --tr-clean:#9085e9; --tr-prop:#d55181 }

.tr-table td.sel, .tr-table th.sel{ width:34px; text-align:center; padding-left:6px; padding-right:6px }
.tr-table td.sel input, .tr-table th.sel input{ width:16px; height:16px; accent-color:var(--accent); cursor:pointer; vertical-align:middle }
.tr-table td.name{ text-align:left; max-width:230px; overflow:hidden; text-overflow:ellipsis }
.tr-table td.txt, .tr-table th.txt{ text-align:left }
.tr-table td .n{ display:block; font-size:11.5px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; max-width:230px; margin-top:1px }
.tr-table td .n.hint-warn{ color:var(--warn); font-weight:600 }
.tr-table td .n.hint-crit{ color:var(--neg); font-weight:600 }
.tr-table tr.picked td{ background:var(--wash) }
.tr-table tr.picked td:first-child{ background:var(--wash) }
.tr-table .def{ color:var(--ink-3) }

/* the bulk bar sits on top of the table while rows are selected */
.tr-bulk{ display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; padding:10px 16px;
  background:var(--wash); border-bottom:1px solid var(--hair); font-size:13px }
.tr-bulk b{ font-weight:700 }
.tr-bulk .grp{ display:flex; gap:6px; align-items:center; flex-wrap:wrap }
.tr-bulk .lbl{ color:var(--ink-2) }

.tr-filters{ display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; padding:12px 16px; border-bottom:1px solid var(--hair) }
.tr-filters .input{ width:200px }

.tr-form{ display:grid; grid-template-columns:150px minmax(0,1fr); gap:12px 14px; align-items:center; font-size:13px }
.tr-form > label{ color:var(--ink-2) }
.tr-form textarea{ width:100%; min-height:70px; resize:vertical; font:inherit }
.tr-form .help{ grid-column:2; font-size:12px; color:var(--ink-3); margin-top:-6px }
.tr-form .seg{ flex-wrap:wrap }

.tr-recv{ border-top:1px solid var(--hair); padding:16px 18px }
.tr-recv:first-of-type{ border-top:0 }
.tr-recv h3{ font-size:14.5px; margin:0 0 4px }
.tr-recv .kv{ max-width:560px; margin:10px 0 12px }

@media (max-width: 760px){
  .tr-form{ grid-template-columns:1fr; gap:6px }
  .tr-form > label{ margin-top:8px }
  .tr-form .help{ grid-column:1; margin-top:0 }
  .tr-filters .input{ width:100% }
  .tr-bulk{ padding:10px 12px }
  .tr-recv{ padding:14px 12px }
}