/*
 * Formato de matrícula, fechas y notas para la tabla de rutas.
 * - Matrículas completas.
 * - Fechas Madrid compactas en dos líneas, sin cambiar la tipografía base.
 * - Notas completas, anchas y sin recorte.
 */

/* Matrícula siempre completa */
#summaryTable th.col-license-plate,
#summaryTable td.col-license-plate,
#passengerResultsTable th.col-license-plate,
#passengerResultsTable td:nth-child(3) {
    width: 138px;
    min-width: 138px;
    max-width: 138px;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none;
}

#summaryTable td.col-license-plate,
#passengerResultsTable td:nth-child(3) {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

/* =========================================================
   Fechas Madrid: dos líneas y columna más estrecha
   ========================================================= */
#summaryTable th:nth-child(18),
#summaryTable th:nth-child(19),
#summaryTable th:nth-child(20),
#summaryTable th:nth-child(21),
.summary-sticky-header th:nth-child(18),
.summary-sticky-header th:nth-child(19),
.summary-sticky-header th:nth-child(20),
.summary-sticky-header th:nth-child(21),
#summaryTable td.date-madrid {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
}

#summaryTable td.date-madrid {
    white-space: normal !important;
    text-align: left;
    vertical-align: top;
    font-size: 12px !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 1.18;
    color: inherit !important;
    font-variant-numeric: tabular-nums;
}

.date-madrid__date,
.date-madrid__time {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
    font: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    font-style: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
    letter-spacing: normal !important;
}

/* =========================================================
   Notas: texto completo, sin line-clamp y columna más ancha
   ========================================================= */
#summaryTable th:nth-child(22),
#summaryTable td:nth-child(22),
.summary-sticky-header th:nth-child(22) {
    width: 520px !important;
    min-width: 520px !important;
    max-width: 520px !important;
}

#summaryTable td:nth-child(22),
#summaryTable td.notes-cell {
    height: auto !important;
    max-height: none !important;
    vertical-align: top;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    line-height: 1.28;
    color: inherit;
}

#summaryTable td:nth-child(22) *,
.notes-preview {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
    line-clamp: unset !important;
    color: inherit !important;
    cursor: default !important;
}

/* Los selectores siempre por encima de la cabecera flotante */
.route-detail-page .toolbar.sticky-panel {
    z-index: 3200 !important;
    overflow: visible !important;
}

.route-detail-page .filters {
    position: relative;
    z-index: 3210;
    overflow: visible !important;
}

.route-detail-page .multi-dropdown {
    z-index: 3220;
}

.route-detail-page .multi-dropdown.open {
    z-index: 5200;
}

.route-detail-page .multi-dropdown-menu {
    z-index: 5300 !important;
}

.summary-sticky-header {
    z-index: 2100 !important;
}

@media (max-width: 760px) {
    #summaryTable th.col-license-plate,
    #summaryTable td.col-license-plate,
    #passengerResultsTable th.col-license-plate,
    #passengerResultsTable td:nth-child(3) {
        width: 130px;
        min-width: 130px;
        max-width: 130px;
    }

    #summaryTable th:nth-child(18),
    #summaryTable th:nth-child(19),
    #summaryTable th:nth-child(20),
    #summaryTable th:nth-child(21),
    .summary-sticky-header th:nth-child(18),
    .summary-sticky-header th:nth-child(19),
    .summary-sticky-header th:nth-child(20),
    .summary-sticky-header th:nth-child(21),
    #summaryTable td.date-madrid {
        width: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
    }

    #summaryTable th:nth-child(22),
    #summaryTable td:nth-child(22),
    .summary-sticky-header th:nth-child(22) {
        width: 420px !important;
        min-width: 420px !important;
        max-width: 420px !important;
    }
}

/* =========================================================
   Proporción Código / Nombre / Matrícula
   - Código: conserva el formato original de la tabla.
   - Nombre: mayor presencia visual y ancho suficiente.
   - Matrícula: compacta, completa y en una sola línea.
   ========================================================= */

/* Nombre de la ruta */
.route-detail-page #summaryTable thead th:nth-child(2),
.route-detail-page #summaryTable tbody td:nth-child(2),
.summary-sticky-header th:nth-child(2) {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
}

.route-detail-page #summaryTable tbody td:nth-child(2) {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.24;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}

/* Matrícula calculada para valores como 1854-4176MKR */
#summaryTable th.col-license-plate,
#summaryTable td.col-license-plate,
#passengerResultsTable th.col-license-plate,
#passengerResultsTable td:nth-child(3) {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
}

#summaryTable td.col-license-plate,
#passengerResultsTable td:nth-child(3) {
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0;
}

@media (max-width: 760px) {
    .route-detail-page #summaryTable thead th:nth-child(2),
    .route-detail-page #summaryTable tbody td:nth-child(2),
    .summary-sticky-header th:nth-child(2) {
        width: 164px !important;
        min-width: 164px !important;
        max-width: 164px !important;
    }

    #summaryTable th.col-license-plate,
    #summaryTable td.col-license-plate,
    #passengerResultsTable th.col-license-plate,
    #passengerResultsTable td:nth-child(3) {
        width: 116px !important;
        min-width: 116px !important;
        max-width: 116px !important;
    }
}

/* Código de ruta un poco más ancho */
.route-detail-page #summaryTable thead th:nth-child(1),
.route-detail-page #summaryTable tbody td:nth-child(1),
.summary-sticky-header th:nth-child(1) {
    width: 95px !important;
    min-width: 95px !important;
    max-width: 95px !important;
}

