.perfListAccordionBlock,
#perfListPanel,
.perfListPanel {

    --pad1: 0.25rem;
    --pad2: 0.5rem;
    --pad3: 1rem;
    --px1: 1px;

    @media (max-width:575.98px) {
        --pad1: 1vw;
        --pad2: 2vw;
        --pad3: 3vw;
        --px1: 0.17361111111111111111111111111111vw;
        font-size: 3vw;
    }

    .sg {
        display: grid;
        grid-template-columns: subgrid;
    }

    .plListItem {

        transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
        background-color: var(--bg);
        grid-column: 1/-1;
        padding: 0;
        font-stretch: condensed;
        position: relative;

        .plListItemBody {

            grid-column: 1 / span 9;
            min-height: 4em;
            position: relative;

            &:focus-visible {
                outline-color: var(--ct-primary-300);
                outline-width: 2px;
                outline-offset: -5px;
                outline-style: solid;
                border-radius: 0.75em;
            }

            .stripe {
                background-color: transparent;
                width: 50%;
                transition: background-color 0.15s ease-in-out;
            }

            .plWeekdayCell {
                grid-column: 2 / span 2;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;

                .plWeekdayAbbr {
                    background-color: var(--accent-1);
                    color: var(--bg);
                    text-transform: uppercase;
                    font-weight: 500;
                    width: 3em;
                    text-align: center;
                    border-radius: 1em;
                    line-height: 1em;
                    padding-top: 0.1em;
                    font-size: 1.125em;
                }

                .plTodayLabel {
                    font-weight: 500;
                    line-height: 1;
                }
            }

            .plDateTagWrap {

                grid-column: 4 / span 6;
                align-content: center;
                position: relative;
                top: var(--px1);
                padding: var(--pad2);

                .plDateTimeCell {

                    grid-column: span 6;
                    align-content: center;

                    .plDate,
                    .plTime {

                        line-height: 1;
                        font-size: 1.45em;
                        white-space: nowrap;
                    }

                    .plDate {
                        text-align: left;
                        grid-column: span 4;
                        text-transform: uppercase;
                    }

                    .plTime {
                        grid-column: span 2;
                    }
                }

                .plTagCell {

                    grid-column: span 6;
                    display: flex;
                    flex-flow: row wrap;
                    row-gap: 0.1em;
                    margin-top: 0.1em;

                    .plPerfTag {
                        white-space: nowrap;
                        text-transform: uppercase;
                        line-height: 1;
                        height: fit-content;

                        &:not(&:last-child):after {
                            content: "/";
                            color: var(--accent-gray);
                            margin: 0 0.5em;
                            opacity: 0.25;
                            display: inline-block;
                        }
                    }
                }
            }

        }

        .plBuyBtn {
            grid-column: span 4;
            align-self: center;
            height: 2.5em;
            column-gap: 0;
            --buybtn-color: #fff;
            --buybtn1-bg: var(--ct-primary-500);
            --buybtn2-bg: var(--ct-primary-550);
            --ct-btn-font-size: 1em;

            &:focus-visible {
                outline-color: var(--ct-primary-300);
                outline-width: 2px;
                outline-style: solid;
                outline-offset: 2px;
            }

            .btn1 {

                grid-column: span 3;
                color: var(--buybtn-color);
                background-color: var(--buybtn1-bg);
                border-color: var(--buybtn1-bg);
                display: flex;
                flex-flow: row;
                padding: 0;
                align-items: center;
                justify-content: center;
                column-gap: 0.25em;
                padding: 0;
                font-size: 1.4em;

                .priceFrom {
                    font-weight: 400;
                    font-size: 0.66em;
                    position: relative;
                    top: 0.2em;
                }

                .price {
                    font-stretch: normal;
                    position: relative;
                    top: 0.035em;
                    max-width: 50%;
                    text-fit: shrink;
                }
            }

            .btn2 {
                color: var(--buybtn-color);
                background-color: var(--buybtn2-bg);
                border-color: var(--buybtn2-bg);
                padding: 0;
                align-content: center;
                font-size: 1.5em;
            }
        }

        .plSoldOutBtn {
            grid-column: span 4;
            align-self: center;
            align-content: center;
            font-size: 1.25em;
            height: 2em;
            padding: 0;

            --ct-btn-color: var(--soldout);
            --ct-btn-bg: transparent;
            --ct-btn-border-color: var(--soldout);
            --ct-btn-hover-color: var(--soldout);
            --ct-btn-hover-bg: transparent;
            --ct-btn-hover-border-color: var(--soldout);
            --ct-btn-active-color: var(--soldout);
            --ct-btn-active-bg: transparent;
            --ct-btn-active-border-color: var(--soldout);
        }

        .accent-1 {
            color: var(--accent-1);
        }

        .accent-2 {
            color: var(--accent-2);
        }

        .accent-3 {
            color: var(--accent-3);
        }

        .accent-time {
            color: var(--accent-time);
        }

        .accent-gray {
            color: var(--accent-gray);
        }

        .accent-orange {
            color: var(--accent-orange);
        }

        .accent-teal {
            color: var(--accent-teal);
        }

        .accent-blue {
            color: var(--accent-blue);
        }

        .accent-brick {
            color: var(--accent-brick);
        }

        .accent-red {
            color: var(--accent-red);
        }

        .accent-yellow {
            color: var(--accent-yellow);
        }

        &.isToday {
            .plListItemBody {
                .stripe {
                    background-color: var(--ct-primary-500);
                }
            }
        }

        &:has([aria-expanded=true]) {
            --bg: var(--ct-gray-950);

            &.isToday {
                .plListItemBody {
                    .stripe {
                        background-color: var(--ct-primary-300);
                    }
                }
            }
        }

    }

    .plAvailTable {

        --tableHead-bg: transparent;
        display: grid;
        grid-template-columns: auto 40%;
        gap: 0 1em;
        align-content: unset;
        margin: 1.25em 0;
        align-items: center;
        justify-content: space-between;
        justify-self: center;

        .legend {
            grid-row: 1;
            grid-column: 2;
            display: grid;
            grid-auto-rows: min-content;
            grid-template-columns: min-content min-content min-content;
            align-self: center;
            justify-self: center;
            column-gap: 0.5em;
            align-items: center;
            list-style: none;
            padding: 0;
            margin: auto 0;
            font-size: 1.25em;
            padding-bottom:0.5em;

            /***/

            .legendHead {
                grid-column: 1 / span 3;
                background-color: var(--tableHead-bg);
                margin: 0;
                padding: 0;
                text-align: center;
                font-size: 0.75em;
                font-weight: 400;
                font-stretch: condensed;
                color: currentColor;
                white-space: nowrap;
            }

            li.pcRow {
                display: grid;
                grid-template-columns: subgrid;
                grid-column: 1/-1;
                cursor: default;

                .pcIcon {
                    --wh: 1.4em;
                    font-size: 1em;
                    font-stretch: normal;
                    font-weight: 500;
                    text-transform: uppercase;
                    text-align: center;
                    justify-self: center;
                    border-radius: var(--wh);
                    align-content: center;
                    aspect-ratio: 1;
                    padding: 0;
                    padding-top: 0.05em;
                    margin: 0.15em;
                    width: var(--wh);
                    height: var(--wh);
                    min-width: var(--wh);
                    max-width: var(--wh);
                    min-height: var(--wh);
                    max-height: var(--wh);
                    line-height: var(--wh);
                    white-space: nowrap;
                    grid-column: 1;
                    column-gap: 0;

                    &.G {
                        background-color: var(--priceCode-G);
                        color: var(--priceCode-G-text);
                    }

                    &.A {
                        background-color: var(--priceCode-A);
                        color: var(--priceCode-A-text);
                    }

                    &.B {
                        background-color: var(--priceCode-B);
                        color: var(--priceCode-B-text);
                    }

                    &.C {
                        background-color: var(--priceCode-C);
                        color: var(--priceCode-C-text);
                    }

                    &.\31 {
                        background-color: var(--accordionText);
                        color: var(--accordionBg);
                    }
                }

                .price {
                    font-size: 1.125em;
                    line-height: 1;
                    font-weight: 600;
                    white-space: nowrap;
                    position: relative;
                    grid-column: 2;
                    text-align: center;
                    font-stretch: normal;
                    top: 0.1em;
                    align-content: center;
                    padding: 0;

                    i {
                        color: var(--ct-red-300);
                        position: absolute;
                        right: 0;
                        top: 0.2em;
                    }
                }

                &.pcRow-sold {
                    .price {
                        opacity: 0.4;
                    }

                    .pcIcon {
                        background-color: rgba(130, 129, 127, 0.5) !important;
                        color: unset;
                    }
                }

                .pipStrip {
                    display: grid;
                    grid-auto-columns: 1em;
                    grid-template-rows: 1em;
                    gap: 1px;
                    grid-auto-flow: column;
                    position: relative;

                    font-size: 0.9em;
                    padding: 0;
                    height: stretch;
                    align-content: center;
                    grid-column: 3;

                    .pip {
                        display: block;
                        aspect-ratio: 1;
                        background-color: var(--ct-gray-650);
                        opacity: 0.5;
                        grid-row: 1;

                        &.lPip {
                            border-bottom-left-radius: 0.25em;
                            border-top-left-radius: 0.25em;
                            grid-column: 1;
                        }

                        &.mPip {
                            grid-column: 2;
                        }

                        &.rPip {
                            border-bottom-right-radius: 0.25em;
                            border-top-right-radius: 0.25em;
                            grid-column: 3;
                        }
                    }

                    &.pipStrip-A {
                        --pipBg: var(--priceCode-A) !important;
                        --pipText: var(--priceCode-A-text) !important;
                    }

                    &.pipStrip-B {
                        --pipBg: var(--priceCode-B) !important;
                        --pipText: var(--priceCode-B-text) !important;
                    }

                    &.pipStrip-C {
                        --pipBg: var(--priceCode-C) !important;
                        --pipText: var(--priceCode-C-text) !important;
                    }

                    &.pipStrip-G {
                        --pipBg: var(--priceCode-G) !important;
                        --pipText: var(--priceCode-G-text) !important;
                    }

                    .remainderCount,
                    .remainderText {
                        grid-row: 1;
                        line-height: 100%;
                        text-align: center;
                    }

                    .remainderCount {
                        grid-column: 1;
                        color: var(--pipText);
                    }

                    .remainderText {
                        grid-column: 2 / span 2;
                        background-color: rgba(130, 129, 127, 0.5);
                        /* --ct-gray-650 */
                        font-size: 0.9em;
                        padding-top: 0.1em;
                        border-bottom-right-radius: 0.25em;
                        border-top-right-radius: 0.25em;
                    }

                    .remainderBar {
                        background-color: rgba(130, 129, 127, 0.5);
                        /* --ct-gray-650 */
                        font-size: 0.9em;
                        line-height: 1;
                        border-radius: 0.277777777777em;
                        text-align: center;
                        padding-top: 0.1em;
                        grid-row: 1;
                        grid-column: 1 / span 3;
                        z-index: 2;
                        border-left: solid 4px var(--pipBg);
                        white-space: nowrap;
                    }

                    &.pipStrip1 {
                        --pipBg: var(--ct-teal-400);

                        .pip:nth-child(1) {
                            background-color: currentColor;
                            opacity: 0.75;

                            background-color: var(--pipBg);
                            opacity: 1;
                        }
                    }

                    &.pipStrip2 {
                        --pipBg: var(--ct-teal-400);

                        .pip:nth-child(-n+2) {
                            background-color: currentColor;
                            opacity: 0.75;

                            background-color: var(--pipBg);
                            opacity: 1;
                        }
                    }

                    &.pipStrip3 {
                        --pipBg: var(--ct-teal-400);

                        .pip:nth-child(-n+3) {
                            background-color: currentColor;
                            opacity: 0.75;

                            background-color: var(--pipBg);
                            opacity: 1;

                        }
                    }

                    &.empty {
                        .pip {
                            display: none;
                        }

                        color: var(--ct-red-400);
                        white-space: nowrap;
                        font-stretch: condensed;
                        font-weight: 500;
                        text-align: center;
                        display: block;
                        line-height: 1;
                        font-size: 0.63em !important;
                        position: relative;
                        top: 0.18em;
                    }
                }

            }

            &.noMap {
                grid-column: 1 / 3;
                justify-content: center;
            }

            .soldOut {
                font-stretch: condensed;
                font-weight: bold;
                color: var(--ct-red-400);
                grid-column: 2 / span 2;
                padding: 0 0.25em;
                text-align: center;
                white-space: nowrap;
                align-content: center;
                position: relative;
                top: 0.1em;
            }
        }

        .minimap {
            grid-column: 1;
            grid-row: 1;
            width: 100%;
            padding: 0;
            align-self: end;
            transition: opacity 0.2s ease-in-out;
        }

        .svgMinimap {

            grid-column: 1;
            grid-row: 1;
            width: 100%;
            padding: 0;
            align-self: end;

            svg {
                width: 100%;
            }

            path {
                transition: fill 0.2s ease-in-out, opacity 0.2s ease-in-out;
            }

            --soldOutFill:rgba(130, 129, 127, 0.5);

            &.soldOut-G {
                --priceCode-G: var(--soldOutFill);
            }

            &.soldOut-A {
                --priceCode-A: var(--soldOutFill);
            }

            &.soldOut-B {
                --priceCode-B: var(--soldOutFill);
            }

            &.soldOut-C {
                --priceCode-C: var(--soldOutFill);
            }
        }

        --fadeOpacity:0.25;

        &:has(.pcRow:not(.pcRow-G):hover) {
            .svgMinimap {
                --priceCode-G: var(--fadeColor);
            }
        }

        &:has(.pcRow:not(.pcRow-A):hover) {
            .svgMinimap {
                --priceCode-A: var(--fadeColor);
            }
        }

        &:has(.pcRow:not(.pcRow-B):hover) {
            .svgMinimap {
                --priceCode-B: var(--fadeColor);
            }
        }

        &:has(.pcRow:not(.pcRow-C):hover) {
            .svgMinimap {
                --priceCode-C: var(--fadeColor);
            }
        }


        @media (max-width:575.98px) {
            width: 100%;
            column-gap: 4vw;
            grid-template-columns: 1fr auto;

            .legend {
                font-size: 4.5vw;
            }
        }
    }

    .plAccordion {
        grid-column: 1 / -1;
        background-color: var(--accordionBg);
        color: var(--accordionText);
        padding: 0 var(--pad3);

        .tagBody {
            font-size: 1.125rem;
            margin: 1em 0;

            a {
                color: var(--linkColor);

                &:hover {
                    color: var(--linkColorHover);

                }

                &:hover,
                &:active,
                &:focus {

                    text-decoration: underline;
                    text-decoration-thickness: 1px;
                    text-decoration-color: var(--linkColorHover);
                }
            }

            .tagTitle {
                font-weight: 400;
                text-transform: uppercase;
            }
        }

    }

}

