/* /Components/Loading/Loading.razor.rz.scp.css */
.loading-spinner-container[b-dvhvgjc9ok] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;    
    gap: 1rem;
    animation: slideInUp-b-dvhvgjc9ok 0.3s ease-out;
}

.loading-text[b-dvhvgjc9ok] {
    color: white;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-align: center;
    animation: fadeIn-b-dvhvgjc9ok 0.5s ease-in-out;
}

/* Keyframes for animations */
@keyframes fadeIn-b-dvhvgjc9ok {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInUp-b-dvhvgjc9ok {
    from {
        opacity: 0;
        transform: translate3d(0, 20px, 0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* Custom sizes for spinners */
.spinner-border-lg[b-dvhvgjc9ok] {
    width: 3rem;
    height: 3rem;
    border-width: 0.3em;
}

.spinner-border-xl[b-dvhvgjc9ok] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

/* Styles for different types of display */
.loading-spinner-container.loading-fullscreen[b-dvhvgjc9ok] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 9999;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.loading-spinner-container.loading-overlay[b-dvhvgjc9ok] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.5);
    z-index: 100;
    backdrop-filter: blur(0.5px);
    -webkit-backdrop-filter: blur(0.5px);
    border-radius: 16px;
}
/* /Components/ShowImagePicker/ShowImagePicker.razor.rz.scp.css */
.image-preview-wrapper[b-ogzzpkgkqz] {
    position: relative;
    width: fit-content;
    margin: 0 auto;
}

.image-skeleton[b-ogzzpkgkqz] {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    border-radius: 0.5rem;
    margin: 0 auto;
    cursor: pointer;
}

.image-preview-container[b-ogzzpkgkqz] {
    width: 100%;
    max-width: 240px;
    aspect-ratio: 4 / 5;
    background-color: #f0f2f5;
    border: 2px dashed #dee2e6;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin: 0 auto;
}

.image-preview-container.has-image[b-ogzzpkgkqz] {
    border-style: solid;
    border-color: #5e72e4;
}

.image-preview-container img[b-ogzzpkgkqz] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.drop-zone[b-ogzzpkgkqz] {
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.drop-zone:hover[b-ogzzpkgkqz] {
    background-color: #e9ecef;
    border-color: #adb5bd;
}

.btn-remove-image[b-ogzzpkgkqz] {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background-color: #f5365c;
    border: 2px solid #fff;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    font-size: 12px;
}

.btn-remove-image:hover[b-ogzzpkgkqz] {
    background-color: #d32f4a;
    transform: scale(1.1);
}
/* /Components/ShowPicker/ShowPicker.razor.rz.scp.css */
.show-picker[b-wz8r0hlq71] {
    position: relative;
    min-width: 320px;
}

.show-picker-field[b-wz8r0hlq71] {
    position: relative;
}

.show-picker-input[b-wz8r0hlq71] {
    padding-right: 2rem;
}

.show-picker-clear[b-wz8r0hlq71] {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    border: none;
    background: none;
    padding: 0;
    line-height: 1;
    color: #8392ab;
    cursor: pointer;
    font-size: 0.75rem;
}

.show-picker-clear:hover[b-wz8r0hlq71] {
    color: #344767;
}

.show-picker-dropdown[b-wz8r0hlq71] {
    position: absolute;
    top: calc(100% + 0.25rem);
    left: 0;
    right: 0;
    z-index: 1000;
    max-height: 20rem;
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #d2d6da;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.show-picker-group[b-wz8r0hlq71] {
    padding: 0.5rem 0.75rem 0.25rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #8392ab;
}

.show-picker-option[b-wz8r0hlq71] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.4rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #344767;
}

.show-picker-option:hover[b-wz8r0hlq71],
.show-picker-option.highlighted[b-wz8r0hlq71] {
    background-color: #f0f2f5;
}

.show-picker-option-name[b-wz8r0hlq71] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.show-picker-option-date[b-wz8r0hlq71] {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: #8392ab;
}

.show-picker-message[b-wz8r0hlq71] {
    padding: 0.6rem 0.75rem;
    font-size: 0.8rem;
    color: #8392ab;
}
/* /Components/Table/Table.razor.rz.scp.css */
.col-small[b-1lh9q5k564] {
    width: 120px;
}

.haveMorePages[b-1lh9q5k564] {
    border-width: 0px !important;
    pointer-events: none;
}

.loading[b-1lh9q5k564] {
    min-height: 300px;
    padding-left: 24px;
}

.dataTable-top-no-padding-top[b-1lh9q5k564] {
    padding-top: 0px !important;
}

.search-container[b-1lh9q5k564] {
    position: relative;
    width: 100%;
}

.clear-button[b-1lh9q5k564] {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    cursor: pointer;
    color: #999;
    font-size: 16px;
    padding: 0;
    display: none;
}

    .clear-button:hover[b-1lh9q5k564] {
        color: #333;
    }

    .clear-button i[b-1lh9q5k564] {
        line-height: 1;
    }

.dataTable-input:not(:placeholder-shown) + .clear-button[b-1lh9q5k564] {
    display: inline-block;
}

.dataTable-top[b-1lh9q5k564] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1rem;    
}

@media (min-width: 769px) {
    .dataTable-top[b-1lh9q5k564] {
        padding-left: 0;
    }
}

.dataTable-dropdown[b-1lh9q5k564] {
    flex-shrink: 0;
    order: 1;
}

.dataTable-search[b-1lh9q5k564] {
    flex-shrink: 0;
    max-width: 300px;
    min-width: 200px;
    order: 2; 
    margin-left: auto;
}

.dataTable-input[b-1lh9q5k564] {
    width: 100%;
    max-width: 100%;
    padding-right: 40px;
}

/* Mobile-specific styles */
@media (max-width: 768px) {
    /* Make the top section completely vertical on mobile */
    .dataTable-top[b-1lh9q5k564] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .dataTable-dropdown[b-1lh9q5k564] {
        align-self: flex-start;
    }

        .dataTable-dropdown label[b-1lh9q5k564] {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 14px;
        }

    .dataTable-selector[b-1lh9q5k564] {
        flex-shrink: 0;
    }

    .dataTable-search[b-1lh9q5k564] {
        width: 100%;
        min-width: unset;
        max-width: unset;
        margin-left: 0;
    }

    .search-container[b-1lh9q5k564] {
        width: 100%;
    }

    .dataTable-input[b-1lh9q5k564] {
        width: 100%;
        padding: 8px 40px 8px 12px;
        font-size: 16px;
        border-radius: 4px;
        border: 1px solid #ccc;
    }

    .table-responsive[b-1lh9q5k564] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 -15px; /* Offset container padding */
        padding: 0 15px;
    }

    .dataTable-table[b-1lh9q5k564] {
        width: 100%;
        min-width: unset;
        table-layout: auto;
    }

        /* Make columns fit better on mobile */
        .dataTable-table th[b-1lh9q5k564],
        .dataTable-table td[b-1lh9q5k564] {
            padding: 8px 4px;
            font-size: 14px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 150px;
        }

    /* Center the entire pagination section on mobile */
    .dataTable-bottom[b-1lh9q5k564] {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        margin-top: 1rem;
    }

    /* Center the text "Showing x to y of z" */
    .dataTable-info[b-1lh9q5k564] {
        text-align: center;
        margin: 0;
        font-size: 14px;
    }

    /* Center pagination */
    .dataTable-pagination[b-1lh9q5k564] {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .dataTable-pagination-list[b-1lh9q5k564] {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 4px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .dataTable-pagination-list li[b-1lh9q5k564] {
            flex-shrink: 0;
        }

            .dataTable-pagination-list li a[b-1lh9q5k564] {
                padding: 8px 12px;
                font-size: 14px;
                min-width: 40px;
                text-align: center;
                display: flex;
                align-items: center;
                justify-content: center;
                text-decoration: none;
                border: 1px solid #ddd;
                background: white;
                color: #333;
                border-radius: 4px;
                cursor: pointer;
                transition: all 0.2s ease;
            }

                .dataTable-pagination-list li a:hover[b-1lh9q5k564] {
                    background: #f8f9fa;
                    border-color: #007bff;
                }

            .dataTable-pagination-list li.pager a[b-1lh9q5k564] {
                padding: 8px 10px;
                min-width: 36px;
                font-weight: bold;
            }

            .dataTable-pagination-list li.active a[b-1lh9q5k564] {
                font-weight: bold;
                background: #007bff;
                color: white;
                border-color: #007bff;
            }

                .dataTable-pagination-list li.active a:hover[b-1lh9q5k564] {
                    background: #0056b3;
                    border-color: #0056b3;
                }
}

/* Tablet styles */
@media (min-width: 769px) and (max-width: 1024px) {
    .dataTable-top[b-1lh9q5k564] {
        gap: 1rem;
    }

    .dataTable-search[b-1lh9q5k564] {
        max-width: 300px;
    }
}

.dataTable-wrapper[b-1lh9q5k564] {
    width: 100%;
    overflow: hidden;
}

.dataTable-container[b-1lh9q5k564] {
    width: 100%;
    overflow-x: auto;
}
/* /Features/Dashboard/DashboardPage.razor.rz.scp.css */
/* Search box sized like the one on the shows table, so both screens filter through the same-looking control. */
.dashboard-search[b-3mqv1tbl3m] {
    position: relative;
    width: 100%;
    max-width: 320px;
}

.dashboard-search .form-control[b-3mqv1tbl3m] {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}

/* The browser's own clear widget would sit on top of ours, and it cannot trigger the reload. */
.dashboard-search .form-control[b-3mqv1tbl3m]::-webkit-search-cancel-button {
    display: none;
}

.dashboard-search-icon[b-3mqv1tbl3m] {
    position: absolute;
    left: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: #8493a8;
    font-size: 0.8rem;
    pointer-events: none;
}

.dashboard-search-clear[b-3mqv1tbl3m] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    padding: 0.25rem;
    line-height: 1;
    color: #8493a8;
    cursor: pointer;
}

.dashboard-search-clear:hover[b-3mqv1tbl3m] {
    color: #344767;
}

.image-wrapper[b-3mqv1tbl3m] {
    position: relative;
}

.card-dates[b-3mqv1tbl3m] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    padding: 2rem 0.625rem 0.625rem;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.5) 55%, transparent 100%);
    border-bottom-left-radius: 0.75rem;
    border-bottom-right-radius: 0.75rem;
    pointer-events: none;
}

