/* source: design-system/primitives/card.css */


/* Conecta Frontend Shell — canonical public card primitive. */
.cc-card {
  display: flex;
  min-width: 0;
  padding: var(--cc-layout-card-padding);
  flex-direction: column;
  gap: var(--cc-space-4);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-1);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-card > * { min-width: 0; }

.cc-card__header {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-4);
}

.cc-card__heading,
.cc-card__content,
.cc-card__body {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-3);
}

.cc-card__eyebrow,
.cc-card__meta {
  margin: 0;
  color: var(--cc-color-text-secondary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-meta);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  overflow-wrap: anywhere;
}

.cc-card__eyebrow {
  color: var(--cc-color-primary);
  letter-spacing: var(--cc-letter-spacing-eyebrow);
  text-transform: uppercase;
}

.cc-card__title {
  margin: 0;
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
  overflow-wrap: anywhere;
}

.cc-card__description,
.cc-card__body > p {
  margin: 0;
  color: var(--cc-color-text-secondary);
  overflow-wrap: anywhere;
}

.cc-card__footer {
  display: flex;
  min-width: 0;
  margin-top: auto;
  padding-top: var(--cc-space-2);
  align-items: center;
  justify-content: space-between;
  gap: var(--cc-space-3);
  flex-wrap: wrap;
}

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

.cc-card__media {
  display: block;
  width: 100%;
  aspect-ratio: var(--cc-card-media-ratio);
  background: var(--cc-color-surface-soft);
  color: var(--cc-color-text-secondary);
  object-fit: cover;
}

.cc-card__metric {
  margin: 0;
  color: var(--cc-color-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-page-title);
  font-weight: var(--cc-font-weight-number);
  line-height: var(--cc-line-height-title);
  overflow-wrap: anywhere;
}

.cc-card--compact {
  padding: var(--cc-space-4);
  gap: var(--cc-space-3);
}

.cc-card--media {
  padding: 0;
  gap: 0;
  overflow: hidden;
}

.cc-card--media .cc-card__content {
  padding: var(--cc-layout-card-padding);
}

.cc-card--editorial .cc-card__body {
  font-family: var(--cc-font-editorial);
  font-size: var(--cc-font-size-editorial);
  line-height: var(--cc-line-height-editorial);
}

.cc-card--metric { min-height: 100%; }
.cc-card--flat { box-shadow: var(--cc-elevation-none); }

.cc-card--interactive {
  color: var(--cc-color-text-primary);
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--cc-motion-fast) var(--cc-motion-easing), border-color var(--cc-motion-fast) var(--cc-motion-easing), box-shadow var(--cc-motion-fast) var(--cc-motion-easing);
}

.cc-card--interactive:hover {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-surface-soft);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-2);
  text-decoration: none;
}

.cc-card--interactive:focus-visible {
  outline: 0;
  border-color: var(--cc-color-primary);
  box-shadow: var(--cc-focus-ring-shadow), var(--cc-elevation-1);
}

.cc-card[aria-selected="true"] {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-interaction);
}

.cc-card[aria-disabled="true"] {
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
  box-shadow: var(--cc-elevation-none);
  cursor: not-allowed;
  pointer-events: none;
}

/* Compatibility class retained byte-equivalent to v2.75.11.16. */
.cc-shell-card {
  background: var(--cc-shell-surface);
  border: 1px solid var(--cc-shell-border);
  border-radius: var(--cc-shell-radius);
  box-shadow: var(--conecta-shadow-soft, 0 14px 36px rgba(40, 56, 38, .08));
  box-sizing: border-box;
}

@media (prefers-reduced-motion: reduce) {
  .cc-card--interactive { transition-duration: 0ms; }
}

/* source: design-system/primitives/divider.css */


/* Conecta Frontend Shell — canonical public divider primitive. */
.cc-divider {
  width: 100%;
  height: 0;
  margin: 0;
  border: 0;
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
  box-sizing: border-box;
}

.cc-divider--strong {
  border-top-color: var(--cc-color-border-interactive);
}

.cc-divider--inset {
  width: auto;
  margin-inline: var(--cc-space-4);
}

.cc-divider--vertical {
  width: 0;
  height: auto;
  min-height: var(--cc-control-height);
  align-self: stretch;
  border-top: 0;
  border-inline-start: var(--cc-divider-thickness) solid var(--cc-color-border);
}

/* source: design-system/patterns/page-section.css */

/* Conecta Frontend Shell — canonical Page Section pattern. */
.cc-page-section {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-6);
  padding: var(--cc-layout-card-padding);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-1);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-page-section > * { min-width: 0; }

.cc-page-section__header {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-6);
}

.cc-page-section__intro {
  display: grid;
  min-width: 0;
  flex: 1 1 auto;
  gap: var(--cc-space-2);
}

.cc-page-section__eyebrow,
.cc-page-section__title,
.cc-page-section__description { margin: 0; }

.cc-page-section__eyebrow {
  color: var(--cc-color-primary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-meta);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  letter-spacing: var(--cc-letter-spacing-eyebrow);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.cc-page-section__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-section-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
  overflow-wrap: anywhere;
}

.cc-page-section__description {
  color: var(--cc-color-text-secondary);
  overflow-wrap: anywhere;
}

.cc-page-section__actions,
.cc-page-section__footer {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
}

.cc-page-section__actions {
  flex: 0 1 auto;
  justify-content: flex-end;
  margin-inline-start: auto;
}

.cc-page-section__content {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-4);
}

