﻿.component-seat-availability-results .column--departure {
    width: 24%;
    padding-left: 3%;
}

.component-seat-availability-results {
    margin-bottom: 50px;
}

.component-seat-availability-results .cap {
    transition: max-height 0.5s ease-in-out;
    overflow: hidden;
}

.component-seat-availability-results .cap.show {
    max-height: 100px;
}

.component-seat-availability-results .cap.hide {
    max-height: 0;
}

.component-seat-availability-results .seat-availability-titles {
    text-align: center;
}

.component-seat-availability-results .seat-availability-titles h4 {
    margin-bottom: 1.5em;
}

.component-seat-availability-results .seat-availability-no-results {
    padding: 30px 20px;
}

.component-seat-availability-results .seat-availability-loading-bars {
    text-align: center;
    padding-top: 300px;
}

.results-table {
    overflow: hidden;
    border-radius: 8px !important;
    border: 1px #061B2B solid;
}
.live-results .cap {
    background-color: rgba(6, 27, 43, 0.5);
    border: 1px solid #061B2B;
    text-align: center;
    font-weight: bold;
    line-height: 49px;
    cursor: pointer;
}
.live-results .cap--top {
    border-bottom: none;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.live-results .cap--bottom {
    border-top: none;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
.results-table .cap {
    border: 0px !important;
    border-radius: 0px !important;
}
.live-results .cap .switch-page {
    color: white;
    font-size: 18px;
    font-weight: 500;
}

.live-results .cap .icon-left_arrow {
    transform: rotate(90deg);
    font-size: 14px;
    margin-left: 20px;
    padding-right: 4px;
}

.live-results .cap .icon-right_arrow {
    transform: rotate(90deg);
    font-size: 14px;
    margin-left: 20px;
    padding-right: 4px;
}

.component-seat-availability-results .results-table {
    min-height: 680px;
    background-color: #F4F8FA;
    transition: min-height 1s ease-in-out;
}

.component-seat-availability-results .results-table.results-loaded {
    min-height: 0;
    border: 1px #000 solid;
}

.component-seat-availability-results .results-table .body .journey {
    cursor: default;
}

.component-seat-availability-results .results-table .body .journey .column p.column-text,
.component-seat-availability-results .results-table .body .journey .column #page .column-text.expandable-panel,
#page .component-seat-availability-results .results-table .body .journey .column .column-text.expandable-panel,
.component-seat-availability-results .results-table .body .journey .column .column-text.expandable-panel-link {
    line-height: 54px;
    font-weight: 400;
}

.component-seat-availability-results .results-table .body .journey .column p.column-text span,
.component-seat-availability-results .results-table .body .journey .column #page .column-text.expandable-panel span,
#page .component-seat-availability-results .results-table .body .journey .column .column-text.expandable-panel span,
.component-seat-availability-results .results-table .body .journey .column .column-text.expandable-panel-link span {
    font-weight: 500;
}

.component-seat-availability-results .column--arrival {
    width: 21%;
}

.component-seat-availability-results .column--carriages {
    width: 19%;
}

.component-seat-availability-results .column--seat-capacity {
    width: 36%;
}

.component-seat-availability-results .column--seat-capacity p.column-text:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.expandable-panel-link:before {
    content: '\e902';
    font-family: icons, sans-serif;
    display: block;
    line-height: 1.5em;
    font-size: 0.85em;
    opacity: 0.4;
}

.component-seat-availability-results .column--seat-capacity p.column-text:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.expandable-panel-link:after {
    display: block;
    line-height: 1.5em;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorRed:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorRed.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorRed.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.colorRed.expandable-panel-link:before {
    color: #CC0701;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorRed:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorRed.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorRed.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.colorRed.expandable-panel-link:after {
    content: 'Standing room only';
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorAmber:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorAmber.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorAmber.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.colorAmber.expandable-panel-link:before {
    color: #FFAA00;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorAmber:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorAmber.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorAmber.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.colorAmber.expandable-panel-link:after {
    content: 'Some seats available';
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorGreen:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorGreen.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorGreen.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.colorGreen.expandable-panel-link:before {
    color: #08BA74;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorGreen:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorGreen.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorGreen.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.colorGreen.expandable-panel-link:after {
    content: 'Seats available';
}

.component-seat-availability-results .column--seat-capacity p.column-text.color:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.color.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.color.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.color.expandable-panel-link:after {
    content: 'No Service';
    position: relative;
    left: 20px;
}

.component-seat-availability-results .column--seat-capacity p.column-text.color:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.color.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.color.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.color.expandable-panel-link:before {
    visibility: hidden;
    opacity: 0;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorVeryRed:before,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorVeryRed.expandable-panel:before,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorVeryRed.expandable-panel:before,
.component-seat-availability-results .column--seat-capacity .column-text.colorVeryRed.expandable-panel-link:before {
    color: #961B1E;
    opacity: 1;
}

.component-seat-availability-results .column--seat-capacity p.column-text.colorVeryRed:after,
.component-seat-availability-results .column--seat-capacity #page .column-text.colorVeryRed.expandable-panel:after,
#page .component-seat-availability-results .column--seat-capacity .column-text.colorVeryRed.expandable-panel:after,
.component-seat-availability-results .column--seat-capacity .column-text.colorVeryRed.expandable-panel-link:after {
    content: 'Full to capacity';
}

.component-seat-availability-results .results-table.results-loaded,
.component-seat-availability-results .seat-availability-no-results,
.component-seat-availability-results .seat-availability-no-results p,
.component-seat-availability-results .seat-availability-on-weekend,
.component-seat-availability-results .seat-availability-on-weekend p {
    background: 0 none;
    border: 0;
    text-align: center;
    font-weight: 500;
    padding: 0;
    margin: 0;
}

.live-results-outer p,
.live-results-outer th,
.live-results-outer td {
    margin: 0;
    padding: 0;
    font-size: 16px;
}

.live-results-outer th p {
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 400;
    white-space: nowrap;
}

.live-results-outer thead,
.live-results-outer thead tr {
    background: #000 !important;
}

.live-results-outer th {
    width: 20% !important;
    padding: 10px 20px;
    text-align: left;
}

.live-results-outer td {
    text-align: left;
    width: 30% !important
}

.live-results-inner {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
}

.live-results-inner tbody tr {
    background: #fff;
    border-color: #ccc;
    border-left: 0;
    border-right: 0;
}

.live-results-inner tbody tr td {
    padding: 15px 20px;
}

.live-results-inner tbody tr td p {
    font-weight: 500;
    white-space: nowrap;
}

.live-results-inner table tr:first-of-type>th,
.live-results-inner table tr:first-of-type>td {
    background: transparent;
}

.live-results-inner table,
.live-results-inner .table-scroll-wrapper {
    margin-bottom: 0;
}

.live-results-inner table {
    border: 0 !important
}

.seat-capacity-via-day-outer {
    display: flex;
    align-items: flex-end;
}

.seat-capacity-via-day-outer p:after {
    font-weight: 400;
}

.seat-capacity-via-day-main {
    display: inline-block;
    padding-right: 12px;
    min-width: 155px;
}

.seat-capacity-via-day-inner {
    background: #061b2b;
    padding: 2px 8px;
    border-radius: 4px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    width: 110px;
    margin-top: 0;
}

.train-name-Arterio {
    display: flex !important;
}

.day-train-wrapper {
    display: flex;
    width: 70px;
    white-space: nowrap;
    align-items: center;
    justify-content: center;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    margin: 0 20px;
    padding: 2px 2px 1px;
}

.day-train-wrapper img {
    display: block;
    max-width: 100%;
    width: 40px;
}

.yellow-bg {
    background-color: #f5d83c;
}

table {
    max-width: 100%;
    border-collapse: collapse;
    border: 1px solid #061B2B;
    display: block;
    width: 100%;
    min-height: 0%;
    overflow-x: auto;
    margin-bottom: 24px;
}

table .icon-tick {
    display: block;
    text-align: center;
}

table>thead>tr>th,
table>thead>tr>td,
table>tbody>tr>th,
table>tbody>tr>td,
table>tfoot>tr>th,
table>tfoot>tr>td {
    line-height: 1.3;
    padding: 15px 10px 15px 20px;
    vertical-align: middle;
    min-width: 140px;
    font-size: 1.6em;
    width: 100%;
}

table>thead>tr>th {
    padding: 15px 10px;
    vertical-align: middle;
}

table tr:first-of-type>th,
table tr:first-of-type>td {
    border-top: 0;
    background: #061B2B;
    color: #fff;
    font-size: 1.8em;
}

table tbody tr {
    border: 1px solid #061B2B;
}

table .table {
    background-color: #fff;
}

@media (min-width: 48em) {
    .component-seat-availability-results .column--departure {
        width: 30%;
        padding-left: 10%;
    }

    .component-seat-availability-results .column--carriages {
        width: 25%;
    }

    .component-seat-availability-results .column--seat-capacity {
        width: 24%;
    }
}

@media (max-width: 47.9375em) {
    .component-seat-availability-results .results-table .column--button {
        width: 2%;
    }

    .component-seat-availability-results .results-table .head .column p,
    .component-seat-availability-results .results-table .head .column #page .expandable-panel,
    #page .component-seat-availability-results .results-table .head .column .expandable-panel,
    .component-seat-availability-results .results-table .head .column .expandable-panel-link {
        line-height: 18px;
        margin: 6px 0;
    }
}