/* Local color-only override for the installed Komari Naive theme. */
:root,
:root .n-config-provider {
  --primary-color: #657DE8 !important;
  --primary-color-hover: #7489EA !important;
  --primary-color-pressed: #536BD1 !important;
  --n-color: #E8EDF4 !important;
  --n-color-modal: #E8EDF4 !important;
  --n-color-popover: #E8EDF4 !important;
  --n-color-embedded: #D2DCE8 !important;
  --n-color-embedded-modal: #E8EDF4 !important;
  --n-color-embedded-popover: #E8EDF4 !important;
  --n-text-color: #283448 !important;
  --n-text-color-1: #283448 !important;
  --n-text-color-2: #68778D !important;
  --n-text-color-3: #68778D !important;
  --n-border-color: #BCC9D9 !important;
  --n-divider-color: #BCC9D9 !important;
}

html.dark,
html.dark .n-config-provider {
  --primary-color: #8195FF !important;
  --primary-color-hover: #91A2FF !important;
  --primary-color-pressed: #6F83E8 !important;
  --n-color: #222936 !important;
  --n-color-modal: #222936 !important;
  --n-color-popover: #222936 !important;
  --n-color-embedded: #1D2430 !important;
  --n-color-embedded-modal: #222936 !important;
  --n-color-embedded-popover: #222936 !important;
  --n-text-color: #E6EBF3 !important;
  --n-text-color-1: #E6EBF3 !important;
  --n-text-color-2: #A1ACBC !important;
  --n-text-color-3: #A1ACBC !important;
  --n-border-color: #343E4F !important;
  --n-divider-color: #343E4F !important;
}

body {
  background-color: #DCE3EC !important;
  color: #283448 !important;
}
html.dark body {
  background-color: #191E28 !important;
  color: #E6EBF3 !important;
}

.background-default,
.background-loading {
  background-image: linear-gradient(135deg, #DCE3EC 0%, #D2DCE8 25%, #BCC9D9 50%, #DCE3EC 75%, #E8EDF4 100%) !important;
}
html.dark .background-default,
html.dark .background-loading {
  background-image: linear-gradient(135deg, #191E28 0%, #1D2430 25%, #222936 50%, #343E4F 75%, #191E28 100%) !important;
}

.n-card {
  --n-color: #E8EDF4 !important;
  --n-border-color: #BCC9D9 !important;
  --n-title-text-color: #283448 !important;
  --n-text-color: #283448 !important;
  background-color: #E8EDF4 !important;
  border-color: #BCC9D9 !important;
  color: #283448 !important;
}
html.dark .n-card {
  --n-color: #222936 !important;
  --n-border-color: #343E4F !important;
  --n-title-text-color: #E6EBF3 !important;
  --n-text-color: #E6EBF3 !important;
  background-color: #222936 !important;
  border-color: #343E4F !important;
  color: #E6EBF3 !important;
}
.n-card-header__main,
.n-card-header__extra,
.n-card__content,
.n-card__footer {
  color: #283448 !important;
}
html.dark .n-card-header__main,
html.dark .n-card-header__extra,
html.dark .n-card__content,
html.dark .n-card__footer {
  color: #E6EBF3 !important;
}

.n-input,
.n-input-number,
.n-base-selection,
.n-date-picker .n-input,
.n-time-picker .n-input {
  --n-color: #D2DCE8 !important;
  --n-border: #BCC9D9 !important;
  --n-border-hover: #AAB8CE !important;
  --n-border-focus: #657DE8 !important;
  background-color: #D2DCE8 !important;
  border-color: #BCC9D9 !important;
  color: #283448 !important;
}
html.dark .n-input,
html.dark .n-input-number,
html.dark .n-base-selection,
html.dark .n-date-picker .n-input,
html.dark .n-time-picker .n-input {
  --n-color: #1D2430 !important;
  --n-border: #343E4F !important;
  --n-border-hover: #526078 !important;
  --n-border-focus: #8195FF !important;
  background-color: #1D2430 !important;
  border-color: #343E4F !important;
  color: #E6EBF3 !important;
}
.n-input__input-el,
.n-base-selection-label,
.n-input__placeholder {
  color: #283448 !important;
}
html.dark .n-input__input-el,
html.dark .n-base-selection-label,
html.dark .n-input__placeholder {
  color: #E6EBF3 !important;
}

.n-button--primary-type {
  --n-color: #657DE8 !important;
  --n-color-hover: #7489EA !important;
  --n-color-pressed: #536BD1 !important;
  --n-border: #657DE8 !important;
  --n-border-hover: #7489EA !important;
  --n-border-pressed: #536BD1 !important;
}
html.dark .n-button--primary-type {
  --n-color: #8195FF !important;
  --n-color-hover: #91A2FF !important;
  --n-color-pressed: #6F83E8 !important;
  --n-border: #8195FF !important;
  --n-border-hover: #91A2FF !important;
  --n-border-pressed: #6F83E8 !important;
}

.text-gray-400,
.text-gray-500,
.text-gray-600,
.text-gray-700 {
  color: #68778D !important;
}
html.dark .text-gray-400,
html.dark .text-gray-500,
html.dark .text-gray-600,
html.dark .text-gray-700 {
  color: #A1ACBC !important;
}

/* Header avatar: preserve its geometry, remove the surrounding surface. */
.position-sticky.top-0 .n-avatar {
  --n-color: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline-color: transparent !important;
}