.cc-page-section__footer {
  justify-content: space-between;
  padding-top: var(--cc-space-4);
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-page-section--compact {
  gap: var(--cc-space-4);
  padding: var(--cc-space-4);
}

.cc-page-section--compact .cc-page-section__title {
  font-size: var(--cc-font-size-card-title);
}

.cc-page-section--flat { box-shadow: var(--cc-elevation-none); }
.cc-page-section[hidden] { display: none; }

@media (max-width: 767px) {
  .cc-page-section__header {
    display: grid;
    gap: var(--cc-space-4);
  }

  .cc-page-section__actions {
    width: 100%;
    margin-inline-start: 0;
    justify-content: flex-start;
  }

  .cc-page-section__footer {
    align-items: flex-start;
  }
}

@media (forced-colors: active) {
  .cc-page-section {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/patterns/filter-bar.css */

/* Conecta Frontend Shell — canonical Filter Bar pattern. */
.cc-filter-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: var(--cc-space-4);
  padding: var(--cc-space-4);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-filter-bar > * { min-width: 0; }

.cc-filter-bar__fields {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(auto-fit, minmax(var(--cc-control-group-min), 1fr));
  gap: var(--cc-space-3);
  align-items: end;
}

.cc-filter-bar__field,
.cc-filter-bar__field > * { min-width: 0; }

.cc-filter-bar__field--search { grid-column: span 2; }

.cc-filter-bar__summary,
.cc-filter-bar__status,
.cc-filter-bar__actions {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
}

.cc-filter-bar__summary {
  gap: var(--cc-space-2);
  padding-top: var(--cc-space-3);
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-filter-bar__summary-label {
  margin: 0;
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
  overflow-wrap: anywhere;
}

.cc-filter-bar__actions {
  justify-content: flex-end;
  gap: var(--cc-space-2);
  padding-top: var(--cc-space-3);
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-filter-bar__status {
  margin-inline-end: auto;
  gap: var(--cc-space-2);
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
  overflow-wrap: anywhere;
}

.cc-filter-bar__result-count {
  color: var(--cc-color-text-primary);
  font-weight: var(--cc-font-weight-medium);
}

.cc-filter-bar--compact {
  gap: var(--cc-space-3);
  padding: var(--cc-space-3);
}

.cc-filter-bar[data-state="applied"] {
  border-color: var(--cc-color-border-interactive);
}

.cc-filter-bar[hidden] { display: none; }

@media (max-width: 1023px) {
  .cc-filter-bar__field--search { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  .cc-filter-bar__fields { grid-template-columns: minmax(0, 1fr); }
  .cc-filter-bar__field--search { grid-column: auto; }
  .cc-filter-bar__actions { align-items: stretch; }
  .cc-filter-bar__status { width: 100%; margin-inline-end: 0; }
}

@media (max-width: 479px) {
  .cc-filter-bar__actions > .cc-button { flex: 1 1 auto; }
}

@media (forced-colors: active) {
  .cc-filter-bar,
  .cc-filter-bar[data-state="applied"] {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/patterns/filter-panel.css */

/* Conecta Frontend Shell — canonical Filter Panel pattern. */
.cc-filter-panel {
  display: grid;
  align-self: start;
  min-width: 0;
  gap: var(--cc-space-4);
  padding: var(--cc-layout-card-padding);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-filter-panel > *,
.cc-filter-panel__header > *,
.cc-filter-panel__fields > *,
.cc-filter-panel__footer > * {
  min-width: 0;
}

.cc-filter-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-3);
}

.cc-filter-panel__intro {
  display: grid;
  gap: var(--cc-space-1);
}

.cc-filter-panel__eyebrow,
.cc-filter-panel__title,
.cc-filter-panel__description,
.cc-filter-panel__group-title,
.cc-filter-panel__summary-label,
.cc-filter-panel__status {
  margin: 0;
}

.cc-filter-panel__eyebrow {
  color: var(--cc-color-primary);
  font-size: var(--cc-font-size-meta);
  letter-spacing: var(--cc-letter-spacing-eyebrow);
  text-transform: uppercase;
}

.cc-filter-panel__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
  overflow-wrap: anywhere;
}

.cc-filter-panel__description,
.cc-filter-panel__status,
.cc-filter-panel__summary-label {
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
  overflow-wrap: anywhere;
}

.cc-filter-panel__body,
.cc-filter-panel__groups,
.cc-filter-panel__group,
.cc-filter-panel__fields,
.cc-filter-panel__summary {
  display: grid;
  min-width: 0;
}

.cc-filter-panel__body,
.cc-filter-panel__groups {
  gap: var(--cc-space-4);
}

.cc-filter-panel__group {
  gap: var(--cc-space-3);
  margin: 0;
  padding: var(--cc-space-4) 0 0;
  border: 0;
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-filter-panel__group:first-child {
  padding-top: 0;
  border-top: 0;
}

.cc-filter-panel__group-title {
  padding: 0;
  color: var(--cc-color-text-primary);
  font-size: var(--cc-font-size-secondary);
  font-weight: var(--cc-font-weight-medium);
  line-height: var(--cc-line-height-interface);
}

.cc-filter-panel__fields {
  grid-template-columns: minmax(0, 1fr);
  gap: var(--cc-space-3);
}

.cc-filter-panel__summary {
  gap: var(--cc-space-2);
  padding-top: var(--cc-space-4);
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-filter-panel__summary-items {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: var(--cc-space-2);
}

.cc-filter-panel__footer {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--cc-space-2);
  padding-top: var(--cc-space-4);
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-filter-panel__status {
  flex: 1 1 var(--cc-control-group-min);
}

.cc-filter-panel__actions {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--cc-space-2);
}

.cc-filter-panel--compact {
  gap: var(--cc-space-3);
  padding: var(--cc-space-4);
}

.cc-filter-panel[data-state="applied"] {
  border-color: var(--cc-color-border-interactive);
}

.cc-filter-panel[hidden] { display: none; }

@media (min-width: 1024px) and (min-height: 701px) {
  .cc-filter-panel--sticky {
    position: sticky;
    top: var(--cc-space-6);
    max-height: calc(100dvh - var(--cc-space-12));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .cc-filter-panel__fields {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--cc-control-group-min)), 1fr));
  }
}

@media (max-width: 767px) {
  .cc-filter-panel__header,
  .cc-filter-panel__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .cc-filter-panel__actions {
    justify-content: stretch;
  }
}

@media (max-width: 479px) {
  .cc-filter-panel__actions > .cc-button {
    flex: 1 1 auto;
  }
}

@media (forced-colors: active) {
  .cc-filter-panel,
  .cc-filter-panel[data-state="applied"] {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/patterns/data-table.css */

/* Conecta Frontend Shell — canonical Data Table pattern. */
.cc-data-table {
  min-width: 0;
  overflow: hidden;
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}
.cc-data-table > *,
.cc-data-table__toolbar > *,
.cc-data-table__row > *,
.cc-data-table__cell > * {
  min-width: 0;
}
.cc-data-table__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--cc-space-3);
  padding: var(--cc-space-4);
  border-bottom: var(--cc-divider-thickness) solid var(--cc-color-border);
}
.cc-data-table__summary,
.cc-data-table__caption,
.cc-data-table__primary,
.cc-data-table__secondary,
.cc-data-table__empty-title,
.cc-data-table__empty-description {
  margin: 0;
}
.cc-data-table__summary,
.cc-data-table__secondary,
.cc-data-table__empty-description {
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
  overflow-wrap: anywhere;
}
.cc-data-table__caption {
  padding: var(--cc-space-4);
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
  text-align: left;
}
.cc-data-table__viewport {
  min-width: 0;
}
.cc-data-table__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
}
.cc-data-table__header-cell,
.cc-data-table__cell {
  padding: var(--cc-space-3) var(--cc-space-4);
  border-bottom: var(--cc-divider-thickness) solid var(--cc-color-border);
  text-align: left;
  vertical-align: middle;
}
.cc-data-table__header-cell {
  color: var(--cc-color-text-secondary);
  background: var(--cc-color-surface-soft);
  font-size: var(--cc-font-size-meta);
  font-weight: var(--cc-font-weight-medium);
  line-height: var(--cc-line-height-interface);
}
.cc-data-table__body .cc-data-table__row:last-child .cc-data-table__cell {
  border-bottom: 0;
}
.cc-data-table__body .cc-data-table__row {
  background: var(--cc-color-surface);
  transition: background-color var(--cc-motion-fast) var(--cc-motion-easing);
}
.cc-data-table__body .cc-data-table__row:hover {
  background: var(--cc-color-interaction);
}
.cc-data-table__body .cc-data-table__row:focus-within {
  background: var(--cc-color-interaction);
  box-shadow: inset var(--cc-focus-ring-width) 0 0 var(--cc-color-focus-ring);
}
.cc-data-table__row[aria-selected="true"],
.cc-data-table__row[data-state="selected"] {
  background: var(--cc-color-interaction);
}
.cc-data-table__row[data-state="disabled"] {
  color: var(--cc-color-disabled-text);
  background: var(--cc-color-disabled-surface);
}
.cc-data-table__primary {
  color: var(--cc-color-text-primary);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-medium);
  overflow-wrap: anywhere;
}
.cc-data-table__secondary {
  margin-top: var(--cc-space-1);
}
.cc-data-table__cell--numeric,
.cc-data-table__header-cell--numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.cc-data-table__cell--actions,
.cc-data-table__header-cell--actions {
  width: var(--cc-control-height-touch);
  text-align: right;
}
.cc-data-table__actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--cc-space-1);
}
.cc-data-table__sort {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-1);
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}
.cc-data-table__sort:hover {
  color: var(--cc-color-primary);
}
.cc-data-table__sort:focus-visible {
  border-radius: var(--cc-control-radius);
  outline: var(--cc-focus-ring-width) solid var(--cc-color-focus-ring);
  outline-offset: var(--cc-focus-ring-offset);
}
.cc-data-table__sort-indicator {
  display: inline-flex;
  min-width: var(--cc-icon-size-16);
  align-items: center;
  justify-content: center;
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-meta);
  line-height: 1;
}
.cc-data-table__header-cell[aria-sort="ascending"] .cc-data-table__sort-indicator,
.cc-data-table__header-cell[aria-sort="descending"] .cc-data-table__sort-indicator {
  color: var(--cc-color-primary);
}
.cc-data-table__mobile-label {
  display: none;
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-meta);
  font-weight: var(--cc-font-weight-medium);
}
.cc-data-table__empty {
  display: grid;
  justify-items: start;
  gap: var(--cc-space-2);
  padding: var(--cc-space-6) var(--cc-space-4);
}
.cc-data-table__empty-title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}
.cc-data-table--compact .cc-data-table__header-cell,
.cc-data-table--compact .cc-data-table__cell {
  padding: var(--cc-space-2) var(--cc-space-3);
}
.cc-data-table[aria-busy="true"] .cc-data-table__body {
  opacity: 0.7;
}
@media (max-width: 767px) {
  .cc-data-table:not(.cc-data-table--scroll) {
    overflow: visible;
    border: 0;
    background: transparent;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__toolbar,
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__caption {
    border: var(--cc-card-border-width) solid var(--cc-color-border);
    background: var(--cc-color-surface);
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__toolbar {
    border-radius: var(--cc-layout-radius-card) var(--cc-layout-radius-card) 0 0;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__caption {
    border-radius: var(--cc-layout-radius-card);
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__head {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__table,
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__body,
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__row,
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__cell {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__body {
    display: grid;
    gap: var(--cc-space-3);
    padding-top: var(--cc-space-3);
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__row {
    padding: var(--cc-space-2) var(--cc-space-4);
    border: var(--cc-card-border-width) solid var(--cc-color-border);
    border-radius: var(--cc-layout-radius-card);
    background: var(--cc-color-surface);
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__cell {
    display: grid;
    grid-template-columns: minmax(var(--cc-control-group-min), 36%) minmax(0, 1fr);
    align-items: start;
    gap: var(--cc-space-3);
    padding: var(--cc-space-3) 0;
    border-bottom: var(--cc-divider-thickness) solid var(--cc-color-border);
    text-align: left;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__cell:last-child {
    border-bottom: 0;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__mobile-label {
    display: block;
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__cell--actions {
    grid-template-columns: minmax(0, 1fr);
  }
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__actions {
    justify-content: flex-start;
  }
  .cc-data-table--scroll .cc-data-table__viewport {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
  }
  .cc-data-table--scroll .cc-data-table__table {
    min-width: var(--cc-layout-container-max);
  }
}
@media (max-width: 479px) {
  .cc-data-table:not(.cc-data-table--scroll) .cc-data-table__cell {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cc-space-1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .cc-data-table__body .cc-data-table__row {
    transition: none;
  }
}
@media (forced-colors: active) {
  .cc-data-table,
  .cc-data-table__row,
  .cc-data-table__toolbar,
  .cc-data-table__caption {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/patterns/entity-list.css */

/* Conecta Frontend Shell — canonical entity list pattern. */
.cc-entity-list {
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 0;
  gap: var(--cc-space-3);
  list-style: none;
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-entity-list > * { min-width: 0; }

.cc-entity-list--compact { gap: var(--cc-space-2); }

.cc-entity-list--divided {
  gap: 0;
  border-block-start: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-entity-list__item {
  display: grid;
  min-width: 0;
  padding: var(--cc-space-4);
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--cc-space-4);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
}

.cc-entity-list__item--with-media {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.cc-entity-list--compact .cc-entity-list__item {
  padding: var(--cc-space-3);
  gap: var(--cc-space-3);
}

.cc-entity-list--divided .cc-entity-list__item {
  padding-inline: 0;
  border-block-start: 0;
  border-inline: 0;
  border-radius: 0;
}

.cc-entity-list__item--interactive {
  transition:
    background-color var(--cc-motion-fast) var(--cc-motion-easing),
    border-color var(--cc-motion-fast) var(--cc-motion-easing),
    box-shadow var(--cc-motion-fast) var(--cc-motion-easing);
}

.cc-entity-list__item--interactive:hover {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-interaction);
}

.cc-entity-list__item--interactive:focus-within {
  border-color: var(--cc-color-border-interactive);
  box-shadow: var(--cc-focus-ring-shadow);
}

.cc-entity-list__item[aria-selected="true"],
.cc-entity-list__item[data-state="selected"] {
  border-color: var(--cc-color-border-interactive);
  background: var(--cc-color-interaction);
}

.cc-entity-list__item[aria-disabled="true"],
.cc-entity-list__item[data-state="disabled"] {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
}

.cc-entity-list__item[aria-disabled="true"] .cc-entity-list__title,
.cc-entity-list__item[aria-disabled="true"] .cc-entity-list__description,
.cc-entity-list__item[aria-disabled="true"] .cc-entity-list__meta,
.cc-entity-list__item[aria-disabled="true"] .cc-entity-list__secondary,
.cc-entity-list__item[data-state="disabled"] .cc-entity-list__title,
.cc-entity-list__item[data-state="disabled"] .cc-entity-list__description,
.cc-entity-list__item[data-state="disabled"] .cc-entity-list__meta,
.cc-entity-list__item[data-state="disabled"] .cc-entity-list__secondary {
  color: var(--cc-color-disabled-text);
}

.cc-entity-list__media {
  display: grid;
  inline-size: var(--cc-space-12);
  block-size: var(--cc-space-12);
  min-width: 0;
  place-items: center;
  overflow: hidden;
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface-soft);
  color: var(--cc-color-primary);
}

.cc-entity-list--compact .cc-entity-list__media {
  inline-size: var(--cc-space-10);
  block-size: var(--cc-space-10);
}

.cc-entity-list__media > img,
.cc-entity-list__media > picture,
.cc-entity-list__media > svg {
  display: block;
  max-inline-size: 100%;
  max-block-size: 100%;
}

.cc-entity-list__media > img,
.cc-entity-list__media > picture img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.cc-entity-list__content {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-1);
}

.cc-entity-list__header {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-3);
  flex-wrap: wrap;
}

.cc-entity-list__title {
  margin: 0;
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
  overflow-wrap: anywhere;
}

.cc-entity-list__link {
  color: inherit;
  text-decoration: none;
  border-radius: var(--cc-control-radius);
}

.cc-entity-list__link:hover { color: var(--cc-color-primary); }

.cc-entity-list__link:focus-visible {
  outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
  outline-offset: var(--cc-focus-ring-offset);
}

.cc-entity-list__description,
.cc-entity-list__meta,
.cc-entity-list__secondary {
  margin: 0;
  color: var(--cc-color-text-secondary);
  overflow-wrap: anywhere;
}

.cc-entity-list__description { font-size: var(--cc-font-size-interface); }

.cc-entity-list__meta {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-2) var(--cc-space-3);
  flex-wrap: wrap;
  font-size: var(--cc-font-size-meta);
}

.cc-entity-list__meta-item {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-1);
}

.cc-entity-list__actions {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
}

.cc-entity-list[aria-busy="true"] .cc-entity-list__item {
  cursor: progress;
}

.cc-entity-list__state {
  display: grid;
  min-width: 0;
  padding: var(--cc-space-6);
  place-items: center;
  gap: var(--cc-space-2);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface);
  text-align: center;
}

.cc-entity-list__state-title {
  margin: 0;
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-entity-list__state-description {
  max-width: var(--cc-layout-reader-max);
  margin: 0;
  color: var(--cc-color-text-secondary);
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  .cc-entity-list__item {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .cc-entity-list__item--with-media {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .cc-entity-list__actions {
    grid-column: 1;
    justify-content: flex-start;
  }

  .cc-entity-list__item--with-media .cc-entity-list__actions {
    grid-column: 2;
  }
}

@media (max-width: 479px) {
  .cc-entity-list__item,
  .cc-entity-list--compact .cc-entity-list__item {
    padding: var(--cc-space-3);
    gap: var(--cc-space-3);
  }

  .cc-entity-list__media {
    inline-size: var(--cc-space-10);
    block-size: var(--cc-space-10);
  }

  .cc-entity-list__actions {
    grid-column: 1 / -1;
  }

  .cc-entity-list__actions > .cc-button {
    flex: 1 1 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc-entity-list__item--interactive { transition: none; }
}

@media (forced-colors: active) {
  .cc-entity-list__item,
  .cc-entity-list__state,
  .cc-entity-list__media {
    border: var(--cc-card-border-width) solid CanvasText;
  }
}

/* source: design-system/patterns/pagination.css */

/* Conecta Frontend Shell — canonical pagination pattern. */
.cc-pagination {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--cc-space-3);
  flex-wrap: wrap;
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-pagination > * { min-width: 0; }

.cc-pagination--compact { gap: var(--cc-space-2); }

.cc-pagination__summary,
.cc-pagination__status {
  margin: 0;
  color: var(--cc-color-text-secondary);
  overflow-wrap: anywhere;
}

.cc-pagination__summary { flex: 1 1 180px; }

.cc-pagination__controls {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
}

.cc-pagination__pages {
  display: flex;
  min-width: 0;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-1);
  flex-wrap: wrap;
  list-style: none;
}

.cc-pagination__item {
  display: flex;
  min-width: 0;
  align-items: center;
}

.cc-pagination__link,
.cc-pagination__current {
  display: inline-flex;
  min-inline-size: var(--cc-control-height-compact);
  min-block-size: var(--cc-control-height-compact);
  padding: 0 var(--cc-space-2);
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-1);
  border: var(--cc-control-border-width) solid transparent;
  border-radius: var(--cc-control-radius);
  box-sizing: border-box;
  color: var(--cc-color-text-primary);
  font: inherit;
  line-height: 1;
  text-align: center;
  text-decoration: none;
}

.cc-pagination__link {
  cursor: pointer;
  background: transparent;
  transition:
    background-color var(--cc-motion-fast) var(--cc-motion-easing),
    border-color var(--cc-motion-fast) var(--cc-motion-easing),
    color var(--cc-motion-fast) var(--cc-motion-easing);
}

.cc-pagination__link:hover {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-interaction-hover);
  color: var(--cc-color-primary);
}

.cc-pagination__link:focus-visible {
  outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
  outline-offset: var(--cc-focus-ring-offset);
}

.cc-pagination__link:active {
  border-color: var(--cc-color-border-interactive);
  background: var(--cc-color-interaction);
}

.cc-pagination__current,
.cc-pagination__link[aria-current="page"] {
  border-color: var(--cc-color-border-interactive);
  background: var(--cc-color-interaction);
  color: var(--cc-color-primary);
  font-weight: var(--cc-font-weight-medium);
}

.cc-pagination__link[aria-disabled="true"],
.cc-pagination__link:disabled {
  cursor: not-allowed;
  border-color: transparent;
  background: transparent;
  color: var(--cc-color-disabled-text);
}

.cc-pagination__ellipsis {
  display: inline-flex;
  min-inline-size: var(--cc-control-height-compact);
  min-block-size: var(--cc-control-height-compact);
  align-items: center;
  justify-content: center;
  color: var(--cc-color-text-secondary);
  user-select: none;
}

.cc-pagination__direction {
  display: inline-flex;
  align-items: center;
  gap: var(--cc-space-1);
}

.cc-pagination__page-size {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-2);
}

.cc-pagination__page-size-label {
  color: var(--cc-color-text-secondary);
  white-space: nowrap;
}

.cc-pagination__page-size .cc-form-control {
  inline-size: auto;
  min-inline-size: 76px;
}

.cc-pagination__status {
  flex: 1 1 100%;
  font-size: var(--cc-font-size-secondary);
}

@media (max-width: 767px) {
  .cc-pagination {
    align-items: stretch;
  }

  .cc-pagination__summary,
  .cc-pagination__controls,
  .cc-pagination__status {
    flex-basis: 100%;
  }

  .cc-pagination__controls {
    justify-content: space-between;
  }

  .cc-pagination__pages {
    order: 2;
    flex: 1 1 100%;
  }

  .cc-pagination__page-size {
    order: 3;
  }
}

@media (max-width: 479px) {
  .cc-pagination__controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .cc-pagination__pages,
  .cc-pagination__page-size {
    grid-column: 1 / -1;
  }

  .cc-pagination__direction {
    inline-size: 100%;
    justify-content: center;
  }

  .cc-pagination__item--optional {
    display: none;
  }

  .cc-pagination__pages {
    justify-content: center;
  }

  .cc-pagination__link,
  .cc-pagination__current,
  .cc-pagination__ellipsis {
    min-block-size: var(--cc-control-height-touch);
  }

  .cc-pagination__page-size {
    justify-content: space-between;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc-pagination__link { transition: none; }
}

@media (forced-colors: active) {
  .cc-pagination__link,
  .cc-pagination__current {
    border-color: ButtonText;
  }

  .cc-pagination__link[aria-disabled="true"],
  .cc-pagination__link:disabled {
    border-color: GrayText;
    color: GrayText;
  }
}

/* source: design-system/patterns/empty-state.css */

/* Conecta Frontend Shell — canonical empty-state pattern. */
.cc-empty-state {
  display: grid;
  min-width: 0;
  padding: var(--cc-layout-card-padding);
  justify-items: center;
  gap: var(--cc-space-4);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-layout-radius-card);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-1);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  text-align: center;
}

.cc-empty-state > * { min-width: 0; }

.cc-empty-state--compact {
  padding: var(--cc-space-4);
  gap: var(--cc-space-3);
}

.cc-empty-state--flat {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.cc-empty-state--inline {
  padding: var(--cc-space-4);
  justify-items: start;
  text-align: start;
}

.cc-empty-state__icon {
  display: inline-flex;
  inline-size: var(--cc-empty-state-icon-size);
  block-size: var(--cc-empty-state-icon-size);
  align-items: center;
  justify-content: center;
  color: var(--cc-color-primary);
}

.cc-empty-state__icon .cc-icon {
  inline-size: 100%;
  block-size: 100%;
}

.cc-empty-state__content {
  display: grid;
  inline-size: min(100%, var(--cc-empty-state-content-max));
  gap: var(--cc-space-2);
  justify-items: inherit;
}

.cc-empty-state__eyebrow,
.cc-empty-state__title,
.cc-empty-state__description,
.cc-empty-state__meta {
  margin: 0;
  overflow-wrap: anywhere;
}

.cc-empty-state__eyebrow {
  color: var(--cc-color-primary);
  font-size: var(--cc-font-size-meta);
  letter-spacing: var(--cc-letter-spacing-eyebrow);
  text-transform: uppercase;
}

.cc-empty-state__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-empty-state__description {
  color: var(--cc-color-text-secondary);
}

.cc-empty-state__meta {
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
}

.cc-empty-state__actions {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
}

.cc-empty-state--inline .cc-empty-state__actions {
  justify-content: flex-start;
}

.cc-empty-state__suggestions {
  display: grid;
  inline-size: min(100%, var(--cc-empty-state-content-max));
  margin: 0;
  padding-inline-start: var(--cc-space-5);
  gap: var(--cc-space-1);
  color: var(--cc-color-text-secondary);
  text-align: start;
}

.cc-empty-state__suggestion {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  .cc-empty-state {
    padding: var(--cc-space-5) var(--cc-space-4);
  }

  .cc-empty-state--compact,
  .cc-empty-state--inline {
    padding: var(--cc-space-4);
  }
}

@media (max-width: 479px) {
  .cc-empty-state__actions {
    inline-size: 100%;
    align-items: stretch;
  }

  .cc-empty-state__actions > .cc-button {
    flex: 1 1 100%;
  }
}

@media (forced-colors: active) {
  .cc-empty-state { border-color: CanvasText; }
  .cc-empty-state__icon { color: CanvasText; }
}

/* source: design-system/patterns/timeline.css */

/* Conecta Frontend Shell — canonical timeline pattern. */
.cc-timeline {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-5);
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-timeline > * { min-width: 0; }

.cc-timeline--compact { gap: var(--cc-space-4); }

.cc-timeline__header {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-4);
  flex-wrap: wrap;
}

.cc-timeline__intro {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-1);
}

.cc-timeline__title,
.cc-timeline__description,
.cc-timeline__date,
.cc-timeline__item-title,
.cc-timeline__item-description,
.cc-timeline__meta,
.cc-timeline__status {
  margin: 0;
  overflow-wrap: anywhere;
}

.cc-timeline__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-section-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-timeline__description,
.cc-timeline__meta,
.cc-timeline__status {
  color: var(--cc-color-text-secondary);
}

.cc-timeline__controls {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
}

.cc-timeline__viewport {
  min-width: 0;
  position: relative;
}

.cc-timeline__track {
  position: relative;
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 0;
  gap: var(--cc-space-5);
  list-style: none;
}

/* Functional connector: it expresses chronological continuity and is not an ornament. */
.cc-timeline__track::before {
  position: absolute;
  z-index: 0;
  content: "";
  background: var(--cc-color-border);
  pointer-events: none;
}

.cc-timeline:not(.cc-timeline--horizontal) .cc-timeline__track::before {
  inset-block: var(--cc-timeline-marker-center);
  inset-inline-start: var(--cc-timeline-connector-offset);
  inline-size: var(--cc-timeline-line-width);
}

.cc-timeline__item {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 0;
  grid-template-columns: var(--cc-timeline-marker-size) minmax(0, 1fr);
  align-items: start;
  gap: var(--cc-space-4);
}

.cc-timeline__marker {
  position: relative;
  z-index: 1;
  display: inline-flex;
  inline-size: var(--cc-timeline-marker-size);
  block-size: var(--cc-timeline-marker-size);
  align-items: center;
  justify-content: center;
  border: var(--cc-timeline-line-width) solid var(--cc-color-border-interactive);
  border-radius: 50%;
  background: var(--cc-color-surface);
  color: var(--cc-color-primary);
  box-sizing: border-box;
}

.cc-timeline__marker .cc-icon {
  inline-size: var(--cc-timeline-marker-icon-size);
  block-size: var(--cc-timeline-marker-icon-size);
}

.cc-timeline__item--complete .cc-timeline__marker {
  border-color: var(--cc-color-success);
  background: var(--cc-color-success);
  color: var(--cc-color-on-primary);
}

.cc-timeline__item--current .cc-timeline__marker,
.cc-timeline__item[aria-current="step"] .cc-timeline__marker {
  border-color: var(--cc-color-primary);
  box-shadow: 0 0 0 var(--cc-timeline-current-ring-width) var(--cc-color-interaction);
}

.cc-timeline__item--disabled {
  color: var(--cc-color-disabled-text);
}

.cc-timeline__item--disabled .cc-timeline__marker {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
}

.cc-timeline__item--disabled .cc-timeline__date,
.cc-timeline__item--disabled .cc-timeline__item-title,
.cc-timeline__item--disabled .cc-timeline__item-description,
.cc-timeline__item--disabled .cc-timeline__meta {
  color: var(--cc-color-disabled-text);
}

.cc-timeline__content {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-3);
}

.cc-timeline__item-header {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-1);
}

.cc-timeline__date {
  color: var(--cc-color-primary);
  font-size: var(--cc-font-size-meta);
  line-height: var(--cc-line-height-interface);
}

.cc-timeline__item-title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-timeline__item-description { color: var(--cc-color-text-secondary); }

.cc-timeline__meta {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
  font-size: var(--cc-font-size-secondary);
}

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

.cc-timeline--compact .cc-timeline__track { gap: var(--cc-space-4); }
.cc-timeline--compact .cc-timeline__item { gap: var(--cc-space-3); }

.cc-timeline--horizontal .cc-timeline__viewport {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
}

.cc-timeline--horizontal .cc-timeline__track {
  grid-auto-flow: column;
  grid-auto-columns: minmax(var(--cc-timeline-card-min), 1fr);
  gap: var(--cc-space-4);
  padding-block-start: 0;
  padding-block-end: var(--cc-space-2);
}

.cc-timeline--horizontal .cc-timeline__track::before {
  inset-block-start: var(--cc-timeline-connector-offset);
  inset-inline: var(--cc-timeline-marker-center);
  block-size: var(--cc-timeline-line-width);
}

.cc-timeline--horizontal .cc-timeline__item {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: var(--cc-timeline-marker-size) minmax(0, 1fr);
}

.cc-timeline--horizontal .cc-timeline__marker { grid-row: 1; }
.cc-timeline--horizontal .cc-timeline__content { grid-row: 2; }

.cc-timeline--snap .cc-timeline__viewport { scroll-snap-type: inline proximity; }
.cc-timeline--snap .cc-timeline__item { scroll-snap-align: start; }

@media (max-width: 767px) {
  .cc-timeline__header { display: grid; }
  .cc-timeline__controls { justify-content: flex-start; }
  .cc-timeline--horizontal .cc-timeline__track {
    grid-auto-columns: minmax(min(82vw, var(--cc-timeline-card-min)), 1fr);
  }
}

@media (max-width: 479px) {
  .cc-timeline__actions { align-items: stretch; }
  .cc-timeline__actions > .cc-button { flex: 1 1 100%; }
  .cc-timeline__controls > .cc-button,
  .cc-timeline__controls > .cc-icon-button { min-block-size: var(--cc-layout-touch-target); }
}

@media (prefers-reduced-motion: reduce) {
  .cc-timeline--snap .cc-timeline__viewport { scroll-behavior: auto; }
}

@media (forced-colors: active) {
  .cc-timeline__track::before { background: CanvasText; }
  .cc-timeline__marker { border-color: CanvasText; }
  .cc-timeline__item--current .cc-timeline__marker,
  .cc-timeline__item[aria-current="step"] .cc-timeline__marker {
    outline: var(--cc-focus-ring-width) solid CanvasText;
    outline-offset: var(--cc-focus-ring-offset);
    box-shadow: none;
  }
}

/* source: design-system/patterns/modal.css */

/* Conecta Frontend Shell — canonical modal pattern. */
dialog.cc-modal {
  inline-size: min(calc(100% - (var(--cc-layout-gutter) * 2)), var(--cc-modal-width-medium));
  max-inline-size: var(--cc-modal-width-medium);
  max-block-size: min(var(--cc-modal-max-height), calc(100dvh - var(--cc-space-8)));
  margin: auto;
  padding: 0;
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-modal-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-2);
  overflow: hidden;
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

dialog.cc-modal:not([open]) { display: none; }

dialog.cc-modal[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

dialog.cc-modal::backdrop { background: var(--cc-color-backdrop); }

.cc-modal > * { min-width: 0; }

.cc-modal--small {
  inline-size: min(calc(100% - (var(--cc-layout-gutter) * 2)), var(--cc-modal-width-small));
  max-inline-size: var(--cc-modal-width-small);
}

.cc-modal--large {
  inline-size: min(calc(100% - (var(--cc-layout-gutter) * 2)), var(--cc-modal-width-large));
  max-inline-size: var(--cc-modal-width-large);
}

.cc-modal__header {
  display: flex;
  min-width: 0;
  padding: var(--cc-space-5) var(--cc-space-6);
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-4);
  border-block-end: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-modal__intro {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-1);
}

.cc-modal__eyebrow,
.cc-modal__title,
.cc-modal__description,
.cc-modal__status { margin: 0; overflow-wrap: anywhere; }

.cc-modal__eyebrow {
  color: var(--cc-color-primary);
  font-size: var(--cc-font-size-meta);
  letter-spacing: var(--cc-letter-spacing-eyebrow);
  text-transform: uppercase;
}

.cc-modal__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-section-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-modal__description,
.cc-modal__status { color: var(--cc-color-text-secondary); }

.cc-modal__close { flex: 0 0 auto; }

.cc-modal__body {
  min-width: 0;
  min-block-size: 0;
  padding: var(--cc-space-6);
  overflow: auto;
  overscroll-behavior: contain;
}

.cc-modal__body > :first-child { margin-block-start: 0; }
.cc-modal__body > :last-child { margin-block-end: 0; }

.cc-modal__footer {
  display: flex;
  min-width: 0;
  padding: var(--cc-space-4) var(--cc-space-6);
  align-items: center;
  justify-content: flex-end;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
  border-block-start: var(--cc-divider-thickness) solid var(--cc-color-border);
  background: var(--cc-color-surface-soft);
}

.cc-modal--compact .cc-modal__header,
.cc-modal--compact .cc-modal__body,
.cc-modal--compact .cc-modal__footer {
  padding-inline: var(--cc-space-4);
}

.cc-modal--compact .cc-modal__header { padding-block: var(--cc-space-4); }
.cc-modal--compact .cc-modal__body { padding-block: var(--cc-space-4); }
.cc-modal--compact .cc-modal__footer { padding-block: var(--cc-space-3); }

@media (max-width: 767px) {
  dialog.cc-modal {
    inline-size: calc(100% - (var(--cc-layout-gutter) * 2));
    max-inline-size: none;
    max-block-size: calc(100dvh - (var(--cc-layout-gutter) * 2));
  }

  .cc-modal__header,
  .cc-modal__body,
  .cc-modal__footer { padding-inline: var(--cc-space-4); }
}

@media (max-width: 479px) {
  .cc-modal__footer { align-items: stretch; }

  .cc-modal__footer > .cc-button {
    flex: 1 1 100%;
    min-block-size: var(--cc-layout-touch-target);
  }
}

@media (forced-colors: active) {
  dialog.cc-modal,
  .cc-modal__header,
  .cc-modal__footer { border-color: CanvasText; }
}

/* source: design-system/patterns/popover.css */

/* Conecta Frontend Shell — canonical anchored popover pattern. */
.cc-popover-region {
  position: relative;
  display: inline-flex;
  min-width: 0;
  align-items: center;
}

.cc-popover {
  position: absolute;
  z-index: var(--cc-popover-z-index);
  inset-block-start: calc(100% + var(--cc-space-2));
  inset-inline-end: 0;
  display: grid;
  inline-size: min(var(--cc-popover-width), calc(100vw - (var(--cc-layout-gutter) * 2)));
  max-inline-size: calc(100vw - (var(--cc-layout-gutter) * 2));
  max-block-size: min(var(--cc-popover-max-height), calc(100dvh - var(--cc-space-8)));
  margin: 0;
  padding: 0;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-popover-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-shadow: var(--cc-elevation-2);
  overflow: hidden;
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-popover[hidden] { display: none; }
.cc-popover > * { min-width: 0; }

.cc-popover--start {
  inset-inline-start: 0;
  inset-inline-end: auto;
}

.cc-popover--top {
  inset-block-start: auto;
  inset-block-end: calc(100% + var(--cc-space-2));
}

.cc-popover--wide {
  inline-size: min(var(--cc-popover-width-wide), calc(100vw - (var(--cc-layout-gutter) * 2)));
}

.cc-popover__header {
  display: flex;
  min-width: 0;
  padding: var(--cc-space-4);
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--cc-space-3);
  border-block-end: var(--cc-divider-thickness) solid var(--cc-color-border);
}

.cc-popover__intro {
  display: grid;
  min-width: 0;
  gap: var(--cc-space-1);
}

.cc-popover__title,
.cc-popover__description,
.cc-popover__status { margin: 0; overflow-wrap: anywhere; }

.cc-popover__title {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-title);
  font-size: var(--cc-font-size-card-title);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-title);
}

.cc-popover__description,
.cc-popover__status {
  color: var(--cc-color-text-secondary);
  font-size: var(--cc-font-size-secondary);
}

.cc-popover__body {
  min-width: 0;
  min-block-size: 0;
  padding: var(--cc-space-4);
  overflow: auto;
  overscroll-behavior: contain;
}

.cc-popover__body > :first-child { margin-block-start: 0; }
.cc-popover__body > :last-child { margin-block-end: 0; }

.cc-popover__footer {
  display: flex;
  min-width: 0;
  padding: var(--cc-space-3) var(--cc-space-4);
  align-items: center;
  justify-content: flex-end;
  gap: var(--cc-space-2);
  flex-wrap: wrap;
  border-block-start: var(--cc-divider-thickness) solid var(--cc-color-border);
  background: var(--cc-color-surface-soft);
}

.cc-popover__list {
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 0;
  gap: var(--cc-space-1);
  list-style: none;
}

.cc-popover__item { min-width: 0; }

.cc-popover__action {
  display: flex;
  min-width: 0;
  inline-size: 100%;
  min-block-size: var(--cc-control-height);
  padding: var(--cc-space-2) var(--cc-space-3);
  align-items: center;
  gap: var(--cc-space-2);
  border: 0;
  border-radius: var(--cc-control-radius);
  background: transparent;
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
  font: inherit;
  text-align: start;
  text-decoration: none;
  cursor: pointer;
}

.cc-popover__action:hover { background: var(--cc-color-interaction-hover); }

.cc-popover__action:focus-visible {
  outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
  outline-offset: var(--cc-focus-ring-offset);
  box-shadow: var(--cc-focus-ring-shadow);
}

.cc-popover__action[aria-disabled="true"],
.cc-popover__action:disabled {
  background: transparent;
  color: var(--cc-color-disabled-text);
  cursor: not-allowed;
}

@media (hover: none), (pointer: coarse) {
  .cc-popover__action { min-block-size: var(--cc-layout-touch-target); }
}

@media (max-width: 479px) {
  .cc-popover {
    position: fixed;
    inset-block-start: auto;
    inset-block-end: var(--cc-layout-gutter);
    inset-inline: var(--cc-layout-gutter);
    inline-size: auto;
    max-inline-size: none;
    max-block-size: calc(100dvh - (var(--cc-layout-gutter) * 2));
  }

  .cc-popover__footer { align-items: stretch; }
  .cc-popover__footer > .cc-button { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .cc-popover { scroll-behavior: auto; }
}

@media (forced-colors: active) {
  .cc-popover,
  .cc-popover__header,
  .cc-popover__footer { border-color: CanvasText; }

  .cc-popover__action:focus-visible {
    outline-color: CanvasText;
    box-shadow: none;
  }
}

/* source: design-system/responsive/mobile-composition.css */

/* Conecta Frontend Shell — canonical opt-in mobile composition. */
.cc-mobile-composition {
  display: grid;
  min-width: 0;
  gap: var(--cc-layout-section-gap);
}

.cc-mobile-composition > *,
.cc-mobile-composition__main,
.cc-mobile-composition__aside,
.cc-mobile-composition__content,
.cc-mobile-composition__toolbar,
.cc-mobile-composition__toolbar-main,
.cc-mobile-composition__toolbar-actions,
.cc-mobile-composition__actions,
.cc-mobile-composition__scroll-region,
.cc-mobile-composition__sticky-actions {
  min-width: 0;
  box-sizing: border-box;
}

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

.cc-mobile-composition--split {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  align-items: start;
}

.cc-mobile-composition__main,
.cc-mobile-composition__aside,
.cc-mobile-composition__content {
  display: grid;
  align-content: start;
  gap: var(--cc-layout-grid-gap);
}

.cc-mobile-composition__toolbar,
.cc-mobile-composition__toolbar-main,
.cc-mobile-composition__toolbar-actions,
.cc-mobile-composition__actions,
.cc-mobile-composition__sticky-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--cc-space-2) var(--cc-space-3);
}

.cc-mobile-composition__toolbar {
  justify-content: space-between;
}

.cc-mobile-composition__toolbar-main,
.cc-mobile-composition__toolbar-actions,
.cc-mobile-composition__actions {
  max-width: 100%;
}

.cc-mobile-composition__toolbar-actions,
.cc-mobile-composition__actions--end {
  justify-content: flex-end;
}

.cc-mobile-composition__actions--between {
  justify-content: space-between;
}

.cc-mobile-composition__action {
  min-width: 0;
  max-width: 100%;
}

.cc-mobile-composition__scroll-region {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.cc-mobile-composition__scroll-region > * {
  min-width: max-content;
}

.cc-mobile-composition__scroll-region--fit > * {
  min-width: 100%;
}

.cc-mobile-composition__scroll-region:focus-visible {
  outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
  outline-offset: var(--cc-focus-ring-offset);
}

.cc-mobile-composition__sticky-actions {
  justify-content: flex-end;
  padding: var(--cc-space-3) 0;
  border-top: var(--cc-divider-thickness) solid var(--cc-color-border);
  background: var(--cc-color-surface);
}

.cc-mobile-composition__mobile-only {
  display: none;
}

@media (max-width: 1023px) {
  .cc-mobile-composition--split {
    grid-template-columns: minmax(0, 1fr);
  }
}

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

  .cc-mobile-composition__main,
  .cc-mobile-composition__aside,
  .cc-mobile-composition__content {
    gap: var(--cc-layout-grid-gap-compact);
  }

  .cc-mobile-composition__toolbar {
    display: grid;
    align-items: stretch;
    justify-content: stretch;
    gap: var(--cc-space-3);
  }

  .cc-mobile-composition__toolbar-main,
  .cc-mobile-composition__toolbar-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .cc-mobile-composition__actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
    align-items: stretch;
  }

  .cc-mobile-composition__action,
  .cc-mobile-composition__action > .cc-button,
  .cc-mobile-composition__action > .cc-form-control {
    width: 100%;
  }

  .cc-mobile-composition__sticky-actions {
    width: 100%;
    padding-bottom: calc(var(--cc-space-3) + env(safe-area-inset-bottom, 0px));
  }

  .cc-mobile-composition__mobile-only {
    display: block;
  }

  .cc-mobile-composition__desktop-only {
    display: none;
  }
}

@media (max-width: 767px) and (min-height: 601px) {
  .cc-mobile-composition__sticky-actions {
    position: sticky;
    bottom: 0;
    z-index: 2;
  }
}

@media (max-width: 479px) {
  .cc-mobile-composition__actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-mobile-composition__toolbar-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-mobile-composition__toolbar-actions > .cc-button,
  .cc-mobile-composition__sticky-actions > .cc-button {
    width: 100%;
  }
}

@media (forced-colors: active) {
  .cc-mobile-composition__sticky-actions {
    border-color: CanvasText;
    background: Canvas;
  }

  .cc-mobile-composition__scroll-region:focus-visible {
    outline-color: CanvasText;
  }
}

/* source: design-system/primitives/icon.css */

/* Conecta Frontend Shell — canonical public icon primitive. */
.cc-icon {
  display: inline-block;
  width: var(--cc-icon-size-20);
  height: var(--cc-icon-size-20);
  flex: 0 0 var(--cc-icon-size-20);
  color: inherit;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
  vertical-align: -0.125em;
}

.cc-icon--16 {
  width: var(--cc-icon-size-16);
  height: var(--cc-icon-size-16);
  flex-basis: var(--cc-icon-size-16);
}

.cc-icon--20 {
  width: var(--cc-icon-size-20);
  height: var(--cc-icon-size-20);
  flex-basis: var(--cc-icon-size-20);
}

.cc-icon--24 {
  width: var(--cc-icon-size-24);
  height: var(--cc-icon-size-24);
  flex-basis: var(--cc-icon-size-24);
}

.cc-icon use { pointer-events: none; }

.cc-button__icon > .cc-icon,
.cc-badge__icon > .cc-icon {
  width: 100%;
  height: 100%;
  flex-basis: 100%;
}

/* source: design-system/primitives/badge.css */

/* Conecta Frontend Shell — canonical public badge primitive. */
.cc-badge {
  display: inline-flex;
  min-width: 0;
  min-height: var(--cc-badge-height);
  padding-inline: var(--cc-space-2);
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-1);
  border: var(--cc-card-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-badge-radius);
  background: var(--cc-color-surface-soft);
  color: var(--cc-color-text-secondary);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-meta);
  font-weight: var(--cc-font-weight-medium);
  line-height: var(--cc-line-height-interface);
  text-align: center;
  overflow-wrap: anywhere;
  vertical-align: middle;
}

