/* CPOOL VISUAL COHERENCE V40
 * Final layer built from the V30 baseline.
 * No cloned parent pages. One page width, one axis, one top rhythm.
 */

:root {
  --cpool-v40-width: 960px;
  --cpool-v40-side: 32px;
  --cpool-v40-top: 28px;
  --cpool-v40-bottom: 48px;
  --cpool-v40-header-gap: 24px;
  --cpool-v40-title: 30px;
  --cpool-v40-copy: 15px;
}

/* The layout itself owns the canonical width. Child pages no longer create
   a second independent axis. */
#cpool-main-yield {
  box-sizing: border-box !important;
  width: min(var(--cpool-v40-width), calc(100% - var(--cpool-v40-side))) !important;
  max-width: var(--cpool-v40-width) !important;
  min-width: 0 !important;
  margin: 0 auto var(--cpool-v40-bottom) !important;
  padding: 0 !important;
}

#cpool-main-yield > :is(
  .cpool-v2-page,
  .cpool-page,
  .cpool-support-page,
  .cpool-client-form-uniform,
  .cpool-dashboard,
  .cpool-paperless-page,
  .cpool-models-page,
  .cpool-comms-shell,
  .cpool-collections-page,
  .cpool-v25-standalone-page,
  .cpool-v2-page-narrow
) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: var(--cpool-v40-top) !important;
  padding-right: 0 !important;
  padding-bottom: var(--cpool-v40-bottom) !important;
  padding-left: 0 !important;
}

/* Nested operation pages have already received their section context above. */
body:has(.cpool-parent-context-slot[data-cpool-parent-section])
  #cpool-main-yield > :is(
    .cpool-v2-page,
    .cpool-page,
    .cpool-support-page,
    .cpool-client-form-uniform,
    .cpool-v25-standalone-page,
    .cpool-v2-page-narrow
  ) {
  padding-top: 0 !important;
}

/* Client detail must never introduce another 960px wrapper inside the first. */
#cpool-main-yield
  > .cpool-client-detail-page-shell-v8
  > .cpool-v2-page {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* One geometry for every page heading. */
#cpool-main-yield > :is(.cpool-v2-page, .cpool-page, .cpool-support-page)
  > :is(.cpool-v2-hero, .cpool-page-header, .cpool-support-hero, .cpool-v25-section-head),
#cpool-main-yield > .cpool-v2-page > .cpool-v25-section-head,
#cpool-main-yield > .cpool-v25-standalone-page > .cpool-v25-section-head,
#cpool-main-yield > .cpool-models-page > .cpool-v25-section-head,
#cpool-main-yield > .cpool-comms-shell > .cpool-comms-hero {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  margin-top: 0 !important;
  margin-bottom: var(--cpool-v40-header-gap) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#cpool-main-yield :is(
  .cpool-v2-hero,
  .cpool-page-header,
  .cpool-support-hero,
  .cpool-comms-hero,
  .cpool-v25-section-head
) h1 {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  color: #0b1220 !important;
  font-size: var(--cpool-v40-title) !important;
  font-weight: 800 !important;
  line-height: 1.14 !important;
  letter-spacing: -0.035em !important;
}

#cpool-main-yield :is(
  .cpool-v2-hero,
  .cpool-page-header,
  .cpool-support-hero,
  .cpool-comms-hero,
  .cpool-v25-section-head
) p {
  max-width: 650px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  color: #667085 !important;
  font-size: var(--cpool-v40-copy) !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

/* Parent context returns to the V30 semantic structure. It is compact and
   content-driven: no cloned full pages and no artificial minimum height. */
.cpool-parent-context-slot {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.cpool-parent-section-shell {
  box-sizing: border-box !important;
  width: min(var(--cpool-v40-width), calc(100% - var(--cpool-v40-side))) !important;
  max-width: var(--cpool-v40-width) !important;
  min-width: 0 !important;
  margin: var(--cpool-v40-top) auto 0 !important;
  padding: 0 !important;
}

.cpool-parent-section-shell > .cpool-v2-hero,
.cpool-parent-section-shell .cpool-v2-hero {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
}

.cpool-parent-section-shell .cpool-v2-hero h1 {
  margin: 0 0 8px !important;
  font-size: var(--cpool-v40-title) !important;
  line-height: 1.14 !important;
}

.cpool-parent-section-shell .cpool-v2-hero p {
  margin: 0 !important;
  font-size: var(--cpool-v40-copy) !important;
  line-height: 1.55 !important;
}

/* Support used its own 1240/900px viewport system and very large bottom gaps.
   Keep the chat behaviour, but align the visible page with every other section. */
body.cpool-support-viewport-page #cpool-main-yield > .cpool-support-page,
body.cpool-support-new-viewport-page #cpool-main-yield > .cpool-support-page {
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cpool-support-page {
  padding-bottom: var(--cpool-v40-bottom) !important;
}

.cpool-support-layout {
  margin-bottom: 0 !important;
}

.cpool-support-form-card {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}

/* Archive, models, communications and settings should use the same page axis. */
#cpool-main-yield :is(
  .cpool-paperless-page,
  .cpool-models-page,
  .cpool-comms-shell,
  .cpool-collections-page,
  .cpool-client-import-page,
  .cpool-ai-settings-page
) {
  max-width: none !important;
}

/* Avoid legacy page shells creating empty vertical blocks. */
#cpool-main-yield > :is(
  .cpool-v2-page,
  .cpool-page,
  .cpool-support-page
) > :is(
  .cpool-v2-hero,
  .cpool-page-header,
  .cpool-support-hero,
  .cpool-v25-section-head
) + * {
  margin-top: 0 !important;
}

