body #ypc-page {
    padding: 0 0 5rem;
}

a,
a:hover {
    color: unset;
    text-decoration: none;
}

p {
    margin-bottom: 0;
}

.header-container {
    align-items: center;
    background-color: #000;
    display: flex;
    justify-content: space-between;
    min-height: 100px;
    position: fixed;
    width: 100%;
    z-index: 40;
}

.header-performance {
    animation-delay: .15s;
    animation-duration: .25s;
    animation-fill-mode: forwards;
    animation-name: fade-in-shift-down;
    animation-timing-function: ease-in;
    color: #fff;
    font-size: var(--text-body-small);
    font-weight: var(--weight-heavy);
    margin-bottom: 0;
    margin-left: .5rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

i.fa-chevron-left {
    color: #fff;
    font-size: var(--text-body-small);
}

.header-filters-filter-icon {
    display: inline-block;
    height: 24px;
    width: 24px;
}

.header-filters-link span {
    display: block;
    margin-right: .5rem;
}

.header-filters-link {
    align-items: center;
    align-self: flex-start;
    color: #fff;
    display: flex;
    justify-content: center;
    margin-left: 16px;
    margin-top: 5px;
    position: relative;
    text-align: center;
    text-decoration: none;
}

.header-filters-link:hover {
    color: #fff;
}

.header-filters-filter-icon > svg {
    fill: #fff;
}

.header-filters-link .cart-icon-amount {
    background: #fff;
    border: 1px solid #423e4c;
    border-radius: 1rem;
    color: #423e4c;
    font-family: var(--font-primary);
    font-size: var(--text-caption);
    height: .95rem;
    line-height: .9rem;
    position: absolute;
    right: -.3125rem;
    top: -.375rem;
    visibility: visible;
    width: .95rem;
}

.control-inactive {
    opacity: .5;
}

.caption-paragraph {
    font-size: var(--text-body);
    line-height: 1.5rem;
}

.page-headings,
.section-headings,
.accordion-headings,
.accordion-button {
    color: var(--seattle-pink, #ed145b);
    font-size: var(--text-heading-xs);
}

.accordion-headings {
    text-align: left !important;
}

.accordion-headings.syos {
    text-align: center !important;
}

p.event-date {
    font-size: var(--text-body-small);
    font-weight: var(--weight-semibold);
    line-height: normal;
    text-align: center;
}

p.current-level {
    font-size: var(--text-body);
}

#app-ba svg#venue {
    height: auto;
}

#syos-seats {
    background-color: #fffff7;
    border: 1px solid #27282d;
}

p.instructions,
.production-override-content p {
    font-size: var(--text-body-small);
    line-height: normal;
}

.venue-level-list-item-info-prices,
.price {
    display: block;
    font-size: var(--text-body-small);
    padding-bottom: .3rem;
}

.form-check-input[type="radio"] {
    margin-top: .35rem;
}

p.footnote {
    font-size: var(--text-caption);
    font-style: italic;
    line-height: normal;
}

#ba-submit-button.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
    filter: saturate(0);
    opacity: .25;
}

#ba-submit-button {
    min-width: 10rem;
    width: auto;
}

@media (max-width: 991.98px) {
    #ba-submit-button {
        min-width: 0;
        width: 100%;
    }
}

.btn.btn-outline {
    background-color: transparent !important;
    border: 1px solid var(--default-brown, #8f6638);
    color: var(--seattle-pink, #ed145b);
    font-size: var(--text-caption) !important;
}

.border-bottom.price-range {
    border-bottom: 0 !important;
}

.border-start.sidebar {
    border-left: 0 !important;
}

.dropdown-menu.show {
    transform: translate(0, -53px) !important;
}

.accordion-button:not(.collapsed) {
    background-color: transparent;
    box-shadow: none;
    color: #6a6a6a;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(-180deg);
}

footer {
    display: none;
}

#app-syos[v-cloak],
#app-ba[v-cloak] {
    background-color: #000;
    inset: 0;
    position: fixed;
    z-index: 9999;
}

#app-syos[v-cloak] > *,
#app-ba[v-cloak] > * {
    visibility: hidden;
}

#app-syos[v-cloak]::before,
#app-ba[v-cloak]::before {
    animation: buy-page-cloak-spin .75s linear infinite;
    border: .25rem solid rgba(255, 255, 255, .3);
    border-radius: 50%;
    border-top-color: #fff;
    content: "";
    height: 3rem;
    left: 50%;
    margin: -1.5rem 0 0 -1.5rem;
    position: fixed;
    top: 50%;
    visibility: visible;
    width: 3rem;
}

#app-syos[v-cloak]::after,
#app-ba[v-cloak]::after {
    color: #fff;
    content: "Loading";
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
    left: 50%;
    position: fixed;
    top: calc(50% + 2rem);
    transform: translateX(-50%);
    visibility: visible;
}