.cc-badge__icon {
  display: inline-flex;
  width: var(--cc-badge-icon-size);
  height: var(--cc-badge-icon-size);
  flex: 0 0 var(--cc-badge-icon-size);
  align-items: center;
  justify-content: center;
  color: currentColor;
}

.cc-badge__icon > svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
}

.cc-badge--primary {
  border-color: var(--cc-color-border-interactive);
  background: var(--cc-color-interaction);
  color: var(--cc-color-primary);
}

.cc-badge--success {
  border-color: var(--cc-color-success-border);
  background: var(--cc-color-success-soft);
  color: var(--cc-color-success);
}

.cc-badge--warning {
  border-color: var(--cc-color-warning-border);
  background: var(--cc-color-warning-soft);
  color: var(--cc-color-warning);
}

.cc-badge--info {
  border-color: var(--cc-color-info-border);
  background: var(--cc-color-info-soft);
  color: var(--cc-color-info);
}

.cc-badge--danger {
  border-color: var(--cc-color-danger-border);
  background: var(--cc-color-danger-soft);
  color: var(--cc-color-danger);
}

.cc-badge[aria-disabled="true"] {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
}

@media (forced-colors: active) {
  .cc-badge {
    border-color: currentColor;
    forced-color-adjust: auto;
  }
}

