/* Hagus skin for the upstream FossFLOW read-only display. Palette definitions
   come from the shared tokens stylesheet; this file only consumes roles. */
:root,
body,
#root {
    background: var(--pico-background-color) !important;
    color: var(--pico-color) !important;
}

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden !important;
    overscroll-behavior: none;
}

body *,
body *::before,
body *::after {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body {
    margin: 0;
}

button,
input,
select,
textarea {
    border-color: var(--pico-muted-border-color) !important;
    background-color: var(--pico-card-background-color) !important;
    color: var(--pico-color) !important;
    border-radius: var(--pico-border-radius) !important;
}

[class*="toolbar"],
[class*="Toolbar"],
[class*="panel"],
[class*="Panel"] {
    border-color: var(--pico-muted-border-color) !important;
}

.toolbar { display: none !important; }

.fossflow-container {
    height: 100vh !important;
}

.current-diagram,
.current-diagram * {
    color: var(--pico-color) !important;
}

/* FossFLOW v1.10.8 node labels. The upstream card is translucent, very narrow,
   and includes an expand control that has no purpose in this read-only view.
   Keep these selectors deliberately pinned to the vendored release so only the
   label component is restyled—not every MUI ancestor containing Quill. */
.MuiBox-root.css-1cgo1qv {
    box-sizing: border-box !important;
    width: 192px !important;
    max-width: 192px !important;
    overflow: hidden !important;
    border: 1px solid var(--pico-muted-border-color) !important;
    border-left: 4px solid var(--pico-primary) !important;
    border-radius: var(--pico-border-radius) !important;
    background: var(--pico-card-background-color) !important;
    box-shadow: var(--c-elevate-shadow) !important;
    opacity: 1 !important;
}

.MuiBox-root.css-1gaahvp {
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 7px 10px !important;
    border: 0 !important;
    background: transparent !important;
}

.MuiStack-root.css-18zsr3k {
    gap: 3px !important;
}

.MuiTypography-root.css-oreby5 {
    margin: 0 !important;
    color: var(--pico-color) !important;
    font-size: 17px !important;
    font-weight: 750 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.01em !important;
}

.MuiBox-root.css-1y3x6rl,
.ql-container,
.ql-editor {
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.ql-editor,
.ql-editor * {
    margin: 0 !important;
    color: var(--pico-muted-color) !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

.ql-editor p {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

button:has([data-testid="ExpandMoreIcon"]) {
    display: none !important;
}

/* Upstream fades the lower half of every label under an edit affordance. A
   read-only inventory card should remain opaque from title through metadata. */
.MuiBox-root.css-1vu4idm {
    display: none !important;
}

svg.MuiBox-root.css-94l24t line {
    stroke: var(--pico-muted-color) !important;
    stroke-width: 1.5 !important;
}

.language-selector {
    display: none !important;
}

[aria-label*="language" i],
[title*="language" i] {
    display: none !important;
}

/* Pinned FossFLOW v1.10.8 view breadcrumb. Hagus already names the active
   diagram above the iframe, so this duplicate overlay only obscures nodes. */
.MuiBox-root.css-wy4oyt {
    display: none !important;
}