.date-badge[b-3mqv1tbl3m] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    max-width: 100%;
    padding: 0.15rem 0.45rem;
    border-radius: 0.4rem;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
}

.date-badge i[b-3mqv1tbl3m] {
    font-size: 0.68rem;
    opacity: 0.85;
}

.date-badge span[b-3mqv1tbl3m] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.date-badge.more[b-3mqv1tbl3m] {
    background: rgba(0, 0, 0, 0.25);
    font-weight: 500;
    opacity: 0.9;
}

/* Wrapper holds the card link plus the settings gear (a sibling, so the anchors are not nested). Lifting the
   wrapper on hover/focus moves the gear together with the card and signals the card is clickable. */
.dashboard-card-wrapper[b-3mqv1tbl3m] {
    position: relative;
    border-radius: 0.75rem;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.dashboard-card-wrapper:hover[b-3mqv1tbl3m],
.dashboard-card-wrapper:focus-within[b-3mqv1tbl3m] {
    transform: translateY(-4px);
    box-shadow: 0 0.5rem 1.5rem rgba(20, 20, 50, 0.2);
}

.dashboard-card-link[b-3mqv1tbl3m] {
    display: flex;
    flex-direction: column;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.dashboard-card-link:hover[b-3mqv1tbl3m],
.dashboard-card-link:focus[b-3mqv1tbl3m] {
    color: inherit;
}
/* /Features/Dashboard/PerformanceDetail/PerformanceDashboardPage.razor.rz.scp.css */
/* Container styled after the Argon Pro kanban columns (e.g. "Backlog", "In progress"). */
.sectors-panel[b-9gyj5hnftn] {
    background: #e9ecef;
    border-radius: 0.75rem;
    /* inline-block shrink-wraps to the card row reliably (fit-content collapses with
       a flex child in Chrome); max-width keeps it from overflowing the page. */
    display: inline-block;
    max-width: 100%;
}

.sectors-panel-header[b-9gyj5hnftn] {
    padding: 20px;
}

.sectors-panel-body[b-9gyj5hnftn] {
    padding: 0 20px 20px;
}

.sectors-grid[b-9gyj5hnftn] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    /* Center the cards when they wrap to a single column (mobile); no effect when the
       panel shrink-wraps the row exactly (desktop). */
    justify-content: center;
}

.sector-card[b-9gyj5hnftn] {
    /* Fixed width, no shrink: cards keep their size so the panel can shrink-wrap the row. Firefox ignores
       flex-basis when sizing the wrapped grid intrinsically, so width is what actually reaches the panel. */
    flex: 0 0 224px;
    width: 224px;
    max-width: 100%;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    /* The sector actions menu has to escape the card, which is narrower than the menu itself. */
    overflow: visible;
}

/* A sector taken off sale still shows its real occupancy, but reads as inactive next to the ones being sold. */
.sector-card-off-sale[b-9gyj5hnftn] {
    opacity: 0.6;
}

/* Reserves the gear button height so the card keeps the same size for users without ShowsManage, who never see it. */
.sector-card-header[b-9gyj5hnftn] {
    min-height: 2rem;
}

/* Same round gear used by the show view, so the actions affordance reads identically across the dashboard. */
.card-gear-button[b-9gyj5hnftn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: 50%;
    font-size: 0.875rem;
    line-height: 1;
    cursor: pointer;
    background: #fff;
    border: 1px solid #dde3ec;
    color: #5a6b82;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.3s ease;
}

.card-gear-button:hover[b-9gyj5hnftn],
.card-gear-button:focus-visible[b-9gyj5hnftn] {
    background: #f6f8fb;
    color: #344767;
    transform: rotate(90deg);
}

/* Everything that operates the performance lives on this bar, off the dark header: on white the channel state can be
   written out instead of being read from the colour of a switch. */
.operation-bar .card-body[b-9gyj5hnftn] {
    row-gap: 1rem;
}

.sale-channel-chip[b-9gyj5hnftn] {
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    padding: 0.5rem 0.875rem;
}

.sale-channel-icon[b-9gyj5hnftn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    background: #f0f2f5;
    color: #8392ab;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.sale-channel-icon-on[b-9gyj5hnftn] {
    background: #eef1fd;
    color: #5e72e4;
}

.sale-channel-name[b-9gyj5hnftn] {
    color: #344767;
    line-height: 1.3;
}

/* Argon's own .text-success sits at 1.33:1 on white, which is unreadable at this size; this green clears 4.5:1. */
.sale-channel-on[b-9gyj5hnftn] {
    color: #167f52;
    line-height: 1.3;
}

/* Darker than Argon's .text-secondary: this line carries the channel state, so it has to clear 4.5:1 at 12px. */
.sale-channel-off[b-9gyj5hnftn] {
    color: #67748e;
    line-height: 1.3;
}

/* Argon sizes the switch track with `height: 1.25em` but draws the knob at a fixed 1rem, so the knob spills out of the
   track whenever the inherited font-size is smaller than Argon assumes. Pinning both axes in absolute units fixes it. */
.sale-channel-switch[b-9gyj5hnftn] {
    padding-left: 0;
    min-height: 0;
}

.sale-channel-switch .form-check-input[b-9gyj5hnftn] {
    width: 2.5rem;
    /* The knob is absolutely positioned at top:1px, and `top` resolves against the padding box, not the border box.
       With box-sizing:border-box the track needs 1rem knob + 2px of gap + 2px of border = 1.25rem to centre it. */
    height: 1.25rem;
    margin: 0;
    flex-shrink: 0;
}

.channel-spinner[b-9gyj5hnftn] {
    width: 0.875rem;
    height: 0.875rem;
    border-width: 0.15em;
}

/* Dims the toggle while the change is in flight; the input is disabled too, this is the visible half of that. */
.channel-row-saving[b-9gyj5hnftn] {
    opacity: 0.65;
}

.sector-gauge[b-9gyj5hnftn] {
    position: relative;
    width: 112px;
    height: 112px;
}

.sector-gauge svg[b-9gyj5hnftn] {
    width: 100%;
    height: 100%;
    /* Start the arc at 12 o'clock instead of 3 o'clock. */
    transform: rotate(-90deg);
}

.sector-gauge-track[b-9gyj5hnftn] {
    fill: none;
    stroke: #e9ecef;
    stroke-width: 10;
}

.sector-gauge-fill[b-9gyj5hnftn] {
    fill: none;
    stroke: #5e72e4;
    stroke-width: 10;
    stroke-linecap: round;
    transition: stroke-dashoffset 0.6s ease;
}

.sector-gauge-label[b-9gyj5hnftn] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.1;
    color: #344767;
}

