/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 */
/* Hallmark · component: application interaction states · genre: modern-minimal
 * theme: Performance AI atmospheric workbench
 * states: default · hover · focus · active · disabled · loading · error · success
 * contrast: pass · accent-on-hover: none · accent-on-focus: none
 */

@media screen {
  :where(button, a, summary, input, select, textarea, [role="button"], [role="option"], [tabindex]:not([tabindex="-1"])) {
    -webkit-tap-highlight-color: color-mix(in oklab, var(--color-focus) 14%, transparent);
  }

  :where(button, a, summary, input, select, textarea, [role="button"], [role="option"], [tabindex]:not([tabindex="-1"])):focus-visible,
  :where(button, a, summary, input, select, textarea, [role="button"], [role="option"]).is-focus {
    outline: 2px solid var(--color-focus) !important;
    outline-offset: 2px;
  }

  :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea
  ):focus-visible {
    border-color: transparent !important;
    background: var(--color-panel-strong) !important;
    outline-offset: 1px;
    box-shadow: none !important;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):focus-within,
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-focus {
    border-color: transparent !important;
    background: var(--color-panel-strong) !important;
    outline: 2px solid var(--color-focus) !important;
    outline-offset: 1px;
    box-shadow: none !important;
  }

  #main-content :is(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell
  ) > :is(input, select, textarea),
  #main-content :is(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell
  ) > :is(input, select, textarea):focus,
  #main-content :is(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell
  ) > :is(input, select, textarea):focus-visible {
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #main-content .admin-person-page :is(
    .person-field__control > input,
    .person-field__control > select,
    .person-password > input,
    .manager-combobox__control > input
  ):focus {
    border-color: transparent !important;
    outline: 2px solid var(--color-focus) !important;
    outline-offset: 1px;
    box-shadow: none !important;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):has(:disabled),
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-disabled {
    border-color: var(--color-rule) !important;
    background: var(--color-paper-muted) !important;
    cursor: not-allowed;
    opacity: 0.55;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  )[aria-busy="true"],
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-loading {
    border-color: var(--color-rule-strong) !important;
    background: var(--color-panel-hover) !important;
    cursor: progress;
    opacity: 0.68;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):has([aria-invalid="true"]),
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-error {
    border-color: var(--color-danger) !important;
    outline-color: transparent !important;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):has([aria-invalid="true"]:focus-visible),
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-error.is-focus {
    border-color: transparent !important;
    outline: 2px solid var(--color-danger) !important;
    outline-offset: 1px;
  }

  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):has([data-state="success"]),
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-success {
    border-color: var(--color-success) !important;
  }
}

@media (hover: hover) and (pointer: fine) {
  :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea,
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ):not(:disabled):hover,
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ).is-hover {
    border-color: var(--color-rule-strong) !important;
    background: var(--color-panel-hover) !important;
    box-shadow: none !important;
  }

  :where(.text-link, .link-accent, .inline-button-link, .quick-links a, .profile-quick-actions a):hover {
    color: var(--color-ink) !important;
  }

  :where(.filter-chip--active, .filter-chip.active):hover {
    border-color: var(--color-warm-surface-hover) !important;
    background: var(--color-warm-surface-hover) !important;
    color: var(--color-ink) !important;
  }
}

:where(
  .search-field,
  .goal-search-field,
  .goal-filter-search,
  .peer-picker__search,
  .checkin-search-field,
  .manager-combobox__control,
  .filter-select,
  .report-input-shell,
  .people-import__drop
).is-active {
  border-color: var(--color-subtle) !important;
  background: var(--color-paper-muted) !important;
}

@media (prefers-reduced-motion: reduce) {
  :where(
    .search-field,
    .goal-search-field,
    .goal-filter-search,
    .peer-picker__search,
    .checkin-search-field,
    .manager-combobox__control,
    .filter-select,
    .report-input-shell,
    .people-import__drop
  ) {
    transition-duration: 0ms !important;
  }
}