/* source: design-system/primitives/status-indicator.css */

/* Conecta Frontend Shell — canonical public status indicator primitive. */
.cc-status-indicator {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: var(--cc-space-2);
  color: var(--cc-color-text-secondary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-secondary);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  overflow-wrap: anywhere;
  vertical-align: middle;
}

.cc-status-indicator__dot {
  display: inline-block;
  width: var(--cc-status-dot-size);
  height: var(--cc-status-dot-size);
  flex: 0 0 var(--cc-status-dot-size);
  border: var(--cc-card-border-width) solid currentColor;
  border-radius: var(--cc-badge-radius);
  background: currentColor;
  box-sizing: border-box;
}

.cc-status-indicator__label {
  min-width: 0;
  color: currentColor;
  overflow-wrap: anywhere;
}

.cc-status-indicator--large .cc-status-indicator__dot {
  width: var(--cc-status-dot-size-large);
  height: var(--cc-status-dot-size-large);
  flex-basis: var(--cc-status-dot-size-large);
}

.cc-status-indicator--primary { color: var(--cc-color-primary); }
.cc-status-indicator--success { color: var(--cc-color-success); }
.cc-status-indicator--warning { color: var(--cc-color-warning); }
.cc-status-indicator--info { color: var(--cc-color-info); }
.cc-status-indicator--danger { color: var(--cc-color-danger); }

