/* Shared action accent. Light mode is orange; dark mode is purple.
   Task buttons use this token instead of relying on the older indigo dark brand token. */
:root {
  --action-primary: #ea580c;
  --action-primary-hover: #c2410c;
  --action-primary-subtle: #fff7ed;
}

html.dark {
  --action-primary: #8b5cf6;
  --action-primary-hover: #7c3aed;
  --action-primary-subtle: rgba(139, 92, 246, 0.16);
}

.btn.btn-primary,
a.btn.btn-primary,
button.btn-primary,
input[type='submit'].btn-primary,
.aap-primary,
.form-submit,
.auth-submit,
.quick-action-btn-primary,
#audit-submit-button,
#drawer-submit,
#crm-save-status,
#crm-save-followup,
#crm-close-won,
#save-mockup-button,
#start-outreach,
#submit-btn {
  border: 1px solid var(--action-primary) !important;
  background: var(--action-primary) !important;
  color: #ffffff !important;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--action-primary) 28%, transparent) !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease !important;
}

.btn.btn-primary:hover,
a.btn.btn-primary:hover,
button.btn-primary:hover,
input[type='submit'].btn-primary:hover,
.aap-primary:hover,
.form-submit:hover,
.auth-submit:hover,
.quick-action-btn-primary:hover,
#audit-submit-button:hover,
#drawer-submit:hover,
#crm-save-status:hover,
#crm-save-followup:hover,
#crm-close-won:hover,
#save-mockup-button:hover,
#start-outreach:hover,
#submit-btn:hover {
  border-color: var(--action-primary-hover) !important;
  background: var(--action-primary-hover) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--action-primary) 22%, transparent) !important;
  transform: translateY(-1px);
}

.btn.btn-primary:focus-visible,
a.btn.btn-primary:focus-visible,
button.btn-primary:focus-visible,
input[type='submit'].btn-primary:focus-visible,
.aap-primary:focus-visible,
.form-submit:focus-visible,
.auth-submit:focus-visible,
.quick-action-btn-primary:focus-visible,
#audit-submit-button:focus-visible,
#drawer-submit:focus-visible,
#crm-save-status:focus-visible,
#crm-save-followup:focus-visible,
#crm-close-won:focus-visible,
#save-mockup-button:focus-visible,
#start-outreach:focus-visible,
#submit-btn:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px var(--action-primary-subtle) !important;
}

.btn.btn-primary:disabled,
button.btn-primary:disabled,
input[type='submit'].btn-primary:disabled,
.aap-primary:disabled,
.form-submit:disabled,
.auth-submit:disabled,
.quick-action-btn-primary:disabled,
#audit-submit-button:disabled,
#drawer-submit:disabled,
#crm-save-status:disabled,
#crm-save-followup:disabled,
#crm-close-won:disabled,
#save-mockup-button:disabled,
#start-outreach:disabled,
#submit-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
  transform: none !important;
}

/* Keep secondary, neutral, destructive and utility controls neutral. */
.btn-secondary,
.quick-action-btn-secondary,
.topbar-btn,
.theme-toggle,
.btn-danger,
.aap-secondary {
  box-shadow: none;
}

/* Companies page quick filters: visible, theme-aware pills instead of white-on-white / black-on-black controls. */
.company-filter-chips {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.company-filter-chip {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--select-accent, var(--action-primary)) 42%, var(--border-default)) !important;
  border-radius: 9999px;
  background: color-mix(in srgb, var(--select-accent-subtle, var(--action-primary-subtle)) 62%, var(--bg-surface)) !important;
  padding: 7px 13px;
  color: color-mix(in srgb, var(--select-accent, var(--action-primary)) 82%, var(--text-primary)) !important;
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: transform .15s ease, border-color .15s ease, background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.company-filter-chip:hover,
.company-filter-chip:focus-visible {
  border-color: var(--select-accent, var(--action-primary)) !important;
  background: var(--select-accent-subtle, var(--action-primary-subtle)) !important;
  color: var(--select-accent, var(--action-primary)) !important;
  box-shadow: 0 3px 8px color-mix(in srgb, var(--select-accent, var(--action-primary)) 14%, transparent);
  transform: translateY(-1px);
  outline: none;
}

.company-filter-chip.is-active {
  border-color: var(--select-accent, var(--action-primary)) !important;
  background: var(--select-accent, var(--action-primary)) !important;
  color: #ffffff !important;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--select-accent, var(--action-primary)) 22%, transparent);
}

html.dark .company-filter-chip {
  border-color: color-mix(in srgb, var(--select-accent, var(--action-primary)) 58%, var(--border-default)) !important;
  background: color-mix(in srgb, var(--select-accent, var(--action-primary)) 12%, var(--bg-elevated)) !important;
  color: #ddd6fe !important;
}

html.dark .company-filter-chip:hover,
html.dark .company-filter-chip:focus-visible {
  border-color: var(--select-accent, var(--action-primary)) !important;
  background: color-mix(in srgb, var(--select-accent, var(--action-primary)) 20%, var(--bg-elevated)) !important;
  color: #f5f3ff !important;
}

html.dark .company-filter-chip.is-active {
  border-color: var(--select-accent, var(--action-primary)) !important;
  background: var(--select-accent, var(--action-primary)) !important;
  color: #ffffff !important;
}

@media (max-width: 900px) {
  .company-filter-chips {
    width: 100%;
    justify-content: flex-start;
  }
}