/* RECATOOLS — CAPEX → OPEX Calculator — tool-specific layout.
   Self-hosted; no third-party assets. Inherits tokens from tool-page.css. */

.co-intro { font-size: .875rem; color: #475569; margin: 0 0 1rem; }

.co-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem 1rem; }
.co-inputs .input-row { display: flex; flex-direction: column; gap: .3rem; }
.co-inputs label { font-size: .8rem; font-weight: 600; color: #1a1814; }
.co-span2 { grid-column: 1 / -1; }
.co-input, .co-select {
    width: 100%; padding: .55rem .7rem; border: 1px solid #d6d3cd; border-radius: 8px;
    font: inherit; font-size: .95rem; background: #fff; color: #1a1814;
}
.co-input:focus, .co-select:focus { outline: 2px solid rgba(232,71,47,.4); border-color: #e8472f; }
.co-affix { display: flex; align-items: stretch; }
.co-affix .co-pre { display: inline-flex; align-items: center; padding: 0 .6rem; background: #f3f1ec; border: 1px solid #d6d3cd; border-right: 0; border-radius: 8px 0 0 8px; font-size: .8rem; color: #6b6760; }
.co-affix .co-input { border-radius: 0 8px 8px 0; }
.co-affix .co-suf { display: inline-flex; align-items: center; padding: 0 .6rem; background: #f3f1ec; border: 1px solid #d6d3cd; border-left: 0; border-radius: 0 8px 8px 0; font-size: .8rem; color: #6b6760; }
.co-affix .co-input.co-has-suffix { border-radius: 8px 0 0 8px; }

#error-box { display: none; margin: .85rem 0 0; padding: .6rem .8rem; border-radius: 8px; background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; font-size: .85rem; }

/* ── Results ── */
.co-results { margin-top: 1.25rem; }
.co-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; }
.co-stat { background: var(--rt-result-bg, #1f2937); border-radius: 12px; padding: .85rem .9rem; }
.co-stat--hl { background: #e8472f; }
.co-stat-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: var(--rt-result-muted, #cbd5e1); }
.co-stat--hl .co-stat-label { color: rgba(255,255,255,.85); }
.co-stat-value { font-size: 1.25rem; font-weight: 700; color: var(--rt-result-ink, #f8fafc); margin-top: .2rem; line-height: 1.2; }
.co-stat-sub { font-size: .72rem; color: var(--rt-result-muted, #cbd5e1); margin-top: .15rem; }

.co-subgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .6rem; margin-top: .7rem; }
.co-mini { background: #f7f6f3; border: 1px solid #ebebeb; border-radius: 10px; padding: .6rem .7rem; }
.co-mini-label { font-size: .72rem; color: #6b6760; }
.co-mini-value { font-size: 1.05rem; font-weight: 700; color: #1a1814; margin-top: .1rem; }

.co-block { margin-top: 1.1rem; padding: .9rem 1rem; background: #f7f6f3; border: 1px solid #ebebeb; border-radius: 12px; }
.co-block h3 { margin: 0 0 .5rem; font-size: .95rem; }
.co-verdict { font-size: .82rem; color: #475569; margin-top: .5rem; }

/* ── Reseller (fenced, collapsible) ── */
.co-reseller { margin-top: 1.1rem; border: 1px dashed #cbb89a; border-radius: 12px; overflow: hidden; }
.co-reseller-toggle { width: 100%; text-align: left; background: #fdf7ec; border: 0; padding: .7rem .9rem; font: inherit; font-weight: 600; font-size: .9rem; color: #7c5e16; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
.co-reseller-toggle::after { content: '▾'; transition: transform .15s; }
.co-reseller-toggle[aria-expanded="true"]::after { transform: rotate(180deg); }
.co-reseller-body { padding: .9rem; }
.co-fence { font-size: .72rem; font-weight: 700; color: #b45309; text-transform: uppercase; letter-spacing: .04em; margin: 0 0 .6rem; }
.co-reseller .co-inputs { margin-bottom: .8rem; }
.co-needs-cost { font-size: .82rem; color: #6b6760; font-style: italic; }

/* ── Disclaimers ── */
.co-disclaimer { role: note; background: #fef9c3; border: 1px solid #fde047; border-left: 4px solid #d97706; border-radius: 8px; padding: .7rem .9rem; margin: 1rem 0; font-size: .8rem; line-height: 1.55; color: #78350f; }
.co-disclaimer-full { margin-top: 1.5rem; }
.co-disclaimer-full h3 { margin: 0 0 .5rem; font-size: .9rem; color: #92400e; }
.co-disclaimer-full p { margin: 0 0 .55rem; }
.co-disclaimer-full p:last-child { margin-bottom: 0; }

/* ── Amortization table ── */
.co-table-head { display: flex; justify-content: space-between; align-items: center; margin: 1.1rem 0 .5rem; gap: .5rem; flex-wrap: wrap; }
.co-table-head h3 { margin: 0; font-size: .95rem; }
.co-table-actions button { font: inherit; font-size: .8rem; padding: .35rem .7rem; border: 1px solid #d6d3cd; border-radius: 8px; background: #fff; cursor: pointer; margin-left: .4rem; }
.co-table-actions button:hover { background: #f3f1ec; }
.co-table-scroll { max-height: 420px; overflow: auto; border: 1px solid #ebebeb; border-radius: 10px; }
.co-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.co-table thead th { position: sticky; top: 0; background: #1f2937; color: #f8fafc; padding: .5rem .6rem; text-align: right; font-weight: 600; white-space: nowrap; }
.co-table tbody td { padding: .4rem .6rem; border-top: 1px solid #f0eee9; text-align: right; }
.co-table tbody tr:nth-child(even) { background: #faf9f6; }
.co-table .num { font-variant-numeric: tabular-nums; }

@media (max-width: 560px) {
    .co-inputs { grid-template-columns: 1fr; }
}