/* Base semantic button and badge styles using theme variables */

.btn-add,
.btn-save,
.btn-submit {
  color: #ffffff !important;
  background-color: #28a745 !important;
  border-color: #28a745 !important;
}

.btn-add:hover,
.btn-add:focus,
.btn-add:active,
.btn-add.active,
.show > .btn-add.dropdown-toggle,
.btn-save:hover,
.btn-save:focus,
.btn-save:active,
.btn-save.active,
.show > .btn-save.dropdown-toggle,
.btn-submit:hover,
.btn-submit:focus,
.btn-submit:active,
.btn-submit.active,
.show > .btn-submit.dropdown-toggle {
  color: #ffffff !important;
  background-color: #218838 !important;
  border-color: #218838 !important;
}

.btn-add:disabled,
.btn-save:disabled,
.btn-submit:disabled {
  color: #ffffff !important;
  background-color: #28a745 !important;
  border-color: #28a745 !important;
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-add,
.btn-outline-activate {
  color: var(--theme-color-add, #28c76f);
  background-color: transparent;
  border-color: var(--theme-color-add, #28c76f);
}

.btn-outline-add:hover,
.btn-outline-add:focus,
.btn-outline-add:active,
.btn-outline-add.active,
.show > .btn-outline-add.dropdown-toggle,
.btn-outline-activate:hover,
.btn-outline-activate:focus,
.btn-outline-activate:active,
.btn-outline-activate.active,
.show > .btn-outline-activate.dropdown-toggle {
  color: var(--theme-color-add-contrast, #ffffff);
  background-color: var(--theme-color-add-hover, var(--theme-color-add, #28c76f));
  border-color: var(--theme-color-add-hover, var(--theme-color-add, #28c76f));
}

.btn-outline-add:disabled,
.btn-outline-activate:disabled {
  color: var(--theme-color-add, #28c76f);
  background-color: transparent;
  border-color: var(--theme-color-add, #28c76f);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-delete {
  color: var(--theme-color-delete-contrast, #ffffff);
  background-color: var(--theme-color-delete, #ea5455);
  border-color: var(--theme-color-delete, #ea5455);
}

.btn-delete:hover,
.btn-delete:focus,
.btn-delete:active,
.btn-delete.active,
.show > .btn-delete.dropdown-toggle {
  color: var(--theme-color-delete-contrast, #ffffff);
  background-color: var(--theme-color-delete-hover, #d84344);
  border-color: var(--theme-color-delete-hover, #d84344);
}

.btn-delete:disabled {
  color: var(--theme-color-delete-contrast, #ffffff);
  background-color: var(--theme-color-delete, #ea5455);
  border-color: var(--theme-color-delete, #ea5455);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-transfer {
  color: var(--theme-color-transfer-contrast, #1f1f1f);
  background-color: var(--theme-color-transfer, #ff9f43);
  border-color: var(--theme-color-transfer, #ff9f43);
}

.btn-transfer:hover,
.btn-transfer:focus,
.btn-transfer:active,
.btn-transfer.active,
.show > .btn-transfer.dropdown-toggle {
  color: var(--theme-color-transfer-contrast, #1f1f1f);
  background-color: var(--theme-color-transfer-hover, var(--theme-color-transfer, #ff9f43));
  border-color: var(--theme-color-transfer-hover, var(--theme-color-transfer, #ff9f43));
}

.btn-transfer:disabled {
  color: var(--theme-color-transfer-contrast, #1f1f1f);
  background-color: var(--theme-color-transfer, #ff9f43);
  border-color: var(--theme-color-transfer, #ff9f43);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-change {
  color: var(--theme-color-change-contrast, #ffffff);
  background-color: var(--theme-color-change, #00cfe8);
  border-color: var(--theme-color-change, #00cfe8);
}

.btn-change:hover,
.btn-change:focus,
.btn-change:active,
.btn-change.active,
.show > .btn-change.dropdown-toggle {
  color: var(--theme-color-change-contrast, #ffffff);
  background-color: var(--theme-color-change-hover, var(--theme-color-change, #00cfe8));
  border-color: var(--theme-color-change-hover, var(--theme-color-change, #00cfe8));
}

.btn-change:disabled {
  color: var(--theme-color-change-contrast, #ffffff);
  background-color: var(--theme-color-change, #00cfe8);
  border-color: var(--theme-color-change, #00cfe8);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-cancel {
  color: var(--theme-color-cancel-contrast, #ffffff);
  background-color: var(--theme-color-cancel, #6c757d);
  border-color: var(--theme-color-cancel, #6c757d);
}

.btn-cancel:hover,
.btn-cancel:focus,
.btn-cancel:active,
.btn-cancel.active,
.show > .btn-cancel.dropdown-toggle {
  color: var(--theme-color-cancel-contrast, #ffffff);
  background-color: var(--theme-color-cancel-hover, var(--theme-color-cancel, #6c757d));
  border-color: var(--theme-color-cancel-hover, var(--theme-color-cancel, #6c757d));
}

.btn-cancel:disabled {
  color: var(--theme-color-cancel-contrast, #ffffff);
  background-color: var(--theme-color-cancel, #6c757d);
  border-color: var(--theme-color-cancel, #6c757d);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-delete {
  color: var(--theme-color-delete, #ea5455);
  background-color: transparent;
  border-color: var(--theme-color-delete, #ea5455);
}

.btn-outline-delete:hover,
.btn-outline-delete:focus,
.btn-outline-delete:active,
.btn-outline-delete.active,
.show > .btn-outline-delete.dropdown-toggle {
  color: var(--theme-color-delete-contrast, #ffffff);
  background-color: var(--theme-color-delete-hover, var(--theme-color-delete, #ea5455));
  border-color: var(--theme-color-delete-hover, var(--theme-color-delete, #ea5455));
}

.btn-outline-delete:disabled {
  color: var(--theme-color-delete, #ea5455);
  background-color: transparent;
  border-color: var(--theme-color-delete, #ea5455);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-transfer {
  color: var(--theme-color-transfer, #ff9f43);
  background-color: transparent;
  border-color: var(--theme-color-transfer, #ff9f43);
}

.btn-outline-transfer:hover,
.btn-outline-transfer:focus,
.btn-outline-transfer:active,
.btn-outline-transfer.active,
.show > .btn-outline-transfer.dropdown-toggle {
  color: var(--theme-color-transfer-contrast, #1f1f1f);
  background-color: var(--theme-color-transfer, #ff9f43);
  border-color: var(--theme-color-transfer, #ff9f43);
}

.btn-outline-transfer:disabled {
  color: var(--theme-color-transfer, #ff9f43);
  background-color: transparent;
  border-color: var(--theme-color-transfer, #ff9f43);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-change {
  color: var(--theme-color-change, #00cfe8);
  background-color: transparent;
  border-color: var(--theme-color-change, #00cfe8);
}

.btn-outline-change:hover,
.btn-outline-change:focus,
.btn-outline-change:active,
.btn-outline-change.active,
.show > .btn-outline-change.dropdown-toggle {
  color: var(--theme-color-change-contrast, #ffffff);
  background-color: var(--theme-color-change, #00cfe8);
  border-color: var(--theme-color-change, #00cfe8);
}

.btn-outline-change:disabled {
  color: var(--theme-color-change, #00cfe8);
  background-color: transparent;
  border-color: var(--theme-color-change, #00cfe8);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-edit,
.btn-outline-neutral {
  color: var(--theme-color-neutral, var(--theme-color-edit, #82868b));
  background-color: transparent;
  border-color: var(--theme-color-neutral, var(--theme-color-edit, #82868b));
}

.btn-outline-edit:hover,
.btn-outline-edit:focus,
.btn-outline-edit:active,
.btn-outline-edit.active,
.show > .btn-outline-edit.dropdown-toggle,
.btn-outline-neutral:hover,
.btn-outline-neutral:focus,
.btn-outline-neutral:active,
.btn-outline-neutral.active,
.show > .btn-outline-neutral.dropdown-toggle {
  color: var(--theme-color-neutral-contrast, var(--theme-color-edit-contrast, #ffffff));
  background-color: var(--theme-color-neutral-hover, var(--theme-color-edit-hover, #82868b));
  border-color: var(--theme-color-neutral-hover, var(--theme-color-edit-hover, #82868b));
}

.btn-outline-edit:disabled,
.btn-outline-neutral:disabled {
  color: var(--theme-color-neutral, var(--theme-color-edit, #82868b));
  background-color: transparent;
  border-color: var(--theme-color-neutral, var(--theme-color-edit, #82868b));
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-cancel {
  color: var(--theme-color-cancel, #6c757d);
  background-color: transparent;
  border-color: var(--theme-color-cancel, #6c757d);
}

.btn-outline-cancel:hover,
.btn-outline-cancel:focus,
.btn-outline-cancel:active,
.btn-outline-cancel.active,
.show > .btn-outline-cancel.dropdown-toggle {
  color: var(--theme-color-cancel-contrast, #ffffff);
  background-color: var(--theme-color-cancel, #6c757d);
  border-color: var(--theme-color-cancel, #6c757d);
}

.btn-outline-cancel:disabled {
  color: var(--theme-color-cancel, #6c757d);
  background-color: transparent;
  border-color: var(--theme-color-cancel, #6c757d);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-outline-actions,
.btn-hr-actions {
  color: var(--theme-color-actions, #7367f0);
  background-color: transparent;
  border-color: var(--theme-color-actions, #7367f0);
}

.btn-outline-actions:hover,
.btn-outline-actions:focus,
.btn-outline-actions:active,
.btn-outline-actions.active,
.show > .btn-outline-actions.dropdown-toggle,
.btn-hr-actions:hover,
.btn-hr-actions:focus,
.btn-hr-actions:active,
.btn-hr-actions.active,
.show > .btn-hr-actions.dropdown-toggle {
  color: var(--theme-color-actions-contrast, #ffffff);
  background-color: var(--theme-color-actions-hover, var(--theme-color-actions, #7367f0));
  border-color: var(--theme-color-actions-hover, var(--theme-color-actions, #7367f0));
}

.btn-outline-actions:disabled,
.btn-hr-actions:disabled {
  color: var(--theme-color-actions, #7367f0);
  background-color: transparent;
  border-color: var(--theme-color-actions, #7367f0);
  opacity: var(--theme-button-disabled-opacity, 0.65);
}

.btn-label-accent {
  color: var(--theme-btn-label-accent-text, #7367f0);
  background-color: var(--theme-btn-label-accent-bg, #e9e7fd);
  border-color: transparent;
}

.btn-label-accent:hover,
.btn-label-accent:focus,
.btn-label-accent:active,
.btn-label-accent.active,
.show > .btn-label-accent.dropdown-toggle {
  color: var(--theme-btn-label-accent-text, #7367f0);
  background-color: var(--theme-btn-label-accent-bg-hover, #dddbfb);
  border-color: transparent;
}

.btn-label-neutral {
  color: var(--theme-btn-label-neutral-text, #5f5f63);
  background-color: var(--theme-btn-label-neutral-bg, #f2f2f3);
  border-color: transparent;
}

.btn-label-neutral:hover,
.btn-label-neutral:focus,
.btn-label-neutral:active,
.btn-label-neutral.active,
.show > .btn-label-neutral.dropdown-toggle {
  color: var(--theme-btn-label-neutral-text, #5f5f63);
  background-color: var(--theme-btn-label-neutral-bg-hover, #e7e7e8);
  border-color: transparent;
}

.badge-role-manager,
.badge-info {
  color: var(--theme-color-info-soft-text, #12303a);
  background-color: var(--theme-color-info-soft-bg, var(--theme-color-manager-soft-bg, #d9f8fc));
}

.badge-role-staff,
.badge-neutral {
  color: var(--theme-color-neutral-soft-text, var(--theme-color-neutral, var(--theme-color-staff, #a8aaae)));
  background-color: var(--theme-color-neutral-soft-bg, var(--theme-color-staff-soft-bg, #f2f2f3));
}

.badge-status-active,
.badge-positive {
  color: var(--theme-color-positive-soft-text, var(--theme-color-positive, var(--theme-color-active, #28c76f)));
  background-color: var(--theme-color-positive-soft-bg, var(--theme-color-active-soft-bg, #dff7e9));
}

.badge-status-inactive,
.badge-negative {
  color: var(--theme-color-negative-soft-text, var(--theme-color-negative, var(--theme-color-inactive, #ea5455)));
  background-color: var(--theme-color-negative-soft-bg, var(--theme-color-inactive-soft-bg, #fce5e6));
}

.badge-warning {
  color: var(--theme-color-warning-contrast, #1f1f1f);
  background-color: var(--theme-color-warning-soft-bg, #fff1e3);
}

.badge-accent {
  color: var(--theme-color-accent-soft-text, #2d2d2d) !important;
  background-color: var(--theme-color-accent-soft-bg, #e9e7fd);
}

.table-hover-accent tr:hover .td {
  color: var(--theme-table-row-hover-text, #7367f0) !important;
}