/* The state hangs from the percentage into the ring's hole instead of sitting under the card body: the sector grid is a
   flex row, so one extra line on a single card stretches every card beside it. The percentage stays anchored to the
   exact centre in every card, with or without a caption, so the numbers line up across the row. */
.sector-gauge-caption[b-9gyj5hnftn] {
    position: absolute;
    top: 50%;
    left: 50%;
    /* Clears half of the percentage's line box, so the caption starts right below it. */
    margin-top: 0.7rem;
    transform: translateX(-50%);
    width: max-content;
    /* Well inside the ~88px hole: a long caption wraps to two centred lines instead of touching the stroke. */
    max-width: 68px;
    font-size: 0.5625rem;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: center;
}

/* The ring and the caption carry the same colour so the state reads at a glance without a legend. */
.sector-gauge-sold-out .sector-gauge-fill[b-9gyj5hnftn],
.sector-gauge-sold-out .sector-gauge-caption[b-9gyj5hnftn] {
    stroke: #f5365c;
    color: #f5365c;
}

.sector-gauge-off-sale .sector-gauge-fill[b-9gyj5hnftn],
.sector-gauge-off-sale .sector-gauge-caption[b-9gyj5hnftn] {
    stroke: #8392ab;
    color: #8392ab;
}
/* /Features/Dashboard/ShowDetail/ShowDashboardPage.razor.rz.scp.css */
/* Container styled after the Argon Pro kanban columns (e.g. "Backlog", "In progress"). */
.board-panel[b-sfzwqhmayz] {
    background: #e9ecef;
    border-radius: 0.75rem;
    /* inline-block shrink-wraps to the card row reliably (fit-content collapses with
       a flex child in Chrome); max-width keeps it from overflowing the page. */
    display: inline-block;
    max-width: 100%;
}

.board-panel-header[b-sfzwqhmayz] {
    padding: 20px;
}

