/* Admin-only completion of the approved palette and reading hierarchy. */
@layer components {
  body[data-authed='1']:has(#main-content > .page) {
    .page {
      [hidden] {
        display: none !important;
      }
      .position-count:empty {
        display: none;
      }
      overflow-x: clip;
      .page-header h1 {
        font-size: clamp(26px, 2.4vw, 34px);
        line-height: 1.2;
      }
      .header-actions {
        flex-wrap: wrap;
        gap: 8px;
      }
      /* Not .overview-text: the position Overview reads at the Assessment
         tab's size instead (positions-brand.css). */
      :is(.intel-text, .section-content, .brief-text) {
        font-size: 16px;
        line-height: 1.65;
        overflow-wrap: anywhere;
      }
      :is(
        .company-card,
        .insight-card,
        :where(.company-intel-page) .detail-section,
        .detail-card,
        .brief-card,
        .criteria-card
      ) {
        border-radius: 12px;
        backdrop-filter: none;
      }
      :is(.company-card-glow, .card-glow, .status-glow) {
        display: none;
      }
      :is(input, select, textarea) {
        min-inline-size: 0;
        max-inline-size: 100%;
      }
      :is(.settings-main, .detail-main, .workspace-main) {
        min-inline-size: 0;
      }
    }
    .nav-brand-text {
      font-size: 10px;
      letter-spacing: 0.12em;
    }
    @media (max-width: 700px) {
      .simulation-story-page {
        .story-content {
          min-inline-size: 0;
          inline-size: 100%;
        }
        .story-meta {
          flex-wrap: wrap;
          gap: 8px;
        }
        .story-title-row {
          min-inline-size: 0;
        }
        .assessment-cost-line {
          white-space: normal;
        }
      }
      .page .header-actions {
        inline-size: 100%;
      }
      .page .page-header {
        align-items: flex-start;
        flex-wrap: wrap;
      }
    }
  }
}
@layer theme {
  :is(body[data-authed='1']:has(#main-content > .page), body:has(#main-content > .signin-page)) {
    --color-success: #287047;
    --color-info: #276d65;
    --color-warning: #875e12;
    --color-error: #ad4141;
    --input-bg: #ffffff;
    --input-bg-darker: #eeefeb;
    --input-border-color: #b8bdb2;
  }
  body[data-authed='1']:has(#main-content > .page) {
    .page {
      :is(input, textarea)::placeholder {
        /* Shared contact styles are unlayered; keep admin hints readable. */
        color: var(--text-secondary) !important;
        opacity: 1;
      }
      :is(
        .company-card,
        .insight-card,
        :where(.company-intel-page) .detail-section,
        .detail-card,
        .brief-card,
        .criteria-card
      ) {
        background: var(--surface-elevated);
        border-color: var(--pilot-border);
        box-shadow: none;
      }
      :is(.section-icon, .company-icon, .insight-icon) {
        color: var(--pilot-icon-ink);
        background: var(--pilot-icon-bg);
        box-shadow: none;
      }
      :is(.overview-text, .section-content, .intel-text, .brief-text, .card) :is(strong, b) {
        color: var(--accent-warm);
      }
      :is(.secondary-button, .back-button) {
        box-shadow: none;
      }
      /* Column headers only; <th scope="row"> row labels style like
         ordinary cells. Excludes by the attribute that means "row header"
         rather than assuming every header sits in a <thead> — holds even
         for a table built without one (the parser puts a headerless
         <table><tr><th> row in <tbody>) or assembled via insertRow. */
      th:not([scope='row']) {
        background: var(--surface-sunken);
        color: var(--text-secondary);
        text-transform: none;
        letter-spacing: 0;
      }
      :is(.tab-trigger.active, .tab-button.active, .setup-step.is-current) {
        background: var(--pilot-selected);
        color: var(--accent-primary);
      }
      :is(button, a, input, select, textarea, summary):focus-visible {
        outline: 2px solid var(--accent-primary);
        outline-offset: 3px;
      }
    }
    nav.navbar :is(.nav-links a, .profile-name) {
      color: var(--pilot-nav-text);
    }
  }
  html[data-theme='dark'] body[data-authed='1']:has(#main-content > .page) {
    --color-success: #94d5ab;
    --color-info: #93c5fd;
    --color-warning: #e7c37d;
    --color-error: #f19a96;
    --input-bg: #16181b;
    --input-bg-darker: #101114;
    --input-border-color: #5a5f66;
    --button-text-color: #2c1a13;
    .members-page .danger-button,
    .page .avatar {
      color: #2c1a13;
    }
  }
}
@layer components {
  .talent-management-page .setup-continuation {
    margin-block-end: 24px;
    border: 1px solid;
    border-radius: 10px;
    > summary {
      cursor: pointer;
      padding: 14px 16px;
      font-size: 14px;
      font-weight: 600;
      span {
        margin-inline-start: 16px;
        font-weight: 400;
      }
    }
    .get-started {
      margin: 0;
      border: 0;
    }
  }
}
@layer theme {
  .talent-management-page .setup-continuation {
    background: var(--surface-elevated);
    border-color: var(--pilot-border);
    > summary {
      color: var(--text-primary);
    }
    > summary span {
      color: var(--text-secondary);
    }
  }
}

@layer theme {
  body[data-authed='1']:has(#main-content > .page)
    .eval-criteria-page
    .primary-button.btn--success {
    background: var(--color-success);
    color: #ffffff;
  }
  html[data-theme='dark']
    body[data-authed='1']:has(#main-content > .page)
    .eval-criteria-page
    .primary-button.btn--success {
    color: #18251f;
  }
}