@media (max-width: 767px) {
  :root {
    --cpool-v40-side: 28px;
    --cpool-v40-top: 22px;
    --cpool-v40-bottom: 36px;
    --cpool-v40-header-gap: 18px;
    --cpool-v40-title: 27px;
    --cpool-v40-copy: 14px;
  }

  #cpool-main-yield > :is(
    .cpool-v2-page,
    .cpool-page,
    .cpool-support-page,
    .cpool-client-form-uniform,
    .cpool-v25-standalone-page,
    .cpool-v2-page-narrow
  ) {
    width: 100% !important;
  }

  #cpool-main-yield :is(
    .cpool-v2-hero,
    .cpool-page-header,
    .cpool-support-hero,
    .cpool-comms-hero,
    .cpool-v25-section-head
  ) {
    min-height: 0 !important;
  }

  .cpool-parent-section-shell .cpool-v2-actions,
  #cpool-main-yield .cpool-v2-actions,
  #cpool-main-yield .cpool-page-actions {
    margin-top: 14px !important;
  }
}

/* Preserve the support chat viewport mechanics while keeping the same 960px axis. */
@media (min-width: 901px) {
  body.cpool-support-viewport-page #cpool-main-yield > .cpool-support-page {
    height: var(--cpool-support-available-height, auto) !important;
    overflow: hidden !important;
    padding-top: var(--cpool-v40-top) !important;
    padding-bottom: 16px !important;
  }
}

/* Demo launch: polished, centered and deterministic. The status text exists in
   the DOM for accessibility but is forcibly hidden until the click handler
   removes the hidden attribute. */
.cpool-demo-launch-v40 {
  box-sizing: border-box !important;
  min-height: calc(100dvh - 150px) !important;
  width: 100% !important;
  padding: 44px 16px 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cpool-demo-launch-card-v40 {
  box-sizing: border-box !important;
  width: min(620px, 100%) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

.cpool-demo-launch-logo-v40 {
  display: flex !important;
  justify-content: center !important;
  margin: 0 0 24px !important;
}

.cpool-demo-launch-card-v40 h1 {
  margin: 0 !important;
  color: #0b1220 !important;
  font-size: 38px !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
}

.cpool-demo-launch-card-v40 > p:not(.cpool-demo-footnote-v40) {
  margin: 16px 0 0 !important;
  color: #667085 !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
}

.cpool-demo-launch-card-v40 form {
  margin: 28px 0 0 !important;
}

.cpool-demo-loading-v40 {
  margin: 28px 0 0 !important;
  display: grid !important;
  justify-items: center !important;
  gap: 14px !important;
}

.cpool-demo-loading-v40[hidden] {
  display: none !important;
}

.cpool-demo-countdown-v40 {
  color: #2f6bff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

.cpool-demo-error-v40 {
  margin: 24px 0 0 !important;
}

.cpool-demo-footnote-v40 {
  margin: 22px 0 0 !important;
  color: #7b8495 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

@media (max-width: 640px) {
  .cpool-demo-launch-v40 {
    min-height: calc(100dvh - 130px) !important;
    padding: 32px 14px 42px !important;
  }

  .cpool-demo-launch-card-v40 h1 {
    font-size: 32px !important;
  }

  .cpool-demo-launch-card-v40 > p:not(.cpool-demo-footnote-v40) {
    font-size: 14px !important;
  }
}