.cc-status-indicator[aria-disabled="true"] {
  color: var(--cc-color-disabled-text);
}


/* Shared temporal presence tooltip. Visual only; accessible names remain on the owning control/indicator. */
.cc-presence-tooltip {
  cursor: default !important;
  pointer-events: auto !important;
}
.cc-presence-tooltip::after {
  content: attr(data-cc-presence-tooltip);
  position: absolute;
  left: var(--cc-presence-tooltip-left, 50%);
  right: var(--cc-presence-tooltip-right, auto);
  top: var(--cc-presence-tooltip-top, auto);
  bottom: var(--cc-presence-tooltip-bottom, calc(100% + 8px));
  z-index: 1000;
  width: max-content;
  max-width: 220px;
  padding: 6px 8px;
  border: 1px solid rgba(83, 96, 87, 0.16);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 7px 20px rgba(32, 45, 37, 0.13);
  color: #3f4b43;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transform: var(--cc-presence-tooltip-transform-hidden, translate(-50%, 2px));
  transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s ease;
  pointer-events: none;
}
.cc-presence-tooltip:hover::after,
.cc-presence-tooltip:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: var(--cc-presence-tooltip-transform-visible, translate(-50%, 0));
}
.cc-presence-tooltip:focus-visible {
  outline: 2px solid rgba(78, 110, 50, 0.34);
  outline-offset: 2px;
}
body.conecta-dark .cc-presence-tooltip::after,
html.conecta-a11y-dark .cc-presence-tooltip::after {
  background: var(--conecta-dark-card, #172a1d);
  border-color: rgba(255, 255, 255, 0.16);
  color: #f3f6f1;
}
@media (prefers-reduced-motion: reduce) {
  .cc-presence-tooltip::after { transition: none; }
}

@media (forced-colors: active) {
  .cc-status-indicator__dot {
    background: CanvasText;
    border-color: CanvasText;
    forced-color-adjust: none;
  }
}

/* source: design-system/primitives/feedback.css */

/* Conecta Frontend Shell — canonical feedback and message surface. */
.cc-feedback {
  --cc-feedback-background: var(--cc-color-surface-soft);
  --cc-feedback-border: var(--cc-color-border);
  --cc-feedback-foreground: var(--cc-color-text-primary);
  display: grid;
  grid-template-columns: var(--cc-feedback-icon-size) minmax(0, 1fr);
  gap: var(--cc-space-3);
  align-items: start;
  min-width: 0;
  padding: var(--cc-space-4);
  border: var(--cc-card-border-width) solid var(--cc-feedback-border);
  border-radius: var(--cc-feedback-radius);
  background: var(--cc-feedback-background);
  color: var(--cc-feedback-foreground);
  font-family: var(--cc-font-family-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}

.cc-feedback--compact {
  padding: var(--cc-space-3);
  gap: var(--cc-space-2);
}

.cc-feedback--without-icon { grid-template-columns: minmax(0, 1fr); }

.cc-feedback--success {
  --cc-feedback-background: var(--cc-color-success-soft);
  --cc-feedback-border: var(--cc-color-success-border);
  --cc-feedback-foreground: var(--cc-color-success);
}

.cc-feedback--warning {
  --cc-feedback-background: var(--cc-color-warning-soft);
  --cc-feedback-border: var(--cc-color-warning-border);
  --cc-feedback-foreground: var(--cc-color-warning);
}

.cc-feedback--info {
  --cc-feedback-background: var(--cc-color-info-soft);
  --cc-feedback-border: var(--cc-color-info-border);
  --cc-feedback-foreground: var(--cc-color-info);
}

.cc-feedback--danger {
  --cc-feedback-background: var(--cc-color-danger-soft);
  --cc-feedback-border: var(--cc-color-danger-border);
  --cc-feedback-foreground: var(--cc-color-danger);
}

.cc-feedback__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--cc-feedback-icon-size);
  height: var(--cc-feedback-icon-size);
  color: currentColor;
}

