/* Tools interattivi (conversioni, IEEE 754, logica, ...) */
.md-typeset .tool {
  --t-line: var(--md-default-fg-color--lightest);
  --t-soft: var(--md-code-bg-color);
  --t-ok: #17784a;
  --t-ok-soft: rgba(23, 120, 74, 0.1);
  --t-no: #b3261e;
  --t-no-soft: rgba(179, 38, 30, 0.08);
  --t-s: #c2410c;
  --t-e: #1d4e89;
  --t-m: #6b4f00;
  margin: 1.2em 0;
  border: 1px solid var(--t-line);
  border-radius: 10px;
  overflow: hidden;
  font-size: 0.75rem;
  min-width: 0;
}
[data-md-color-scheme="slate"] .md-typeset .tool {
  --t-ok: #6fd39c;
  --t-ok-soft: rgba(111, 211, 156, 0.12);
  --t-no: #ff8b7d;
  --t-no-soft: rgba(255, 139, 125, 0.1);
  --t-s: #fb923c;
  --t-e: #8db4ea;
  --t-m: #e9c46a;
}
.md-typeset .tool:not(.tool--pronto) { padding: 0.8rem; color: var(--md-default-fg-color--light); }

.md-typeset .tool-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.6rem;
  padding: 0.5rem 0.8rem; background: var(--t-soft); border-bottom: 1px solid var(--t-line);
}
.md-typeset .tool-badge {
  font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
  padding: 0.05rem 0.4rem; border-radius: 4px; color: #fff; background: var(--md-primary-fg-color);
}
.md-typeset .tool-title { font-weight: 700; flex: 1 1 12rem; min-width: 0; }
.md-typeset .tool-link { font-size: 0.65rem; white-space: nowrap; }

.md-typeset .tool-tabs {
  display: flex; gap: 0.25rem; padding: 0.4rem 0.6rem 0; border-bottom: 1px solid var(--t-line);
  overflow-x: auto; scrollbar-width: thin;
}
.md-typeset .tool-tab {
  flex: none; font: inherit; font-size: 0.7rem; font-weight: 600; cursor: pointer;
  padding: 0.35rem 0.7rem; border: 1px solid transparent; border-bottom: 0; border-radius: 6px 6px 0 0;
  background: none; color: var(--md-default-fg-color--light);
}
.md-typeset .tool-tab:hover { color: var(--md-default-fg-color); }
.md-typeset .tool-tab.is-on {
  color: var(--md-typeset-a-color); border-color: var(--t-line); background: var(--md-default-bg-color);
  margin-bottom: -1px;
}

