/* =============================================================================
   Dashboard card shell: grid, card chrome, titles, corners, table-scroll inset
   Extracted from style.css (move-only). Depends on style.css tokens + dashboard-cards.css.
   ============================================================================= */

/* Dashboard Grid - 2 колонки */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-bottom: 2rem;
}

/*
 * Dashboard Card: единые поля у прямого `.card-body` (переменные --card-inline-padding / --card-inline-padding-end),
 * «вылет» таблиц — `.dashboard-card .table-scroll-wrapper`.
 */
.dashboard-card {
    overflow: hidden;
    transition: var(--transition);
    position: relative;
}

/* Для dropdown фильтра над таблицей бронирований / полей пробного бронирования: не обрезать при open-up */
#sellerBookingsCard,
#sellerBookingCard,
#providerBookingsCard,
#providerSeatsAvailabilityCard,
#sellerSeatsAvailabilityCard {
    overflow: visible;
}

/* Базовые стили всех h3 по проекту */
h3 {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--text-color);
    text-transform: uppercase;
    margin: 0 0 0.75rem;
    padding: 0;
}

/* Заголовки внутри карточек: класс `.card-title`; кегль — var(--card-title-font-size, 1.2rem) из :root */
.card-title {
    font-size: var(--card-title-font-size, 1.2rem);
    font-weight: 500;
    line-height: 1.35;
    color: var(--text-color);
    text-transform: uppercase;
    margin: 0 0 1rem;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-title i {
    flex-shrink: 0;
    color: var(--primary-color);
}

.card-title svg {
    flex-shrink: 0;
    color: var(--accent-color);
}

/* Заголовок карточки + действия (развернуть на весь экран) */
.dashboard-card-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.dashboard-card-heading .card-title {
    margin-bottom: 0;
    flex: 1;
    min-width: 0;
    display: block;
}

[data-bs-theme="dark"] .card-arrow::before,
[data-bs-theme="dark"] .card-arrow::after {
    background: rgba(255, 255, 255, 0.4);
}

/* Прямой .card-body: поля и переменные для .table-scroll-wrapper / чипов (см. комментарий у .dashboard-card). */
.dashboard-card > .card-body {
    position: relative;
    z-index: 0;
    --card-inline-padding: 1rem;
    --card-inline-padding-end: var(--booking-max-view-inset);
    padding: 1rem var(--card-inline-padding-end) 1rem var(--card-inline-padding);
}

/* Card Body */
.card-body {
    --card-inline-padding: 1rem;
    padding: 1rem;
    position: relative;
}

/* Углы карточек (dashboard-card, stat-card-colored) */
.card-arrow {
    position: absolute;
    z-index: 3;
    pointer-events: none;
}

.card-arrow-top-left, .card-arrow-top-right, .card-arrow-bottom-left, .card-arrow-bottom-right {
    width: 10px;
    height: 10px;
    position: absolute;
}

.card-arrow-top-left, .card-arrow-top-right {
    top: 0;
}

.card-arrow-bottom-left, .card-arrow-bottom-right {
    bottom: 0;
}

.card-arrow-top-left, .card-arrow-bottom-left, .card-arrow-top-left::before, .card-arrow-top-left::after, .card-arrow-bottom-left::before, .card-arrow-bottom-left::after {
    left: 0;
}

.card-arrow-top-right, .card-arrow-bottom-right, .card-arrow-top-right::before, .card-arrow-top-right::after, .card-arrow-bottom-right::before, .card-arrow-bottom-right::after {
    right: 0;
}

.card-arrow::before {
    content: "";
    position: absolute;
    width: 2px;
    height: 8px;
    background: var(--border-color);
}

.card-arrow::after {
    content: "";
    position: absolute;
    width: 10px;
    height: 2px;
    background: var(--border-color);
}

html:not([data-bs-theme="dark"]) .card-arrow::before,
html:not([data-bs-theme="dark"]) .card-arrow::after {
    background: rgba(85, 85, 85, 0.55);
}

.card-arrow-top-left::before, .card-arrow-top-right::before {
    top: 2px;
}

.card-arrow-top-left::after, .card-arrow-top-right::after {
    top: 0;
}

.card-arrow-bottom-left::before, .card-arrow-bottom-right::before {
    bottom: 2px;
}

.card-arrow-bottom-left::after, .card-arrow-bottom-right::after {
    bottom: 0;
}

/* Table Scroll Wrapper */
.table-scroll-wrapper {
    width: calc(100% + 2 * var(--card-inline-padding, 1rem));
    margin-left: calc(-1 * var(--card-inline-padding, 1rem));
    margin-right: calc(-1 * var(--card-inline-padding, 1rem));
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-gutter: auto;
    padding-bottom: calc(var(--card-scrollbar-offset) + var(--scrollbar-height));
    box-sizing: border-box;
}

.dashboard-card .table-scroll-wrapper {
    width: calc(100% + var(--card-inline-padding, 1rem) + var(--card-inline-padding-end, var(--booking-max-view-inset)));
    margin-left: calc(-1 * var(--card-inline-padding, 1rem));
    margin-right: calc(-1 * var(--card-inline-padding-end, var(--booking-max-view-inset)));
}

@supports not (scrollbar-gutter: stable) {
    .table-scroll-wrapper {
        overflow-x: scroll;
    }
}

/* Fullscreen: без отрицательных margin — иначе таблица вылезает за правый край вьюпорта. */
.dashboard-card.dashboard-card--maximized :is(.table-scroll-wrapper, .viva-split-table-scroll) {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}

.dashboard-card.dashboard-card--maximized .table-scroll-wrapper:not(.viva-split-table-scroll) {
    overflow-y: auto;
}

.dashboard-card .viva-modal-scrollbar:not(.table-scroll-wrapper) {
    padding-bottom: var(--card-scrollbar-offset);
    box-sizing: border-box;
}