@keyframes buy-page-cloak-spin {
    to {
        transform: rotate(360deg);
    }
}

.loading-container {
    align-items: center;
    background-color: #000;
    display: flex;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
}

.loading-icon {
    animation: rotate 2s linear infinite, fade-in .4s linear forwards;
    fill: #fff;
    height: 120px;
    transform-origin: center center;
    width: 120px;
}

.loading-icon svg,
.loading-icon svg path {
    fill: #fff;
}

.loading-text {
    color: #fff;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.theme-bg-color-dark {
    background-color: var(--seattle-pink, #ed145b) !important;
    border-color: var(--default-brown, #8f6638) !important;
    transition: .7s;
}

.theme-text-color-light {
    color: #fff;
    transition: .7s;
}

.btn-hover-colored-dark-text:hover {
    background: #fff;
    border-color: var(--default-brown, #8f6638) !important;
    color: var(--seattle-pink-dark, #cf0f4d) !important;
    opacity: .75;
    transition: all .5s ease-in-out;
}

.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
    cursor: not-allowed !important;
    pointer-events: initial;
}

svg text.sold-out-label {
    fill: red;
    font-family: var(--font-primary);
    font-size: var(--text-heading-xxl);
    font-weight: var(--weight-bold);
    stroke-width: .25px;
}

.mobile-nav {
    display: none;
}

.master-container > header,
.main-header-background,
.main-container > footer {
    display: none;
}

.header-dark-background + .main-container {
    margin-top: 0;
}

.input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea {
    min-width: unset;
}

@media (min-width: 992px) {
    .master-container {
        overflow: unset;
    }
}

#syos-seats {
    height: calc(-230px + 70vh);
    margin: 0 auto;
    width: 90% !important;
}

@media screen and (min-width: 992px) {
    .header-container {
        position: relative;
    }

    .header-performance {
        font-size: var(--text-body);
    }

    p.event-date {
        font-size: var(--text-body);
        text-align: left;
    }

    #syos-seats {
        background-color: unset;
        border: none;
        height: calc(-230px + 100vh);
        width: 100%;
    }

    .accordion.border-top {
        border-top: 0;
    }

    .border-bottom.promo {
        border-bottom: 0 !important;
    }

    .border-bottom.price-range.desktop {
        border-bottom: 1px solid #dee2e6 !important;
    }

    .border-start.sidebar {
        border-left: 1px solid #dee2e6 !important;
    }
}

/* Venue overview-map helpers retained from the shared buy-page implementation. */
.van-cliburn-overview .element {
    fill: #cbcbcb;
    stroke: #fff;
    stroke-miterlimit: 10;
    stroke-width: 1.8px;
}

.van-cliburn-overview .element-stage {
    fill: #eee;
}

.van-cliburn-overview .map-text {
    fill: #7c7a7b;
    font-family: var(--font-primary);
    font-size: var(--text-body-small);
}

.van-cliburn-overview g:hover {
    cursor: pointer;
    opacity: .4;
}

.bottom-arrow::after {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid var(--default-brown, #8f6638);
    bottom: -10px;
    content: "";
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    z-index: 1;
}

.btn-active-section {
    background-color: var(--seattle-pink, #ed145b) !important;
    opacity: 1 !important;
}

/*
 * Shared buy-flow refinements ported from Public Theater.
 * Brand choices are intentionally local to this stylesheet so the ticketing UI
 * follows Seattle Symphony's palette without changing global site components.
 */

.buypage-container {
    --buy-ink: var(--seattle-black, #050505);
    --buy-paper: var(--default-paper, #f7f2ea);
    --buy-cream: var(--seattle-cream, #eee5d8);
    --buy-pink: var(--seattle-pink, #ed145b);
    --buy-pink-dark: var(--seattle-pink-dark, #cf0f4d);
    --buy-plum: var(--sso-plum, #330025);
    --buy-rule: rgba(143, 102, 56, .38);
    color: var(--buy-ink);
    font-family: var(--font-primary);
    padding-top: 100px;
}

.GeneralContentPage .buypage-container ~ .content-container {
    min-height: unset;
}

.theme-bg-color-dark {
    background-color: var(--seattle-pink, #ed145b) !important;
    border-color: var(--default-brown, #8f6638) !important;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.theme-bg-color-dark:not(:disabled):hover,
.theme-bg-color-dark:not(:disabled):focus-visible {
    background-color: var(--seattle-pink-dark, #cf0f4d) !important;
    border-color: var(--default-brown, #8f6638) !important;
}

/* Compact login accordion used on mobile. */
#accordion-login .accordion-item {
    background-color: var(--seattle-cream, #eee5d8);
    border-bottom: 0 !important;
}

#accordion-login .accordion-item .accordion-button {
    background-color: transparent;
    color: var(--sso-plum, #330025);
    font-size: var(--text-body);
    padding: .75rem 0;
}

#mobile-promo-accordion .accordion-body > .row,
#mobile-promo-accordion .promo-code-container > .row {
    margin-left: 0;
    margin-right: 0;
}

#mobile-promo-accordion .mobile-promo-content > .row {
    margin-left: 0;
    margin-right: 0;
}

#mobile-promo-accordion .mobile-promo-content > .row > * {
    padding-left: 0;
    padding-right: 0;
}

#mobile-promo-accordion .promo-code-container {
    background-color: transparent;
    max-width: 100%;
    padding: .75rem 0;
    width: 100%;
}

#mobile-promo-accordion .promo-code-container > .row > * {
    padding-left: 0;
    padding-right: 0;
}

.buypage-container .login {
    max-width: none;
    width: 100%;
}

.datetime,
.datetime .accordion-item,
.datetime .accordion-body {
    background-color: var(--default-paper);
}

.datetime .accordion-button {
    background-color: var(--default-paper);
    border-bottom: 2px solid rgba(143, 102, 56, .38);
    border-radius: 0 !important;
}

#app-ba #accordion-promo,
#app-ba #accordion-promo .accordion-item,
#app-ba #accordion-promo .accordion-collapse,
#app-ba #accordion-promo .accordion-body,
#app-ba #accordion-promo .accordion-button,
#app-ba #accordion-promo .promo-code-container {
    background-color: var(--default-paper) !important;
}

#app-ba #accordion-promo .accordion-item {
    border-bottom: 0 !important;
    border-radius: 0 !important;
}

#app-ba #accordion-promo .accordion-button::after {
    display: block;
}

@media (max-width: 991.98px) {
    #app-syos .sidebar .datetime .accordion-item,
    #app-syos .sidebar .datetime .accordion-button {
        border-bottom: 0 !important;
    }

    #app-syos .sidebar .datetime .accordion-button {
        padding-bottom: 0 !important;
    }

    #app-syos .sidebar .datetime .form-select {
        margin-top: .25rem;
    }

    #app-syos .syos-mobile-promo-heading {
        font-size: var(--text-caption);
        font-weight: var(--weight-bold);
        margin: .75rem 0 .25rem;
    }

    #app-syos #mobile-promo-accordion .promo-code-container {
        padding-top: 0 !important;
    }

    #app-syos #mobile-levels-accordion .accordion-button::after,
    #app-syos #mobile-seat-legend-accordion .accordion-button::after {
        background-size: 1rem;
        height: 1rem;
        margin-right: .75rem;
        width: 1rem;
    }

    #app-syos #mobile-seat-legend-accordion .accordion-item {
        border-bottom: 0 !important;
    }

    #app-syos .mobile-seat-legend {
        flex: 1 1 auto;
        margin-right: .75rem;
        min-width: 0;
    }

    #app-syos .mobile-seat-legend .accordion-button {
        padding-bottom: .625rem;
        padding-left: .5rem;
        padding-top: .625rem;
    }

    #app-syos .mobile-seat-legend .seat-legend .col-12 > .p-1 {
        align-items: flex-start;
    }

    #app-syos .mobile-seat-legend .seat-legend .col-12 > .p-1 svg {
        margin-top: .25rem;
    }

    #app-syos .syos-controls-mobile {
        flex: 0 0 auto;
    }

    #app-syos .syos-controls-mobile .syos-map-control {
        align-items: center;
        display: inline-flex;
        height: 2.5rem;
        justify-content: center;
        padding: 0;
        width: 2.5rem;
    }

    #app-syos svg.syos-seats {
        border-bottom: 0 !important;
    }

    #app-ba .ba-mobile-promo-heading {
        font-size: var(--text-caption);
        font-weight: var(--weight-bold);
        margin: .75rem 0 .25rem;
    }

    #app-ba #additional-dates .accordion-item,
    #app-ba #additional-dates .accordion-button {
        border-bottom: 0 !important;
    }

    #app-ba #additional-dates .accordion-button {
        padding-bottom: 0 !important;
    }

    #app-ba #additional-dates .accordion-body {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #app-ba #additional-dates .form-select {
        margin-top: .25rem;
    }

    #app-ba #accordion-promo .accordion-body,
    #app-ba #accordion-promo .promo-code-container > .row > * {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #app-ba #accordion-promo .promo-code-container {
        padding-top: 0 !important;
    }

    #app-ba #accordion-promo .accordion-button {
        border-bottom: 0 !important;
    }
}

