/* ============================================================
   Busca FDS — v2
   Mudança em relação à v1: controle explícito de largura das
   colunas da tabela (table-layout: fixed). Na v1 o algoritmo
   "auto" dimensionava as colunas pelo conteúdo, e os nomes
   químicos concatenados da 1ª coluna empurravam as demais
   para fora do container. Nenhuma alteração de HTML.
   ============================================================ */

.busca-produtos--intro {
    padding-top: 40px;
    padding-bottom: 40px;
}


.busca-produtos--intro::before,
.busca-produtos--intro::after {
    content: none !important;
    background: none !important;
    display: none !important;
}

.busca-produtos::after {
    content: none !important;
    background: none !important;
    display: none !important;
}

.fds-intro__text {
    font-size: 18px;
    font-weight: 100;
    line-height: 1.5;
    color: #6A7F89;
    margin: 0 0 16px;
}

.fds-intro__text:last-child {
    margin-bottom: 0;
}


.fds-grid {
    margin-top: 32px;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.fds-grid__table {
    /* fixed = as larguras abaixo mandam, o conteúdo não manda */
    table-layout: fixed;
    width: 100%;
    /* soma das colunas fixas (780px) + ~220px mínimos p/ a 1ª coluna */
    min-width: 1000px;
    border-collapse: collapse;
    font-size: 14px;
    color: #6A7F89;
}

/* ------------------------------------------------------------
   Larguras das colunas
   Sob table-layout: fixed, quem define a grade é a PRIMEIRA
   linha da tabela — por isso as regras vão no thead th.
   Colunas 2..7 têm largura fixa; a coluna 1 fica sem width e
   absorve todo o espaço restante (≥220px no mínimo, ~370px
   num container de 1150px).
   Bônus: no mobile o thead é display:none, então estas regras
   simplesmente não interferem no layout de cards.
   ------------------------------------------------------------ */
.fds-grid__table thead th:nth-child(2) { width: 170px; } /* Nome comercial */
.fds-grid__table thead th:nth-child(3) { width: 120px; } /* Número ONU */
.fds-grid__table thead th:nth-child(4) { width: 120px; } /* Número CAS */
.fds-grid__table thead th:nth-child(5) { width: 130px; } /* Fabricante */
.fds-grid__table thead th:nth-child(6) { width: 110px; } /* Empresa */
.fds-grid__table thead th:nth-child(7) { width: 130px; } /* Download */

.fds-grid__table thead th {
    text-align: left;
    font-weight: 600;
    color: #6A7F89;
    padding: 14px 16px;
    border-bottom: 1px solid #6A7F89;
    background: transparent;
    /* nowrap removido: com coluna de largura fixa, um cabeçalho
       que não quebra vaza da célula em telas estreitas */
    white-space: normal;
    overflow-wrap: break-word;
}

.fds-grid__table tbody td {
    padding: 18px 16px;
    border-bottom: 1px solid #e6e6e6;
    color: #6A7F89;
    vertical-align: middle;
    /* quebra tokens longos sem espaço, ex.:
       "3-Chloropropyltrimethoxysilane" ou listas com ";" */
    overflow-wrap: break-word;
    word-break: break-word;
}

.fds-grid__table tbody tr:hover td {
    background: #f5f7f8;
}

.fds-grid__col-download {
    text-align: right;
    white-space: nowrap;
}

.fds-grid__download {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #6A7F89;
    font-weight: 600;
    text-decoration: none;
    transition: color .15s ease;
}

.fds-grid__download:hover,
.fds-grid__download:focus {
    color: #005CA9;
    text-decoration: none;
}

.fds-grid__download-icon {
    display: inline-block;
    width: 16px;
    height: 21px;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .fds-grid { overflow-x: visible; }
    .fds-grid__table { min-width: 0; }
    .fds-grid__table thead { display: none; }

    .fds-grid__table,
    .fds-grid__table tbody {
        display: block;
        width: 100%;
    }

    .fds-grid__table tbody tr {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
        row-gap: 18px;
        padding: 24px 0;
        border-bottom: 1px solid #e6e6e6;
    }

    .fds-grid__table tbody tr:hover td { background: transparent; }

    .fds-grid__table tbody td {
        display: flex;
        flex-direction: column;
        gap: 4px;
        /* sem isso, um nome químico longo estoura a coluna 1fr
           do grid (min-width: auto é o default de grid item) */
        min-width: 0;
        padding: 0;
        border: 0;
        font-size: 16px;
        font-weight: 700;
        color: #6A7F89;
    }

    .fds-grid__table tbody td::before {
        content: attr(data-label);
        font-size: 13px;
        font-weight: 400;
        color: #6A7F89;
    }

    .fds-grid__table tbody td:nth-child(1),
    .fds-grid__table tbody td:nth-child(2),
    .fds-grid__table tbody td:nth-child(7) {
        grid-column: 1 / -1;
    }

    .fds-grid__col-download {
        display: block;
        text-align: left;
        margin-top: 4px;
    }

    .fds-grid__col-download::before { display: none; }
}