/* EcoTracer shared foundation entry point / Revision 303.1.
   Keep imports first. Revisioned URLs prevent stale nested dependencies.
   The existing Environmental Solutions tokens URL imports this entry during migration. */
@import url("./tokens.css?v=303.1");
@import url("./typography.css?v=296.6");
@import url("./actions.css?v=296.6");
@import url("./hero.css?v=307.2");
@import url("./summaries.css?v=308");
@import url("./mobile-workspace.css?v=296.6");
@import url("./context.css?v=296.6");
@import url("./panels.css?v=299.1");
@import url("./forms.css?v=296.6");
@import url("./feedback.css?v=296.6");
@import url("./evidence.css?v=296.6");
@import url("./registers.css?v=303");

:is(.eco-page, .solutions-page, .solutions-overview),
:is(.eco-page, .solutions-page, .solutions-overview) *,
:is(.eco-page, .solutions-page, .solutions-overview) *::before,
:is(.eco-page, .solutions-page, .solutions-overview) *::after {
    box-sizing: border-box;
}

:is(.eco-page, .solutions-page, .solutions-overview) {
    width: 100%;
    min-width: 0;
    min-height: calc(100vh - var(--topbar-height, 0px));
    padding: var(--eco-page-start) var(--eco-page-gutter) var(--eco-page-end);
    color: var(--eco-color-text);
    color-scheme: dark;
    background: var(--eco-page-atmosphere);
    overflow-wrap: anywhere;
    /* No page-level overflow clipping or scale transform. Wide content owns its region. */
}

/* New consumers opt into shared body typography. Legacy pages keep their inherited
   body family until their component migration; their heading tokens already share authority. */
.eco-page {
    font-family: var(--eco-font-body);
    font-size: var(--eco-font-size-body);
    line-height: var(--eco-line-height-body);
    background-color: var(--eco-color-background);
}

:is(.eco-shell, .solutions-shell) {
    width: 100%;
    max-width: var(--eco-workspace-max-width);
    min-width: 0;
    margin-inline: auto;
    padding: 0 var(--eco-shell-gutter) var(--eco-shell-end);
    container-type: inline-size;
}

/* Deployment Details is the first bridge consumer, not a universal page composition. */
.deployment-details-page .solutions-shell {
    display: grid;
    gap: var(--eco-content-gap);
}

.eco-stack { display: grid; gap: var(--eco-content-gap); min-width: 0; }
.eco-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--eco-content-gap); min-width: 0; }
.eco-stack > *, .eco-cluster > * { min-width: 0; }

/* Plain surface material. Panel headings/actions, statuses, forms and summaries are UI-3/4. */
.eco-surface {
    min-width: 0;
    padding: var(--eco-space-8);
    border: var(--eco-border-width) solid var(--eco-border-color);
    border-radius: var(--eco-radius-panel);
    background: var(--eco-surface);
}
.eco-surface--strong { background: var(--eco-surface-strong); }
.eco-surface--soft { background: var(--eco-surface-soft); }

.eco-page :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: var(--eco-focus-width) solid var(--eco-focus-color);
    outline-offset: var(--eco-focus-offset);
}

/* The UI-2 application shell can expose its available content width with this
   named container. This also supports a narrow embedded workspace on a wide screen. */
.eco-workspace-host { min-width: 0; container: eco-workspace / inline-size; }
@container eco-workspace (max-width: 48.75rem) {
    :is(.eco-page, .solutions-page, .solutions-overview) {
        --eco-page-gutter: var(--eco-space-7);
        --eco-shell-gutter: var(--eco-space-0);
        --eco-page-start: var(--eco-space-7);
        --eco-page-end: var(--eco-space-12);
    }
}
@container eco-workspace (max-width: 32.5rem) {
    :is(.eco-page, .solutions-page, .solutions-overview) {
        --eco-page-gutter: var(--eco-space-5);
        --eco-page-start: var(--eco-space-6);
        --eco-shell-end: var(--eco-space-9);
    }
}

@media print {
    .eco-page { color: #000; background: #fff; padding: 0; min-height: 0; }
    .eco-page .eco-shell { padding: 0; }
    .eco-page .eco-surface { color: #000; background: #fff; box-shadow: none; }
}
@media (forced-colors: active) {
    .eco-page { color: CanvasText; background: Canvas; }
    .eco-surface { color: CanvasText; border-color: CanvasText; background: Canvas; }
    .eco-page :focus-visible { outline-color: Highlight; }
}