#app-ba #accordion-promo .promo-code-container {
    max-width: 100%;
    padding: .75rem 0;
    width: 100%;
}

#app-ba #accordion-promo .accordion-body > .row,
#app-ba #accordion-promo .promo-code-container > .row {
    margin-left: 0;
    margin-right: 0;
}

@media (min-width: 992px) {
    #app-syos .sidebar {
        --sidebar-inline-space: 1.5rem;
        padding-left: var(--sidebar-inline-space) !important;
        padding-right: var(--sidebar-inline-space) !important;
    }

    #app-syos .sidebar .syos-performance-title {
        font-size: var(--text-heading-l);
        line-height: var(--line-height-heading-m);
    }

    #app-syos .sidebar .datetime .accordion-item,
    #app-syos .sidebar .datetime .accordion-button {
        border-bottom: 0 !important;
    }

    #app-syos .sidebar .datetime .accordion-button {
        padding-bottom: 0 !important;
    }

    #app-syos .sidebar .datetime .form-select {
        margin-top: .25rem;
    }

    #app-syos .sidebar .accordion-button::after {
        background-size: 1rem;
        height: 1rem;
        margin-right: .75rem;
        width: 1rem;
    }

    #app-ba #additional-dates .accordion-item,
    #app-ba #additional-dates .accordion-button {
        border-bottom: 0 !important;
    }

    #app-ba #additional-dates .accordion-button {
        padding-bottom: 0 !important;
    }

    #app-ba #additional-dates .form-select {
        margin-top: .25rem;
    }

    #app-ba #additional-dates .accordion-body,
    #app-ba #accordion-promo .accordion-body {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #app-ba #accordion-promo .promo-code-container > p:first-child {
        font-size: var(--text-caption);
        font-weight: var(--weight-bold);
        margin-bottom: .5rem !important;
    }

    #app-syos .sidebar .promo-code-container > p:first-child {
        font-size: var(--text-caption);
        font-weight: var(--weight-bold);
        margin-bottom: .5rem !important;
    }

    #app-syos .sidebar .sidebar-promo > .row {
        margin-left: calc(var(--sidebar-inline-space) * -1);
        margin-right: calc(var(--sidebar-inline-space) * -1);
    }

    #app-syos .sidebar .sidebar-promo .promo-code-container {
        padding-left: var(--sidebar-inline-space);
        padding-right: var(--sidebar-inline-space);
    }

    #desktop-legend-accordion .accordion-item {
        border-bottom: 0 !important;
    }

    #app-ba #accordion-promo .promo-code-container > .row > * {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 1200px) {
    #app-syos .sidebar {
        --sidebar-inline-space: 2rem;
    }
}