.board-panel-body[b-sfzwqhmayz] {
    padding: 0 20px 20px;
}

.functions-grid[b-sfzwqhmayz] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    /* Center the cards when they wrap to a single column (mobile); no effect when the
       panel shrink-wraps the row exactly (desktop). */
    justify-content: center;
}

.function-card[b-sfzwqhmayz] {
    /* Fixed width, no shrink: cards keep their size so the panel can shrink-wrap the row. Firefox ignores
       flex-basis when sizing the wrapped grid intrinsically, so width is what actually reaches the panel. */
    flex: 0 0 320px;
    width: 320px;
    max-width: 100%;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* The whole card is the link to the performance, so it has to shed the anchor's default colour and underline
   and pick up its own affordance instead. */
.function-card-link[b-sfzwqhmayz] {
    color: inherit;
    text-decoration: none;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.function-card-link:hover[b-sfzwqhmayz],
.function-card-link:focus-visible[b-sfzwqhmayz] {
    color: inherit;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

/* Round gear for the show-level actions menu, matching the one the dashboard cards use. */
.header-gear-button[b-sfzwqhmayz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: 50%;
    font-size: 0.875rem;
    line-height: 1;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    transition: background 0.15s ease, transform 0.3s ease;
}

.header-gear-button:hover[b-sfzwqhmayz],
.header-gear-button:focus-visible[b-sfzwqhmayz] {
    background: rgba(255, 255, 255, 0.3);
    transform: rotate(90deg);
}
/* /Features/Halls/Sections/Order/OrderSections.razor.rz.scp.css */
.section-item[b-isold12oih] {
    transition: transform 0.3s ease-out, opacity 0.3s ease-out;
}

    .section-item.moving-up[b-isold12oih] {
        animation: moveUp-b-isold12oih 0.3s ease-out;
    }

    .section-item.moving-down[b-isold12oih] {
        animation: moveDown-b-isold12oih 0.3s ease-out;
    }

@keyframes moveUp-b-isold12oih {
    0% {
        transform: translateY(100%);
        opacity: 0.5;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes moveDown-b-isold12oih {
    0% {
        transform: translateY(-100%);
        opacity: 0.5;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}
/* /Features/Halls/Templates/EditSections/EditSections.razor.rz.scp.css */
.btn-list[b-x4c66uz9cc] {
    width: 50px;
    padding-left: 8px;
    padding-right: 8px;
    min-width: 0px;
}

.section-item[b-x4c66uz9cc] {
    transition: all 0.3s ease-in-out;
    transform: translateY(0);
}

    .section-item.moving-up[b-x4c66uz9cc] {
        animation: slideUp-b-x4c66uz9cc 0.3s ease-in-out;
    }

    .section-item.moving-down[b-x4c66uz9cc] {
        animation: slideDown-b-x4c66uz9cc 0.3s ease-in-out;
    }

@keyframes slideUp-b-x4c66uz9cc {
    0% {
        transform: translateY(0);
        background-color: var(--bs-light);
    }

    50% {
        transform: translateY(-10px);
        background-color: var(--bs-primary-bg-subtle);
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }

    100% {
        transform: translateY(0);
        background-color: var(--bs-light);
    }
}

@keyframes slideDown-b-x4c66uz9cc {
    0% {
        transform: translateY(0);
        background-color: var(--bs-light);
    }

    50% {
        transform: translateY(10px);
        background-color: var(--bs-primary-bg-subtle);
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }

    100% {
        transform: translateY(0);
        background-color: var(--bs-light);
    }
}
/* /Features/PendingPickups/PendingPickupShows.razor.rz.scp.css */
/* Card holding the whole report. No overflow:hidden here, unlike the mockup: the show picker's dropdown
   lives inside this card and clipping would cut it off. */
.pending-card[b-zge1807qta] {
    background: #fff;
    border: 1px solid #e5e8ee;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(30, 40, 60, 0.1);
}

/* ── Filter ─────────────────────────────────────────────────────── */

.filter-block[b-zge1807qta] {
    padding: 22px 26px;
    border-bottom: 1px solid #edf0f4;
}

.filter-label[b-zge1807qta] {
    margin-bottom: 8px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #8a94a8;
}

/* The picker is a shared component, so its own width and control styling are overridden from here
   instead of being changed for every screen that uses it. */
.filter-block[b-zge1807qta]  .show-picker {
    min-width: 0;
}

.filter-block[b-zge1807qta]  .show-picker-input {
    height: auto;
    /* Right padding keeps clear of the picker's own clear button. */
    padding: 11px 2rem 11px 14px;
    font-size: 0.875rem;
    border-color: #d6dce5;
    border-radius: 8px;
    color: #20293a;
}

/* ── List ───────────────────────────────────────────────────────── */

.list-header[b-zge1807qta] {
    display: flex;
    justify-content: space-between;
    padding: 12px 26px;
    border-bottom: 1px solid #edf0f4;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: #8a94a8;
}

.show-group[b-zge1807qta] {
    border-bottom: 1px solid #edf0f4;
    /* Trailing breathing room so the last performance of a group does not touch the divider. */
    padding-bottom: 8px;
}

.show-group:last-child[b-zge1807qta] {
    border-bottom: 0;
}

.show-heading[b-zge1807qta] {
    padding: 14px 26px 4px;
}

.show-name[b-zge1807qta] {
    font-size: 0.9375rem;
    font-weight: 800;
    color: #20293a;
}

.show-subtitle[b-zge1807qta] {
    font-size: 0.78125rem;
    font-weight: 600;
    color: #8a94a8;
}

.performance-row[b-zge1807qta] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 26px 9px 44px;
    cursor: pointer;
}

.performance-row:hover[b-zge1807qta] {
    background: #f6f8fb;
}

.performance-date[b-zge1807qta] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #54617a;
}

.pending-count[b-zge1807qta] {
    min-width: 44px;
    padding: 4px 10px;
    border-radius: 14px;
    background: #eef1f6;
    color: #35496b;
    font-size: 0.8125rem;
    font-weight: 800;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.empty-state[b-zge1807qta] {
    padding: 3rem;
    text-align: center;
    color: #8a94a8;
}
/* /Features/Reports/ActiveEvents/ActiveEventsPage.razor.rz.scp.css */
/* Four narrow columns: on a wide monitor the amounts drift so far from the show name that the eye loses the row. */
.active-events-card[b-618sz7wydo] {
    max-width: 1100px;
}

.active-events-table[b-618sz7wydo] {
    width: 100%;
    border-collapse: collapse;
}

.active-events-table th[b-618sz7wydo] {
    padding: 0.75rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #8392ab;
    white-space: nowrap;
}

.active-events-table td[b-618sz7wydo] {
    padding: 0.6rem 1.5rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: baseline;
}

/* Alignment lives here rather than on Bootstrap's .text-end utilities: those carry !important and would win
   against the stacked mobile layout below. */
.active-events-table th:nth-child(n+2)[b-618sz7wydo],
.active-events-table td:nth-child(n+2)[b-618sz7wydo] {
    text-align: right;
    white-space: nowrap;
}

/* Once the card is capped at 1100px the columns sit close together, and the ticket count ends up brushing the
   occupancy figure of its own row. The extra gap keeps each number attached to its heading. */
.active-events-table th:nth-child(2)[b-618sz7wydo],
.active-events-table td:nth-child(2)[b-618sz7wydo] {
    padding-right: 2.5rem;
}

.show-name[b-618sz7wydo] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #344767;
}

.show-tickets[b-618sz7wydo],
.show-amount[b-618sz7wydo] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #344767;
}

.performance-date[b-618sz7wydo] {
    font-size: 0.75rem;
    color: #8392ab;
    margin-left: 0.5rem;
}

/* Detail rows sit under their show, so the date carries the indent instead of a separate column. */
.performance-date-detail[b-618sz7wydo] {
    margin-left: 1.5rem;
}

.performance-row td[b-618sz7wydo] {
    font-size: 0.8rem;
    color: #67748e;
    background-color: #fbfbfc;
}

.totals-row td[b-618sz7wydo] {
    font-size: 1rem;
    font-weight: 700;
    color: #344767;
    border-top: 2px solid #dee2e6;
    border-bottom: none;
}

.report-note[b-618sz7wydo] {
    font-size: 0.75rem;
    color: #8392ab;
    padding: 1rem 1.5rem 1.25rem;
    margin-bottom: 0;
}

/* Phones: four columns cannot fit in 360px. Rather than scroll sideways, each row stacks — show name on its own
   line, figures underneath — which is why the header row is dropped and the ticket count grows a label. */
@media (max-width: 767.98px) {
    .active-events-card[b-618sz7wydo] {
        max-width: none;
    }

    .active-events-table thead[b-618sz7wydo] {
        display: none;
    }

    .active-events-table tr[b-618sz7wydo] {
        display: grid;
        grid-template-columns: auto auto 1fr;
        column-gap: 0.75rem;
        align-items: baseline;
        padding: 0.7rem 1rem;
        border-bottom: 1px solid #f1f3f5;
    }

    .active-events-table td[b-618sz7wydo] {
        padding: 0;
        border-bottom: none;
    }

    .active-events-table td:first-child[b-618sz7wydo] {
        grid-column: 1 / -1;
        margin-bottom: 0.35rem;
    }

    .active-events-table td:nth-child(2)[b-618sz7wydo],
    .active-events-table td:nth-child(3)[b-618sz7wydo] {
        text-align: left;
    }

    /* Extra breathing room after the ticket count: pressed against the occupancy figure the two read as one blob
       and it stops being obvious which row each number belongs to. The padding reset needs this same selector —
       the generic "td { padding: 0 }" above is less specific and loses against the desktop rule. */
    .active-events-table td:nth-child(2)[b-618sz7wydo] {
        padding-right: 0;
        margin-right: 1rem;
    }

    .active-events-table td:nth-child(2)[b-618sz7wydo]::after {
        content: " " attr(data-label);
        font-size: 0.7rem;
        font-weight: 400;
        color: #8392ab;
    }

    /* Long show names must wrap instead of pushing the row wider than the screen. */
    .show-name[b-618sz7wydo] {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .performance-date[b-618sz7wydo] {
        display: block;
        margin-left: 0;
        margin-top: 0.15rem;
    }

    /* The whole detail row indents, not just its date: with only the date moved, a performance's figures lined up
       with the show's own and stopped reading as belonging to that performance. The selector needs two classes to
       outweigh the ".active-events-table tr" padding above. */
    .active-events-table .performance-row[b-618sz7wydo] {
        padding-left: 2rem;
    }

    .performance-date-detail[b-618sz7wydo] {
        margin-left: 0;
    }

    .totals-row td[b-618sz7wydo] {
        border-top: none;
    }

    .totals-row[b-618sz7wydo] {
        border-top: 2px solid #dee2e6;
    }

    .report-note[b-618sz7wydo] {
        padding: 0.75rem 1rem 1rem;
    }
}
/* /Features/Reports/ActiveEvents/OccupancyCell.razor.rz.scp.css */
.occupancy[b-8avmvflgc3] {
    font-weight: 700;
    font-size: 0.875rem;
}

.occupancy-high[b-8avmvflgc3] {
    color: #2dce89;
}

.occupancy-medium[b-8avmvflgc3] {
    color: #fb6340;
}

.occupancy-low[b-8avmvflgc3] {
    color: #f5365c;
}

.occupancy-unknown[b-8avmvflgc3] {
    color: #adb5bd;
}

.seats-for-sale[b-8avmvflgc3] {
    display: block;
    font-size: 0.7rem;
    color: #8392ab;
    line-height: 1.1;
}

/* Phones read the row as stacked lines, so the capacity sits beside the percentage instead of under it. */
@media (max-width: 767.98px) {
    .seats-for-sale[b-8avmvflgc3] {
        display: inline;
        white-space: nowrap;
        margin-left: 0.25rem;
    }
}
/* /Features/Reports/HoldsReport/HoldsReportPage.razor.rz.scp.css */
.filter-field[b-fkyiu12is9] {
    flex: 1 1 200px;
    max-width: 250px;
}

.holds-table[b-fkyiu12is9] {
    width: 100%;
    table-layout: auto;
}

.comment-cell-td[b-fkyiu12is9] {
    width: 100%;
    max-width: 0;
}

.comment-cell[b-fkyiu12is9] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Features/Reports/InvitationsReport/InvitationsReportPage.razor.rz.scp.css */
.filter-field[b-7rpjykq2w8] {
    flex: 1 1 200px;
    max-width: 250px;
}
/* /Features/Reports/SalesSummaryV2/SalesSummaryV2Page.razor.rz.scp.css */
/* ── KPI strip ──────────────────────────────────────────────────── */

.kpi-strip[b-8su6lnjcky] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    padding: 18px 24px;
    border-top: 1px solid #f0f2f5;
    border-bottom: 1px solid #f0f2f5;
}

.kpi[b-8su6lnjcky] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kpi + .kpi[b-8su6lnjcky] {
    border-left: 1px solid #f0f2f5;
    padding-left: 24px;
}

.kpi-label[b-8su6lnjcky] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #8392ab;
    text-transform: uppercase;
}

.kpi-value[b-8su6lnjcky] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #344767;
    font-variant-numeric: tabular-nums;
}

.kpi-meta[b-8su6lnjcky] {
    font-size: 0.75rem;
    color: #67748e;
}

/* ── Grid table ─────────────────────────────────────────────────── */

/* One column per sales channel makes the table wider than the card on small screens; it scrolls
   sideways instead of squeezing the columns. --grid-columns and --grid-min-width come from the component. */
.sales-table[b-8su6lnjcky] {
    overflow-x: auto;
}

.grid-row[b-8su6lnjcky] {
    display: grid;
    grid-template-columns: var(--grid-columns);
    align-items: center;
    min-width: var(--grid-min-width);
    padding: 13px 24px;
}

.header-row[b-8su6lnjcky] {
    padding: 12px 24px 8px;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #8392ab;
    text-transform: uppercase;
}

.channel-heading[b-8su6lnjcky] {
    text-align: center;
    border-left: 1px solid #f0f2f5;
}

/* ── Show row ───────────────────────────────────────────────────── */

/* Matches the rows' min-width so the top border and the grey performances band still span the full
   table when it is scrolled sideways, instead of stopping at the visible edge. */
.show-block[b-8su6lnjcky] {
    border-top: 1px solid #f0f2f5;
    min-width: var(--grid-min-width);
}

.show-row[b-8su6lnjcky] {
    cursor: pointer;
}

.show-row:hover[b-8su6lnjcky] {
    background: #fafbfe;
}

.show-name-cell[b-8su6lnjcky] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.chevron[b-8su6lnjcky] {
    width: 14px;
    font-size: 0.6875rem;
    color: #8392ab;
    flex-shrink: 0;
}

.show-name[b-8su6lnjcky] {
    font-size: 0.875rem;
    font-weight: 700;
    color: #344767;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.performance-count[b-8su6lnjcky] {
    font-size: 0.6875rem;
    color: #8392ab;
    background: #f0f2f5;
    border-radius: 999px;
    padding: 2px 9px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Value cells (qty left, amount right) ───────────────────────── */

.value-cell[b-8su6lnjcky] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    border-left: 1px solid #f0f2f5;
    padding: 0 4px 0 14px;
}

.value-cell-total[b-8su6lnjcky] {
    padding-right: 0;
}

.value-qty[b-8su6lnjcky] {
    font-size: 0.75rem;
    color: #8392ab;
    font-variant-numeric: tabular-nums;
}

.value-amount[b-8su6lnjcky] {
    font-size: 0.84375rem;
    font-weight: 600;
    color: #344767;
    font-variant-numeric: tabular-nums;
}

.value-cell-total .value-amount[b-8su6lnjcky] {
    font-weight: 700;
}

/* Performance rows sit on the grey band, so their figures step down in weight and contrast. */
.value-cell-performance[b-8su6lnjcky] {
    border-left-color: #eef0f4;
}

.value-cell-performance .value-qty[b-8su6lnjcky] {
    font-size: 0.71875rem;
    color: #a9b4c9;
}

.value-cell-performance .value-amount[b-8su6lnjcky] {
    font-size: 0.78125rem;
    color: #495a7c;
}

.value-cell-performance.value-cell-total .value-amount[b-8su6lnjcky] {
    color: #344767;
}

/* ── Performances (expanded) ────────────────────────────────────── */

.performances[b-8su6lnjcky] {
    background: #f8f9fa;
}

.performance-block[b-8su6lnjcky] {
    border-top: 1px solid #eef0f4;
}

.performance-row[b-8su6lnjcky] {
    padding: 10px 24px 8px;
}

.performance-date[b-8su6lnjcky] {
    font-size: 0.78125rem;
    font-weight: 600;
    color: #67748e;
    padding-left: 24px;
}

/* ── Payment method chips, grouped by point of sale ─────────────── */

.payment-strip[b-8su6lnjcky] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex-wrap: wrap;
    padding: 0 24px 10px 48px;
}

