:root {
  /* Cores originais do Chatwoot */
  --color-woot-25: #f0fef4;
  --color-woot-50: #dcfce7;
  --color-woot-75: #bbf7d0;
  --color-woot-100: #86efac;
  --color-woot-200: #4ade80;
  --color-woot-300: #22c55e;
  --color-woot-400: #16a34a;
  --color-woot-500: #24F400 !important;
  --color-woot-600: #1FD000 !important;
  --color-woot-700: #15a300;
  --color-woot-800: #0d7300;
  --color-woot-900: #064e00;
  --w-500: #24F400 !important;
  --w-600: #1FD000 !important;

  /* Variáveis customizadas Conversas.AI */
  --conversas-primary: #24F400;
  --conversas-primary-hover: #1FD000;
  --conversas-primary-active: #15a300;
  --conversas-text-link: #1E9C09;
  --conversas-text-dark: #000;
  --conversas-bg-light: #F4FCF2;
  --conversas-border-hover: #C1FBB9;
  --conversas-primary-alpha-25: rgba(36, 244, 0, 0.25);
  --conversas-primary-alpha-10: rgba(36, 244, 0, 0.1);
  --conversas-background-message: #F4FCF2;
}

body.dark {
  --conversas-background-message: #064e00;
}

.button--primary,
.button.primary,
button[class*="primary"] {
  background-color: var(--conversas-primary) !important;
  border-color: var(--conversas-primary) !important;
}

.button--primary:hover,
.button.primary:hover {
  background-color: var(--conversas-primary-hover) !important;
  border-color: var(--conversas-primary-hover) !important;
}

a.active,
.active {
  color: var(--conversas-text-link) !important;
}

.sidebar-item.active {
  background-color: var(--conversas-primary-alpha-10) !important;
  border-left-color: var(--conversas-primary) !important;
}

.badge--primary {
  background-color: var(--conversas-primary) !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  accent-color: var(--conversas-primary) !important;
  background-color: var(--conversas-primary) !important;
  border-color: var(--conversas-primary) !important;
}

.progress-bar {
  background-color: var(--conversas-primary) !important;
}

.tabs .tab.active {
  border-bottom-color: var(--conversas-primary) !important;
  color: var(--conversas-primary) !important;
}

.button.primary,
.button--primary,
button.primary,
.bg-woot-500,
.bg-woot-600,
.bg-woot-700 {
  background-color: var(--conversas-primary) !important;
  border-color: var(--conversas-primary) !important;
}

.button.primary:hover,
.button--primary:hover,
button.primary:hover {
  background-color: var(--conversas-primary-hover) !important;
  border-color: var(--conversas-primary-hover) !important;
}

.text-woot-500,
.text-woot-600,
a.text-woot {
  color: var(--conversas-text-link) !important;
}

.sidebar-item.is-active,
.sidebar .menu-item.is-active,
.secondary-menu .menu-item.is-active {
  background-color: var(--conversas-primary) !important;
  border-color: var(--conversas-primary) !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background-color: var(--conversas-primary) !important;
  border-color: var(--conversas-primary) !important;
}

.tabs .tab.is-active,
.tabs .tabs-title.is-active a {
  border-bottom-color: var(--conversas-primary) !important;
  color: var(--conversas-primary) !important;
}

.badge.primary,
.label.primary {
  background-color: var(--conversas-primary) !important;
}

.progress-bar,
.progress .progress-meter {
  background-color: var(--conversas-primary) !important;
}

.switch input:checked+label {
  background-color: var(--conversas-primary) !important;
}

.spinner,
.spinner--small::before {
  border-top-color: var(--conversas-primary) !important;
}

.conversation--status.open,
.status-badge.open {
  background-color: var(--conversas-primary) !important;
}

.button.success,
.fab-button {
  background-color: var(--conversas-primary) !important;
}


.page-top-bar,
.modal-header {
  border-bottom-color: var(--conversas-primary-alpha-25) !important;
}


