/* RECATOOLS — Unit Price Comparator (RT-HOM-023)
 * Light result surfaces; the --rt-result-* tokens are for navy boxes and must
 * not be used here (docs/contrast-conventions.md).
 */
.upc-form { display: flex; flex-direction: column; gap: .9rem; }

.upc-rows { display: flex; flex-direction: column; gap: .7rem; }
.upc-row {
    display: grid; grid-template-columns: 1.4fr .8fr .8fr 1fr .7fr auto;
    gap: .5rem; align-items: end;
    padding: .7rem; background: #fafaf9; border: 1px solid #ebebeb; border-radius: 10px;
}
.upc-cell { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.upc-cell label { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #6b6760; }
.upc-cell input, .upc-cell select {
    width: 100%; min-width: 0; padding: .5rem .6rem; font-size: .92rem; font-family: inherit;
    color: #1a1814; background: #fff; border: 1px solid #ebebeb; border-radius: 8px;
}
.upc-cell input:focus-visible, .upc-cell select:focus-visible { outline: 2px solid #4338ca; outline-offset: 1px; }
.upc-remove {
    padding: .5rem .6rem; font-size: .8rem; font-family: inherit; color: #6b6760;
    background: #fff; border: 1px solid #ebebeb; border-radius: 8px; cursor: pointer;
}
.upc-remove:hover:not(:disabled) { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
.upc-remove:disabled { opacity: .35; cursor: not-allowed; }

.upc-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.upc-add {
    padding: .55rem .9rem; font-size: .85rem; font-weight: 600; font-family: inherit;
    color: #1a1814; background: #fff; border: 1px solid #ebebeb; border-radius: 999px; cursor: pointer;
}
.upc-add:hover:not(:disabled) { border-color: #c7d2fe; background: #eef2ff; }
.upc-add:disabled { opacity: .4; cursor: not-allowed; }
.upc-compare {
    padding: .7rem 1.2rem; font-size: .95rem; font-weight: 700; font-family: inherit;
    color: #fff; background: #e8622a; border: 0; border-radius: 999px; cursor: pointer;
}
.upc-compare:hover { background: #d4551f; }
.upc-compare:focus-visible { outline: 2px solid #1a1814; outline-offset: 2px; }

.upc-error {
    padding: .7rem .9rem; font-size: .82rem; line-height: 1.6; color: #7f1d1d;
    background: #fef2f2; border: 1px solid #fecaca; border-left: 3px solid #dc2626; border-radius: 0 8px 8px 0;
}

#upc-results { display: flex; flex-direction: column; gap: .8rem; }

.upc-summary { padding: .9rem 1.1rem; font-size: 1rem; font-weight: 700; font-family: 'IBM Plex Serif', serif; color: #312e81; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 12px; text-align: center; }

/* The refusal. Amber, not grey — it is the answer, not an aside. */
.upc-refusal {
    padding: .85rem 1rem; font-size: .82rem; line-height: 1.65; color: #78350f;
    background: #fef9c3; border: 1px solid #fde047; border-left: 4px solid #d97706; border-radius: 0 8px 8px 0;
}

.upc-table-wrap { overflow-x: auto; }
.upc-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.upc-table th, .upc-table td { padding: .55rem .7rem; border-bottom: 1px solid #ebebeb; text-align: left; }
.upc-table thead th { font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; color: #6b6760; background: #fafaf9; }
.upc-table .upc-num { text-align: right; font-variant-numeric: tabular-nums; }
.upc-table tr.is-best { background: #f0fdf4; }
.upc-table tr.is-best td { font-weight: 700; color: #14532d; }
.upc-table tr.is-invalid td { color: #92400e; background: #fffbeb; font-style: italic; }

@media (max-width: 720px) {
    .upc-row { grid-template-columns: 1fr 1fr; }
    .upc-cell--label { grid-column: 1 / -1; }
    .upc-remove { grid-column: 1 / -1; }
}