.payment-group[b-8su6lnjcky] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-right: 10px;
}

.payment-group-label[b-8su6lnjcky] {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #8392ab;
    text-transform: uppercase;
}

.payment-chip[b-8su6lnjcky] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e6e9f0;
    border-radius: 999px;
    padding: 3px 10px;
}

.payment-dot[b-8su6lnjcky] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.payment-name[b-8su6lnjcky] {
    font-size: 0.71875rem;
    color: #67748e;
}

.payment-value[b-8su6lnjcky] {
    font-size: 0.71875rem;
    font-weight: 700;
    color: #344767;
    font-variant-numeric: tabular-nums;
}

/* ── Grand total ────────────────────────────────────────────────── */

.total-row[b-8su6lnjcky] {
    border-top: 2px solid #344767;
    padding: 14px 24px;
}

.total-label[b-8su6lnjcky] {
    font-size: 0.875rem;
    font-weight: 800;
    color: #344767;
    padding-left: 24px;
}

.total-row .value-cell[b-8su6lnjcky] {
    border-left: 0;
}

.total-row .value-amount[b-8su6lnjcky] {
    font-weight: 700;
}

.total-row .value-cell-total .value-amount[b-8su6lnjcky] {
    font-size: 0.875rem;
    font-weight: 800;
}

