/* ============================================================
   Transfer Compare — airport transport comparison table
   ============================================================ */

.huc-compare {
    --huc-compare-accent: var(--huc-accent-clr);
    --huc-compare-border: color-mix(in srgb, var(--huc-darkGray-clr) 8%, transparent);
    --huc-compare-head-bg: color-mix(in srgb, var(--huc-darkGray-clr) 4%, var(--huc-white-clr));
    --huc-compare-recommended-bg: rgba(var(--huc-accent-rgb), 0.08);
}

/* ---- Table shell ---- */
.huc-compare-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--huc-compare-border);
    border-radius: 16px;
    -webkit-overflow-scrolling: touch;
}

.huc-compare-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
}

.huc-compare-table thead th {
    padding: 1rem 1.25rem;
    background-color: var(--huc-compare-head-bg);
    border-bottom: 1px solid var(--huc-compare-border);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--huc-gray-clr);
    text-align: left;
    white-space: nowrap;
}

.huc-compare-table tbody td {
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--huc-compare-border);
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--huc-gray-clr);
    vertical-align: top;
}

.huc-compare-table tbody tr:last-child td {
    border-bottom: none;
}

.huc-compare-table__mode {
    font-weight: 700;
    color: var(--huc-darkGray-clr);
}

/* ---- Recommended row ---- */
.huc-compare-table__row--recommended td {
    background-color: var(--huc-compare-recommended-bg);
}

.huc-compare-table__badge {
    display: inline-block;
    margin-top: 0.375rem;
    padding: 0.2rem 0.625rem;
    border-radius: 999px;
    background-color: var(--huc-compare-accent);
    color: var(--huc-white-clr);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* ---- Footnote ---- */
.huc-compare__footnote {
    margin: 1rem 0 0;
    font-size: 0.8125rem;
    color: var(--huc-gray-clr);
    text-align: center;
}

/* ---- Responsive ---- */
@media (max-width: 575.98px) {
    .huc-compare-table thead th,
    .huc-compare-table tbody td {
        padding: 0.875rem 1rem;
    }
}