.cc-feedback__content {
  display: grid;
  gap: var(--cc-space-1);
  min-width: 0;
}

.cc-feedback__title,
.cc-feedback__message { margin: 0; }

.cc-feedback__title {
  font-family: var(--cc-font-family-interface);
  font-size: var(--cc-font-size-interface);
  font-weight: var(--cc-font-weight-medium);
  line-height: var(--cc-line-height-interface);
}

.cc-feedback__message {
  color: currentColor;
  overflow-wrap: anywhere;
}

.cc-feedback__actions {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  gap: var(--cc-space-2);
  align-items: center;
  min-width: 0;
}

.cc-feedback--without-icon .cc-feedback__actions { grid-column: 1; }
.cc-feedback[hidden] { display: none; }

@media (max-width: 479px) {
  .cc-feedback__actions > .cc-button { flex: 1 1 auto; }
}

@media (forced-colors: active) {
  .cc-feedback {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/primitives/button.css */

/* Conecta Frontend Shell — canonical public button primitive. */
.cc-button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-2);
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  min-height: var(--cc-control-height);
  padding: var(--cc-space-2) var(--cc-space-4);
  border: var(--cc-control-border-width) solid transparent;
  border-radius: var(--cc-control-radius);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-control);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: background-color var(--cc-motion-fast) var(--cc-motion-easing), border-color var(--cc-motion-fast) var(--cc-motion-easing), color var(--cc-motion-fast) var(--cc-motion-easing), box-shadow var(--cc-motion-fast) var(--cc-motion-easing);
}
.cc-button--primary {
  border-color: var(--cc-color-border-interactive);
  background: var(--cc-color-interaction);
  color: var(--cc-color-primary);
}
.cc-button--secondary {
  border-color: var(--cc-color-border);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
}
.cc-button--tertiary {
  border-color: transparent;
  background: transparent;
  color: var(--cc-color-primary);
}
.cc-button:hover {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-interaction-hover);
  color: var(--cc-color-primary);
  text-decoration: none;
}
.cc-button:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 var(--cc-focus-ring-width) var(--cc-color-focus-ring);
}
.cc-button:active { background: var(--cc-color-interaction-hover); }
.cc-button:disabled,
.cc-button[aria-disabled="true"] {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
  cursor: not-allowed;
  pointer-events: none;
}
.cc-button[aria-busy="true"] {
  cursor: progress;
  pointer-events: none;
}
.cc-button--compact {
  min-height: var(--cc-control-height-compact);
  padding: var(--cc-space-1) var(--cc-space-3);
  font-size: var(--cc-font-size-secondary);
}
.cc-button--block { width: 100%; }
.cc-button__icon {
  display: inline-flex;
  width: var(--cc-control-icon-size);
  height: var(--cc-control-icon-size);
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  color: currentColor;
}
.cc-button__icon > svg { width: 100%; height: 100%; color: currentColor; }