.footnote[b-8su6lnjcky] {
    margin: 0;
    padding: 10px 24px 16px;
    font-size: 0.6875rem;
    color: #8392ab;
}
/* /Features/Reports/ShowSales/ShowSalesPage.razor.rz.scp.css */
.kpi-row[b-10cuz17e51] {
    font-size: 0.75rem;
    color: #67748e;
}

.kpi-row strong[b-10cuz17e51] {
    color: #344767;
    font-size: 0.875rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.master-detail[b-10cuz17e51] {
    display: flex;
    border-top: 1px solid #f0f2f5;
}

/* ── Master: shows list ─────────────────────────────────────────── */

.shows-list[b-10cuz17e51] {
    width: 380px;
    flex-shrink: 0;
    border-right: 1px solid #f0f2f5;
}

.show-item[b-10cuz17e51] {
    padding: 13px 20px 13px 17px;
    border-left: 3px solid transparent;
    border-bottom: 1px solid #f0f2f5;
    cursor: pointer;
}

.show-item:hover[b-10cuz17e51] {
    background: #f6f8ff;
}

.show-item-selected[b-10cuz17e51] {
    border-left-color: #5e72e4;
    background: #f6f8ff;
}

.show-item-line[b-10cuz17e51] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}

.show-item-line + .show-item-line[b-10cuz17e51] {
    margin-top: 2px;
}

