/* Shared surface treatment, loaded after page styles in every application shell. */
:root {
    /* One shared rhythm for panels, cards, and page sections (12px). */
    --bt-surface-space: var(--bt-space-3, .75rem);
    --bt-edge-shadow: 0 0 0 1px rgba(15, 35, 60, .055);
    --bt-shadow-xs: var(--bt-edge-shadow), 0 1px 2px rgba(15, 35, 60, .035);
    --bt-shadow-sm: var(--bt-edge-shadow), 0 2px 5px rgba(15, 35, 60, .045);
    --bt-shadow-card: var(--bt-edge-shadow), 0 2px 4px rgba(15, 35, 60, .025), 0 5px 14px rgba(15, 35, 60, .035);
    --bt-shadow-md: var(--bt-edge-shadow), 0 4px 12px rgba(15, 35, 60, .065);
    --bt-shadow-lg: var(--bt-edge-shadow), 0 8px 24px rgba(15, 35, 60, .10);
    --bt-focus-shadow: 0 0 0 3px rgba(20, 120, 166, .25);
    --bt-heading-shadow: 0 1px 0 rgba(15, 35, 60, .045), 0 4px 8px -4px rgba(15, 35, 60, .16);
}

html[data-theme="light"] {
    --bt-edge-shadow: 0 0 0 1px rgba(41, 67, 91, .10);
    --bt-shadow-xs: var(--bt-edge-shadow), 0 1px 3px rgba(15, 35, 60, .045);
    --bt-shadow-sm: var(--bt-edge-shadow), 0 3px 9px rgba(15, 35, 60, .06);
    --bt-shadow-card: var(--bt-edge-shadow), 0 3px 8px rgba(15, 35, 60, .045), 0 10px 22px rgba(15, 35, 60, .04);
    --bt-shadow-md: var(--bt-edge-shadow), 0 7px 18px rgba(15, 35, 60, .085);
    --bt-shadow-lg: var(--bt-edge-shadow), 0 14px 34px rgba(15, 35, 60, .12);
    --bt-heading-shadow: 0 1px 0 rgba(41, 67, 91, .10), 0 5px 10px -6px rgba(15, 35, 60, .18);
}

html[data-theme="dark"] {
    --bt-edge-shadow: 0 0 0 1px rgba(182, 204, 235, .075);
    --bt-shadow-xs: var(--bt-edge-shadow), 0 1px 2px rgba(0, 0, 0, .12);
    --bt-shadow-sm: var(--bt-edge-shadow), 0 2px 5px rgba(0, 0, 0, .16);
    --bt-shadow-card: var(--bt-edge-shadow), 0 2px 4px rgba(0, 0, 0, .10), 0 5px 14px rgba(0, 0, 0, .12);
    --bt-shadow-md: var(--bt-edge-shadow), 0 4px 12px rgba(0, 0, 0, .22);
    --bt-shadow-lg: var(--bt-edge-shadow), 0 8px 24px rgba(0, 0, 0, .28);
    --bt-focus-shadow: 0 0 0 3px rgba(34, 211, 238, .3);
    --bt-heading-shadow: 0 1px 0 rgba(182, 204, 235, .09), 0 4px 8px -4px rgba(0, 0, 0, .45);
}

/* Listing sections use one 12px gap even when legacy views carry mb-4. */
html body .page-wrapper > .bt-filter-card {
    margin-bottom: var(--bt-surface-space) !important;
}

