﻿.theme {
  --gray-text-light: #9a9a9a78;
  --neutral-border-color: #8585859c ;
}

/*GENERAL*/
.theme-text {
  color: var(--theme-text-color);
}

.theme-text-dark {
  color: #F8F9FA;
}

.theme-text-light {
  color: #222222;
}

.top-row .theme-light {
  --theme-text: white !important;
}

.top-row .theme-dark {
  --theme-text: white !important;
}

/*GENERAL*/
/*BUTTONS and LINKS*/
.app-btn-primary {
  color: var(--btn-primary-color) !important;
  background-color: var(--btn-primary-bg);
  border-color: var(--btn-primary-border-color);
}

.app-btn-neutral {
  background: transparent !important;
  color: var(--theme-text-color);
  border: 1px solid var(--default-border-contrast);
}

/*BUTTONS and LINKS*/
/*GENERAL BACKGROUND*/
.theme-bg {
  background: var(--theme-bg);
  transition: background linear 0.1s;
}

/*GENERAL BACKGROUND*/
/*HOME CARD*/
.home-card {
  background: var(--card-bg);
}

/*HOME CARD*/
/*tags*/
.item-tag {
  position: absolute;
  background: red;
  top: 10px;
  right: 10px;
  font-size: 0.7rem;
  content: "asdf";
  z-index: 10;
  background: #206bf3;
  padding: 4px;
  padding-block: 1px;
  border-radius: 3px;
  color: white;
}

/*buttons*/
.btn-normal {
  height: 26px;
}

.app-btn-outline-primary {
  filter: contrast(1.1);
  border-radius: 2px;
  font-size: 0.8rem;
  font-weight: 600;
  transition: transform 0.02s;
  color: var(--theme-font-color) !important;
  background: transparent !important;
  border: 1px solid var(--btn-primary-bg);
}

/*end of buttons*/
select {
  height: 30px;
  max-width: 350px !important;
}