/* Display values in the same square, lightly outlined style as Admin. */
.route-comparison-wrap{container-type:inline-size}
.route-comparison-table th,.route-comparison-table td{vertical-align:middle;padding:9px 3px!important}
.route-comparison-table th{font-size:14px!important;line-height:1.4}
.route-comparison-table td{font-size:15px!important;line-height:1.4}
.route-comparison-table thead th{background:#edf4fa}
.route-comparison-table .route-value,.route-comparison-table .route-table-link{display:block;width:100%;min-width:0;border:1px solid #b8cbdc;background:#f9fbfd;padding:7px 3px;line-height:1.4;font-size:15px;color:inherit;text-align:inherit;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.route-comparison-table .route-table-link{text-align:left;color:#16344e;font-weight:700;background:#fff}
.route-comparison-table .route-table-link:hover{background:#eaf2fa;border-color:#437aa9;text-decoration:none}
.route-comparison-table .route-table-link:focus-visible{outline:2px solid #195f9f;outline-offset:1px}
.route-comparison-table .route-edit-button{width:100%;font-size:14px;padding:7px 2px;line-height:1.4;background:#fff}
.route-comparison-table .selected-comparison-row .route-value{background:#edf4fa;border-color:#98b8d2}
.route-comparison-table td:nth-child(8) .route-value,.route-comparison-table td:nth-child(9) .route-value{text-align:center}
.route-comparison-table .route-row-number{font-size:14px!important}
@container(min-width:1000px){
 .route-comparison-table td,.route-comparison-table .route-value,.route-comparison-table .route-table-link{font-size:16px!important}
 .route-comparison-table th{font-size:15px!important}
}
@container(max-width:800px){
 .route-comparison-table th,.route-comparison-table td{padding:8px 2px!important}
 .route-comparison-table .route-value,.route-comparison-table .route-table-link{font-size:14px;padding:7px 2px}
 .route-comparison-table .route-edit-button{font-size:13px}
}

.route-comparison-table thead th:last-child{padding-right:12px!important}

.route-comparison-table .selected-comparison-row{background:#b5cee5}
.route-comparison-table .selected-comparison-row>td{background:transparent}

/* Larger type for the contribution chart and its supporting labels. */
.compare-head h3{font-size:20px;line-height:1.35}
.compare-head .sub{font-size:17px!important}
.compare-head .sort-wrap,.compare-head .sort-wrap label,.compare-head .sort-wrap select{font-size:16px}
#routes .route-name{font-size:20px;line-height:1.35;overflow-wrap:anywhere}
#routes .route-name small{font-size:14px;line-height:1.45}
#routes .bar-label{font-size:14px;line-height:1.4;flex-wrap:wrap;gap:4px 10px}
#routes .bar-label strong{font-size:17px;white-space:nowrap}
#routes .metric{font-size:21px}
#routes .metric small{font-size:14px;line-height:1.4}
#routes .badge{font-size:14px;line-height:1.4}
@media(max-width:650px){.compare-head h3{max-width:210px}}

/* Keep city pairs compact without forcing the table wider than its panel. */
.route-comparison-table{min-width:0!important}
.route-comparison-table .route-table-link{white-space:nowrap;overflow-wrap:normal;padding-left:2px;padding-right:2px}

.route-comparison-table .route-table-link{font-size:14px!important}
@container(max-width:800px){.route-comparison-table .route-table-link{font-size:13px!important}}

.route-comparison-table thead th{font-size:12px!important;font-weight:700}

/* Mobile route cards reuse the table's values and delegated route actions. */
@media screen and (max-width:767.98px){
 .route-comparison-wrap{overflow:visible}
 .route-comparison-table{display:block;width:100%;border:0}
 .route-comparison-table colgroup{display:none}
 .route-comparison-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .route-comparison-table tbody{display:grid;gap:12px;width:100%}
 .route-comparison-table tbody tr{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 8px;width:100%;padding:12px;border:1px solid #b8cbdc;border-left:4px solid #b8cbdc;background:#fff}
 .route-comparison-table tbody tr.test-comparison-row{background:#f0fbfb;border-color:#008a94}
 .route-comparison-table tbody tr.selected-comparison-row{background:#b5cee5;border-left-color:#195f9f}
 .route-comparison-table tbody td{display:flex;flex-direction:column;min-width:0;width:auto;padding:0!important;border:0;background:transparent;text-align:left!important;white-space:normal}
 .route-comparison-table tbody .route-row-number{position:absolute;top:23px;left:12px;font-size:12px!important}
 .route-comparison-table tbody td:nth-child(2){grid-column:1/-1;padding-left:22px!important}
 .route-comparison-table tbody td:nth-child(3){grid-column:span 2}
 .route-comparison-table td[data-label]::before{content:attr(data-label);display:block;min-height:2.5em;margin-bottom:4px;color:#536c80;font-size:12px;line-height:1.25;font-weight:600}
 .route-comparison-table .route-value{flex:1;display:flex;align-items:center;justify-content:flex-start;min-height:36px;padding:7px 5px;font-size:14px!important;line-height:1.3;text-align:left!important;white-space:normal;overflow-wrap:anywhere}
 .route-comparison-table .route-table-link{min-height:44px;padding:8px 6px;font-size:16px!important;text-align:left}
 .route-comparison-table tbody td:last-child,.route-comparison-table tbody td[colspan]{grid-column:1/-1}
 .route-comparison-table .route-edit-button{min-height:44px;padding:9px;font-size:14px}
 .route-comparison-table .test-badge{align-self:flex-start;margin-left:0}
}