/* Explicit surface classes avoid decorating structural grids and layout wrappers. */
html body :is(.app-card, .card, .stat-card, .chart-card, .info-tile,
    .listing-preference-toolbar, .planning-item-card, .document-library-card,
    .credential-card, .agent-card, .agent-connect-card, .agent-content-card,
    .agent-api-strip, .agent-token-reveal, .agent-console-hero, .auth-card) {
    border: 0 !important;
    box-shadow: var(--bt-shadow-card) !important;
}
html body .listing-preference-toolbar {
    background: var(--bt-surface) !important;
}
html body :is(.modal-content, .offcanvas, .dropdown-menu, .popover, .daterangepicker) {
    border: 0 !important;
    box-shadow: var(--bt-shadow-lg) !important;
}
html body :is(.app-card-header, .app-card-footer, .card-header, .card-footer,
    .listing-card-footer, .modal-header, .modal-footer, .offcanvas-header) {
    border: 0 !important;
    box-shadow: none !important;
    background-color: var(--bt-surface-2);
}
html body :is(.app-card-header, .card-header, .modal-header, .offcanvas-header,
    .fc-modal > header, .ticket-transfer-dialog > header, .calendar-drawer-header) {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    border: 0 !important;
    background-color: var(--bt-surface-2);
    box-shadow: var(--bt-heading-shadow) !important;
}
html body :is(.sidebar, .workspace-topbar, .mobile-topbar) {
    border: 0 !important;
    box-shadow: var(--bt-shadow-sm) !important;
}
html body :is(.btn, .page-link, .listing-item-trigger, .listing-view-toggle button) {
    border: 0 !important;
    box-shadow: var(--bt-shadow-xs) !important;
}
html body .listing-view-toggle {
    border: 0 !important;
    background: var(--bt-surface-2);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bt-ink) 5%, transparent);
}
html body .listing-view-toggle button:not(.is-active) {
    box-shadow: none !important;
}
@media (hover: hover) {
    html body :is(.btn, .page-link, .listing-item-trigger):not(:disabled):hover,
    html body .listing-view-toggle button:hover {
        box-shadow: var(--bt-shadow-sm) !important;
    }
    html body .personalized-listing .personalized-listing-item:hover :is(.listing-card-shell, .ticket-card) {
        box-shadow: var(--bt-shadow-md) !important;
    }
}
html body :is(.btn, .page-link, .listing-item-trigger, .listing-view-toggle button):focus-visible {
    outline: 0;
    box-shadow: var(--bt-shadow-xs), var(--bt-focus-shadow) !important;
}
html body .listing-item-trigger.is-active {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bt-warning) 20%, transparent) !important;
}
/* A table has one surface; its wrappers must not stack shadows in grid mode. */
html body .bt-datatable-native-scroll {
    border: 0 !important;
    box-shadow: var(--bt-edge-shadow);
}
html body .listing-view-grid :is(.bt-datatable-native-scroll, .dataTables_scroll, .dataTables_scrollBody) {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
@media (min-width: 768px) {
    /* Match both overflow axes: overflow-x:hidden also makes overflow-y:auto.
       These wrappers surround the first card and otherwise crop its shadow. */
    html body .personalized-listing.listing-view-grid :is(.app-table-wrap.has-datatable,
        .dataTables_wrapper, .bt-datatable, .bt-datatable-native-scroll,
        .dataTables_scroll, .dataTables_scrollBody) {
        overflow: visible !important;
    }
}
html body .profile-agents-panel {
    border: 0 !important;
    box-shadow: none !important;
}
/* The migrated modules use Tickets' compact mobile cards, independent of
   the saved desktop mode. Keep the desktop card payload out of expanded rows. */
@media (max-width: 767.98px) {
    html body .listing-mobile-grid-only { display:none !important; }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table {
        table-layout:auto !important;
        max-width:100% !important;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table tbody td.dt-card-cell {
        display:none !important;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table tbody tr:not(.bt-mobile-empty-row) {
        isolation:isolate;
        padding-top:4.1rem;
        background:var(--bt-surface);
        box-shadow:var(--bt-shadow-card);
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .bt-mobile-action-cell {
        top:.8rem !important;
        right:.8rem !important;
        overflow:visible !important;
        z-index:30;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .dt-row-actions {
        display:flex;
        align-items:center;
        flex-wrap:nowrap;
        gap:.35rem;
        max-width:none;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .dt-row-actions > .btn,
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .dt-row-actions > form > .btn,
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .listing-action-menu-toggle {
        display:inline-flex !important;
        align-items:center;
        justify-content:center;
        min-width:2.5rem;
        min-height:2.5rem;
        touch-action:manipulation;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .bt-mobile-row-toggle-cell {
        position:static !important;
        overflow:visible !important;
        width:100% !important;
        max-width:100% !important;
        clear:both;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .bt-mobile-row-toggle {
        display:flex !important;
        justify-content:center;
        width:100% !important;
    }
    html body table.bt-mobile-ticket-listing.bt-mobile-card-table .bt-mobile-row-toggle > span {
        display:inline-block !important;
        width:auto !important;
        white-space:nowrap;
    }
}