/* Shared event-course cards; paid billing/payment styles stay in Register. */
@media (max-width: 700px) {
:is(#registerform, #redeemform) #panel-3,
:is(#registerform, #redeemform) #panel-3 > div.panel-body.panel-profile-body,
:is(#registerform, #redeemform) #bdms-packagetable-type,
:is(#registerform, #redeemform) #bdms-packagetable,
:is(#registerform, #redeemform) #bdms-packagetable2 {
    box-sizing: border-box;
    max-width: 100%;
}
:is(#registerform, #redeemform) #panel-3 > div.panel-body.panel-profile-body {
    overflow: visible !important;
    overflow-x: visible !important;
}
:is(#registerform, #redeemform) #bdms-packagetable-type,
:is(#registerform, #redeemform) #bdms-packagetable,
:is(#registerform, #redeemform) #bdms-packagetable2 {
    display: block;
    width: 100%;
    zoom: 1;
    box-shadow: none;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody,
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr,
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr > td {
    display: block;
    width: 100%;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr {
    margin-bottom: 10px;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr > td {
    padding: 0;
    box-shadow: none;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr > td > div {
    min-height: 72px;
    height: auto;
    padding: 16px;
    justify-content: flex-start;
    text-align: left;
    white-space: normal;
    font-size: 15px;
    line-height: 1.45;
    border-radius: 12px;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr > td > div > input[type=radio] {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 0 12px 0 0;
    zoom: 1;
    transform: none;
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr.bdms-packagetable-type1:has(input:checked) > td > div {
    background-color: #f1f6ff;
    border-color: #0147a3;
    box-shadow: 0 8px 20px rgba(1, 71, 163, 0.16);
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr.bdms-packagetable-type2:has(input:checked) > td > div {
    background-color: #fff4f4;
    border-color: #b21e28;
    box-shadow: 0 8px 20px rgba(178, 30, 40, 0.14);
}
:is(#registerform, #redeemform) #bdms-packagetable-type > tbody > tr:has(input:focus-visible) > td > div,
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td:has(input:focus-visible) > div,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td:has(input:focus-visible) > div {
    outline: 3px solid rgba(1, 71, 163, 0.28);
    outline-offset: 2px;
}
:is(#registerform, #redeemform) #bdms-packagetable > thead,
:is(#registerform, #redeemform) #bdms-packagetable2 > thead {
    display: none;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr {
    display: contents;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td {
    display: block;
    position: relative;
    width: 100% !important;
    padding: 0;
    overflow: visible;
    box-shadow: none;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td:empty,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td:empty {
    display: none;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td[data-course-date^="10"],
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date^="10"] {
    order: 10;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td[data-course-date^="11"],
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date^="11"] {
    order: 11;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td[data-course-date^="12"],
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date^="12"] {
    order: 12;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td[data-course-date^="13"],
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date^="13"] {
    order: 13;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td[data-course-date]::before,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date]::before {
    content: attr(data-course-date);
    position: absolute;
    z-index: 1;
    top: 14px;
    left: 56px;
    padding: 3px 8px;
    border-radius: 999px;
    color: #0147a3;
    background-color: #e8f1ff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .04em;
    text-transform: uppercase;
    pointer-events: none;
}
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td[data-course-date]::before {
    color: #a51c25;
    background-color: #fff0f1;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td > div,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td > div {
    display: block;
    min-height: 104px;
    height: auto;
    padding: 42px 16px 16px 56px;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 14px;
    line-height: 1.45;
    border-radius: 12px;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td > div > input[type=radio],
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td > div > input[type=radio] {
    position: absolute;
    top: 50%;
    left: 16px;
    width: 24px;
    height: 24px;
    margin: 0;
    zoom: 1;
    transform: translateY(-50%);
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td:has(input:checked) > div {
    background-color: #f1f6ff;
    border-color: #0147a3;
    box-shadow: 0 8px 20px rgba(1, 71, 163, 0.16);
}
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td:has(input:checked) > div {
    background-color: #fff4f4;
    border-color: #b21e28;
    box-shadow: 0 8px 20px rgba(178, 30, 40, 0.14);
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr > td:has(input:disabled) > div,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr > td:has(input:disabled) > div {
    opacity: .46;
    cursor: not-allowed;
    box-shadow: none;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr.bdms-packagetable-row-uncheck > td,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr.bdms-packagetable-row-uncheck > td {
    order: 99;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr.bdms-packagetable-row-uncheck > td > div,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr.bdms-packagetable-row-uncheck > td > div {
    display: flex;
    min-height: 56px;
    height: auto;
    padding: 14px 16px;
    align-items: center;
}
:is(#registerform, #redeemform) #bdms-packagetable > tbody > tr.bdms-packagetable-row-uncheck > td > div > div,
:is(#registerform, #redeemform) #bdms-packagetable2 > tbody > tr.bdms-packagetable-row-uncheck > td > div > div {
    display: flex;
    width: 100%;
    margin: 0;
    align-items: center;
    transform: none;
}
:is(#registerform, #redeemform) #courseclear1,
:is(#registerform, #redeemform) #courseclear2 {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 0 12px 0 0;
    float: none;
    zoom: 1;
}
:is(#registerform, #redeemform) .coursecleartext {
    display: block;
    padding: 0 !important;
    float: none;
    text-align: left;
    white-space: normal;
    line-height: 1.45;
}
:is(#registerform, #redeemform) .courseclearboth {
    display: none;
}
#redeemform #bdms-packagetable-allclear {
    box-shadow: none;
}
#redeemform #bdms-packagetable-allclear td {
    padding: 0;
}
#redeemform #bdms-packagetable-allclear td > div {
    min-height: 56px;
    height: auto;
    padding: 14px 16px;
    text-align: left;
    white-space: normal;
    border-radius: 12px;
}
#redeemform #bdms-packagetable-allclear td > div > div {
    display: flex;
    align-items: center;
    transform: none;
}
#redeemform #bdms-packagetable-allclear #courseclear {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 0 12px 0 0;
    zoom: 1;
    transform: none;
}
#redeemform #bdms-packagetable-allclear td:has(input:focus-visible) > div {
    outline: 3px solid rgba(1, 71, 163, 0.28);
    outline-offset: 2px;
}
}
