:root {
  --smartks-primary-50: #eef7ff;
  --smartks-primary-100: #d4ebff;
  --smartks-primary-200: #abd7ff;
  --smartks-primary-300: #79bfff;
  --smartks-primary-400: #469fff;
  --smartks-primary-500: #1e88ff;
  --smartks-primary-600: #116fdd;
  --smartks-primary-700: #0d5fbe;
  --smartks-primary-shadow: 30, 136, 255;
}

.btn-primary {
  --bs-btn-color: var(--smartks-primary-600);
  --bs-btn-bg: transparent;
  --bs-btn-border-color: var(--smartks-primary-600);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: var(--smartks-primary-500);
  --bs-btn-hover-border-color: var(--smartks-primary-500);
  --bs-btn-focus-shadow-rgb: var(--smartks-primary-shadow);
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: var(--smartks-primary-600);
  --bs-btn-active-border-color: var(--smartks-primary-600);
  --bs-btn-disabled-color: var(--smartks-primary-400);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--smartks-primary-300);
  box-shadow: none;
}

.btn,
.btn-primary,
.btn-outline-primary {
  box-shadow: none !important;
}

.btn-outline-primary {
  --bs-btn-color: var(--smartks-primary-600);
  --bs-btn-bg: var(--smartks-primary-100);
  --bs-btn-border-color: var(--smartks-primary-600);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: var(--smartks-primary-500);
  --bs-btn-hover-border-color: var(--smartks-primary-500);
  --bs-btn-focus-shadow-rgb: var(--smartks-primary-shadow);
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: var(--smartks-primary-600);
  --bs-btn-active-border-color: var(--smartks-primary-600);
  --bs-btn-disabled-color: var(--smartks-primary-400);
  --bs-btn-disabled-bg: var(--smartks-primary-50);
  --bs-btn-disabled-border-color: var(--smartks-primary-300);
}

.btn-primary i,
.btn-primary .bx,
.btn-outline-primary i,
.btn-outline-primary .bx {
  transition: color 0.2s ease;
}

.btn-icon.btn-outline-primary i,
.btn-icon.btn-outline-primary .bx {
  color: var(--bs-btn-border-color);
}

.btn-primary:hover i,
.btn-primary:hover .bx,
.btn-primary:focus-visible i,
.btn-primary:focus-visible .bx,
.btn-primary:active i,
.btn-primary:active .bx,
.btn-primary.active i,
.btn-primary.active .bx,
.btn-primary.show i,
.btn-primary.show .bx,
.btn-outline-primary:hover i,
.btn-outline-primary:hover .bx,
.btn-outline-primary:focus-visible i,
.btn-outline-primary:focus-visible .bx,
.btn-outline-primary:active i,
.btn-outline-primary:active .bx,
.btn-outline-primary.active i,
.btn-outline-primary.active .bx,
.btn-outline-primary.show i,
.btn-outline-primary.show .bx,
.btn-outline-primary[aria-expanded="true"] i,
.btn-outline-primary[aria-expanded="true"] .bx,
.btn-primary[aria-expanded="true"] i,
.btn-primary[aria-expanded="true"] .bx {
  color: #ffffff !important;
}

.btn-icon.btn-outline-primary,
.btn-icon.btn-primary {
  border-width: 1px;
}