.md-typeset .tool-body { padding: 0.8rem; min-width: 0; }
.md-typeset .tool-form {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: 0.6rem 0.8rem; align-items: start;
}
.md-typeset .tool-field { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.md-typeset .tool-field[hidden] { display: none; }
.md-typeset .tool-field--wide { grid-column: 1 / -1; }
.md-typeset .tool-field label { font-weight: 600; font-size: 0.68rem; color: var(--md-default-fg-color--light); }
.md-typeset .tool-field small { font-size: 0.62rem; line-height: 1.4; color: var(--md-default-fg-color--light); }
.md-typeset .tool-input {
  font: inherit; font-size: 0.8rem; width: 100%; min-width: 0; box-sizing: border-box;
  padding: 0.4rem 0.55rem; border: 1px solid var(--md-default-fg-color--lighter); border-radius: 6px;
  background: var(--md-default-bg-color); color: var(--md-default-fg-color);
}
.md-typeset select.tool-input { padding-right: 0.3rem; }
.md-typeset .tool-input:focus { outline: 2px solid var(--md-accent-fg-color); outline-offset: 0; border-color: transparent; }
.md-typeset .tool-mono { font-family: var(--md-code-font-family); letter-spacing: 0.02em; }

.md-typeset .tool-out { margin-top: 0.8rem; min-width: 0; overflow-wrap: break-word; }
.md-typeset .tool-out p { margin: 0.5em 0; }
.md-typeset .tool-out h5 { margin: 1em 0 0.3em; font-size: 0.72rem; text-transform: none; letter-spacing: 0; color: var(--md-typeset-a-color); }
.md-typeset .tool-result {
  font-size: 0.9rem; padding: 0.55rem 0.7rem; border-radius: 8px; background: var(--t-soft);
  font-family: var(--md-code-font-family); overflow-wrap: anywhere; line-height: 1.5;
}
.md-typeset .tool-result strong { color: var(--md-typeset-a-color); }
.md-typeset .tool-formula { font-family: var(--md-code-font-family); font-size: 0.72rem; overflow-wrap: anywhere; }
.md-typeset .tool-note { font-size: 0.68rem; color: var(--md-default-fg-color--light); }
.md-typeset .tool-err {
  padding: 0.5rem 0.7rem; border-radius: 8px; border-left: 4px solid var(--t-no); background: var(--t-no-soft); color: var(--md-default-fg-color);
}
.md-typeset .tool-good, .md-typeset .tool-bad { margin: 0.6em 0; padding: 0.5rem 0.7rem; border-radius: 8px; border-left: 4px solid; }
.md-typeset .tool-good { border-color: var(--t-ok); background: var(--t-ok-soft); }
.md-typeset .tool-bad { border-color: var(--t-no); background: var(--t-no-soft); }
.md-typeset .tool-no { color: var(--t-no); font-weight: 600; }
.md-typeset .tool-word, .md-typeset .tool-code { font-weight: 700; letter-spacing: 0.04em; overflow-wrap: anywhere; word-break: break-all; }
.md-typeset .tool code { font-size: 0.85em; }

/* schede con le quattro basi */
.md-typeset .tool-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(6.5rem, 1fr)); gap: 0.5rem; margin: 0.7rem 0; }
.md-typeset .tool-card {
  display: flex; flex-direction: column; gap: 0.2rem; min-width: 0;
  padding: 0.45rem 0.6rem; border: 1px solid var(--t-line); border-radius: 8px;
}
.md-typeset .tool-card.is-on { border-color: var(--md-accent-fg-color); }
.md-typeset .tool-card span { font-size: 0.62rem; color: var(--md-default-fg-color--light); }
.md-typeset .tool-card code { background: none; padding: 0; font-weight: 700; overflow-wrap: anywhere; word-break: break-all; }

/* tabelle */
.md-typeset .tool-scroll { overflow-x: auto; max-width: 100%; margin: 0.5em 0; -webkit-overflow-scrolling: touch; }
.md-typeset .tool .tool-table, .md-typeset .tool .tool-cols {
  display: table; width: auto; min-width: 0; margin: 0; font-size: 0.7rem; border-collapse: collapse;
  border: 1px solid var(--t-line); border-radius: 0; box-shadow: none;
}
.md-typeset .tool .tool-table th, .md-typeset .tool .tool-table td {
  padding: 0.3rem 0.6rem; border-top: 1px solid var(--t-line); vertical-align: top; min-width: 0;
}
.md-typeset .tool .tool-table th { background: var(--t-soft); font-weight: 700; text-align: left; }
.md-typeset .tool .tool-table td small { color: var(--md-default-fg-color--light); }
.md-typeset .tool .tool-table tr.is-no td { background: var(--t-no-soft); }
.md-typeset .tool .tool-table tr.is-1 td { background: var(--md-accent-fg-color--transparent); }
.md-typeset .tool .tool-table tr.tool-in td { background: var(--t-soft); }
.md-typeset .tool .tool-truth th, .md-typeset .tool .tool-truth td { text-align: center; font-family: var(--md-code-font-family); white-space: nowrap; }
.md-typeset .tool .tool-groups th, .md-typeset .tool .tool-groups td { text-align: center; }
.md-typeset .tool-var { font-style: italic; }

/* somma in colonna */
.md-typeset .tool .tool-cols { border: 0; font-family: var(--md-code-font-family); font-size: 0.85rem; }
.md-typeset .tool .tool-cols th { padding: 0.15rem 0.6rem 0.15rem 0; text-align: right; font-size: 0.65rem; font-family: var(--md-text-font-family); color: var(--md-default-fg-color--light); font-weight: 600; white-space: nowrap; }
.md-typeset .tool .tool-cols td { padding: 0.15rem 0.3rem; text-align: center; min-width: 1.1em; }
.md-typeset .tool .tool-cols .tool-carry td { font-size: 0.65rem; color: var(--md-accent-fg-color); height: 1.1rem; }
.md-typeset .tool .tool-cols .tool-line td { border-bottom: 2px solid var(--md-default-fg-color--light); }
.md-typeset .tool .tool-cols .tool-sum td { font-weight: 700; }
.md-typeset .tool .tool-cols .tool-col-first { color: var(--md-default-fg-color--light); }