#perfListPanel,
.perfListPanel {

    --ct-offcanvas-bg: black;
    --ct-offcanvas-border-color: var(--ct-gray-850);
    --ct-border-color: white;
    --ct-heading-color: white;
    --ct-offcanvas-width: 536px;
    --gridCols: 1.25rem 1.75rem 2rem 2.25rem 2.5rem 3rem 3rem 3rem 3rem 2.5rem 2.25rem 2rem 1.75rem 1.25rem;

    &.showing,
    &.hiding,
    &.tweening,
    &:not(.show) {
        pointer-events: none;
    }

    max-width: 90vw;
    z-index: 1100;
    width: fit-content;

    @media (max-width:575.96px) {
        width: 100%;
        max-width: 100%;
        border-left: none;
        --gridCols: 2vw 7fr 8fr 9fr 10fr 11fr 12fr 12fr 11fr 10fr 9fr 8fr 7fr 2vw;
    }

    #plpHeader {
        display: grid;
        grid-template-columns: var(--gridCols);
        grid-auto-rows: min-content;
        height: fit-content;
        align-content: center;
        padding: 0;
        border-bottom: solid var(--px1) var(--ct-offcanvas-border-color);
        row-gap: 0.5em;
        padding: var(--pad3) 0;

        #plpTitle {
            grid-column: 2 / span 10;
            margin-bottom: 0;
            text-transform: uppercase;
            line-height: 1;
        }

        #plpCloseBtn {
            grid-column: 12 / span 2;
            justify-self: end;
        }

        #plpUpcoming {
            grid-column: 2 / span 8;
            text-transform: uppercase;
            font-weight: 400;
            color: var(--ct-secondary-500);
            margin-bottom: 0;
            font-size: 1.5em;
            line-height: 1;
        }

        #paginatorTopWrap {
            grid-column: 10 / span 4;
        }

    }

    #plpBody {

        display: grid;
        grid-template-columns: var(--gridCols);
        grid-auto-rows: min-content;
        overflow-x: hidden;
        padding: 0;
        scrollbar-width: none;

        #plpListingWrap {
            display: contents;
        }

        .plListing {
            grid-column: 1/-1;
            grid-row: 1;
            margin-bottom: 0;
            padding-left: 0;
            list-style: none;
            height: stretch;
            align-content: start;
        }

        .spinners {
            list-style: none;
            grid-column: 1/-1;
            padding: 0;

            .spinnerRow {
                grid-column: 1/-1;
                min-height: 4em;
                padding: 0 var(--pad3);

                .spinner-grow {

                    animation-timing-function: ease-out;
                    --ct-spinner-animation-speed: 1.5s;
                    border-radius: 0.35em;
                }
            }
        }

        #plpFooter {
            grid-column: 2 / span 12;
            display: grid;
            grid-template-columns: subgrid;
            padding: var(--pad3) 0;

            #paginatorBottomWrap {
                grid-column: 1 / span 4;
            }

            #plpSeeMore {
                font-size: 1.5em;
                grid-column: 9 / span 4;
                font-stretch: condensed;
                text-transform: uppercase;
                font-weight: 400;
                cursor: pointer;
                color: var(--ct-link-color);

                &:hover,
                &:focus,
                &:active {
                    color: var(--ct-link-hover-color);
                }

                &.disabled {
                    opacity: 0;
                }
            }
        }
    }

    .paginatorWrap {
        grid-column: span 4;

        .paginator {
            width: stretch;

            .btn {
                padding: 0.5em 0;
                align-content: center;

                --ct-btn-color: #fff;
                --ct-btn-bg: transparent;
                --ct-btn-border-color: #fff;
                --ct-btn-hover-color: #000;
                --ct-btn-hover-bg: #fff;
                --ct-btn-hover-border-color: #fff;
                --ct-btn-active-color: #000;
                --ct-btn-active-bg: var(--ct-gray-500);
                --ct-btn-active-border-color: var(--ct-gray-500);

                --ct-btn-disabled-color: var(--ct-gray-500);
                --ct-btn-disabled-border-color: var(--ct-gray-500);
                --ct-btn-disabled-opacity: 0.65;
            }
        }
    }

    .plListItem {
        --bg: #000;
        --soldout: var(--ct-red-500);
        --accent-1: var(--ct-primary-300);
        --accent-2: var(--ct-primary-400);
        --accent-3: var(--ct-primary-500);
        --accent-teal: var(--ct-teal-400);
        --accent-blue: var(--ct-blue-400);
        --accent-orange: var(--ct-orange-400);
        --accent-brick: var(--ct-brick-400);
        --accent-red: var(--ct-red-400);
        --accent-yellow: var(--ct-yellow-400);
        --accent-gray: var(--ct-gray-300);
        --accent-time: var(--accent-gray);

        border-bottom: solid var(--px1) var(--ct-offcanvas-border-color);

        &:hover {
            --bg: var(--ct-gray-950);
            --soldout: var(--ct-red-400);

            .plListItemBody {
                --accent-1: var(--ct-primary-200);
                --accent-2: var(--ct-primary-300);
                --accent-3: var(--ct-primary-400);
                --accent-teal: var(--ct-teal-300);
                --accent-blue: var(--ct-blue-300);
                --accent-orange: var(--ct-orange-300);
                --accent-brick: var(--ct-brick-300);
                --accent-red: var(--ct-red-300);
                --accent-yellow: var(--ct-yellow-300);
                --accent-gray: var(--ct-gray-200);
            }
        }

        &:has([aria-expanded=true]) {

            --bg: var(--ct-primary-700);
            --soldout: var(--ct-red-100);

            .plListItemBody {
                --accent-1: #fff;
                --accent-2: var(--ct-orange-50);
                --accent-3: var(--ct-orange-100);
                --accent-teal: var(--ct-teal-100);
                --accent-blue: var(--ct-blue-100);
                --accent-orange: var(--ct-orange-100);
                --accent-brick: var(--ct-brick-100);
                --accent-red: var(--ct-red-100);
                --accent-yellow: var(--ct-yellow-100);
                --accent-gray: #fff;
                --accent-time: #fff;

                .plWeekdayAbbr {
                    background-color: var(--accent-3) !important;
                }
            }

            &:hover {
                --bg: var(--ct-primary-700);
            }
        }

        .plListItemBody .plDateTagWrap .plDateTimeCell .plTime {
            text-align: center;
        }

        .plBuyBtn {

            &:hover,
            &:active,
            &:focus,
            &:focus-visible {
                --buybtn-color: #000 !important;
                --buybtn1-bg: #fff !important;
                --buybtn2-bg: var(--ct-gray-300) !important;
            }
        }
    }

    .plAvailTable {
        --fadeColor: rgba(80, 79, 78, 0.25); /* ct-gray-800 */
    }

    .plAccordion {

        --accordionBg: var(--ct-gray-950);
        --accordionText: #fff;
        --linkColor: var(--ct-primary-400);
        --linkColorHover: var(--ct-primary-300);

        .plAccBuyBtn {
            --ct-btn-color: #fff;
            --ct-btn-bg: var(--ct-primary-500);
            --ct-btn-border-color: var(--ct-primary-500);
            --ct-btn-hover-color: #000;
            --ct-btn-hover-bg: #fff;
            --ct-btn-hover-border-color: #fff;
            --ct-btn-active-color: #000;
            --ct-btn-active-bg: var(--ct-gray-300);
            --ct-btn-active-border-color: var(--ct-gray-300);
        }
    }
}

