/* Frontend Shell responsive layout. Legacy frame preserved from v2.75.11.14; opt-in extensions are governed by layout-manifest.json. */

/*
 * Shared front-end frame. Scoped to shell profiles to avoid changing WP Admin
 * and to keep Gestão Conecta free to retain its operational composition.
 */
body.cc-shell--portal,
body.cc-shell--reader {
  --conecta-app-template-page-max: var(--cc-portal-surface-max);
  --conecta-app-template-page-gutter: var(--cc-portal-frame-gutter);
  --conecta-app-template-shell-width: var(--cc-portal-surface-width);
  --conecta-global-footer-gap: var(--cc-portal-frame-footer-gap);
  --conecta-global-footer-gap-mobile: var(--cc-portal-frame-footer-gap);
  overflow-x: clip !important;
}

body.cc-shell--portal #conecta-public-app-template,
body.cc-shell--reader #conecta-public-app-template {
  width: 100% !important;
  min-height: 100dvh !important;
  overflow-x: clip !important;
}

/* The public template historically escaped theme wrappers with 100vw. The
   shell restores a bounded canvas on mobile, preventing iOS horizontal canvas
   expansion while preserving the desktop Community sticky contract. */
body.conecta-app-template-page.cc-shell--portal .conecta-app,
body.conecta-app-template-page.cc-shell--portal .conecta-profile-edit-view,
body.conecta-app-template-page.cc-shell--portal .conecta-profile-public-view,
body.conecta-app-template-page.cc-shell--portal .conecta-profile-directory-view,
body.cc-shell--portal:not(.conecta-app-template-page) .conecta-app,
body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-edit-view,
body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-public-view,
body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-directory-view {
  --cc-shell-frame-padding: var(--cc-portal-frame-padding);
  min-height: 100dvh !important;
  box-sizing: border-box !important;
}

@media (max-width: 767px) {
  body.conecta-app-template-page.cc-shell--portal .conecta-app,
  body.conecta-app-template-page.cc-shell--portal .conecta-profile-edit-view,
  body.conecta-app-template-page.cc-shell--portal .conecta-profile-public-view,
  body.conecta-app-template-page.cc-shell--portal .conecta-profile-directory-view,
  body.conecta-app-template-page.cc-shell--portal .conecta-app.conecta-community-view,
  body.cc-shell--portal:not(.conecta-app-template-page) .conecta-app,
  body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-edit-view,
  body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-public-view,
  body.cc-shell--portal:not(.conecta-app-template-page) .conecta-profile-directory-view {
    --cc-shell-frame-padding: var(--cc-portal-frame-padding);
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--cc-shell-frame-padding) !important;
    padding-right: var(--cc-shell-frame-padding) !important;
    box-sizing: border-box !important;
  }

  /* Do not manufacture a nested scroller for the Community on phones. The
     module keeps ownership of desktop sticky columns; the mobile frame remains
     in normal document flow. */
  body.conecta-app-template-page.cc-shell--portal .conecta-app.conecta-community-view {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }
}

/* Gestão Conecta receives only the profile marker and neutral primitive
   variables in this release. Its sidebar/topbar are intentionally untouched. */
body.cc-shell--management {
  --cc-shell-page-gutter: 24px;
  --cc-shell-touch-target: 44px;
}

/* Conecta Frontend Shell — canonical opt-in containers. */
.cc-layout-container,
.cc-layout-container--reader,
.cc-layout-container--fluid {
  --cc-layout-container-max: var(--cc-layout-content-max);
  width: min(var(--cc-layout-container-max), calc(100% - (var(--cc-layout-gutter) * 2)));
  max-width: var(--cc-layout-container-max);
  margin-inline: auto;
  min-width: 0;
  box-sizing: border-box;
}

.cc-layout-container--reader {
  --cc-layout-container-max: var(--cc-layout-reader-max);
}

.cc-layout-container--fluid {
  width: calc(100% - (var(--cc-layout-gutter) * 2));
  max-width: none;
}

/* Portal containers share the exact Header ruler. Other Shell families retain
 * the generic opt-in container contract below. */
body.cc-shell--portal .cc-layout-container,
body.cc-shell--portal .cc-layout-container--fluid {
  width: var(--cc-portal-surface-width);
  max-width: var(--cc-portal-surface-max);
}

.cc-layout-container > *,
.cc-layout-container--reader > *,
.cc-layout-container--fluid > * {
  min-width: 0;
}

/* Conecta Frontend Shell — canonical opt-in responsive grids. */
.cc-layout-stack,
.cc-layout-grid {
  display: grid;
  min-width: 0;
}

.cc-layout-stack {
  gap: var(--cc-layout-section-gap);
}

.cc-layout-stack--compact {
  gap: var(--cc-layout-section-gap-compact);
}

.cc-layout-grid {
  gap: var(--cc-layout-grid-gap);
}

.cc-layout-grid--compact {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--cc-layout-card-min-compact)), 1fr));
}

.cc-layout-grid--medium {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--cc-layout-card-min-medium)), 1fr));
}

.cc-layout-grid--large {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--cc-layout-card-min-large)), 1fr));
}

.cc-layout-grid--panel-content {
  grid-template-columns: minmax(0, var(--cc-layout-panel-width)) minmax(0, 1fr);
}

.cc-layout-stack > *,
.cc-layout-grid > *,
.cc-layout-grid__panel,
.cc-layout-grid__content {
  min-width: 0;
}

.cc-layout-cluster {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--cc-space-2) var(--cc-space-3);
  min-width: 0;
}

.cc-layout-cluster--between {
  justify-content: space-between;
}

@media (max-width: 1023px) {
  .cc-layout-grid--panel-content {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 767px) {
  .cc-layout-grid {
    gap: var(--cc-layout-grid-gap-compact);
  }

  .cc-layout-cluster--mobile-stack {
    align-items: stretch;
    flex-direction: column;
  }
}