/* input:focus, */
textarea:focus,
select:focus {
  border-color: var(--conversas-primary) !important;
  box-shadow: 0 0 0 1px var(--conversas-primary) !important;
}

.text-n-blue-text {
  color: var(--conversas-text-link) !important;
}

.text-n-brand {
  color: var(--conversas-text-link) !important;
}

.text-white {
  color: var(--conversas-text-dark) !important;
}

.n-brand {
  background-color: var(--conversas-primary) !important;
}


@supports (color: rgb(0 0 0 / 0)) and (top: var(--f)) {
  .bg-n-brand {
    background-color: var(--conversas-primary) !important;
  }

  .text-link {
    color: var(--conversas-primary) !important;
  }

  .border-n-brand {
    border-color: var(--conversas-text-link) !important;
  }

}

.border-n-brand {
  border-color: var(--conversas-text-link) !important;
}

.text-n-blue-11 {

  color: var(--conversas-text-link) !important;
}

.dark\:bg-n-brand\/20:is(.dark *) {
  background-color: var(--conversas-primary-alpha-25) !important;
}

.bg-n-brand\/10 {

  background-color: var(--conversas-primary-alpha-10) !important;
}

input[type]:not([type=file]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]):not([type=reset]):not([type=color]):not([type=image]):not([type=hidden]):not(.reset-base):not(.multiselect__input):not(.no-margin):focus {
  outline-color: var(--conversas-primary) !important;
}

.button {
  background-color: var(--conversas-primary) !important;
  color: var(--conversas-text-dark) !important;
}

button.shadow-sm.h-9 {
  background-color: var(--conversas-primary) !important;
  color: var(--conversas-text-dark) !important;
}

input[type='submit']:not(.reset-base) {
  background-color: var(--conversas-primary) !important;
  color: var(--conversas-text-dark) !important;
}

.hover\:text-woot-500:hover {
  color: var(--conversas-text-link) !important;
}

.hover\:text-woot-500:focus {
  outline-color: var(--conversas-text-link) !important;
}

a.flex.items-center.flex-1:hover {
  color: var(--conversas-text-link) !important;
}

.bg-n-blue-2 {
  background-color: var(--conversas-bg-light) !important;
}

.bg-n-solid-blue {
  background-color: var(--conversas-background-message) !important;
}


.bg-n-teal-9 {
  background-color: var(--conversas-primary) !important;
  color: var(--conversas-text-dark) !important;
}

.hover\:enabled\:border-n-blue-9:enabled:hover {
  border-color: var(--conversas-border-hover) !important;
}

@supports (color: rgb(0 0 0 / 0)) and (top: var(--f)) {
  .text-woot-500 {
    color: var(--conversas-text-link) !important;
  }

  .text-woot-500 svg {
    fill: var(--conversas-text-link) !important;
  }
}

ninja-keys {
  --ninja-accent-color: var(--conversas-primary);
}

.ninja-action.selected {
  border-left: 2px solid var(--conversas-primary) !important;
}



.focus\:ring-n-brand:focus {
  --tw-ring-color: var(--conversas-primary) !important;
}

.cell-label:hover a {
  color: var(--conversas-text-link) !important;
}



.cell-data a:hover {
  color: var(--conversas-text-link) !important;
}

.cell-label a svg {
  fill: var(--conversas-text-link) !important;
}

.flex.items-center.flex-1:focus {
  outline-color: var(--conversas-text-link);
}

.text-woot-500 svg {
  fill: var(--conversas-text-link) !important;
}

.action-edit:hover {
  color: var(--conversas-text-link) !important;
}

.bg-n-slate-12 {
  background-color: var(--conversas-bg-light) !important;
}

.bg-n-blue-3 {
  background-color: var(--conversas-primary-alpha-25) !important;
}

.after\:bg-n-brand:after {
  background-color: var(--conversas-primary-active) !important;
}