@media (min-width: 1400px) {
    #app-syos .sidebar {
        --sidebar-inline-space: 3rem;
    }
}

.datetime .accordion-button::after {
    display: none;
}

.datetime .accordion-body {
    padding: 0 0 .5rem .5rem;
}

.syos-btn-selection button {
    line-height: normal !important;
    width: 100%;
}

@media (min-width: 992px) {
    #app-syos {
        position: relative;
    }

    #app-syos .syos-btn-selection button,
    #app-ba .syos-btn-selection button {
        width: auto;
    }

    #app-syos .syos-btn-selection--desktop-map {
        left: 0;
        position: absolute;
        right: 0;
        top: -2.5rem;
        z-index: 41;
    }

    #app-syos .syos-btn-selection--desktop-map > .col {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #app-syos .syos-btn-selection .buy-seat-mode {
        min-height: 0;
        padding: .375rem .75rem !important;
    }

    #app-ba .syos-btn-selection .buy-seat-mode {
        flex: 1 1 0;
        max-width: 100%;
        min-width: 0;
        min-height: 0;
        padding: .375rem .75rem !important;
        width: 100%;
    }
}

.syos-btn-selection .buy-seat-mode.bottom-arrow::after {
    border-top-color: var(--default-gold, #edb52a);
}

#app-syos .syos-seat-view-control {
    align-items: center;
    display: inline-flex;
    gap: .5rem;
    justify-content: center;
    padding: .375rem .75rem;
}

@media (max-width: 991.98px) {
    .syos-btn-selection--mobile-top {
        margin-top: .75rem;
    }

    .syos-btn-selection > .col {
        margin-top: 2rem !important;
    }

    .syos-btn-selection--mobile-section > .col {
        margin-top: 0 !important;
    }

    #app-syos .syos-btn-selection .buy-seat-mode,
    #app-ba .syos-btn-selection .buy-seat-mode {
        height: auto !important;
        min-height: 0;
        padding: .375rem .75rem !important;
    }

    #app-ba .syos-btn-selection .d-flex,
    #app-syos .syos-btn-selection--mobile-top .d-flex {
        flex-wrap: nowrap;
    }

    #app-ba .syos-btn-selection .buy-seat-mode,
    #app-syos .syos-btn-selection--mobile-top .buy-seat-mode {
        flex: 1 1 0;
        min-width: 0;
        width: 0;
    }
}

