/* ============================================================
   Rateio Avançado — Estilos Suplementares
   Reutiliza calculator.css como base; adiciona apenas estilos
   específicos para a calculadora de rateio.
   ============================================================ */

/* --- Radio em 2 colunas --- */
.radio-group-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.radio-desc {
    display: block;
    font-size: .78rem;
    color: #8a8e9a;
    margin-top: 4px;
    font-weight: 400;
}

/* --- Tabela de resultados do rateio --- */
.rateio-result-table {
    table-layout: auto;
}

.rateio-result-table th,
.rateio-result-table td {
    text-align: center;
}

.rateio-result-table th:first-child,
.rateio-result-table td:first-child {
    text-align: left;
    width: auto;
}

.rateio-result-table td:last-child {
    width: auto;
}

/* --- Tabela comparativa --- */
.rateio-comparison-table th {
    font-size: .78rem;
    padding: 10px 8px;
    white-space: nowrap;
}

.rateio-comparison-table td {
    font-size: .85rem;
    padding: 10px 8px;
}

/* --- Perigo / alerta em células --- */
.row-danger {
    background: rgba(239, 71, 112, 0.08) !important;
}

.cell-danger {
    color: #EF4770 !important;
    font-weight: 600;
}

/* --- Responsividade do scroll horizontal --- */
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
}

/* --- Responsivo --- */
@media (max-width: 640px) {
    .radio-group-2col {
        grid-template-columns: 1fr;
    }

    .rateio-comparison-table {
        font-size: .75rem;
    }

    .rateio-comparison-table th,
    .rateio-comparison-table td {
        padding: 8px 6px;
    }
}