.show-item-name[b-10cuz17e51] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #344767;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.show-item-amount[b-10cuz17e51] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #344767;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.show-item-meta[b-10cuz17e51] {
    font-size: 0.6875rem;
    color: #8392ab;
}

.channel-bar[b-10cuz17e51] {
    height: 4px;
    border-radius: 2px;
    background: #edf0f5;
    margin-top: 8px;
    overflow: hidden;
}

.channel-bar-online[b-10cuz17e51] {
    height: 100%;
    background: #5e72e4;
}

.channel-legend[b-10cuz17e51] {
    padding: 12px 20px;
    display: flex;
    gap: 14px;
    align-items: center;
    font-size: 0.6875rem;
    color: #8392ab;
}

.channel-legend-item[b-10cuz17e51] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.legend-swatch[b-10cuz17e51] {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    display: inline-block;
}

.legend-swatch-online[b-10cuz17e51] {
    background: #5e72e4;
}

.legend-swatch-box-office[b-10cuz17e51] {
    background: #edf0f5;
    border: 1px solid #d9dee8;
}

/* ── Detail: selected show ──────────────────────────────────────── */

.show-detail[b-10cuz17e51] {
    flex: 1;
    padding: 26px 30px;
    min-width: 0;
}

.show-detail-name[b-10cuz17e51] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 800;
    color: #344767;
}

.show-detail-date[b-10cuz17e51] {
    margin: 4px 0 0;
    font-size: 0.8125rem;
    color: #67748e;
}

.channel-cards[b-10cuz17e51] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.channel-card[b-10cuz17e51] {
    border: 1px solid #f0f2f5;
    border-radius: 10px;
    padding: 14px 16px;
}

.channel-card-total[b-10cuz17e51] {
    background: #f8f9fa;
}

.channel-card-label[b-10cuz17e51] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #8392ab;
    text-transform: uppercase;
}

.channel-card-amount[b-10cuz17e51] {
    margin-top: 2px;
    font-size: 1.25rem;
    font-weight: 800;
    color: #344767;
    font-variant-numeric: tabular-nums;
}

.channel-card-tickets[b-10cuz17e51] {
    font-size: 0.75rem;
    color: #67748e;
}

/* ── Payment methods with proportion bars ───────────────────────── */

.payment-methods-header[b-10cuz17e51] {
    margin-top: 26px;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #8392ab;
    text-transform: uppercase;
}

.payment-methods[b-10cuz17e51] {
    margin-top: 8px;
}

.payment-method-row[b-10cuz17e51] {
    display: grid;
    grid-template-columns: minmax(140px, 200px) minmax(60px, 1fr) 70px 110px;
    align-items: center;
    gap: 14px;
    padding: 9px 0;
    border-bottom: 1px solid #f6f7fa;
}

.payment-method-name[b-10cuz17e51] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8125rem;
    color: #344767;
    min-width: 0;
}

.payment-method-dot[b-10cuz17e51] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.payment-method-name-text[b-10cuz17e51] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payment-method-bar[b-10cuz17e51] {
    display: block;
    height: 8px;
    border-radius: 4px;
    background: #edf0f5;
    overflow: hidden;
}

.payment-method-bar-fill[b-10cuz17e51] {
    display: block;
    height: 100%;
    border-radius: 4px;
}

.payment-method-qty[b-10cuz17e51] {
    font-size: 0.75rem;
    color: #8392ab;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.payment-method-amount[b-10cuz17e51] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #344767;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ── Per-performance sections (shows with more than one) ────────── */

.performance-section[b-10cuz17e51] {
    margin-top: 26px;
    padding-top: 4px;
}

.performance-section + .performance-section[b-10cuz17e51] {
    border-top: 1px solid #f0f2f5;
}

.performance-section .payment-methods-header[b-10cuz17e51] {
    margin-top: 14px;
}

.performance-header[b-10cuz17e51] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
}

.performance-date[b-10cuz17e51] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #344767;
}

.performance-channel-totals[b-10cuz17e51] {
    display: inline-flex;
    gap: 18px;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: #67748e;
}

.performance-channel strong[b-10cuz17e51] {
    color: #344767;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.online-note[b-10cuz17e51] {
    margin: 18px 0 0;
    font-size: 0.6875rem;
    color: #8392ab;
}

/* ── Responsive: stack the panes on narrow screens ──────────────── */

@media (max-width: 991.98px) {
    .master-detail[b-10cuz17e51] {
        flex-direction: column;
    }

    .shows-list[b-10cuz17e51] {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid #f0f2f5;
    }

    .show-detail[b-10cuz17e51] {
        padding: 20px;
    }

    .payment-method-row[b-10cuz17e51] {
        grid-template-columns: minmax(110px, 160px) minmax(40px, 1fr) 55px 95px;
        gap: 10px;
    }
}
/* /Features/Shows/Create/CreateShow.razor.rz.scp.css */
/* Progress bar. It renders as the top of the step card: rounded only above, and the panel below squares its own top corners */
.multisteps-form__progress[b-t85hr7ut5n] {
    background-color: white;
    border-radius: 15px 15px 0 0;
    padding: 14px 20px 10px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    border-bottom: 1px solid #e9ecef;
    box-shadow: 0 0 2rem 0 rgba(136, 152, 170, 0.15); /* matches .card, otherwise the seam looks narrower than the panel */
}