/* Temporary aliases retained until consumers migrate explicitly. */
.cc-shell-control,
.cc-shell-button { min-height: var(--cc-shell-touch-target); box-sizing: border-box; }
.cc-shell-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--cc-space-2);
  padding: 0 var(--cc-space-4);
  border: 1px solid var(--cc-shell-border);
  border-radius: 999px;
  background: var(--cc-shell-surface);
  color: var(--cc-shell-primary);
  text-decoration: none;
}
.cc-shell-button--primary { background: var(--cc-shell-primary); border-color: var(--cc-shell-primary); color: var(--cc-color-on-primary); }

@media (max-width: 767px), (pointer: coarse) {
  .cc-button { min-height: var(--cc-control-height-touch); }
  .cc-button--compact { min-height: var(--cc-control-height-touch); }
}
@media (prefers-reduced-motion: reduce) {
  .cc-button { transition-duration: 0ms; }
}

/* source: design-system/primitives/icon-button.css */

/* Conecta Frontend Shell — canonical icon-only button primitive. */
.cc-icon-button {
  appearance: none;
  display: inline-flex;
  width: var(--cc-icon-button-size);
  height: var(--cc-icon-button-size);
  flex: 0 0 var(--cc-icon-button-size);
  align-items: center;
  justify-content: center;
  padding: 0;
  border: var(--cc-control-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-primary);
  box-sizing: border-box;
  line-height: 1;
  cursor: pointer;
  transition: background-color var(--cc-motion-fast) var(--cc-motion-easing), border-color var(--cc-motion-fast) var(--cc-motion-easing), color var(--cc-motion-fast) var(--cc-motion-easing), box-shadow var(--cc-motion-fast) var(--cc-motion-easing);
}
.cc-icon-button:hover,
.cc-icon-button:active {
  border-color: var(--cc-color-border-interactive-hover);
  background: var(--cc-color-interaction-hover);
  color: var(--cc-color-primary);
}
.cc-icon-button:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 var(--cc-focus-ring-width) var(--cc-color-focus-ring);
}
.cc-icon-button:disabled,
.cc-icon-button[aria-disabled="true"] {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
  cursor: not-allowed;
  pointer-events: none;
}
.cc-icon-button[aria-busy="true"] {
  cursor: progress;
  pointer-events: none;
}
.cc-icon-button > svg,
.cc-icon-button > .dashicons {
  width: var(--cc-control-icon-size);
  height: var(--cc-control-icon-size);
  color: currentColor;
  font-size: var(--cc-control-icon-size);
  line-height: var(--cc-control-icon-size);
}
@media (max-width: 767px), (pointer: coarse) {
  .cc-icon-button { width: var(--cc-icon-button-size-touch); height: var(--cc-icon-button-size-touch); flex-basis: var(--cc-icon-button-size-touch); }
}
@media (prefers-reduced-motion: reduce) {
  .cc-icon-button { transition-duration: 0ms; }
}

