/* ============================================================
   Referencia de fórmulas generada desde el motor
   (comparador/tabla_formulas.php)
   ============================================================ */

.tf-table code {
    display: inline-block;
    font-size: 0.76rem;
    line-height: 1.5;
    color: rgba(255,255,255,0.88);
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 3px;
    padding: 0.12rem 0.4rem;
}
html.light-theme .tf-table code,
body.light-theme .tf-table code {
    color: rgba(0,0,0,0.82);
    background: rgba(0,0,0,0.04);
    border-color: rgba(0,0,0,0.08);
}

.tf-paso {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.45rem;
    padding: 0.22rem 0;
    border-bottom: 1px dashed rgba(255,255,255,0.06);
}
.tf-paso:last-child { border-bottom: none; }
html.light-theme .tf-paso,
body.light-theme .tf-paso { border-bottom-color: rgba(0,0,0,0.07); }

.tf-val {
    font-size: 0.74rem;
    font-variant-numeric: tabular-nums;
    color: var(--primary-color, #ff6b35);
    white-space: nowrap;
}

.tf-nota {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.tf-nota strong { font-size: 1.05rem; color: var(--primary-color, #ff6b35); }
.tf-nota small  { font-size: 0.7rem; opacity: 0.5; }

.tf-pie {
    margin: 0.7rem 0 0;
    font-size: 0.73rem;
    color: rgba(255,255,255,0.38);
}
.tf-pie i { color: var(--primary-color, #ff6b35); margin-right: 0.3rem; }
.tf-pie code {
    font-size: 0.72rem;
    background: none;
    border: none;
    padding: 0;
    color: inherit;
}
html.light-theme .tf-pie,
body.light-theme .tf-pie { color: rgba(0,0,0,0.45); }

@media (max-width: 700px) {
    .tf-paso { flex-direction: column; gap: 0.1rem; }
    .tf-val  { white-space: normal; }
    .tf-table code { font-size: 0.7rem; }
}