/* ═══════════════════════════════════════════════════════════════
   PREGAME DASHBOARD — Master Bundled Stylesheet
   Import modularized sub-stylesheets for base layout, components,
   sidebar spine, and mobile responsive optimizations.
   ═══════════════════════════════════════════════════════════════ */

@import "./app-base.css";
@import "./app-components.css";
@import "./app-sidebar.css";
@import "./app-mobile.css";

/* ─── Integration Detail Modal & Unconnected Greyout Overrides ─── */
.modal-integration-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: opacity 0.25s ease, filter 0.25s ease;
}

.modal-integration-body.not-connected,
.integration-card:not(.is-connected) .integration-card-body {
    opacity: 0.42 !important;
    filter: grayscale(1) !important;
    pointer-events: none !important;
    user-select: none !important;
}

.modal-integration-body.is-connected,
.integration-card.is-connected .integration-card-body {
    opacity: 1 !important;
    filter: none !important;
    pointer-events: auto !important;
    user-select: auto !important;
}

.modal-integration-topbar,
.integration-actions {
    opacity: 1 !important;
    filter: none !important;
    pointer-events: auto !important;
}

#integration-detail-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(10, 10, 15, 0.8) !important;
    backdrop-filter: blur(12px) !important;
    z-index: 99999 !important;
    align-items: center !important;
    justify-content: center !important;
}
#integration-detail-modal.hidden {
    display: none !important;
}