/* source: design-system/primitives/form-control.css */

/* Conecta Frontend Shell — canonical public field and form-control primitives. */
.cc-field {
  display: grid;
  gap: var(--cc-space-2);
  min-width: 0;
}
.cc-field__label {
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-secondary);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
}
.cc-field__required { color: var(--cc-color-danger); }
.cc-field__help,
.cc-field__error {
  margin: 0;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-meta);
  line-height: var(--cc-line-height-interface);
}
.cc-field__help { color: var(--cc-color-text-secondary); }
.cc-field__error { color: var(--cc-color-danger); }
.cc-form-control {
  width: 100%;
  min-width: 0;
  min-height: var(--cc-control-height);
  margin: 0;
  padding: 0 var(--cc-space-3);
  border: var(--cc-control-border-width) solid var(--cc-color-border);
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  box-sizing: border-box;
  font-family: var(--cc-font-interface);
  font-size: var(--cc-font-size-control);
  font-weight: var(--cc-font-weight-regular);
  line-height: var(--cc-line-height-interface);
  transition: background-color var(--cc-motion-fast) var(--cc-motion-easing), border-color var(--cc-motion-fast) var(--cc-motion-easing), box-shadow var(--cc-motion-fast) var(--cc-motion-easing);
}
textarea.cc-form-control {
  min-height: var(--cc-textarea-min-height);
  padding-block: var(--cc-space-3);
  resize: vertical;
}
.cc-form-control::placeholder { color: var(--cc-color-placeholder); opacity: 1; }
.cc-form-control:hover { border-color: var(--cc-color-border-interactive-hover); }
.cc-form-control:focus,
.cc-form-control:focus-visible {
  border-color: var(--cc-color-primary);
  outline: 0;
  box-shadow: 0 0 0 var(--cc-focus-ring-width) var(--cc-color-focus-ring);
}
.cc-form-control:disabled {
  border-color: var(--cc-color-border);
  background: var(--cc-color-disabled-surface);
  color: var(--cc-color-disabled-text);
  cursor: not-allowed;
}
.cc-form-control[readonly] {
  background: var(--cc-color-surface-soft);
  color: var(--cc-color-text-secondary);
}
.cc-form-control[aria-invalid="true"],
.cc-form-control.is-invalid {
  border-color: var(--cc-color-danger-border);
  background: var(--cc-color-danger-soft);
}
.cc-form-control[aria-busy="true"] { cursor: progress; }
.cc-field__control-group {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--cc-space-2);
  min-width: 0;
}
.cc-field__control-group > .cc-form-control { flex: 1 1 var(--cc-control-group-min); }
@media (max-width: 767px), (pointer: coarse) {
  .cc-form-control { min-height: var(--cc-control-height-touch); }
}
@media (prefers-reduced-motion: reduce) {
  .cc-form-control { transition-duration: 0ms; }
}

/* source: design-system/foundation/focus.css */

/* Conecta Frontend Shell — canonical opt-in focus behavior. */
.cc-focus-ring:focus-visible,
.cc-focus-group:focus-within {
  outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
  outline-offset: var(--cc-focus-ring-offset);
  box-shadow: var(--cc-focus-ring-shadow);
}

.cc-skip-link {
  position: fixed;
  inset-block-start: var(--cc-space-3);
  inset-inline-start: var(--cc-space-3);
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  min-height: var(--cc-layout-touch-target);
  max-width: calc(100vw - (2 * var(--cc-space-3)));
  padding: var(--cc-space-2) var(--cc-space-4);
  border: var(--cc-control-border-width) solid var(--cc-color-border-interactive);
  border-radius: var(--cc-control-radius);
  background: var(--cc-color-surface);
  color: var(--cc-color-text-primary);
  font-family: var(--cc-font-family-interface);
  font-size: var(--cc-font-size-control);
  line-height: var(--cc-line-height-interface);
  text-decoration: none;
  box-shadow: var(--cc-elevation-2);
  transform: translateY(calc(-100% - var(--cc-space-6)));
  transition: transform var(--cc-motion-duration-fast) var(--cc-motion-easing-standard);
}

.cc-skip-link:focus-visible { transform: translateY(0); }

@supports not selector(:focus-visible) {
  .cc-focus-ring:focus,
  .cc-skip-link:focus {
    outline: var(--cc-focus-ring-width) solid var(--cc-color-primary);
    outline-offset: var(--cc-focus-ring-offset);
    box-shadow: var(--cc-focus-ring-shadow);
  }
  .cc-skip-link:focus { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .cc-skip-link { transition: none; }
}

@media (forced-colors: active) {
  .cc-focus-ring:focus-visible,
  .cc-focus-group:focus-within,
  .cc-skip-link:focus-visible {
    outline-color: CanvasText;
    box-shadow: none;
  }
  .cc-skip-link {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

/* source: design-system/foundation/accessibility.css */

/* Conecta Frontend Shell — shared accessibility helpers. */
.cc-shell-visually-hidden,
.cc-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media (forced-colors: active) {
  .cc-button:focus-visible,
  .cc-icon-button:focus-visible,
  .cc-form-control:focus,
  .cc-form-control:focus-visible,
  .cc-card--interactive:focus-visible {
    outline: var(--cc-focus-ring-width) solid CanvasText;
    outline-offset: 2px;
    box-shadow: none;
  }
  .cc-card,
  .cc-divider {
    border-color: CanvasText;
  }
}
