
.osc-sessions-page {
    max-width: 1480px;
    margin: 0 auto;
    padding: 28px 24px 64px;
}


.osc-sessions-back {
    margin-bottom: 24px;
}

.osc-sessions-back a {
    font-weight: 600;
    text-decoration: none;
}


.osc-sessions-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 28px;
}


.osc-sessions-heading h1 {
    margin: 0 0 6px;
    color: #123f75;
    font-size: clamp(2rem, 4vw, 3rem);
}


.osc-sessions-heading p {
    margin: 0;
    opacity: .68;
}


.osc-sessions-table {
    background: #fff;
    border: 1px solid #e1e7ef;
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 6px 25px
        rgba(20, 50, 90, 0.06);
}


.osc-sessions-row {
    display: grid;

    grid-template-columns:
        minmax(260px, 1.55fr)
        minmax(210px, 1.15fr)
        minmax(190px, 1fr)
        minmax(130px, .65fr)
        minmax(155px, .75fr);

    gap: 22px;
    align-items: center;

    padding: 22px 24px;

    border-bottom:
        1px solid #e7ecf2;
}


.osc-sessions-row:last-child {
    border-bottom: 0;
}


.osc-sessions-table-header {
    background: #f6f8fb;

    padding-top: 16px;
    padding-bottom: 16px;

    color: #42536a;

    font-size: .77rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}


.osc-session-course {
    display: flex;
    gap: 16px;
    align-items: center;
    min-width: 0;
}


.osc-session-course-image {
    display: block;
    flex: 0 0 96px;
}


.osc-session-course-image img {
    width: 96px;
    height: 72px;
    object-fit: cover;
    border-radius: 9px;
}


.osc-session-course-title {
    display: block;
    color: #064f99;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}


.osc-session-course-title:hover {
    text-decoration: none;
    color: #123f75;
}


.osc-session-category,
.osc-session-code {
    display: block;
    margin-top: 5px;
    color: #748398;
    font-size: .78rem;
}


.osc-session-code {
    font-size: .72rem;
}


.osc-session-schedule strong,
.osc-session-schedule span {
    display: block;
}


.osc-session-schedule span {
    margin-top: 5px;
    color: #69788b;
}


.osc-session-course-info > div {
    margin-bottom: 6px;
}


.osc-session-course-info > div:last-child {
    margin-bottom: 0;
}


.osc-session-course-info span {
    display: block;
    color: #748398;
    font-size: .72rem;
}


.osc-session-course-info strong {
    display: block;
    font-size: .88rem;
}


.osc-session-price {
    white-space: nowrap;
}


.osc-session-page-button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 145px;
    min-height: 42px;

    padding: 9px 18px;

    border-radius: 999px;

    background: #123f75;
    color: #fff;

    font-weight: 600;
    text-decoration: none;
    text-align: center;
}


.osc-session-page-button:hover {
    color: #fff;
    text-decoration: none;
}


.osc-session-page-button.is-disabled {
    background: #d4dee9;
    color: #617087;
    cursor: default;
}


@media (max-width: 1100px) {

    .osc-sessions-row {
        grid-template-columns:
            minmax(250px, 1.4fr)
            minmax(190px, 1fr)
            minmax(120px, .65fr)
            minmax(150px, .75fr);
    }

    .osc-sessions-table-header > div:nth-child(3),
    .osc-session-course-info {
        display: none;
    }
}


@media (max-width: 767.98px) {

    .osc-sessions-page {
        padding:
            20px 14px 44px;
    }

    .osc-sessions-table {
        background: transparent;
        border: 0;
        box-shadow: none;
        overflow: visible;
    }

    .osc-sessions-table-header {
        display: none;
    }

    .osc-sessions-row {
        display: block;

        background: #fff;
        border: 1px solid #e1e7ef;
        border-radius: 14px;

        padding: 18px;
        margin-bottom: 16px;
    }

    .osc-session-course,
    .osc-session-schedule,
    .osc-session-course-info,
    .osc-session-price,
    .osc-session-action {
        margin-bottom: 18px;
    }

    .osc-session-course-info {
        display: block;
    }

    .osc-session-action {
        margin-bottom: 0;
    }

    .osc-session-page-button {
        width: 100%;
    }
}