.syos-headings {
    color: var(--sso-plum, #330025);
}

/* Best Available uses the neutral text treatment throughout its SSO controls. */
#app-ba .section-headings,
#app-ba .accordion-headings,
#app-ba .syos-headings,
#app-ba .theme-color-dark-text,
#app-ba #accordion-promo .accordion-button {
    color: var(--default-black, #000) !important;
}

#syos-seats {
    background-color: transparent;
    border: 0;
    width: 100% !important;
}

#syos-controls {
    border-bottom: 2px solid rgba(143, 102, 56, .38);
    font-size: var(--text-body);
    padding-bottom: 1rem;
}

#syos-controls button,
.syos-controls-mobile button {
    border-color: var(--default-brown, #8f6638) !important;
    border-radius: var(--border-radius, 4px);
    color: var(--default-black, #000) !important;
}

.syos-controls-mobile {
    font-size: var(--text-body);
}

/* Main choose-your-own-seat map area. */
#app-syos svg.syos-seats {
    background: #fff;
    border: 2px solid rgba(143, 102, 56, .28) !important;
    border-radius: var(--border-radius, 4px);
    /* Keep every drag inside the SVG assigned to map pan/zoom, including
       drags that begin on open areas between seats. */
    touch-action: none;
}

#pre-cart {
    bottom: 0;
    box-shadow: 0 -3px 12px rgba(51, 0, 37, .2);
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 30;
}

#pre-cart .accordion-body {
    max-height: 45vh;
    overflow-y: auto;
}

#pre-cart .accordion-item {
    background-color: var(--default-paper, #f7f2ea);
    border: 0 !important;
}

#pre-cart .pre-cart-collapsed-summary {
    background-color: var(--default-paper, #f7f2ea);
    border-bottom: 2px solid rgba(143, 102, 56, .38);
}

#pre-cart .pre-cart-collapsed-summary__totals {
    font-size: var(--text-body, 1rem);
    line-height: 1.2;
}

#pre-cart #syos-submit-collapsed {
    min-width: 8.75rem;
    padding-left: .75rem;
    padding-right: .75rem;
    width: auto;
}

#pre-cart .pre-cart-collapsed-alerts {
    background-color: var(--default-paper, #f7f2ea);
}

#pre-cart .pre-cart-collapsed-alerts .alert:last-child {
    margin-bottom: 1rem;
}

#pre-cart .border-top,
#pre-cart .border-bottom {
    border-color: rgba(143, 102, 56, .38) !important;
}

#pre-cart .pre-cart-seat-remove .fa-times-circle {
    transition: color .15s ease-in-out;
}

#pre-cart .pre-cart-seat-remove:hover .fa-times-circle,
#pre-cart .pre-cart-seat-remove:focus-visible .fa-times-circle {
    color: var(--bh-dark-orange, #c73422);
}

#pre-cart-heading .accordion-button {
    background-color: var(--bh-maroon, #3e0000) !important;
    border: 0;
    border-radius: 0;
    color: #fff !important;
}

#pre-cart-heading .accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(0deg);
}

#pre-cart-heading .accordion-button.collapsed::after {
    transform: rotate(180deg);
}

/* Best available. */
.section-map-radio-spacing {
    margin-bottom: 1rem;
}

@media (min-width: 768px) {
    #app-ba .section-map-radio-spacing {
        margin-bottom: 0;
        margin-right: 1rem;
    }
}

.buypage-container .best-available .level {
    width: 20%;
}

#app-syos #pre-cart div.reservation-instructions {
    color: var(--default-black, #000) !important;
}

#pre-cart #syos-submit {
    min-width: 10rem;
    width: auto;
}

@media (min-width: 768px) {
    #app-ba .best-available > .level,
    #app-ba .best-available > .price-level {
        flex: 1 1 0;
        width: auto;
    }

    #app-ba .best-available > .level > .section-headings,
    #app-ba .best-available > .price-level .accordion-headings {
        margin-bottom: 1.25rem;
    }
}

.buypage-container .best-available .seats {
    border-top: 2px solid rgba(143, 102, 56, .38);
}

@media (min-width: 992px) {
    #app-ba .best-available .seats {
        border: 1px solid var(--default-brown, #8f6638);
        border-radius: var(--border-radius, 4px);
    }
}

.buypage-container .best-available .seats .form-select,
#app-ba .ba-ticket-section .form-select {
    background-position: right .75rem center;
    background-repeat: no-repeat;
    border: 1px solid rgba(143, 102, 56, .45) !important;
    border-radius: var(--border-radius, 4px);
    min-width: 4.5rem;
    padding: .6rem 2.5rem .6rem .75rem;
}

