/* tools/torque-converter/tool.css — only what the torque converter needs beyond
 * /assets/tool.css. Every class starts with tqc-. */

/* Unit boxes two abreast. The shared .tk-row minimum (150px) is too narrow once a Copy
 * button is fused on after the unit. */
.tqc-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
           gap: var(--s-3); }

/* The per-value Copy button, fused to the right end of a .tk-input like the unit is. */
.tqc-copy { flex: none; margin: 0; padding: 0 10px; font: inherit; font-size: var(--t-xs);
            font-weight: var(--w-medium); color: var(--brand); background: var(--page-raised);
            border: 0; border-left: 1px solid var(--page-hair-cool);
            border-radius: 0 var(--r-sm) var(--r-sm) 0; cursor: pointer; }
.tqc-copy:hover { background: var(--brand-wash); }
.tqc-copy:focus-visible { outline: 2px solid var(--brand); outline-offset: -3px; }
.tqc-copy.is-done { color: var(--ok); }
/* With the button after it, the unit is no longer the rounded right-hand end. */
.tk-input > .tk-input__u:not(:last-child) { border-radius: 0; }

/* Tables whose headers are unit symbols. The shared header style sets capitals, and "mN·m"
 * in capitals reads as meganewton metres. */
.tqc-table thead th { text-transform: none; letter-spacing: 0; }
.tqc-table .tqc-n { text-align: right; }

/* The catalogue reference table: its own section between the converter and the explanation,
 * on the same edges as both. */
.tqc-ref { display: grid; gap: var(--s-3); margin-top: var(--s-8); }
.tqc-ref > * { margin: 0; }
.tqc-ref .tk-table tbody + tbody > tr:first-child > * { border-top: var(--hair); }
.tqc-ref .tqc-group > th { background: var(--page-cool); color: var(--page-muted);
                           font-size: var(--t-xs); letter-spacing: 0.04em;
                           text-transform: uppercase; }
.tqc-ref .tk-table tbody th[scope="row"] { min-width: 18rem; font-weight: var(--w-normal); }

@media print {
  .tqc-copy { display: none !important; }
}