@layer lf-contract {
/*
  Final authenticated-app visual contract.

  This file is deliberately loaded after page CSS. Page styles own composition;
  this layer owns shared color, shape, typography, focus, and control treatment.
  New page CSS must not override these primitives.
*/

:where(body.dashboard-client-flat-theme[data-company-theme] ) {
  --lf-control-height: var(--lf-target-comfortable);
  --lf-control-radius: var(--lf-radius-md);
  --lf-card-radius: var(--lf-radius-lg);
  --lf-modal-radius: var(--lf-radius-xl);
  background: var(--lf-color-bg);
  color: var(--lf-color-text);
  font-family: var(--lf-font-sans);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell,
body.dashboard-client-flat-theme[data-company-theme] > .shell > .main,
body.dashboard-client-flat-theme[data-company-theme] > .shell .content-grid ) {
  color: var(--lf-color-text);
  background-color: transparent;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .panel,
  .lf-panel,
  .card,
  .lf-card,
  .settings-card,
  .metric-card,
  .analytics-metric-card,
  .stat-card,
  .team-card,
  .billing-card,
  .campaign-card,
  .integration-panel-shell,
  .integration-panel-card,
  .integration-health-card,
  .integration-sidebar-card,
  .integration-status-card,
  .company-detail-panel,
  .company-profile-status-card,
  .billing-overview-panel,
  .billing-info-summary,
  .billing-plan-summary,
  .billing-includes-summary,
  .billing-feature-detail-panel,
  .billing-usage-panel,
  .plans-usage-panel,
  .plans-comparison-panel,
  .detail-panel,
  .progress-panel,
  .journey-card,
  .insurance-ai-card,
  .notification-card
) ) {
  border-color: var(--lf-color-border);
  border-radius: var(--lf-card-radius);
  background-color: var(--lf-color-surface);
  background-image: none;
  color: var(--lf-color-text);
  box-shadow: none;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .panel,
  .settings-card,
  .metric-card,
  .analytics-metric-card,
  .stat-card,
  .team-card,
  .billing-card,
  .campaign-card
):hover ) {
  border-color: var(--lf-color-border-strong);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  h1,
  h2,
  h3,
  h4,
  .title,
  .dashboard-welcome-title,
  .company-cell-name,
  .client-name,
  .lead-name
) ) {
  color: var(--lf-color-text);
  letter-spacing: 0;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .subtitle,
  .muted,
  .lf-muted-text,
  .analytics-metric-label,
  .analytics-metric-sub,
  .panel-header p,
  .settings-card p
) ) {
  color: var(--lf-color-muted);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  button,
  input,
  select,
  textarea
) ) {
  font-family: var(--lf-font-sans);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="password"],
  select,
  textarea,
  .lf-input,
  .lf-select,
  .lf-textarea,
  .search-field,
  .search-input,
  .lead-input,
  .chat-input
) ) {
  border: 1px solid var(--lf-color-border);
  border-radius: var(--lf-control-radius);
  background-color: var(--lf-color-surface);
  background-image: none;
  color: var(--lf-color-text);
  min-height: var(--lf-control-height);
  box-shadow: none;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="password"],
  select,
  textarea,
  .lf-input,
  .lf-select,
  .lf-textarea,
  .search-field,
  .search-input,
  .lead-input,
  .chat-input
):focus ) {
  border-color: var(--lf-color-primary);
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: var(--lf-focus-ring);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  a,
  button,
  summary,
  [tabindex]
):focus-visible ) {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: var(--lf-focus-ring);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .btn,
  .lf-button,
  .btn-primary,
  .btn-secondary,
  .dashboard-mini-button,
  .dashboard-task-footer,
  .dashboard-ai-task-button,
  .dashboard-table-action,
  .dashboard-create-client-button,
  .integration-quick-button,
  .company-action-btn,
  .control-action,
  .billing-primary-button,
  .pipeline-add-button,
  .plans-create-button
) ) {
  min-height: var(--lf-target-comfortable);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--lf-space-2);
  border-radius: var(--lf-control-radius);
  box-shadow: none;
  font-size: var(--lf-font-size-sm);
  font-weight: var(--lf-font-weight-800);
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .btn-primary,
  .lf-button--primary,
  .dashboard-ai-task-button,
  .dashboard-create-client-button,
  .billing-primary-button,
  .pipeline-add-button,
  .plans-create-button
) ) {
  border-color: transparent;
  background-color: var(--lf-color-primary);
  background-image: none;
  color: var(--lf-color-on-primary);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .btn-secondary,
  .lf-button--secondary,
  .dashboard-mini-button,
  .dashboard-task-footer,
  .dashboard-table-action,
  .integration-quick-button,
  .company-action-btn,
  .control-action
) ) {
  border: 1px solid var(--lf-color-border);
  background-color: var(--lf-color-surface-muted);
  background-image: none;
  color: var(--lf-color-text);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .icon-button,
  .lf-icon-button,
  .record-action-trigger,
  .client-action-icon,
  .users-action-trigger,
  .lead-pagination-arrow,
  .lead-pagination-page
) ) {
  min-width: var(--lf-target-comfortable);
  min-height: var(--lf-target-comfortable);
  border-color: var(--lf-color-border);
  border-radius: var(--lf-control-radius);
  background-color: var(--lf-color-surface);
  background-image: none;
  color: var(--lf-color-text);
  box-shadow: none;
}