/* IEEE 754 */
.md-typeset .tool-ieee { display: flex; flex-wrap: wrap; gap: 0.3rem; font-family: var(--md-code-font-family); font-weight: 700; font-size: 0.85rem; }
.md-typeset .tool-ieee > span {
  display: flex; flex-direction: column; gap: 0.15rem; padding: 0.35rem 0.5rem; border-radius: 6px; border: 2px solid;
  min-width: 0; word-break: break-all; overflow-wrap: anywhere;
}
.md-typeset .tool-ieee small { font-family: var(--md-text-font-family); font-weight: 600; font-size: 0.6rem; opacity: 0.85; }
.md-typeset .tool-ieee-s { color: var(--t-s); }
.md-typeset .tool-ieee-e { color: var(--t-e); }
.md-typeset .tool-ieee-m { color: var(--t-m); flex: 1 1 12rem; }
.md-typeset .tool-hexline { font-size: 0.68rem; color: var(--md-default-fg-color--light); }

/* passaggi */
.md-typeset details.tool-steps {
  margin: 0.8em 0 0; padding: 0; border: 1px solid var(--t-line); border-radius: 8px;
  background: none; box-shadow: none; font-size: inherit; overflow: visible;
}
.md-typeset details.tool-steps > summary {
  cursor: pointer; padding: 0.45rem 0.7rem 0.45rem 2rem; margin: 0; font-weight: 700; font-size: 0.72rem;
  color: var(--md-typeset-a-color); background: none; border: 0; border-radius: 8px; list-style: none;
}
.md-typeset details.tool-steps > summary::-webkit-details-marker { display: none; }
.md-typeset details.tool-steps > summary::before {
  content: "▸"; position: absolute; left: 0.8rem; top: 0.42rem; width: auto; height: auto;
  background: none; -webkit-mask-image: none; mask-image: none; transform: none; transition: transform 0.15s;
  color: var(--md-typeset-a-color); font-size: 0.8rem; line-height: 1;
}
.md-typeset details.tool-steps[open] > summary::before { transform: rotate(90deg); }
.md-typeset details.tool-steps > summary::after { display: none; }
.md-typeset details.tool-steps[open] > summary { border-bottom: 1px solid var(--t-line); border-radius: 8px 8px 0 0; }
.md-typeset .tool-steps-body { padding: 0.2rem 0.8rem 0.6rem; min-width: 0; }
.md-typeset details.tool-steps > .tool-steps-body > :first-child { margin-top: 0.6em; }

/* tabella ASCII */
.md-typeset .tool-ascii { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); gap: 0.3rem; }
.md-typeset .tool-ascii > div {
  display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 0 0.4rem;
  padding: 0.25rem 0.4rem; border: 1px solid var(--t-line); border-radius: 6px; font-size: 0.65rem;
}
.md-typeset .tool-ascii strong { grid-row: span 2; font-family: var(--md-code-font-family); font-size: 0.95rem; }
.md-typeset .tool-ascii code { background: none; padding: 0; font-size: 0.6rem; color: var(--md-default-fg-color--light); }

/* elenco dei tools (pagina indice) */
.md-typeset .tools-elenco { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.8rem; margin: 1rem 0 1.4rem; }
.md-typeset .tools-elenco > p { margin: 0; display: flex; }
.md-typeset .tools-elenco a {
  display: block; flex: 1; padding: 0.8rem 0.9rem; border: 1px solid var(--md-default-fg-color--lightest); border-radius: 10px;
  color: var(--md-default-fg-color); text-decoration: none;
}
.md-typeset .tools-elenco a:hover, .md-typeset .tools-elenco a:focus-visible { border-color: var(--md-primary-fg-color); }
.md-typeset .tools-elenco strong { display: block; color: var(--md-typeset-a-color); margin-bottom: 0.2rem; }
.md-typeset .tools-elenco span { display: block; font-size: 0.68rem; line-height: 1.45; color: var(--md-default-fg-color--light); }

@media screen and (max-width: 30em) {
  .md-typeset .tool { margin-left: -0.2rem; margin-right: -0.2rem; }
  .md-typeset .tool-body { padding: 0.6rem; }
  .md-typeset .tool-form { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
  .md-typeset .tool-steps-body { padding: 0.2rem 0.5rem 0.5rem; }
  .md-typeset .tool-result { font-size: 0.8rem; }
  .md-typeset .tool-link { display: none; }
}
