/* One shared light theme for the directory and its phone layouts. */
:root {
  color-scheme: light;
  color-scheme: only light;
  background: #fff;
  color: #172a46;
}

html,
body,
body.onepage,
body.company-workspace-mode {
  background: #fff;
  color: #172a46;
  color-scheme: light;
  color-scheme: only light;
}

/* Paint the shared surfaces explicitly, including native dialog windows. */
body.onepage .area,
body.onepage main,
body.onepage .sidebar,
body.onepage .directory-results-panel,
body.onepage .people-hub-panel,
.directory-filter-panel,
.people-count-filter-panel,
.am-person-dialog,
.compact-source-dialog,
.website-preview-dialog {
  background-color: #fff;
  color: #172a46;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  color-scheme: light;
  color-scheme: only light;
  background-color: #fff;
  color: #26374f;
  caret-color: #1855d9;
}

input::placeholder,
textarea::placeholder {
  color: #718096;
  opacity: 1;
}

@media (max-width: 700px) {
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  .compact-name-search input,
  .compact-company-filters select,
  .websites-toolbar input,
  .websites-toolbar select,
  body.onepage .people-hub-search select {
    font-size: 16px;
  }

  body.onepage .sidebar nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
  }

  .compact-name-search {
    min-height: 44px;
  }

  .compact-name-search button {
    min-width: 40px;
    min-height: 38px;
  }

  .compact-company-filters select,
  body.onepage .people-hub-search select,
  .compact-toolbar-actions button {
    min-height: 44px;
  }

  /* Keep the directory rows inside the phone viewport. */
  body.onepage .uk-directory-table,
  body.onepage .people-hub-scroll table {
    min-width: 0;
    width: 100%;
    table-layout: fixed;
  }

  body.onepage .uk-directory-table th,
  body.onepage .uk-directory-table td,
  body.onepage .people-hub-scroll th,
  body.onepage .people-hub-scroll td {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.onepage #allCompanyDirectory .uk-directory-table .name,
  body.onepage .people-hub-scroll .name {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    max-width: 100%;
    font-size: 13px;
    line-height: 1.45;
    white-space: normal;
    overflow-wrap: anywhere;
    overflow: visible;
    text-overflow: clip;
  }

  body.onepage .uk-directory-table th:first-child {
    width: 57%;
  }

  body.onepage .uk-directory-table th:nth-child(3) {
    width: 22%;
  }

  body.onepage .uk-directory-table th:last-child {
    width: 21%;
  }

  body.onepage .uk-directory-table th,
  body.onepage .people-hub-scroll th {
    font-size: 9px;
    letter-spacing: 0;
    white-space: nowrap;
    padding-inline: 4px;
  }

  body.onepage #allCompanyDirectory .uk-directory-table th:nth-child(2),
  body.onepage #allCompanyDirectory .uk-directory-table td:nth-child(2) {
    display: none;
  }

  body.onepage #allCompanyDirectory .company-categories-mobile {
    display: block;
    margin-top: 6px;
  }

  body.onepage #allCompanyDirectory .company-category {
    max-width: 100%;
    min-height: 32px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.onepage .uk-directory-table td:last-child,
  body.onepage .people-hub-scroll td:last-child {
    padding-inline: 4px;
  }

  body.onepage .uk-directory-table td:last-child .text-button,
  body.onepage .people-hub-scroll td:last-child .text-button,
  body.onepage .people-hub-scroll .people-company-count {
    min-height: 44px;
    min-width: 44px;
    max-width: 100%;
    padding: 4px;
    white-space: normal;
  }

  /* All four People columns remain visible; connection details wrap. */
  body.onepage .people-hub-scroll th:nth-child(1) {
    width: 36%;
  }

  body.onepage .people-hub-scroll th:nth-child(2) {
    width: 20%;
  }

  body.onepage .people-hub-scroll th:nth-child(3) {
    width: 26%;
  }

  body.onepage .people-hub-scroll th:last-child {
    width: 18%;
  }

  body.onepage .people-hub-scroll th,
  body.onepage .people-hub-scroll td {
    padding-inline: 4px;
  }

  body.onepage .people-hub-scroll .people-hub-roles,
  body.onepage .people-hub-scroll .people-hub-roles .pill,
  body.onepage .people-hub-scroll .people-hub-roles small,
  body.onepage .people-hub-scroll td > small {
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.onepage .people-hub-scroll .people-hub-roles .pill {
    max-width: 100%;
    padding: 4px;
    margin-inline: 0;
  }

  .people-inline {
    padding: 12px 8px;
  }

  .people-inline header {
    flex-wrap: wrap;
    gap: 10px;
  }

  .people-inline header .text-button {
    min-height: 44px;
    white-space: normal;
    text-align: left;
  }

  .am-person-dialog,
  .compact-source-dialog {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
    padding: 16px;
  }

  .am-person-header,
  .compact-source-dialog header {
    align-items: flex-start;
    gap: 12px;
  }

  .am-person-header > div {
    min-width: 0;
  }

  .am-person-header h2,
  .compact-source-dialog h2 {
    overflow-wrap: anywhere;
  }

  .am-person-header > button,
  .compact-source-dialog header > button {
    min-width: 44px;
    min-height: 44px;
    flex-shrink: 0;
  }

  .am-person-stats,
  .am-person-totals {
    flex-wrap: wrap;
    gap: 16px;
  }

  body.onepage #companyWorkspace .company-hero-copy {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body.onepage #companyWorkspace .company-back,
  body.onepage #companyWorkspace .company-primary-tabs button,
  body.onepage #companyWorkspace .company-subnav button {
    min-height: 44px;
  }
}