/* Canonical shell contract for theme-layout-v2 public pages. */

body.theme-layout-v2 {
    --public-shell-max-width: var(--container-width);
    --public-shell-gutter: var(--page-padding);
    --public-shell-mobile-gutter: var(--page-padding);
    --public-shell-width: min(var(--public-shell-max-width), calc(100vw - (var(--public-shell-gutter) * 2)));
    --page-shell-width: var(--public-shell-width);
}

body.theme-layout-v2 main,
body.theme-layout-v2 .page-shell,
body.theme-layout-v2 .page-container,
body.theme-layout-v2 .container,
body.theme-layout-v2 .headbar-container {
    box-sizing: border-box;
}

body.theme-layout-v2 .public-page-shell,
body.theme-layout-v2 .page-shell,
body.theme-layout-v2 .page-container,
body.theme-layout-v2 .container,
body.theme-layout-v2 .headbar-container {
    width: var(--page-shell-width);
    max-width: none;
    margin-inline: auto;
}

body.theme-layout-v2 main {
    width: 100%;
    max-width: 100%;
}

@media (max-width: 900px) {
    body.theme-layout-v2 {
        --public-shell-gutter: var(--public-shell-mobile-gutter);
        --public-shell-width: calc(100vw - (var(--public-shell-mobile-gutter) * 2));
        --page-shell-width: var(--public-shell-width);
    }
}