.multisteps-form__panel[b-t85hr7ut5n] {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

/* The step title competes with the progress bar for the fold on 768px-tall screens */
.multisteps-form__panel h5[b-t85hr7ut5n] {
    font-size: 1rem;
    margin-bottom: 0.25rem;
}

/* The sector name and its price share one row, so the input needs a fixed width instead of the input-group default of 100% */
.sector-price-input[b-t85hr7ut5n] {
    flex: 0 0 130px;
    width: 130px;
}

/* Both heights are reserved up front: the price feedback appears as the user types, and h-100 would push the
   whole row down at that moment. Reserving costs nothing once every price is loaded, which is the end state */
.sector-row[b-t85hr7ut5n] {
    min-height: 2rem;
}

.sector-note[b-t85hr7ut5n] {
    min-height: 2.25rem;
}

/* Argon's .bg-primary ignores --bs-bg-opacity, so bg-opacity-10 painted a solid blue that hid the text.
   These three colors clear WCAG AA against the tint: 5.42:1, 4.87:1 and 8.32:1 */
.sector-selected[b-t85hr7ut5n] {
    background-color: #eff1fc;
    border-color: #5e72e4 !important;
}

.sector-price-note[b-t85hr7ut5n] {
    color: #177046;
}

.sector-words-note[b-t85hr7ut5n] {
    color: #5a6a85;
}

/* Hide steps text in small devices*/
@media (max-width: 660px) {
    .multisteps-form__progress-btn span[b-t85hr7ut5n] {
        display: none;
    }
}

/* Points of sale, payment methods, discounts and surcharges: two columns while the column is wide enough for them */
.checkbox-grid[b-t85hr7ut5n] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
}

@media (max-width: 420px) {
    .checkbox-grid[b-t85hr7ut5n] {
        grid-template-columns: 1fr;
    }
}

/* Fixed height for checkbox labels */
.checkbox-label-fixed-height[b-t85hr7ut5n] {
    min-height: 2.5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Prevent user interaction with header steps */
.multisteps-form__progress-btn[b-t85hr7ut5n] {
    pointer-events: none;
    cursor: default;
}

/* Half width keeps the preview from pushing the wizard buttons below the fold; the aspect ratio halves the height too */
.hall-image-preview[b-t85hr7ut5n] {
    aspect-ratio: 4 / 3;
    max-width: 50%;
}
/* /Features/Shows/HallImage/EditShowHallImage.razor.rz.scp.css */
.image-option[b-x81ej323vy] {
    position: relative;
    aspect-ratio: 4 / 3;
    border: 3px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .image-option:hover[b-x81ej323vy] {
        border-color: #adb5bd;
        transform: scale(1.02);
    }

    .image-option.selected[b-x81ej323vy] {
        border-color: #5e72e4;
        box-shadow: 0 0 0 3px rgba(94, 114, 228, 0.25);
    }

    .image-option img[b-x81ej323vy] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.image-placeholder[b-x81ej323vy] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #f0f2f5;
}

.selection-indicator[b-x81ej323vy] {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background-color: #5e72e4;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
/* /Features/Shows/Performances/ChangePrices/ChangePerformancePrices.razor.rz.scp.css */
/* Remove spinner arrows from number input */
input[type="number"].no-spinner[b-6q344dxgl1]::-webkit-inner-spin-button,
input[type="number"].no-spinner[b-6q344dxgl1]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"].no-spinner[b-6q344dxgl1] {
    -moz-appearance: textfield;
}
/* /Features/Shows/Performances/ManageCapacityReservations/ManageCapacityReservations.razor.rz.scp.css */
.capacity-indicator[b-2gwsn7qapv] {
    width: 10px;
    height: 10px;
}

.capacity-summary[b-2gwsn7qapv] {
    max-width: 250px;
}

.btn-modify[b-2gwsn7qapv] {
    max-width: 150px;
}

/* Form controls do not inherit the page font, so the display-1 class alone would not match the previous heading.
   The width is intrinsic on purpose: a percentage would shrink-to-fit the flex parent and clip the larger numbers */
.held-input[b-2gwsn7qapv] {
    display: block; /* an inline-block input would flow next to its label instead of below it */
    width: 280px;
    margin: 0 auto;
    padding: 0 0.5rem;
    font-family: inherit;
    line-height: 1.2;
    text-align: center;
    color: #344767;
    background-color: transparent;
    border: 1px solid #d2d6da;
    border-radius: 0.5rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.held-input:hover:not(:disabled)[b-2gwsn7qapv] {
    border-color: #8392ab;
}

.held-input:focus[b-2gwsn7qapv] {
    outline: 0;
    border-color: #5e72e4;
    box-shadow: 0 0 0 2px rgba(94, 114, 228, 0.25);
}

.held-input.is-invalid[b-2gwsn7qapv], .held-input.is-invalid:focus[b-2gwsn7qapv] {
    border-color: #ea0606;
    box-shadow: 0 0 0 2px rgba(234, 6, 6, 0.2);
}

.held-input:disabled[b-2gwsn7qapv] {
    opacity: 0.6;
}

@media (max-width: 575.98px) {
    .held-input[b-2gwsn7qapv] {
        width: 180px;
    }
}
/* /Features/Shows/Performances/ManageSections/ManagePerformanceSections.razor.rz.scp.css */
/* Argon applies `white-space: nowrap` to every td and th, so headers like "MARCAR COMO AGOTADO" alone force the table
   wider than its card and trigger a horizontal scrollbar even with room to spare. Only the headers need to wrap —
   the data cells stay on one line so prices and switches never break mid-value. */
.table thead th[b-09058iezwh] {
    white-space: normal;
    padding-left: 1rem;
    padding-right: 1rem;
}

.order-btn[b-09058iezwh] {
    min-width: 30px;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    margin-top: 0;
    margin-bottom: 0;
    aspect-ratio: 1 / 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* /Features/Users/Create/CreateUser.razor.rz.scp.css */
.btnSend[b-2ijb4mluhb] {
    min-width: 120px;
}
/* /Layout/Notifications.razor.rz.scp.css */
.alert[b-q9e7bk4gr3] {
    position: fixed;
    bottom: 20px;
    right: 20px;
    min-width: 250px;
    z-index: 1050;
    opacity: 1;
    transition: opacity 0.5s ease-out;
    width: 300px;
}

.alert.fade-out[b-q9e7bk4gr3] {
    opacity: 0;
}

.alert-text[b-q9e7bk4gr3]{
    margin-left: 10px;
}