#app-ba .ba-total {
    font-weight: var(--weight-bold);
    padding-left: 0;
    padding-right: .75rem;
}

#app-ba .ba-total-amount {
    flex: 0 0 4.5rem;
    min-width: 4.5rem;
    text-align: left;
}

#app-ba .border-top,
#app-ba .border-bottom {
    border-color: rgba(143, 102, 56, .38) !important;
}

.buypage-container .ba-ticket-section,
.buypage-container .best-available .seats,
.buypage-container .ba-ticket-section .col.col-lg-7 {
    background-color: var(--default-paper, #f7f2ea);
}

.ba-ticket-section {
    border: 1px solid var(--default-brown);
    border-radius: var(--border-radius);
}

@media (max-width: 991.98px) {
    #app-ba .ba-ticket-section .section-headings {
        font-size: var(--text-heading-xl);
        line-height: var(--line-height-heading-xl);
    }
}

/* Desktop sidebar. */
.promo-code-container {
    background-color: var(--seattle-cream, #eee5d8);
    padding: 2rem 1rem;
}

.promo-code-container .input-group > .form-control {
    background-color: #fff;
    border: 1px solid rgba(143, 102, 56, .45) !important;
    border-radius: var(--border-radius, 4px) !important;
    color: var(--default-black, #000);
    font-size: var(--text-body-small);
    font-weight: var(--weight-regular);
    height: 2.5rem;
    line-height: normal;
    padding: .5rem .75rem;
}

.promo-code-container .input-group > .form-control::placeholder {
    color: var(--default-brown, #8f6638);
    font-size: var(--text-body-small);
    font-weight: var(--weight-regular);
    opacity: 1;
}

.promo-code-container .input-group > .form-control:focus,
.promo-code-container .input-group > .form-control:focus-visible {
    border-color: var(--default-brown, #8f6638) !important;
    box-shadow: none;
}

/* Seat detail modal. */
#app-syos .modal-header {
    border-bottom: 2px solid #fff !important;
}

#app-syos .seat-detail-modal-class {
    background-color: var(--default-paper, #f7f2ea);
    border-radius: var(--border-radius, 4px);
    color: var(--default-black, #000);
    overflow: hidden;
}

#app-syos .seat-detail-modal-class .modal-header {
    border-bottom: 1px solid rgba(143, 102, 56, .38) !important;
    color: var(--default-black, #000);
    text-align: left;
}

#app-syos .seat-detail-modal-class .modal-body {
    border-bottom: 0;
    color: var(--default-black, #000);
}

#app-syos .seat-detail-modal-class .modal-footer {
    padding: 0;
}

#app-syos .seat-detail-modal-class .btn-close {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}

.pricetype-container:last-of-type {
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#app-syos .modal-body {
    border-bottom: 2px solid #fff;
}

#app-syos .btn-close {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}

.modal-seat-terms-notice .modal-header {
    margin-top: 1rem;
    padding-bottom: 0;
}

#app-ba svg#venue {
    height: auto;
}

.header-container {
    background-color: var(--default-paper-dark, #ede4d8);
    color: var(--seattle-black, #050505);
    position: fixed;
    width: 100%;
}

.header-info {
    min-height: 100px;
    width: 100%;
    flex-direction:column;
}

.buy-page-logo {
    align-items: center;
    color: var(--seattle-black, #050505);
    display: inline-flex;
    flex: 0 0 auto;
}

.buy-page-logo img {
    display: block;
    max-height: 54px;
    max-width: 245px;
    width: auto;
}

.buy-page-logo span {
    font-size: var(--text-heading-l);
    font-weight: var(--weight-heavy);
}

.buy-page-back-link,
.buy-page-customer-id {
    color: var(--seattle-black, #050505);
}

@media (max-width: 575.98px) {
    .buy-page-logo img {
        max-height: 40px;
        max-width: 180px;
    }

    .buy-page-logo span {
        font-size: var(--text-heading-m);
    }
}

.datetime .form-select {
    appearance: none;
    background-color: #fff !important;
    background-position: right .75rem center;
    background-size: 1rem;
    border: 1px solid rgba(143, 102, 56, .45) !important;
    border-radius: var(--border-radius, 4px);
    color: var(--default-black, #000);
    color-scheme: light;
    font-size: var(--text-body-small);
    font-weight: var(--weight-regular);
    height: 2.5rem;
    line-height: normal;
    margin: .5rem 0 .75rem;
    min-height: 2.5rem;
    padding: .5rem 2.25rem .5rem .75rem;
    width: 100%;
}

.datetime .form-select option {
    background-color: #fff !important;
    color: var(--default-black, #000) !important;
    font-size: var(--text-body-small);
    font-weight: var(--weight-regular);
    padding: .5rem .75rem;
}

.datetime .form-select option:checked,
.datetime .form-select option:focus,
.datetime .form-select option:hover {
    background: #fff linear-gradient(0deg, #fff 0%, #fff 100%) !important;
    color: var(--default-black, #000) !important;
}

.form-select {
    border: 0;
    border-bottom: 1px solid rgba(143, 102, 56, .45) !important;
    border-radius: 0;
    border-top: 1px solid rgba(143, 102, 56, .45) !important;
    width: auto;
}

.custom-select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23330025'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-position: right;
    background-repeat: no-repeat;
    background-size: 1.25rem;
    font-size: var(--text-body);
    font-weight: var(--weight-bold);
    margin: 1.25rem 0;
    padding: 0 2rem 0 0;
    width: -webkit-fill-available;
    width: stretch;
}

.accordion-button {
    color: var(--seattle-black, #050505);
    font-size: var(--text-caption);
    font-weight: var(--weight-bold);
    padding: 1.25rem 0;
}

.accordion-button:focus,
.accordion-button:active,
.accordion-button:not(.collapsed) {
    background-color: transparent !important;
    box-shadow: none;
    color: var(--seattle-black, #050505);
    font-weight: var(--weight-bold);
}

.accordion-button:focus-visible,
.custom-select:focus-visible,
.form-select:focus-visible {
    outline: 2px solid var(--seattle-pink, #ed145b);
    outline-offset: 3px;
}

#app-ba :focus {
    box-shadow: none !important;
}

#app-ba :focus-visible {
    outline: 2px solid var(--default-brown, #8f6638) !important;
    outline-offset: 2px;
}

#syos-seats [role="button"]:focus-visible {
    outline: none;
    filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 3px var(--default-brown, #8f6638));
}

#app-ba .form-control:focus,
#app-ba .form-select:focus {
    border-color: var(--default-brown, #8f6638) !important;
}

.datetime .form-select:focus,
.datetime .form-select:focus-visible {
    border-color: rgba(143, 102, 56, .45) !important;
    box-shadow: none;
    outline: none;
}

.accordion-item {
    border-bottom: 2px solid rgba(143, 102, 56, .38) !important;
    border-radius: 0 !important;
}

.accordion-body {
    padding: 0 .5rem 1rem;
}

#desktop-legend-accordion .accordion-item,
#desktop-legend-accordion .accordion-collapse,
#desktop-legend-accordion .accordion-body {
    background-color: var(--default-paper) !important;
}

.seat-legend .col-12 > .p-1 {
    align-items: center;
    display: flex;
    gap: .75rem;
}

.seat-legend .col-12 > .p-1 svg {
    flex: 0 0 auto;
}

.seat-legend .legend-label {
    margin-left: 0;
    position: static;
    margin-bottom: 1px;
}

.syos-levels-accordion .accordion-item,
.syos-levels-accordion .accordion-collapse,
.syos-levels-accordion .accordion-body,
.syos-levels-accordion .accordion-button,
.syos-levels-accordion .accordion-button:focus,
.syos-levels-accordion .accordion-button:active,
.syos-levels-accordion .accordion-button:not(.collapsed) {
    background-color: var(--default-paper) !important;
}

.syos-levels-accordion .form-check-input[type="radio"],
#app-ba .form-check-input[type="radio"] {
    appearance: none;
    background-color: transparent;
    background-image: none;
    border: 1px solid var(--default-brown);
    border-radius: 50%;
    display: inline-grid;
    flex: 0 0 auto;
    height: 1rem;
    margin: 0;
    place-content: center;
    width: 1rem;
}

.syos-levels-accordion .form-check {
    align-items: flex-start;
}

.syos-levels-accordion .form-check-input[type="radio"] {
    margin-top: .35rem;
}

#app-ba .form-check {
    align-items: flex-start;
}

#app-ba .form-check-input[type="radio"] {
    margin-top: .35rem;
}

.syos-levels-accordion .form-check-input[type="radio"]::before,
#app-ba .form-check-input[type="radio"]::before {
    background-color: var(--default-brown);
    border-radius: 50%;
    content: "";
    height: .5rem;
    transform: scale(0);
    transition: transform .12s ease-in-out;
    width: .5rem;
}

.syos-levels-accordion .form-check-input[type="radio"]:checked::before,
#app-ba .form-check-input[type="radio"]:checked::before {
    transform: scale(1);
}

.syos-levels-accordion .form-check-input[type="radio"]:focus-visible,
#app-ba .form-check-input[type="radio"]:focus-visible {
    outline: 2px solid var(--default-brown);
    outline-offset: 2px;
}

@media (min-width: 992px) {
    .buypage-container {
        padding-top: 3rem;
    }

    #app-ba.best-available-is-visible {
        background-color: transparent;
        isolation: isolate;
        padding-bottom: 3rem !important;
        padding-top: 3rem;
        position: relative;
    }

    #app-ba.best-available-is-visible::before {
        background-color: #fff;
        bottom: 0;
        content: "";
        left: calc(20.833333% - 3rem);
        pointer-events: none;
        position: absolute;
        right: calc(50% - 50vw);
        top: 0;
        z-index: -1;
    }

    #app-ba #additional-dates,
    #app-ba #additional-dates .accordion-item,
    #app-ba #additional-dates .accordion-body,
    #app-ba #additional-dates .accordion-button,
    #app-ba #accordion-promo,
    #app-ba #accordion-promo .accordion-item,
    #app-ba #accordion-promo .accordion-collapse,
    #app-ba #accordion-promo .accordion-body,
    #app-ba #accordion-promo .accordion-button,
    #app-ba #accordion-promo .promo-code-container {
        background-color: transparent !important;
    }

    #syos-controls {
        border-bottom: 0;
        justify-content: center !important;
    }

    #pre-cart {
        left: 25%;
        right: 0;
        width: auto;
    }

    #pre-cart .accordion-body {
        max-height: 50vh;
    }

    .buypage-container .best-available .price-level {
        border-left: 0;
        width: 20%;
    }

    .buypage-container .best-available .price-level:not(.border-start-0) {
        align-self: stretch;
        display: grid;
        grid-template-rows: auto 1fr;
        padding-left: .25rem;
    }

    .buypage-container .best-available .price-level:not(.border-start-0) .price-level-options {
        height: 100%;
        position: relative;
    }

    .buypage-container .best-available .price-level:not(.border-start-0) .price-level-options::before {
        background-color: rgba(143, 102, 56, .3);
        bottom: 0;
        content: "";
        left: -1.5rem;
        position: absolute;
        top: 0;
        width: 1px;
    }

    .header-container {
        position: relative;
    }

    .sidebar {
        border-right: 1px solid rgba(143, 102, 56, .48) !important;
        z-index: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .theme-bg-color-dark {
        transition: none;
    }
}

