/* Reuse the exact fleet shortcode artwork for booking capacity. */
:root {
    --tm24-icon-fleet-passengers: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 aria-hidden=%22true%22 focusable=%22false%22 %3E %3Ccircle cx=%2212%22 cy=%227%22 r=%222.8%22%3E%3C/circle%3E %3Cpath d=%22M6.8 20v-2.2A5.2 5.2 0 0 1 12 12.6a5.2 5.2 0 0 1 5.2 5.2V20%22%3E%3C/path%3E %3Cpath d=%22M5.6 13.2A3.2 3.2 0 0 0 3 16.3V18%22%3E%3C/path%3E %3Cpath d=%22M18.4 13.2a3.2 3.2 0 0 1 2.6 3.1V18%22%3E%3C/path%3E %3Ccircle cx=%224.9%22 cy=%229.3%22 r=%221.7%22%3E%3C/circle%3E %3Ccircle cx=%2219.1%22 cy=%229.3%22 r=%221.7%22%3E%3C/circle%3E %3C/svg%3E");
    --tm24-icon-fleet-bags: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 aria-hidden=%22true%22 focusable=%22false%22 %3E %3Crect x=%226%22 y=%227%22 width=%2212%22 height=%2213.5%22 rx=%222.1%22%3E%3C/rect%3E %3Cpath d=%22M9.2 7V5.3A2.3 2.3 0 0 1 11.5 3h1A2.3 2.3 0 0 1 14.8 5.3V7%22%3E%3C/path%3E %3Cpath d=%22M6 11.2h12%22%3E%3C/path%3E %3Cpath d=%22M9.2 11.2v5.5%22%3E%3C/path%3E %3Cpath d=%22M14.8 11.2v5.5%22%3E%3C/path%3E %3Ccircle cx=%228.5%22 cy=%2221%22 r=%22.8%22 fill=%22black%22 stroke=%22none%22%3E%3C/circle%3E %3Ccircle cx=%2215.5%22 cy=%2221%22 r=%22.8%22 fill=%22black%22 stroke=%22none%22%3E%3C/circle%3E %3C/svg%3E");
}
.vehicle-section ul li.vehicle-passenger-limit::before {
    -webkit-mask-image: var(--tm24-icon-fleet-passengers);
    mask-image: var(--tm24-icon-fleet-passengers);
}
.vehicle-section ul li.vehicle-bag-limit::before {
    -webkit-mask-image: var(--tm24-icon-fleet-bags);
    mask-image: var(--tm24-icon-fleet-bags);
}

/* Slightly larger capacity artwork, with equal visual spacing to the counts. */
.vehicle-section ul li:is(.vehicle-passenger-limit, .vehicle-bag-limit)::before {
    width: 20px;
    height: 20px;
    font-size: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.vehicle-section ul li.vehicle-bag-limit::before {
    left: 3px;
}
.vehicle-section ul li.vehicle-passenger-limit {
    padding-left: 26px;
}

/* Lower the counts optically while keeping the SVGs in place on all screens. */
.vehicle-section ul li:is(.vehicle-passenger-limit, .vehicle-bag-limit) {
    top: 2px;
}
.vehicle-section ul li:is(.vehicle-passenger-limit, .vehicle-bag-limit)::before {
    transform: translateY(calc(-50% - 2px));
}
