/*
 * MRI Command Center — Scoped styles
 * Isolates the dashboard from WordPress theme interference.
 */

/* Wrapper reset ─────────────────────────────────── */
.mri-cc-root,
.mri-cc-root * {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Override common WP theme resets that break the layout */
.mri-cc-root table {
    border-collapse: collapse;
    width: 100%;
}

.mri-cc-root button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.mri-cc-root input,
.mri-cc-root select {
    font-family: inherit;
}

/* Prevent WP themes from adding extra margins/padding to paragraphs & headings inside the app */
.mri-cc-root p,
.mri-cc-root h1,
.mri-cc-root h2,
.mri-cc-root h3,
.mri-cc-root h4,
.mri-cc-root h5,
.mri-cc-root h6 {
    margin: 0;
    padding: 0;
    line-height: inherit;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

/* Scrollbar styling */
.mri-cc-root ::-webkit-scrollbar         { width: 4px; height: 4px; }
.mri-cc-root ::-webkit-scrollbar-track   { background: #050c14; }
.mri-cc-root ::-webkit-scrollbar-thumb   { background: #0d2235; border-radius: 2px; }
.mri-cc-root ::-webkit-scrollbar-thumb:hover { background: #00c8ff44; }

/* Full-bleed on full-page embeds — remove WP content max-width */
.mri-cc-root {
    max-width: none !important;
    width: 100%;
    overflow-x: hidden;
}

/* Loading placeholder shown before React mounts */
.mri-cc-root:empty::before {
    content: "Loading MRI Command Center…";
    display: block;
    padding: 40px;
    text-align: center;
    color: #4a7a9b;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    background: #050c14;
    min-height: 200px;
    line-height: 200px;
}