.perfListAccordionBlock {

    --gridCols: 1.25rem 1.75rem 2rem 2.25rem 2.5rem 3rem 3rem 1fr 1fr 2.5rem 2.25rem 2rem 1.75rem 1.25rem;
    --pla-border-color: var(--ct-gray-150);

    @media (min-width:992px) {
        --gridCols: 1.25rem 1.75rem 2rem min-content min-content min-content min-content 1fr 1fr 3rem 2.25rem 2rem 1.75rem 1.25rem;
    }

    @media (max-width:575.98px) {
        --gridCols: 3vw 7fr 8fr 9fr 10fr 11fr 12fr 12fr 11fr 10fr 9fr 8fr 7fr 3vw;
        margin: 0;
    }

    display:grid;
    grid-template-columns:var(--gridCols);
    grid-auto-rows: min-content;
    list-style: none;
    padding: 0 !important;
    align-content: start;
    transition: opacity 0.2s ease-in-out;

    &.appear {
        opacity: 0;
    }

    .plListItem {
        --bg: #fff;
        --soldout: var(--ct-red-600);
        --accent-1: var(--ct-brick-400);
        --accent-2: var(--ct-brick-600);
        --accent-3: var(--ct-brick-500);
        --accent-teal: var(--ct-teal-600);
        --accent-blue: var(--ct-blue-600);
        --accent-orange: var(--ct-orange-600);
        --accent-brick: var(--ct-brick-500);
        --accent-red: var(--ct-red-600);
        --accent-yellow: var(--ct-yellow-600);
        --accent-gray: var(--ct-gray-700);
        --accent-time: var(--accent-2);

        border: solid var(--px1) var(--pla-border-color);
        margin-top: -1px;

        &:hover {
            --bg: var(--ct-orange-50);
            --soldout: var(--ct-red-600);
            --pla-border-color: var(--ct-primary-500);
            z-index: 2;

            .plListItemBody {
                --accent-1: var(--ct-brick-500);
                --accent-2: var(--ct-brick-700);
                --accent-3: var(--ct-brick-600);
                --accent-teal: var(--ct-teal-600);
                --accent-blue: var(--ct-blue-600);
                --accent-orange: var(--ct-orange-600);
                --accent-brick: var(--ct-brick-600);
                --accent-red: var(--ct-red-600);
                --accent-yellow: var(--ct-yellow-600);
                --accent-gray: var(--ct-gray-800);
            }
        }

        &:has([aria-expanded=true]) {
            --soldout: var(--ct-red-300);
            --pla-border-color: var(--ct-gray-950);
            z-index: 2;

            .plListItemBody {
                --accent-1: var(--ct-primary-300);
                --accent-2: var(--ct-primary-400);
                --accent-3: var(--ct-primary-500);
                --accent-teal: var(--ct-teal-200);
                --accent-blue: var(--ct-blue-200);
                --accent-orange: var(--ct-orange-200);
                --accent-brick: var(--ct-brick-200);
                --accent-red: var(--ct-red-200);
                --accent-yellow: var(--ct-yellow-200);
                --accent-gray: var(--ct-gray-200);
                --accent-time: var(--accent-gray);
            }

            .plBuyBtn {

                &:hover,
                &:active,
                &:focus,
                &:focus-visible {
                    --buybtn-color: #000 !important;
                    --buybtn1-bg: #fff !important;
                    --buybtn2-bg: var(--ct-gray-300) !important;
                }
            }

            &:has(.plListItemBody:hover) {
                --bg: var(--ct-gray-900);
                --pla-border-color: var(--ct-gray-900);
            }

        }

        @media (max-width:575.98px) {
            border-width: var(--px1) 0;
        }

        .plListItemBody {
            .plDateTagWrap {
                .plDateTimeCell {
                    .plTime {
                        text-align: left;
                        color: var(--accent-time);
                        padding-left: var(--pad2);
                        padding-right: var(--pad3);
                    }
                }

                .plTagCell {

                    &.appear {
                        opacity: 0;
                    }

                    transition:opacity 0.25s ease-in-out;
                }

                .plClassNameCell {
                    grid-column: span 6;
                    font-size: 1.25em;
                    margin-top: -0.2em;
                }

                .plClassNameCell+.plDateTimeCell {
                    font-size: 0.8em;
                }

                .plAltTitleCell {
                    grid-column: span 6;
                    font-size: 1.25em;
                    text-transform: uppercase;
                    line-height: 1;
                }

                @media (min-width:1200px) {

                    .plDateTimeCell {
                        grid-column: span 4 !important;

                        .plDate {
                            grid-column: span 2 !important;
                        }

                        .plDate {
                            grid-column: span 2 !important;
                        }
                    }

                    &:not(:has(.plAltTitleCell)) {

                        .plTagCell {
                            grid-column: span 2 !important;
                            justify-content: center;
                            align-items: center;
                        }
                    }

                }
            }
        }

        .plBuyBtn {

            &:hover,
            &:active,
            &:focus,
            &:focus-visible {
                --buybtn-color: #fff !important;
                --buybtn1-bg: var(--ct-gray-900) !important;
                --buybtn2-bg: #000 !important;

                @media (max-width:575.98px) {
                    --buybtn-color: #000 !important;
                    --buybtn1-bg: #fff !important;
                    --buybtn2-bg: var(--ct-gray-300) !important;
                }
            }

            .btn1 {

                &.appear {
                    color: var(--buybtn1-bg);
                }
            }

        }
    }

    .plAvailTable {
        --fadeColor: rgba(173, 172, 169, 0.25); /* ct-gray-500 */
    }

    .plAccordion {
        --accordionBg: var(--ct-gray-50);
        --accordionText: var(--ct-gray-900);
        --linkColor: var(--ct-brick-400);
        --linkColorHover: var(--ct-brick-300);
        --accent-teal: var(--ct-teal-500);
        --accent-blue: var(--ct-blue-500);
        --accent-orange: var(--ct-orange-500);
        --accent-brick: var(--ct-brick-500);
        --accent-red: var(--ct-red-500);
        --accent-yellow: var(--ct-yellow-500);

        .plAccBuyBtn {
            --ct-btn-color: #fff;
            --ct-btn-bg: var(--ct-primary-500);
            --ct-btn-border-color: var(--ct-primary-500);
            --ct-btn-hover-color: #fff;
            --ct-btn-hover-bg: #000;
            --ct-btn-hover-border-color: #000;
            --ct-btn-active-color: #fff;
            --ct-btn-active-bg: var(--ct-gray-900);
            --ct-btn-active-border-color: var(--ct-gray-900);

            max-width: 576px;
            margin: 0 auto;
        }
    }

    .pipStrip {
        .remainderBar {
            font-weight: 500;
        }
    }

}