.lf-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .status-badge,
  .alert-badge,
  .status-chip,
  .plan-chip,
  .dashboard-status-chip,
  .dashboard-plan-chip,
  .dashboard-count-pill,
  .dashboard-trend
) ) {
  border-radius: var(--lf-radius-pill);
  box-shadow: none;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .table-wrap,
  .table-modern,
  .lf-table-wrap,
  .clients-table-scroll
) ) {
  border: 1px solid var(--lf-color-border);
  border-radius: var(--lf-card-radius);
  background-color: var(--lf-color-surface);
  background-image: none;
  box-shadow: none;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .data-table,
  .lead-table,
  .lf-table
) th ) {
  color: var(--lf-color-muted);
  font-size: var(--lf-font-size-xs);
  font-weight: var(--lf-font-weight-800);
  letter-spacing: 0.02em;
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .data-table,
  .lead-table,
  .lf-table
) :is(th, td) ) {
  border-color: var(--lf-color-border);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .data-table,
  .lead-table,
  .lf-table
) tbody tr:hover ) {
  background-color: var(--lf-color-surface-muted);
}

:where(body.dashboard-client-flat-theme :is(
  .modal-card,
  .dialog-card,
  .lead-popup-card,
  .client-form-card,
  .dashboard-agenda-dialog,
  .dashboard-task-dialog,
  .dashboard-pipeline-dialog
) ) {
  border: 1px solid var(--lf-color-border);
  border-radius: var(--lf-modal-radius);
  background-color: var(--lf-color-surface);
  background-image: none;
  color: var(--lf-color-text);
  box-shadow: var(--lf-shadow-lift);
}

:where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
  .analytics-metric-icon,
  .dashboard-task-icon,
  .dashboard-brief-icon,
  .dashboard-inline-title-icon,
  .dashboard-activity-icon,
  .billing-metric-icon,
  .billing-feature-card-icon,
  .integration-panel-icon
) ) {
  border-radius: var(--lf-control-radius);
  box-shadow: none;
}

@media (max-width: 900px) {
  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell ) {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--lf-space-3);
    padding: var(--lf-space-3);
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell > :is(.sidebar, .main),
  body.dashboard-client-flat-theme[data-company-theme] > .shell .content-grid ) {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    .panel,
    .lf-panel,
    .settings-card,
    .billing-card,
    .campaign-card
  ) ) {
    padding: var(--lf-space-4);
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    .panel-header,
    .lf-panel-header,
    .dashboard-panel-header-with-action
  ) ) {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--lf-space-3);
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    button,
    summary,
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    select,
    textarea,
    [role="button"],
    [role="tab"],
    [role="menuitem"],
    [tabindex]:not([tabindex="-1"]),
    a.btn,
    a.lf-button
  ) ) {
    min-height: var(--lf-target-comfortable);
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    button,
    summary,
    [role="button"],
    [role="tab"],
    [role="menuitem"]
  ) ) {
    min-width: var(--lf-target-comfortable);
  }
}

@media (prefers-contrast: more) {
  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell ) {
    --lf-color-border: var(--lf-color-text-soft);
    --lf-color-border-strong: var(--lf-color-text);
    --lf-color-muted: var(--lf-color-text-soft);
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    a,
    button,
    summary,
    input,
    select,
    textarea,
    [tabindex]
  ):focus-visible ) {
    outline-width: 3px;
  }
}

@media (forced-colors: active) {
  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    a,
    button,
    summary,
    input,
    select,
    textarea,
    [tabindex]
  ):focus-visible ) {
    outline: 3px solid Highlight;
    outline-offset: 2px;
    box-shadow: none;
  }

  :where(body.dashboard-client-flat-theme[data-company-theme] > .shell :is(
    button,
    input,
    select,
    textarea,
    .panel,
    .card,
    .settings-card,
    .billing-card,
    .campaign-card
  ) ) {
    border: 1px solid CanvasText;
  }
}

@media (prefers-reduced-motion: reduce) {
  :where(body.dashboard-client-flat-theme[data-company-theme] *,
  body.dashboard-client-flat-theme[data-company-theme] *::before,
  body.dashboard-client-flat-theme[data-company-theme] *::after ) {
    scroll-behavior: auto;
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    transition-duration: 0.01ms;
  }
}
}