/* Origen un poco más ancho */
.route-detail-page #summaryTable thead th:nth-child(6),
.route-detail-page #summaryTable tbody td:nth-child(6),
.summary-sticky-header th:nth-child(6) {
    width: 115px !important;
    min-width: 115px !important;
    max-width: 115px !important;
}

/* Método de recuperación un poco más ancho */
.route-detail-page #summaryTable thead th:nth-child(16),
.route-detail-page #summaryTable tbody td:nth-child(16),
.summary-sticky-header th:nth-child(6) {
    width: 115px !important;
    min-width: 115px !important;
    max-width: 115px !important;
}

/* Cierre visual compartido: mantener la misma escala que dashboard, mapa y configurador. */
.route-detail-page #summaryTable,
.route-detail-page #passengerResultsTable,
.route-detail-page .summary-sticky-header table,
.route-detail-page .modal-table {
    font-family: var(--route-font) !important;
    font-size: 12px !important;
    line-height: 1.32 !important;
}

.route-detail-page #summaryTable th,
.route-detail-page #passengerResultsTable th,
.route-detail-page .summary-sticky-header th,
.route-detail-page .modal-table th {
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.22 !important;
}

.route-detail-page #summaryTable td,
.route-detail-page #summaryTable td:nth-child(2),
.route-detail-page #summaryTable td.col-license-plate,
.route-detail-page #passengerResultsTable td,
.route-detail-page #passengerResultsTable td:nth-child(3),
.route-detail-page .modal-table td {
    font-size: 12px !important;
    line-height: 1.32 !important;
}

/* Notas: recorte inicial y expansión de fila al clicar la celda. */
.route-detail-page #summaryTable td.notes-cell {
    cursor: pointer !important;
    vertical-align: top;
}

.route-detail-page #summaryTable td.notes-cell .notes-cell__content {
    display: -webkit-box !important;
    max-height: calc(1.32em * 2) !important;
    overflow: hidden !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    cursor: pointer !important;
}

.route-detail-page #summaryTable tr.is-notes-expanded td {
    vertical-align: top;
}

.route-detail-page #summaryTable td.notes-cell.is-expanded .notes-cell__content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
}

/* =========================================================
   Modo cliente: 10 columnas, ocupando el ancho real de pantalla.
   ========================================================= */
.route-detail-page.route-client-mode .summary-table-wrap {
    overflow-x: auto !important;
}

.route-detail-page.route-client-mode #summaryTable,
.route-detail-page.route-client-mode .summary-sticky-header table {
    width: 100% !important;
    min-width: 1080px !important;
    table-layout: fixed !important;
}

.route-detail-page.route-client-mode #summaryTable th,
.route-detail-page.route-client-mode #summaryTable td,
.route-detail-page.route-client-mode .summary-sticky-header th {
    padding-left: 10px;
    padding-right: 10px;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(1),
.route-detail-page.route-client-mode #summaryTable td:nth-child(1),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(1) {
    width: 8% !important;
    min-width: 96px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(2),
.route-detail-page.route-client-mode #summaryTable td:nth-child(2),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(2) {
    width: 27% !important;
    min-width: 250px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable th.col-license-plate,
.route-detail-page.route-client-mode #summaryTable td.col-license-plate,
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(3) {
    width: 10% !important;
    min-width: 124px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(4),
.route-detail-page.route-client-mode #summaryTable td:nth-child(4),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(4) {
    width: 5% !important;
    min-width: 62px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(5),
.route-detail-page.route-client-mode #summaryTable td:nth-child(5),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(5) {
    width: 10% !important;
    min-width: 118px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(8),
.route-detail-page.route-client-mode #summaryTable td:nth-child(8),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(8) {
    width: 8% !important;
    min-width: 90px !important;
    max-width: none !important;
    text-align: center;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(6),
.route-detail-page.route-client-mode #summaryTable td:nth-child(6),
.route-detail-page.route-client-mode #summaryTable th:nth-child(7),
.route-detail-page.route-client-mode #summaryTable td:nth-child(7),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(6),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(7) {
    width: 7% !important;
    min-width: 82px !important;
    max-width: none !important;
    text-align: center;
}

.route-detail-page.route-client-mode #summaryTable th:nth-child(9),
.route-detail-page.route-client-mode #summaryTable td:nth-child(9),
.route-detail-page.route-client-mode #summaryTable th:nth-child(10),
.route-detail-page.route-client-mode #summaryTable td:nth-child(10),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(9),
.route-detail-page.route-client-mode .summary-sticky-header th:nth-child(10),
.route-detail-page.route-client-mode #summaryTable td.date-madrid {
    width: 9% !important;
    min-width: 112px !important;
    max-width: none !important;
}

.route-detail-page.route-client-mode #summaryTable tbody td:nth-child(2) {
    font-size: 12.5px !important;
}

.route-detail-page.route-client-mode #summaryTable tbody td:nth-child(5) .badge {
    max-width: 100% !important;
}

.route-detail-page.route-client-mode #passengerResultsTable {
    width: 100% !important;
    min-width: 980px !important;
    table-layout: fixed !important;
}

@media (min-width: 1500px) {
    .route-detail-page.route-client-mode #summaryTable,
    .route-detail-page.route-client-mode .summary-sticky-header table {
        min-width: 100% !important;
    }
}

@media (max-width: 760px) {
    .route-detail-page.route-client-mode #summaryTable,
    .route-detail-page.route-client-mode .summary-sticky-header table {
        min-width: 980px !important;
    }
}