.syos-performance-title {
    line-height: 2.50rem;
    margin-bottom: .25rem;
}

.event-details {
    margin-bottom: 1rem;
}

.best-available-status {
    background-color: var(--default-paper-dark, #f4f0e7);
    border-radius: var(--border-radius);
    padding: 1rem;
}

.package-item {
    border: 1px solid var(--default-brown);
    border-radius: var(--border-radius);
    background: transparent;
    color: inherit;
}

.package-item:hover {
    background: var(--default-paper-dark);
}

.package-performance-modal {
    border: 0;
    border-radius: var(--border-radius);
    overflow: hidden;
}

.package-performance-modal .modal-header,
.package-performance-modal .modal-footer {
    border-color: color-mix(in srgb, var(--default-brown) 35%, transparent);
}

.package-performance-modal .modal-body {
    scrollbar-color: var(--default-brown) transparent;
    scrollbar-width: thin;
}

.package-performance-modal .modal-body::-webkit-scrollbar-track {
    background: transparent;
}

.package-performance-modal .modal-body::-webkit-scrollbar-thumb,
.package-performance-modal .modal-body::-webkit-scrollbar-button {
    background-color: var(--default-brown);
}

.flex-package-seat-alert {
    background-color: #e4eff3;
    border-color: #527787;
    color: #243e49;
}

.package-performance-modal-image {
    display: flex;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.package-performance-modal-image img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: min(400px, 40vh);
    border-radius: var(--border-radius);
    object-fit: contain;
}


.package-performance-modal-image img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 450px;
    border-radius: var(--border-radius);
    object-fit: contain;
}

body.modal-open {
    overflow: hidden;
}

#package-performance-info-modal .modal-dialog {
    background-color: transparent;
}

#package-performance-info-modal .modal-header {
    border-bottom: 0;
}

.modal.show .modal-dialog{
    border-radius: var(--border-radius);
}

/* Reflow ticket controls at the narrow CSS viewport produced by 200% browser zoom. */
@media (max-width: 48rem) {
    #app-ba,
    #app-syos,
    #app-ba .row > *,
    #app-syos .row > * {
        min-width: 0;
    }

    #app-syos .pre-cart-collapsed-summary {
        flex-wrap: wrap;
    }

    #app-ba .form-select,
    #app-syos .form-select {
        max-width: 100%;
        width: 100%;
    }

    #app-ba .modal-container,
    #app-syos .modal-container {
        max-height: calc(100vh - 2rem);
        max-width: calc(100vw - 2rem);
        overflow: auto;
    }
}