:root {
  --space-md: 1rem;
  --action-button-size: 32px;
  --spinner-controls-right: 0.5rem;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 100%;
  scrollbar-gutter: stable;
}

body {
  scrollbar-gutter: stable;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  color: #7f8890;
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
}

body > .content {
  width: min(1120px, 92%);
  margin: 0 auto;
}

/*
 _____                                        _           
|_   _|   _ _ __   ___   __ _ _ __ __ _ _ __ | |__  _   _ 
  | || | | | '_ \ / _ \ / _` | '__/ _` | '_ \| '_ \| | | |
  | || |_| | |_) | (_) | (_| | | | (_| | |_) | | | | |_| |
  |_| \__, | .__/ \___/ \__, |_|  \__,_| .__/|_| |_|\__, |
      |___/|_|          |___/          |_|          |___/ 
*/
h1,
h2,
h3,
h4,
h5,
h6,
.title {
  margin: 0;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.5;
  color: #434a4c;
}

.inverted h1,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h1,
.inverted h2,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h2,
.inverted h3,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h3,
.inverted h4,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h4,
.inverted h5,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h5,
.inverted h6,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content h6,
.inverted .title,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content .title {
  color: #ffffff;
}

h1 {
  font-size: 2.5rem;
}

h2 {
  font-size: 2rem;
}

h3 {
  font-size: 1.5rem;
}

h4 {
  font-size: 1.25rem;
}

h5 {
  font-size: 1.125rem;
}

p {
  font-size: 1rem;
  line-height: 1.5;
}

.inverted p,
.ui.message.inverted > .text,
.ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content p {
  color: #eeeeee;
}

h1:has(+ *),
h2:has(+ *),
h3:has(+ *),
h4:has(+ *),
h5:has(+ *),
h6:has(+ *),
p:has(+ *) {
  margin-bottom: 1rem;
}

h1 + p,
h2 + p,
h3 + p,
h4 + p,
h5 + p,
h6 + p {
  margin-top: 0;
}

/*
 _                            _   
| |    __ _ _   _  ___  _   _| |_ 
| |   / _` | | | |/ _ \| | | | __|
| |__| (_| | |_| | (_) | |_| | |_ 
|_____\__,_|\__, |\___/ \__,_|\__|
            |___/                 
*/
.ui.row {
  display: flex;
  flex-wrap: wrap;
  --layout-gap: 0rem;
  gap: var(--layout-gap);
  --size: 1;
}
.ui.row.gap {
  --layout-gap: 1.25rem;
}
.ui.row.gap.tiny {
  --layout-gap: 0.3125rem;
}
.ui.row.gap.small {
  --layout-gap: 0.625rem;
}
.ui.row.gap.big {
  --layout-gap: 2.5rem;
}
.ui.row.gap.large {
  --layout-gap: 5rem;
}
.ui.row.right {
  justify-content: flex-end;
}
.ui.row.center {
  justify-content: center;
}
.ui.row.justify {
  justify-content: space-between;
}
.ui.row.align-top {
  align-items: flex-start;
}
.ui.row.align-center {
  align-items: center;
}
.ui.row.align-bottom {
  align-items: flex-end;
}
.ui.row > .right {
  margin-left: auto;
}
.ui.row > .left {
  margin-right: auto;
}
.ui.row > .center {
  margin-left: auto;
  margin-right: auto;
}
.ui.row > .align-top {
  margin-bottom: auto;
}
.ui.row > .align-center {
  margin-bottom: auto;
  margin-top: auto;
}
.ui.row > .align-bottom {
  margin-top: auto;
}
.ui.row > * {
  box-sizing: border-box;
  min-width: 0;
}
.ui.row.auto > * {
  flex-grow: 1;
}
.ui.row.auto-two > * {
  --size: 12 / 2;
}
.ui.row.auto-three > * {
  --size: 12 / 3;
}
.ui.row.auto-four > * {
  --size: 12 / 4;
}
.ui.row.auto-five > * {
  --size: 12 / 5;
}
.ui.row.auto-six > * {
  --size: 12 / 6;
}
.ui.row.auto-seven > * {
  --size: 12 / 7;
}
.ui.row.auto-eight > * {
  --size: 12 / 8;
}
.ui.row.auto-nine > * {
  --size: 12 / 9;
}
.ui.row.auto-ten > * {
  --size: 12 / 10;
}
.ui.row.auto-eleven > * {
  --size: 12 / 11;
}
.ui.row.auto-twelve > * {
  --size: 12 / 12;
}
.ui.row > .size-one {
  --size: 1;
}
.ui.row > .size-two {
  --size: 2;
}
.ui.row > .size-three {
  --size: 3;
}
.ui.row > .size-four {
  --size: 4;
}
.ui.row > .size-five {
  --size: 5;
}
.ui.row > .size-six {
  --size: 6;
}
.ui.row > .size-seven {
  --size: 7;
}
.ui.row > .size-eight {
  --size: 8;
}
.ui.row > .size-nine {
  --size: 9;
}
.ui.row > .size-ten {
  --size: 10;
}
.ui.row > .size-eleven {
  --size: 11;
}
.ui.row > .size-twelve {
  --size: 12;
}
.ui.row > [class*=size-], .ui.row[class*=auto-].no-grow > * {
  flex: 0 0 calc((100% - 11 * var(--layout-gap)) / 12 * var(--size) + (var(--size) - 1) * var(--layout-gap));
  width: calc((100% - 11 * var(--layout-gap)) / 12 * var(--size) + (var(--size) - 1) * var(--layout-gap));
}
.ui.row[class*=auto-]:not(.no-grow) > * {
  flex: 1 0 calc((100% - 11 * var(--layout-gap)) / 12 * var(--size) + (var(--size) - 1) * var(--layout-gap));
  width: calc((100% - 11 * var(--layout-gap)) / 12 * var(--size) + (var(--size) - 1) * var(--layout-gap));
}

.ui.column {
  display: flex;
  flex-direction: column;
  --layout-gap: 0rem;
  gap: var(--layout-gap);
}
.ui.column.gap {
  --layout-gap: 1.25rem;
}
.ui.column.gap.tiny {
  --layout-gap: 0.3125rem;
}
.ui.column.gap.small {
  --layout-gap: 0.625rem;
}
.ui.column.gap.big {
  --layout-gap: 2.5rem;
}
.ui.column.gap.large {
  --layout-gap: 5rem;
}
.ui.column.bottom {
  justify-content: flex-end;
}
.ui.column.center {
  justify-content: center;
}
.ui.column.justify {
  justify-content: space-between;
}
.ui.column.align-left {
  align-items: flex-start;
}
.ui.column.align-center {
  align-items: center;
}
.ui.column.align-right {
  align-items: flex-end;
}
.ui.column > .bottom {
  margin-top: auto;
}
.ui.column > .center {
  margin-top: auto;
  margin-bottom: auto;
}
.ui.column > .align-left {
  margin-right: auto;
}
.ui.column > .align-right {
  margin-left: auto;
}
.ui.column > .align-center {
  margin-left: auto;
  margin-right: auto;
}
.ui.column > * {
  box-sizing: border-box;
  min-height: 0;
}

.ui.grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  --layout-gap: 0rem;
  gap: var(--layout-gap);
}
.ui.grid.gap {
  --layout-gap: 1.25rem;
}
.ui.grid.gap.tiny {
  --layout-gap: 0.3125rem;
}
.ui.grid.gap.small {
  --layout-gap: 0.625rem;
}
.ui.grid.gap.big {
  --layout-gap: 2.5rem;
}
.ui.grid.gap.large {
  --layout-gap: 5rem;
}
.ui.grid > .column-one {
  grid-column: span 1;
}
.ui.grid > .row-one {
  grid-row: span 1;
}
.ui.grid > .column-two {
  grid-column: span 2;
}
.ui.grid > .row-two {
  grid-row: span 2;
}
.ui.grid > .column-three {
  grid-column: span 3;
}
.ui.grid > .row-three {
  grid-row: span 3;
}
.ui.grid > .column-four {
  grid-column: span 4;
}
.ui.grid > .row-four {
  grid-row: span 4;
}
.ui.grid > .column-five {
  grid-column: span 5;
}
.ui.grid > .row-five {
  grid-row: span 5;
}
.ui.grid > .column-six {
  grid-column: span 6;
}
.ui.grid > .row-six {
  grid-row: span 6;
}
.ui.grid > .column-seven {
  grid-column: span 7;
}
.ui.grid > .row-seven {
  grid-row: span 7;
}
.ui.grid > .column-eight {
  grid-column: span 8;
}
.ui.grid > .row-eight {
  grid-row: span 8;
}
.ui.grid > .column-nine {
  grid-column: span 9;
}
.ui.grid > .row-nine {
  grid-row: span 9;
}
.ui.grid > .column-ten {
  grid-column: span 10;
}
.ui.grid > .row-ten {
  grid-row: span 10;
}
.ui.grid > .column-eleven {
  grid-column: span 11;
}
.ui.grid > .row-eleven {
  grid-row: span 11;
}
.ui.grid > .column-twelve {
  grid-column: span 12;
}
.ui.grid > .row-twelve {
  grid-row: span 12;
}

@media (max-width: 1023px) {
  .ui.row > .tablet-size-one {
    --size: 1;
  }
  .ui.row > .tablet-size-two {
    --size: 2;
  }
  .ui.row > .tablet-size-three {
    --size: 3;
  }
  .ui.row > .tablet-size-four {
    --size: 4;
  }
  .ui.row > .tablet-size-five {
    --size: 5;
  }
  .ui.row > .tablet-size-six {
    --size: 6;
  }
  .ui.row > .tablet-size-seven {
    --size: 7;
  }
  .ui.row > .tablet-size-eight {
    --size: 8;
  }
  .ui.row > .tablet-size-nine {
    --size: 9;
  }
  .ui.row > .tablet-size-ten {
    --size: 10;
  }
  .ui.row > .tablet-size-eleven {
    --size: 11;
  }
  .ui.row > .tablet-size-twelve {
    --size: 12;
  }
  .ui.row.tablet-auto-two > * {
    --size: 12 / 2;
  }
  .ui.row.tablet-auto-three > * {
    --size: 12 / 3;
  }
  .ui.row.tablet-auto-four > * {
    --size: 12 / 4;
  }
  .ui.row.tablet-auto-five > * {
    --size: 12 / 5;
  }
  .ui.row.tablet-auto-six > * {
    --size: 12 / 6;
  }
  .ui.row.tablet-auto-seven > * {
    --size: 12 / 7;
  }
  .ui.row.tablet-auto-eight > * {
    --size: 12 / 8;
  }
  .ui.row.tablet-auto-nine > * {
    --size: 12 / 9;
  }
  .ui.row.tablet-auto-ten > * {
    --size: 12 / 10;
  }
  .ui.row.tablet-auto-eleven > * {
    --size: 12 / 11;
  }
  .ui.row.tablet-auto-twelve > * {
    --size: 12 / 12;
  }
  .ui.grid > .tablet-column-one {
    grid-column: span 1;
  }
  .ui.grid > .tablet-row-one {
    grid-row: span 1;
  }
  .ui.grid > .tablet-column-two {
    grid-column: span 2;
  }
  .ui.grid > .tablet-row-two {
    grid-row: span 2;
  }
  .ui.grid > .tablet-column-three {
    grid-column: span 3;
  }
  .ui.grid > .tablet-row-three {
    grid-row: span 3;
  }
  .ui.grid > .tablet-column-four {
    grid-column: span 4;
  }
  .ui.grid > .tablet-row-four {
    grid-row: span 4;
  }
  .ui.grid > .tablet-column-five {
    grid-column: span 5;
  }
  .ui.grid > .tablet-row-five {
    grid-row: span 5;
  }
  .ui.grid > .tablet-column-six {
    grid-column: span 6;
  }
  .ui.grid > .tablet-row-six {
    grid-row: span 6;
  }
  .ui.grid > .tablet-column-seven {
    grid-column: span 7;
  }
  .ui.grid > .tablet-row-seven {
    grid-row: span 7;
  }
  .ui.grid > .tablet-column-eight {
    grid-column: span 8;
  }
  .ui.grid > .tablet-row-eight {
    grid-row: span 8;
  }
  .ui.grid > .tablet-column-nine {
    grid-column: span 9;
  }
  .ui.grid > .tablet-row-nine {
    grid-row: span 9;
  }
  .ui.grid > .tablet-column-ten {
    grid-column: span 10;
  }
  .ui.grid > .tablet-row-ten {
    grid-row: span 10;
  }
  .ui.grid > .tablet-column-eleven {
    grid-column: span 11;
  }
  .ui.grid > .tablet-row-eleven {
    grid-row: span 11;
  }
  .ui.grid > .tablet-column-twelve {
    grid-column: span 12;
  }
  .ui.grid > .tablet-row-twelve {
    grid-row: span 12;
  }
}
@media (max-width: 639px) {
  .ui.row > .mobile-size-one {
    --size: 1;
  }
  .ui.row > .mobile-size-two {
    --size: 2;
  }
  .ui.row > .mobile-size-three {
    --size: 3;
  }
  .ui.row > .mobile-size-four {
    --size: 4;
  }
  .ui.row > .mobile-size-five {
    --size: 5;
  }
  .ui.row > .mobile-size-six {
    --size: 6;
  }
  .ui.row > .mobile-size-seven {
    --size: 7;
  }
  .ui.row > .mobile-size-eight {
    --size: 8;
  }
  .ui.row > .mobile-size-nine {
    --size: 9;
  }
  .ui.row > .mobile-size-ten {
    --size: 10;
  }
  .ui.row > .mobile-size-eleven {
    --size: 11;
  }
  .ui.row > .mobile-size-twelve {
    --size: 12;
  }

  .ui.row.mobile-auto-one > * {
    --size: 12;
  }

  .ui.row.mobile-auto-two > * {
    --size: 12 / 2;
  }
  .ui.row.mobile-auto-three > * {
    --size: 12 / 3;
  }
  .ui.row.mobile-auto-four > * {
    --size: 12 / 4;
  }
  .ui.row.mobile-auto-five > * {
    --size: 12 / 5;
  }
  .ui.row.mobile-auto-six > * {
    --size: 12 / 6;
  }
  .ui.row.mobile-auto-seven > * {
    --size: 12 / 7;
  }
  .ui.row.mobile-auto-eight > * {
    --size: 12 / 8;
  }
  .ui.row.mobile-auto-nine > * {
    --size: 12 / 9;
  }
  .ui.row.mobile-auto-ten > * {
    --size: 12 / 10;
  }
  .ui.row.mobile-auto-eleven > * {
    --size: 12 / 11;
  }
  .ui.row.mobile-auto-twelve > * {
    --size: 12 / 12;
  }
  .ui.grid > .mobile-column-one {
    grid-column: span 1;
  }
  .ui.grid > .mobile-row-one {
    grid-row: span 1;
  }
  .ui.grid > .mobile-column-two {
    grid-column: span 2;
  }
  .ui.grid > .mobile-row-two {
    grid-row: span 2;
  }
  .ui.grid > .mobile-column-three {
    grid-column: span 3;
  }
  .ui.grid > .mobile-row-three {
    grid-row: span 3;
  }
  .ui.grid > .mobile-column-four {
    grid-column: span 4;
  }
  .ui.grid > .mobile-row-four {
    grid-row: span 4;
  }
  .ui.grid > .mobile-column-five {
    grid-column: span 5;
  }
  .ui.grid > .mobile-row-five {
    grid-row: span 5;
  }
  .ui.grid > .mobile-column-six {
    grid-column: span 6;
  }
  .ui.grid > .mobile-row-six {
    grid-row: span 6;
  }
  .ui.grid > .mobile-column-seven {
    grid-column: span 7;
  }
  .ui.grid > .mobile-row-seven {
    grid-row: span 7;
  }
  .ui.grid > .mobile-column-eight {
    grid-column: span 8;
  }
  .ui.grid > .mobile-row-eight {
    grid-row: span 8;
  }
  .ui.grid > .mobile-column-nine {
    grid-column: span 9;
  }
  .ui.grid > .mobile-row-nine {
    grid-row: span 9;
  }
  .ui.grid > .mobile-column-ten {
    grid-column: span 10;
  }
  .ui.grid > .mobile-row-ten {
    grid-row: span 10;
  }
  .ui.grid > .mobile-column-eleven {
    grid-column: span 11;
  }
  .ui.grid > .mobile-row-eleven {
    grid-row: span 11;
  }
  .ui.grid > .mobile-column-twelve {
    grid-column: span 12;
  }
  .ui.grid > .mobile-row-twelve {
    grid-row: span 12;
  }
}
/*
 ____  _           _               ____        _           
|  _ \(_)___ _ __ | | __ _ _   _  |  _ \ _   _| | ___  ___ 
| | | | / __| '_ \| |/ _` | | | | | |_) | | | | |/ _ \/ __|
| |_| | \__ \ |_) | | (_| | |_| | |  _ <| |_| | |  __/\__ \
|____/|_|___/ .__/|_|\__,_|\__, | |_| \_\\__,_|_|\___||___/
            |_|            |___/                           
*/
@media (max-width: 639px) {
  .desktop-only:not(.mobile-only) {
    display: none !important;
  }
  .tablet-only:not(.mobile-only) {
    display: none !important;
  }
}
@media (min-width: 640px) and (max-width: 1023px) {
  .desktop-only:not(.tablet-only) {
    display: none !important;
  }
  .mobile-only:not(.tablet-only) {
    display: none !important;
  }
}
/*
  ____            _        _                     
 / ___|___  _ __ | |_ __ _(_)_ __   ___ _ __ ___ 
| |   / _ \| '_ \| __/ _` | | '_ \ / _ \ '__/ __|
| |__| (_) | | | | || (_| | | | | |  __/ |  \__ \
 \____\___/|_| |_|\__\__,_|_|_| |_|\___|_|  |___/
*/
.ui.card {
  position: relative;
  display: grid;
  padding: 1rem;
  border-radius: 15px;
  background: #ffffff;
  border: 1px solid #cccccc;
  transition: box-shadow 0.18s ease;
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}
.ui.card.inverted {
  background: #9b9dc0;
}
.ui.card:hover {
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
}

.ui.message {
  padding: 0.75rem;
  border-radius: 15px;
  border: 1px solid #cccccc;
  background: #ffffff;
  position: relative;
}
.ui.message.inverted {
  background-color: #9b9dc0;
}
.ui.message > i {
  font-size: 1rem;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0.6rem;
  margin-top: 2px;
  line-height: 1;
}
.ui.message > i:not(.right) {
  left: 0.75rem;
  color: #9b9dc0;
}
.ui.message > i.right {
  right: 0.75rem;
  left: auto;
}
.ui.message.inverted > i {
  color: #ffffff;
}
.ui.message:has(> i:not(.right)) {
  padding-left: 3rem;
}
.ui.message:has(> i.right) {
  padding-right: 3rem;
}
.ui.message > .title {
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0 0 0.25rem 0;
}
.ui.message > .text {
  font-size: 0.875rem;
  margin: 0;
  color: #7f8890;
}

.ui.table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 15px;
}
.ui.table > thead {
  background: color-mix(in srgb, #ffffff 50%, #cccccc 50%);
}
.ui.table > thead > tr > th {
  padding: 1rem;
  text-align: left;
  border-bottom: 1px solid #9b9dc0;
  border-right: 1px solid #9b9dc0;
  font-size: 1rem;
  font-weight: 600;
  color: #434a4c;
  vertical-align: middle;
  position: sticky;
  top: 0;
  z-index: 10;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.ui.table > thead > tr > th:last-child {
  border-right: none;
}
.ui.table > tbody > tr > td {
  padding: 0.5rem 1rem;
  text-align: left;
  border-bottom: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  font-size: 1rem;
  color: #434a4c;
  vertical-align: middle;
}
.ui.table > tbody > tr > td:last-child {
  border-right: none;
}
.ui.table > tbody > tr:last-child > td {
  border-bottom: none;
}
.ui.table > tfoot {
  background: color-mix(in srgb, #ffffff 50%, #cccccc 50%);
}
.ui.table > tfoot > tr > td {
  padding: 1rem;
  text-align: left;
  border-top: 1px solid #9b9dc0;
  border-right: 1px solid #cccccc;
  border-bottom: none;
  font-size: 1rem;
  color: #434a4c;
  vertical-align: middle;
}
.ui.table > tfoot > tr > td:last-child {
  border-right: none;
}
.ui.table .table-pagination {
  display: flex;
  align-items: center;
  float: right;
}
.ui.table .table-pagination > button {
  min-width: 32px;
  height: 32px;
  padding: 0 0.75rem;
  background: #ffffff;
  font-size: 1rem;
  color: #434a4c;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border: 1px solid #cccccc;
  border-right: none;
}
.ui.table .table-pagination > button:first-child {
  border-radius: 8px 0 0 8px;
}
.ui.table .table-pagination > button:last-child {
  border-radius: 0 8px 8px 0;
  border-right: 1px solid #cccccc;
}
.ui.table .table-pagination > button:hover {
  background: #cccccc;
  border-color: #9b9dc0;
  color: #434a4c;
}
.ui.table .table-pagination > button:active, .ui.table .table-pagination > button.active {
  background: #9b9dc0;
  border-color: #9b9dc0;
  color: #ffffff;
  transform: scale(0.98);
}
.ui.table .table-pagination > .pagination-ellipsis {
  pointer-events: none;
  opacity: 0.5;
}
.ui.table.inverted {
  background: #9b9dc0;
  border-color: #cccccc;
}
.ui.table.inverted > thead {
  background: color-mix(in srgb, #9b9dc0 50%, #cccccc 50%);
}
.ui.table.inverted > thead > tr > th {
  border-bottom-color: #cccccc;
  border-right-color: #cccccc;
}
.ui.table.inverted > tbody > tr > td {
  border-bottom-color: #cccccc;
  border-right-color: #cccccc;
}
.ui.table.inverted > tfoot {
  background: color-mix(in srgb, #9b9dc0 50%, #cccccc 50%);
}
.ui.table.inverted > tfoot > tr > td {
  border-top-color: #cccccc;
  border-right-color: #cccccc;
}
.ui.table.inverted .table-pagination > button {
  background: #cccccc;
  color: #ffffff;
  border-color: #cccccc;
}
.ui.table.inverted .table-pagination > button:hover {
  background: #9b9dc0;
  border-color: #9b9dc0;
  color: #ffffff;
}
.ui.table.inverted .table-pagination > button:active, .ui.table.inverted .table-pagination > button.active {
  background: #9b9dc0;
  border-color: #9b9dc0;
  color: #ffffff;
}

.ui.tabs {
  display: flex;
  flex-direction: column;
}
.ui.tabs > .header {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}
.ui.tabs > .header > .tab {
  padding: 0.5rem;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  border-radius: 8px 8px 0 0;
  border-bottom: none;
  font-size: 0.75rem;
  font-weight: 600;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #7f8890;
}
.ui.tabs > .header > .tab:hover {
  background-color: #cccccc;
  color: #434a4c;
}
.ui.tabs > .header > .tab:active {
  background: #9b9dc0;
  color: #ffffff;
  transform: scale(0.98);
}
.ui.tabs > .header > .tab.active:not(:active) {
  border: 1px solid #9b9dc0;
  border-bottom: none;
  background: #ffffff;
  color: #434a4c;
  transform: scale(0.98);
  position: relative;
  z-index: 1;
}
.ui.tabs > .header > .tab.active:not(:active):after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: inherit;
}
.ui.tabs > .header > .tab.inverted.active:not(:active) {
  background-color: #9b9dc0;
  color: #ffffff;
}
.ui.tabs.inverted > .header > .tab.active:not(:active) {
  background-color: #9b9dc0;
  color: #ffffff;
}
.ui.tabs > .content {
  position: relative;
  min-height: 0;
  background: #ffffff;
}
.ui.tabs > .content > .panel {
  display: none;
}
.ui.tabs > .content > .panel.active {
  display: block;
}
.ui.tabs > .content > .panel:not(.active) {
  visibility: hidden;
}
.ui.tabs:not(.simple) > .content {
  border-radius: 15px;
  border: 1px solid #cccccc;
  padding: 1rem;
}
.ui.tabs:not(.simple).inverted > .content, .ui.tabs:not(.simple):has(> .header > .tab.active.inverted) > .content {
  background: #9b9dc0;
  color: #ffffff;
}
.ui.tabs:not(.no-animation) > .content {
  /*overflow: hidden;*/
  transition: background 0.2s ease, color 0.2s ease;
}
.ui.tabs:not(.no-animation) > .content > .panel {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.ui.tabs:not(.no-animation) > .content > .panel.active {
  opacity: 1;
  transform: translateY(0);
}
.ui.tabs:not(.no-animation) > .header > .tab {
  transition: background 0.2s ease, color 0.2s ease;
}
.ui.tabs.right > .header {
  justify-content: flex-end;
}
.ui.tabs.bottom {
  flex-direction: column-reverse;
}
.ui.tabs.bottom > .header > .tab {
  border-radius: 0 0 8px 8px;
  border-top: none;
  border-bottom: 1px solid transparent;
}
.ui.tabs.bottom > .header > .tab.active:not(:active) {
  border-top: none;
  border-bottom: 1px solid #9b9dc0;
}
.ui.tabs.bottom > .header > .tab.active:not(:active):after {
  top: -1px;
  bottom: auto;
}

.ui.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 300px;
  background: #ffffff;
  z-index: 10;
  box-shadow: none;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transform: translateX(0);
}
.ui.sidebar.left {
  left: 0;
}
.ui.sidebar.right {
  right: 0;
}
.ui.sidebar.right:not(.active) {
  transform: translateX(100%);
}
.ui.sidebar:not(.active) {
  transform: translateX(-100%);
}
.ui.sidebar.active {
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
  transform: translateX(0);
}
.ui.sidebar > .header {
  padding: 1rem;
  border-bottom: 1px solid #cccccc;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.ui.sidebar > .header > h1,
.ui.sidebar > .header > h2,
.ui.sidebar > .header > h3,
.ui.sidebar > .header > h4,
.ui.sidebar > .header > h5,
.ui.sidebar > .header > h6,
.ui.sidebar > .header > .title {
  margin: 0;
  flex: 1;
}
.ui.sidebar > .body {
  padding: 1rem;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
}
.ui.sidebar > .footer {
  padding: 1rem;
  border-top: 1px solid #cccccc;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.ui.modal.card {
  position: relative;
  pointer-events: auto;
  max-width: 480px;
  width: 100%;
  margin: 1rem;
  display: none;
  flex-direction: column;
  overflow: hidden;
  transform: translateY(50px);
  transition: transform 0.5s ease;
  z-index: 1;
}
.ui.modal.card.active {
  display: flex;
  transform: translateY(0);
}
.ui.modal.card.small {
  max-width: 360px;
}
.ui.modal.card.large {
  max-width: 720px;
}
.ui.modal.card.full {
  max-width: 960px;
  max-height: min(90vh, 680px);
}
.ui.modal.card > .header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.ui.modal.card > .header i {
  margin-right: 0.5rem;
}
.ui.modal.card > .body {
  max-height: 60vh;
  overflow-y: auto;
}
.ui.modal.card > .footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
}

.ui.accordion.card {
  display: flex;
  flex-direction: column;
  gap: 0px;
  overflow: hidden;
}
.ui.accordion.card > .header {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  transition: background 0.2s ease, color 0.2s ease;
  gap: 0.75rem;
  padding-right: 2.5rem;
}
.ui.accordion.card > .header::after {
  content: "\f078";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: #9b9dc0;
  transition: color 0.2s ease, background 0.2s ease, transform 0.2s ease;
  position: absolute;
  right: 0.65rem;
  top: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  z-index: 1;
}
.ui.accordion.card > .header:hover::after {
  background-color: #cccccc;
}
.ui.accordion.card > .header:active::after {
  background-color: #9b9dc0;
  color: #ffffff;
}
.ui.accordion.card.inverted > .header {
  color: #eeeeee;
}
.ui.accordion.card.inverted > .header::after {
  color: #ffffff;
}
.ui.accordion.card.active > .header::after {
  transform: rotate(180deg);
  background-color: #9b9dc0;
  color: #ffffff;
}
.ui.accordion.card.inverted.active > .header::after {
  background-color: #ffffff;
  color: #9b9dc0;
}
.ui.accordion.card > .content {
  height: 0;
}
.ui.accordion.card > .content > .ui.accordion.card {
  margin-top: 0.75rem;
  border: 1px solid #cccccc;
}
.ui.accordion.card:not(.active) > .content {
  visibility: hidden;
}
.ui.accordion.card.open > .content, .ui.accordion.card.active > .content {
  height: auto;
  padding-top: 1rem;
}
.ui.accordion.card:not(.no-animation) > .content {
  transition: height 0.2s ease, padding-top 0.2s ease;
}

.ui.accordion-group {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #cccccc;
  border-radius: 15px;
}
.ui.accordion-group > .ui.accordion.card {
  margin: 0;
  border-radius: 0;
  border-top-width: 0.5px;
  border-bottom-width: 0.5px;
  border-left: none;
  border-right: none;
}
.ui.accordion-group > .ui.accordion.card:first-child {
  border-radius: 15px 15px 0 0;
  border-top: none;
}
.ui.accordion-group > .ui.accordion.card:last-child {
  border-radius: 0 0 15px 15px;
  border-bottom: none;
}

.ui.backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  pointer-events: auto;
  z-index: 1;
  display: none;
  opacity: 0;
  transition: opacity 0.5s ease;
  align-items: center;
  justify-content: center;
}
.ui.backdrop.fullscreen {
  position: fixed;
  inset: 0;
  z-index: 1300;
  border-radius: 0;
}
.ui.backdrop.active {
  display: flex;
  opacity: 1;
}
.ui.backdrop.dimmer {
  background: rgba(0, 0, 0, 0.45);
}
.ui.backdrop.blur {
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.ui.notification-container {
  position: fixed;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  z-index: 1200;
  max-width: min(100% - 2rem, 380px);
  pointer-events: none;
}
.ui.notification-container.top-right {
  top: calc(1rem + 75px);
  right: 1rem;
}
.ui.notification-container.top-left {
  top: calc(1rem + 75px);
  left: 1rem;
}
.ui.notification-container.bottom-right {
  bottom: 1rem;
  right: 1rem;
}
.ui.notification-container.bottom-left {
  bottom: 1rem;
  left: 1rem;
}

@media (max-width: 639px) {
  .ui.notification-container {
    left: 1rem !important;
    right: 1rem !important;
    top: calc(1rem + 75px) !important;
    bottom: auto !important;
    max-width: none;
  }
}
/*
  ____                                             _       
 / ___|___  _ __ ___  _ __   ___  _ __   ___ _ __ | |_ ___ 
| |   / _ \| '_ ` _ \| '_ \ / _ \| '_ \ / _ \ '_ \| __/ __|
| |__| (_) | | | | | | |_) | (_) | | | |  __/ | | | |_\__ \
 \____\___/|_| |_| |_| .__/ \___/|_| |_|\___|_| |_|\__|___/
                     |_|                                   
*/
.ui.notification {
  pointer-events: auto;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.ui.notification .content {
  flex: 1;
}
.ui.notification .close {
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  margin-left: 0.5rem;
  padding: 0;
  align-self: flex-start;
}
.ui.notification.leave {
  opacity: 0;
  transform: translateY(-8px);
}
.ui.notification.enter {
  opacity: 1;
  transform: translateY(0);
}

body:has(.ui.backdrop.fullscreen) {
  overflow: hidden;
}

.ui.eyebrow,
.ui.input.searchable .content .tag,
.ui.input.dropdown .content .tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #7f8890;
  margin-bottom: 0.5rem;
}

.ui.progress {
  width: 100%;
  height: 20px;
  background: #cccccc;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: row;
  /* Progress Bar Sizes */
  /* Default size (20px) - no class needed */
  /* Indeterminate State */
}
.ui.progress.left {
  flex-direction: row-reverse;
}
.ui.progress > .fill {
  height: 100%;
  background: #9b9dc0;
  transition: width 0.3s ease;
  width: 0%;
  flex-shrink: 0;
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  flex-direction: row-reverse;
}
.ui.progress > .fill:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.ui.progress > .fill:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.ui.progress > .fill > .percent {
  margin-right: 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #ffffff;
  text-align: left;
  white-space: nowrap;
  z-index: 1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.ui.progress.left > .fill {
  flex-direction: row;
}
.ui.progress.left > .fill > .percent {
  margin-right: 0;
  margin-left: 0.5rem;
}
.ui.progress.tiny {
  height: 12px;
}
.ui.progress.small {
  height: 16px;
}
.ui.progress.large {
  height: 24px;
}
.ui.progress.huge {
  height: 28px;
}
.ui.progress.indeterminate > .fill {
  width: 30% !important;
  position: relative;
  overflow: hidden;
  animation: progress-indeterminate-move 1.5s ease-in-out infinite;
}
.ui.progress.indeterminate > .fill > .percent {
  display: none;
}
.ui.progress.indeterminate > .fill::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.5) 30%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.5) 70%, transparent 100%);
  animation: progress-indeterminate-shimmer 1.5s ease-in-out infinite;
}
.ui.progress.indeterminate.left > .fill {
  animation-direction: reverse;
}
.ui.progress.indeterminate.left > .fill::after {
  animation-direction: reverse;
}

@keyframes progress-indeterminate-move {
  0% {
    transform: translateX(-100%);
  }
  50% {
    transform: translateX(350%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes progress-indeterminate-shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(300%);
  }
}
.ui.loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Circular Loading Indicator */
  /* Dots Loading Indicator */
}
.ui.loading.circular {
  width: 40px;
  height: 40px;
  position: relative;
  /* Circular Loading Sizes */
  /* Circular Loading Speeds */
}
.ui.loading.circular::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border: 4px solid #cccccc;
  border-top-color: #9b9dc0;
  border-radius: 50%;
  animation: loading-spin 0.8s linear infinite;
}
.ui.loading.circular.tiny {
  width: 20px;
  height: 20px;
}
.ui.loading.circular.tiny::before {
  border-width: 2px;
}
.ui.loading.circular.small {
  width: 30px;
  height: 30px;
}
.ui.loading.circular.small::before {
  border-width: 3px;
}
.ui.loading.circular.large {
  width: 60px;
  height: 60px;
}
.ui.loading.circular.large::before {
  border-width: 5px;
}
.ui.loading.circular.huge {
  width: 80px;
  height: 80px;
}
.ui.loading.circular.huge::before {
  border-width: 6px;
}
.ui.loading.circular.slow::before {
  animation-duration: 1.6s;
}
.ui.loading.circular.fast::before {
  animation-duration: 0.4s;
}
.ui.loading.dots {
  gap: 0.5rem;
  /* Generate animation delays for dots using loop */
  /* Dots Loading Sizes */
  /* Dots Loading Speeds */
}
.ui.loading.dots > span {
  width: 8px;
  height: 8px;
  background: #cccccc;
  border-radius: 50%;
  display: inline-block;
  animation: loading-dots 1.4s ease-in-out infinite;
}
.ui.loading.dots > span:nth-child(1) {
  animation-delay: calc(0 * 0.2s);
}
.ui.loading.dots > span:nth-child(2) {
  animation-delay: calc(1 * 0.2s);
}
.ui.loading.dots > span:nth-child(3) {
  animation-delay: calc(2 * 0.2s);
}
.ui.loading.dots > span:nth-child(4) {
  animation-delay: calc(3 * 0.2s);
}
.ui.loading.dots > span:nth-child(5) {
  animation-delay: calc(4 * 0.2s);
}
.ui.loading.dots.tiny {
  gap: 0.25rem;
}
.ui.loading.dots.tiny > span {
  width: 4px;
  height: 4px;
}
.ui.loading.dots.small {
  gap: 0.375rem;
}
.ui.loading.dots.small > span {
  width: 6px;
  height: 6px;
}
.ui.loading.dots.large {
  gap: 0.75rem;
}
.ui.loading.dots.large > span {
  width: 12px;
  height: 12px;
}
.ui.loading.dots.huge {
  gap: 1rem;
}
.ui.loading.dots.huge > span {
  width: 16px;
  height: 16px;
}
.ui.loading.dots.slow > span {
  animation-duration: 2.1s;
}
.ui.loading.dots.fast > span {
  animation-duration: 0.7s;
}

@keyframes loading-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes loading-dots {
  0%, 80%, 100% {
    transform: scale(0.8);
    opacity: 0.5;
  }
  40% {
    transform: scale(1.2);
    opacity: 1;
  }
}
.ui.backdrop .ui.loading {
  position: relative;
  z-index: 2;
}

.ui.divider,
.ui.separator {
  border: none;
  margin: 0.75rem 0;
  height: 1px;
  background-color: #9b9dc0;
}
.ui.divider.vertical,
.ui.separator.vertical {
  width: 1px;
  height: 100%;
  margin: 0 0.75rem;
  display: inline-block;
  vertical-align: middle;
}

.ui.tooltip {
  position: absolute;
  padding: 0.5rem 0.75rem;
  background: #434a4c;
  color: #ffffff;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
  z-index: 1000;
  opacity: 0;
  transform: translate(-50%, -50%);
  transition: opacity 0.2s ease;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
}
.ui.tooltip.show {
  opacity: 1;
}
.ui.tooltip::after {
  content: "";
  position: absolute;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 6px;
  height: 6px;
  background-color: #434a4c;
}
.ui.tooltip.top::after {
  top: 100%;
  left: 50%;
}
.ui.tooltip.bottom::after {
  top: 0%;
  left: 50%;
}
.ui.tooltip.left::after {
  left: 100%;
  top: 50%;
}
.ui.tooltip.right::after {
  left: 0%;
  top: 50%;
}

.ui.breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-size: 1rem;
  color: #7f8890;
}
.ui.breadcrumb .item {
  display: inline-flex;
  align-items: center;
  color: #7f8890;
  text-decoration: none;
  transition: color 0.15s ease;
  white-space: nowrap;
}
.ui.breadcrumb .item > i:not(.right) {
  margin-right: 0.5rem;
}
.ui.breadcrumb .item > i.right {
  margin-left: 0.5rem;
}
.ui.breadcrumb .item:hover {
  color: #434a4c;
}
.ui.breadcrumb .item.active {
  color: #434a4c;
  font-weight: 600;
  cursor: default;
  pointer-events: none;
}
.ui.breadcrumb .item.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.ui.breadcrumb .divider {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  margin: 0 0.5rem;
}
.ui.breadcrumb .divider::before {
  content: "/";
}
.ui.breadcrumb .item .icon {
  margin-right: 0.5rem;
  font-size: 0.9em;
}
.ui.breadcrumb a.item:hover {
  text-decoration: underline;
}
.ui.breadcrumb a.item.active {
  text-decoration: none;
}
.ui.breadcrumb.small {
  font-size: 0.75rem;
  gap: 0.375rem;
}
.ui.breadcrumb.small .divider {
  margin: 0 0.375rem;
}
.ui.breadcrumb.large {
  gap: 0.75rem;
}
.ui.breadcrumb.large .divider {
  margin: 0 0.75rem;
}
.ui.breadcrumb.inverted {
  color: rgba(255, 255, 255, 0.8);
}
.ui.breadcrumb.inverted .item {
  color: rgba(255, 255, 255, 0.8);
}
.ui.breadcrumb.inverted .item:hover {
  color: #ffffff;
}
.ui.breadcrumb.inverted .item.active {
  color: #ffffff;
}
.ui.breadcrumb.inverted .divider {
  color: rgba(255, 255, 255, 0.6);
}

.ui.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 15px;
  font-weight: 600;
  padding: 0.8rem 1.75rem;
  border: none;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  font-size: 1rem;
  line-height: 1;
  position: relative;
  background-color: #9b9dc0;
  color: #ffffff;
}
.ui.button > i:not(.right) {
  margin-right: 0.5rem;
  margin-left: -0.5rem;
}

.ui.button > i.center {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.ui.button > i.right {
  margin-left: 0.5rem;
  margin-right: -0.5rem;
  order: 2;
}
.ui.button:hover {
  background-color: #cccccc;
}
.ui.button.outline {
  background: transparent;
  border: 1px solid;
  border-color: #cccccc;
  color: #9b9dc0;
}
.ui.button.outline:hover {
  border-color: #9b9dc0;
  background: #9b9dc0;
  color: #ffffff;
}
.ui.button:active {
  transform: scale(0.98);
}

.ui.button.fluid {
  width: 100%;
}

/*
 _____ _      _     _     
|  ___(_) ___| | __| |___ 
| |_  | |/ _ \ |/ _` / __|
|  _| | |  __/ | (_| \__ \
|_|   |_|\___|_|\__,_|___/
*/
.ui.field,
.ui.form .field {
  display: grid;
  gap: 0.5rem;
  height: -moz-fit-content;
  height: fit-content;
}
.ui.field label,
.ui.form .field label {
  font-size: 0.875rem;
  font-weight: 600;
  color: #7f8890;
}

.ui.field label.required::after,
.ui.form label.required::after,
.ui.form .field label.required::after {
  content: "*";
  color: #dc3545;
  margin-left: 0.25rem;
  font-weight: 700;
}

.ui.form .error-message,
.ui.field .error-message {
  display: block;
  color: #dc3545;
  font-size: 0.875rem;
  margin-top: 0.5rem;
}

.ui.input input,
.ui.field input,
.ui.form input,
.ui.input textarea,
.ui.field textarea,
.ui.form textarea {
  border-radius: 15px;
  border: 1px solid #cccccc;
  padding: 0.75rem;
  font: inherit;
  background: #f5f5f5;
  color: #434a4c;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
  width: 100%;
  box-sizing: border-box;
  outline: none;
}
.ui.input input::-moz-placeholder, .ui.field input::-moz-placeholder, .ui.form input::-moz-placeholder, .ui.input textarea::-moz-placeholder, .ui.field textarea::-moz-placeholder, .ui.form textarea::-moz-placeholder {
  color: #7f8890;
}
.ui.input input::placeholder,
.ui.field input::placeholder,
.ui.form input::placeholder,
.ui.input textarea::placeholder,
.ui.field textarea::placeholder,
.ui.form textarea::placeholder {
  color: #7f8890;
}
.ui.input input.error,
.ui.field input.error,
.ui.form input.error,
.ui.input textarea.error,
.ui.field textarea.error,
.ui.form textarea.error {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.input input.error:focus,
.ui.field input.error:focus,
.ui.form input.error:focus,
.ui.input textarea.error:focus,
.ui.field textarea.error:focus,
.ui.form textarea.error:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}
.ui.input input.success,
.ui.field input.success,
.ui.form input.success,
.ui.input textarea.success,
.ui.field textarea.success,
.ui.form textarea.success {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.ui.input input.success:focus,
.ui.field input.success:focus,
.ui.form input.success:focus,
.ui.input textarea.success:focus,
.ui.field textarea.success:focus,
.ui.form textarea.success:focus {
  border-color: #28a745;
  box-shadow: 0 10px 24px rgba(40, 167, 69, 0.15);
}

.ui.input.error input,
.ui.input.error textarea,
.ui.field.error input,
.ui.field.error textarea,
.ui.field .input.error input,
.ui.field .input.error textarea {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.input.error input:focus,
.ui.input.error textarea:focus,
.ui.field.error input:focus,
.ui.field.error textarea:focus,
.ui.field .input.error input:focus,
.ui.field .input.error textarea:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}

.ui.input.success input,
.ui.input.success textarea,
.ui.field.success input,
.ui.field.success textarea,
.ui.field .input.success input,
.ui.field .input.success textarea {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.ui.input.success input:focus,
.ui.input.success textarea:focus,
.ui.field.success input:focus,
.ui.field.success textarea:focus,
.ui.field .input.success input:focus,
.ui.field .input.success textarea:focus {
  border-color: #28a745;
  box-shadow: 0 10px 24px rgba(40, 167, 69, 0.15);
}

.ui.input textarea,
.ui.field textarea,
.ui.form textarea {
  min-height: 100px;
  resize: vertical;
}

.ui.input[type=file],
.ui.field input[type=file],
.ui.form input[type=file] {
  position: relative;
  cursor: pointer;
}
.ui.input[type=file]::file-selector-button,
.ui.field input[type=file]::file-selector-button,
.ui.form input[type=file]::file-selector-button {
  padding: 0.75rem 1rem;
  border-radius: 15px;
  border: none;
  background-color: #9b9dc0;
  color: #434a4c;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  margin-right: 1rem;
  transition: background 0.2s ease, scale 0.2s ease;
}
.ui.input[type=file].outline::file-selector-button,
.ui.field input[type=file].outline::file-selector-button,
.ui.form input[type=file].outline::file-selector-button {
  background: transparent;
  border: 1px solid;
  border-color: #cccccc;
  color: #9b9dc0;
}
.ui.input[type=file]::file-selector-button:hover,
.ui.field input[type=file]::file-selector-button:hover,
.ui.form input[type=file]::file-selector-button:hover {
  background: #cccccc;
}
.ui.input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].outline::file-selector-button:hover {
  border-color: #9b9dc0;
  background: #9b9dc0;
  color: #ffffff;
}
.ui.input[type=file]::file-selector-button:active,
.ui.field input[type=file]::file-selector-button:active,
.ui.form input[type=file]::file-selector-button:active {
  scale: 0.98;
}

.ui.input[type=number],
.ui.field input[type=number],
.ui.form input[type=number] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
}
.ui.input[type=number]::-webkit-outer-spin-button, .ui.input[type=number]::-webkit-inner-spin-button,
.ui.field input[type=number]::-webkit-outer-spin-button,
.ui.field input[type=number]::-webkit-inner-spin-button,
.ui.form input[type=number]::-webkit-outer-spin-button,
.ui.form input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.ui.input,
.ui.field .input,
.ui.form .input {
  position: relative;
  display: flex;
  align-items: center;
}
.ui.input input,
.ui.field .input input,
.ui.form .input input {
  flex: 1;
  width: 100%;
}

.ui.input > i,
.ui.field .input > i,
.ui.form .input > i {
  position: absolute;
  pointer-events: none;
  z-index: 2;
  color: #cccccc;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  top: 50%;
  transform: translateY(-50%);
}
.ui.input > i:not(.right),
.ui.field .input > i:not(.right),
.ui.form .input > i:not(.right) {
  left: 0.75rem;
}
.ui.input > i.right,
.ui.field .input > i.right,
.ui.form .input > i.right {
  right: 0.75rem;
  left: auto;
}

.ui.input.spinner,
.ui.field .input.spinner,
.ui.form .input.spinner {
  position: relative;
}
.ui.input.spinner input[type=number],
.ui.field .input.spinner input[type=number],
.ui.form .input.spinner input[type=number] {
  padding-right: 2.5rem;
}
.ui.input.spinner::before,
.ui.field .input.spinner::before,
.ui.form .input.spinner::before {
  content: "\f077";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  right: 0.5rem;
  bottom: 26px;
  width: 28px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9b9dc0;
  font-size: 0.75rem;
  cursor: pointer;
  background: transparent;
  border-radius: 8px;
  transition: background 0.2s ease, color 0.2s ease;
  z-index: 2;
}
.ui.input.spinner::after,
.ui.field .input.spinner::after,
.ui.form .input.spinner::after {
  content: "\f078";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  right: 0.5rem;
  bottom: 6px;
  width: 28px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9b9dc0;
  font-size: 0.75rem;
  cursor: pointer;
  background: transparent;
  border-radius: 8px;
  transition: background 0.2s ease, color 0.2s ease;
  z-index: 2;
}

.ui.toggle,
.ui.field .toggle,
.ui.form .toggle,
.ui.input.toggle,
.ui.field .input.toggle,
.ui.form .input.toggle {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
}
.ui.toggle > input[type=checkbox],
.ui.field .toggle > input[type=checkbox],
.ui.form .toggle > input[type=checkbox],
.ui.input.toggle > input[type=checkbox],
.ui.field .input.toggle > input[type=checkbox],
.ui.form .input.toggle > input[type=checkbox] {
  display: none;
}
.ui.toggle > .toggle-switch,
.ui.field .toggle > .toggle-switch,
.ui.form .toggle > .toggle-switch,
.ui.input.toggle > .toggle-switch,
.ui.field .input.toggle > .toggle-switch,
.ui.form .input.toggle > .toggle-switch {
  position: relative;
  width: 48px;
  height: 26px;
  background: #68776e;
  border-radius: 9999px;
  transition: background 0.3s ease;
  flex-shrink: 0;
}
.ui.toggle > .toggle-switch::before,
.ui.field .toggle > .toggle-switch::before,
.ui.form .toggle > .toggle-switch::before,
.ui.input.toggle > .toggle-switch::before,
.ui.field .input.toggle > .toggle-switch::before,
.ui.form .input.toggle > .toggle-switch::before {
  content: "";
  position: absolute;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #ffffff;
  top: 2px;
  left: 2px;
  transition: transform 0.3s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}
.ui.toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.input.toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .input.toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .input.toggle > input[type=checkbox]:checked + .toggle-switch {
  background: #cccccc;
}
.ui.toggle > input[type=checkbox]:checked + .toggle-switch::before,
.ui.field .toggle > input[type=checkbox]:checked + .toggle-switch::before,
.ui.form .toggle > input[type=checkbox]:checked + .toggle-switch::before,
.ui.input.toggle > input[type=checkbox]:checked + .toggle-switch::before,
.ui.field .input.toggle > input[type=checkbox]:checked + .toggle-switch::before,
.ui.form .input.toggle > input[type=checkbox]:checked + .toggle-switch::before {
  transform: translateX(22px);
}
.ui.toggle:hover > .toggle-switch,
.ui.field .toggle:hover > .toggle-switch,
.ui.form .toggle:hover > .toggle-switch,
.ui.input.toggle:hover > .toggle-switch,
.ui.field .input.toggle:hover > .toggle-switch,
.ui.form .input.toggle:hover > .toggle-switch {
  background: #797ba0;
}
.ui.toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.input.toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .input.toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .input.toggle:hover > input[type=checkbox]:checked + .toggle-switch {
  background: #9b9dc0;
}
.ui.toggle.error > .toggle-switch,
.ui.field .toggle.error > .toggle-switch,
.ui.form .toggle.error > .toggle-switch,
.ui.input.toggle.error > .toggle-switch,
.ui.field .input.toggle.error > .toggle-switch,
.ui.form .input.toggle.error > .toggle-switch {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.toggle.error > .toggle-switch:focus,
.ui.field .toggle.error > .toggle-switch:focus,
.ui.form .toggle.error > .toggle-switch:focus,
.ui.input.toggle.error > .toggle-switch:focus,
.ui.field .input.toggle.error > .toggle-switch:focus,
.ui.form .input.toggle.error > .toggle-switch:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}
.ui.toggle.success > .toggle-switch,
.ui.field .toggle.success > .toggle-switch,
.ui.form .toggle.success > .toggle-switch,
.ui.input.toggle.success > .toggle-switch,
.ui.field .input.toggle.success > .toggle-switch,
.ui.form .input.toggle.success > .toggle-switch {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.ui.toggle.success > .toggle-switch:focus,
.ui.field .toggle.success > .toggle-switch:focus,
.ui.form .toggle.success > .toggle-switch:focus,
.ui.input.toggle.success > .toggle-switch:focus,
.ui.field .input.toggle.success > .toggle-switch:focus,
.ui.form .input.toggle.success > .toggle-switch:focus {
  border-color: #28a745;
  box-shadow: 0 10px 24px rgba(40, 167, 69, 0.15);
}
.ui.toggle > .toggle-label,
.ui.field .toggle > .toggle-label,
.ui.form .toggle > .toggle-label,
.ui.input.toggle > .toggle-label,
.ui.field .input.toggle > .toggle-label,
.ui.form .input.toggle > .toggle-label {
  font-size: 0.875rem;
  color: #434a4c;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.ui.radio-group,
.ui.field .radio-group,
.ui.form .radio-group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.ui.radio,
.ui.field .radio,
.ui.form .radio,
.ui.input.radio,
.ui.field .input.radio,
.ui.form .input.radio {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
}
.ui.radio > input[type=radio],
.ui.field .radio > input[type=radio],
.ui.form .radio > input[type=radio],
.ui.input.radio > input[type=radio],
.ui.field .input.radio > input[type=radio],
.ui.form .input.radio > input[type=radio] {
  display: none;
}
.ui.radio > .radio-circle,
.ui.field .radio > .radio-circle,
.ui.form .radio > .radio-circle,
.ui.input.radio > .radio-circle,
.ui.field .input.radio > .radio-circle,
.ui.form .input.radio > .radio-circle {
  width: 24px;
  height: 24px;
  border: 1px solid #cccccc;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  background-color: #ffffff;
}
.ui.radio > .radio-circle::before,
.ui.field .radio > .radio-circle::before,
.ui.form .radio > .radio-circle::before,
.ui.input.radio > .radio-circle::before,
.ui.field .input.radio > .radio-circle::before,
.ui.form .input.radio > .radio-circle::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #cccccc;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.2s ease, background 0.2s ease;
}
.ui.radio:hover > .radio-circle,
.ui.field .radio:hover > .radio-circle,
.ui.form .radio:hover > .radio-circle,
.ui.input.radio:hover > .radio-circle,
.ui.field .input.radio:hover > .radio-circle,
.ui.form .input.radio:hover > .radio-circle {
  border-color: #9b9dc0;
}
.ui.radio:hover > .radio-circle::before,
.ui.field .radio:hover > .radio-circle::before,
.ui.form .radio:hover > .radio-circle::before,
.ui.input.radio:hover > .radio-circle::before,
.ui.field .input.radio:hover > .radio-circle::before,
.ui.form .input.radio:hover > .radio-circle::before {
  background: #9b9dc0;
}
.ui.radio.error > .radio-circle,
.ui.field .radio.error > .radio-circle,
.ui.form .radio.error > .radio-circle,
.ui.input.radio.error > .radio-circle,
.ui.field .input.radio.error > .radio-circle,
.ui.form .input.radio.error > .radio-circle {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.radio.error > .radio-circle:focus,
.ui.field .radio.error > .radio-circle:focus,
.ui.form .radio.error > .radio-circle:focus,
.ui.input.radio.error > .radio-circle:focus,
.ui.field .input.radio.error > .radio-circle:focus,
.ui.form .input.radio.error > .radio-circle:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}
.ui.radio.success > .radio-circle,
.ui.field .radio.success > .radio-circle,
.ui.form .radio.success > .radio-circle,
.ui.input.radio.success > .radio-circle,
.ui.field .input.radio.success > .radio-circle,
.ui.form .input.radio.success > .radio-circle {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.ui.radio.success > .radio-circle:focus,
.ui.field .radio.success > .radio-circle:focus,
.ui.form .radio.success > .radio-circle:focus,
.ui.input.radio.success > .radio-circle:focus,
.ui.field .input.radio.success > .radio-circle:focus,
.ui.form .input.radio.success > .radio-circle:focus {
  border-color: #28a745;
  box-shadow: 0 10px 24px rgba(40, 167, 69, 0.15);
}
.ui.radio > input[type=radio]:checked + .radio-circle::before,
.ui.field .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio > input[type=radio]:checked + .radio-circle::before,
.ui.input.radio > input[type=radio]:checked + .radio-circle::before,
.ui.field .input.radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .input.radio > input[type=radio]:checked + .radio-circle::before {
  transform: translate(-50%, -50%) scale(1);
}
.ui.radio > .radio-label,
.ui.field .radio > .radio-label,
.ui.form .radio > .radio-label,
.ui.input.radio > .radio-label,
.ui.field .input.radio > .radio-label,
.ui.form .input.radio > .radio-label {
  font-size: 0.875rem;
  color: #434a4c;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.ui.checkbox,
.ui.field .checkbox,
.ui.form .checkbox,
.ui.input.checkbox,
.ui.field .input.checkbox,
.ui.form .input.checkbox {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
}
.ui.checkbox > input[type=checkbox],
.ui.field .checkbox > input[type=checkbox],
.ui.form .checkbox > input[type=checkbox],
.ui.input.checkbox > input[type=checkbox],
.ui.field .input.checkbox > input[type=checkbox],
.ui.form .input.checkbox > input[type=checkbox] {
  display: none;
}
.ui.checkbox > .checkbox-box,
.ui.field .checkbox > .checkbox-box,
.ui.form .checkbox > .checkbox-box,
.ui.input.checkbox > .checkbox-box,
.ui.field .input.checkbox > .checkbox-box,
.ui.form .input.checkbox > .checkbox-box {
  width: 24px;
  height: 24px;
  border: 1px solid #cccccc;
  border-radius: 8px;
  position: relative;
  flex-shrink: 0;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
}
.ui.checkbox > .checkbox-box::after,
.ui.field .checkbox > .checkbox-box::after,
.ui.form .checkbox > .checkbox-box::after,
.ui.input.checkbox > .checkbox-box::after,
.ui.field .input.checkbox > .checkbox-box::after,
.ui.form .input.checkbox > .checkbox-box::after {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  color: #ffffff;
  font-size: 0.75rem;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.ui.checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.input.checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .input.checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .input.checkbox > input[type=checkbox]:checked + .checkbox-box {
  background: #cccccc;
  border-color: #cccccc;
}
.ui.checkbox > input[type=checkbox]:checked + .checkbox-box::after,
.ui.field .checkbox > input[type=checkbox]:checked + .checkbox-box::after,
.ui.form .checkbox > input[type=checkbox]:checked + .checkbox-box::after,
.ui.input.checkbox > input[type=checkbox]:checked + .checkbox-box::after,
.ui.field .input.checkbox > input[type=checkbox]:checked + .checkbox-box::after,
.ui.form .input.checkbox > input[type=checkbox]:checked + .checkbox-box::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  color: #ffffff;
}
.ui.checkbox.error > .checkbox-box,
.ui.field .checkbox.error > .checkbox-box,
.ui.form .checkbox.error > .checkbox-box,
.ui.input.checkbox.error > .checkbox-box,
.ui.field .input.checkbox.error > .checkbox-box,
.ui.form .input.checkbox.error > .checkbox-box {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.checkbox.error > .checkbox-box:focus,
.ui.field .checkbox.error > .checkbox-box:focus,
.ui.form .checkbox.error > .checkbox-box:focus,
.ui.input.checkbox.error > .checkbox-box:focus,
.ui.field .input.checkbox.error > .checkbox-box:focus,
.ui.form .input.checkbox.error > .checkbox-box:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}
.ui.checkbox:hover > .checkbox-box,
.ui.field .checkbox:hover > .checkbox-box,
.ui.form .checkbox:hover > .checkbox-box,
.ui.input.checkbox:hover > .checkbox-box,
.ui.field .input.checkbox:hover > .checkbox-box,
.ui.form .input.checkbox:hover > .checkbox-box {
  border-color: #9b9dc0;
}
.ui.checkbox:hover > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox:hover > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox:hover > input[type=checkbox]:checked + .checkbox-box,
.ui.input.checkbox:hover > input[type=checkbox]:checked + .checkbox-box,
.ui.field .input.checkbox:hover > input[type=checkbox]:checked + .checkbox-box,
.ui.form .input.checkbox:hover > input[type=checkbox]:checked + .checkbox-box {
  background: #9b9dc0;
}
.ui.checkbox > .checkbox-label,
.ui.field .checkbox > .checkbox-label,
.ui.form .checkbox > .checkbox-label,
.ui.input.checkbox > .checkbox-label,
.ui.field .input.checkbox > .checkbox-label,
.ui.form .input.checkbox > .checkbox-label {
  font-size: 0.875rem;
  color: #434a4c;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.ui.input[type=range],
.ui.field input[type=range],
.ui.form input[type=range] {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  width: 100%;
  height: 8px;
  background: #cccccc;
  border-radius: 8px;
  outline: none;
  transition: background 0.2s ease;
  cursor: pointer;
  margin: 0.75rem 0;
  border: none;
  padding: 0;
}
.ui.input[type=range]:hover,
.ui.field input[type=range]:hover,
.ui.form input[type=range]:hover {
  background: #9b9dc0;
}
.ui.input[type=range]:focus,
.ui.field input[type=range]:focus,
.ui.form input[type=range]:focus {
  background: #9b9dc0;
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}
.ui.input[type=range]::-webkit-slider-thumb,
.ui.field input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border: 1px solid #9b9dc0;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}
.ui.input[type=range]::-moz-range-thumb:hover,
.ui.field input[type=range]::-moz-range-thumb:hover,
.ui.form input[type=range]::-moz-range-thumb:hover {
  transform: scale(1.1);
  border-color: #9b9dc0;
  background: #cccccc;
}
.ui.input[type=range]::-moz-range-thumb:active,
.ui.field input[type=range]::-moz-range-thumb:active,
.ui.form input[type=range]::-moz-range-thumb:active {
  transform: scale(0.98);
}
.ui.input[type=range]::-moz-range-track,
.ui.field input[type=range]::-moz-range-track,
.ui.form input[type=range]::-moz-range-track {
  width: 100%;
  height: 8px;
  background: #cccccc;
  border-radius: 8px;
  cursor: pointer;
}

.ui.input.searchable,
.ui.input.dropdown {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border-radius: 15px;
  border: 1px solid #cccccc;
  padding: 0.75rem;
  font: inherit;
  background: #f5f5f5;
  color: #434a4c;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  cursor: pointer;
  gap: 0.75rem;
}
.ui.input.searchable.error,
.ui.input.dropdown.error {
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.ui.input.searchable.error:focus,
.ui.input.dropdown.error:focus {
  border-color: #dc3545;
  box-shadow: 0 10px 24px rgba(220, 53, 69, 0.15);
}
.ui.input.searchable.success,
.ui.input.dropdown.success {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.ui.input.searchable.success:focus,
.ui.input.dropdown.success:focus {
  border-color: #28a745;
  box-shadow: 0 10px 24px rgba(40, 167, 69, 0.15);
}

.ui.input.datepicker input,
.ui.input.timepicker input,
.ui.input.datetimepicker input {
  cursor: pointer;
}

.ui.input.searchable .menu,
.ui.input.dropdown .menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 15px;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
  max-height: 240px;
  overflow-y: auto;
  z-index: 100;
  transform-origin: top;
  transform: scaleY(0);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;
}
.ui.input.searchable .menu.active,
.ui.input.dropdown .menu.active {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}
.ui.input.searchable .menu > .item,
.ui.input.dropdown .menu > .item {
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: background 0.2s ease;
  color: #434a4c;
}
.ui.input.searchable .menu > .item.filtered,
.ui.input.dropdown .menu > .item.filtered {
  display: none;
}
.ui.input.searchable .menu > .item:hover,
.ui.input.dropdown .menu > .item:hover {
  background: #cccccc;
}
.ui.input.searchable .menu > .item.empty-message, .ui.input.searchable .menu > .item.loading-message,
.ui.input.dropdown .menu > .item.empty-message,
.ui.input.dropdown .menu > .item.loading-message {
  cursor: default;
  pointer-events: none;
  color: #7f8890;
  font-style: normal;
}
.ui.input.searchable .menu > .item.empty-message:hover, .ui.input.searchable .menu > .item.loading-message:hover,
.ui.input.dropdown .menu > .item.empty-message:hover,
.ui.input.dropdown .menu > .item.loading-message:hover {
  background: transparent;
}

.ui.input.searchable > input[type=text],
.ui.input.dropdown > input[type=text] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.ui.input.searchable .content,
.ui.input.dropdown .content {
  flex: 1;
  text-align: left;
  color: #7f8890;
  min-width: 0;
  position: relative;
  padding: 0;
  min-height: 1.5em;
}
.ui.input.searchable .content.has-selection,
.ui.input.dropdown .content.has-selection {
  color: #434a4c;
}

.ui.input.searchable.action-button .content,
.ui.input.dropdown.action-button .content,
.ui.input.datepicker.action-button > input,
.ui.input.timepicker.action-button > input,
.ui.input.datetimepicker.action-button > input {
  padding-right: 2.5rem;
}

.ui.input.searchable:has(> i:not(.right)),
.ui.input.searchable:has(> i.left),
.ui.input.dropdown:has(> i:not(.right)),
.ui.input.dropdown:has(> i.left),
.ui.input:has(> i:not(.right)) > input,
.ui.field .input:has(> i:not(.right)) > input,
.ui.form .input:has(> i:not(.right)) > input {
  padding-left: 2.5rem;
}

.ui.input.searchable:has(> i.right):not(.action-button),
.ui.input.dropdown:has(> i.right):not(.action-button),
.ui.input:has(> i.right) > input,
.ui.field .input:has(> i.right) > input,
.ui.form .input:has(> i.right) > input {
  padding-right: 2.5rem;
}

.ui.input.clearable.clear > input,
.ui.field .input.clearable.clear > input,
.ui.form .input.clearable.clear > input {
  padding-right: 2.5rem;
}

.ui.input.dropdown:has(i.right).action-button.arrow::after,
.ui.input.datepicker:has(i.right).action-button.arrow::after,
.ui.input.timepicker:has(i.right).action-button.arrow::after,
.ui.input.datetimepicker:has(i.right).action-button.arrow::after {
  display: none;
}

.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear > i.right,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear > i.right,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear > i.right,
.ui.input.searchable.action-button > i.right,
.ui.input.dropdown.action-button:not(.arrow) > i.right,
.ui.input.datepicker.action-button:not(.arrow) > i.right,
.ui.input.timepicker.action-button:not(.arrow) > i.right,
.ui.input.datetimepicker.action-button:not(.arrow) > i.right {
  display: none;
}

.ui.input.searchable.action-button::after,
.ui.input.dropdown.action-button::after,
.ui.input.datepicker.action-button::after,
.ui.input.timepicker.action-button::after,
.ui.input.datetimepicker.action-button::after,
.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input)::after,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input)::after,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input)::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: #9b9dc0;
  transition: color 0.2s ease, background 0.2s ease;
  position: absolute;
  right: 0.65rem;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  z-index: 1;
}

.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear::after,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear::after,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable:has(> input).clear::after,
.ui.input.searchable.action-button.clear::after,
.ui.input.dropdown.action-button.clear::after,
.ui.input.datepicker.action-button.clear::after,
.ui.input.timepicker.action-button.clear::after,
.ui.input.datetimepicker.action-button.clear::after {
  content: "\f00d";
}

.ui.input.searchable.action-button.add::after {
  content: "\f067";
}

.ui.input.dropdown.action-button.arrow::after,
.ui.input.datepicker.action-button.arrow::after,
.ui.input.timepicker.action-button.arrow::after,
.ui.input.datetimepicker.action-button.arrow::after {
  content: "\f078";
  transition: transform 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.ui.input.dropdown.action-button.arrow.rotated::after,
.ui.input.datepicker.action-button.arrow.rotated::after,
.ui.input.timepicker.action-button.arrow.rotated::after,
.ui.input.datetimepicker.action-button.arrow.rotated::after {
  transform: translateY(-50%) rotate(180deg);
}

.ui.button:disabled,
.ui.button.disabled,
.ui.tabs > .header > .tab:disabled,
.ui.tabs > .header > .tab.disabled,
.ui.carousel .indicator:disabled,
.ui.carousel .indicator.disabled,
.ui.carousel .arrow:disabled,
.ui.carousel .arrow.disabled,
.ui.table .table-pagination > button:disabled,
.ui.table .table-pagination > button.disabled,
.ui.progress.disabled,
.ui.input.datepicker.disabled,
.ui.input.timepicker.disabled,
.ui.input.datetimepicker.disabled,
.ui.input.searchable.disabled,
.ui.input.dropdown.disabled,
.ui.input.datepicker .calendar.active button:disabled,
.ui.input.datepicker .calendar.active .calendar-day.disabled,
.ui.input.datepicker .calendar.active .calendar-year.disabled,
.ui.tag.action.disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.input:disabled,
.ui.field input:disabled,
.ui.form input:disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.input.disabled,
.ui.field input.disabled,
.ui.form input.disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.toggle input[type=checkbox].disabled ~ .toggle-switch,
.ui.field .toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.field .toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.field .toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.field .toggle input[type=checkbox].disabled ~ .toggle-switch,
.ui.form .toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.form .toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.form .toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.form .toggle input[type=checkbox].disabled ~ .toggle-switch,
.ui.input.toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.input.toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.input.toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.input.toggle input[type=checkbox].disabled ~ .toggle-switch,
.ui.field .input.toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.field .input.toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.field .input.toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.field .input.toggle input[type=checkbox].disabled ~ .toggle-switch,
.ui.form .input.toggle input[type=checkbox]:disabled ~ .toggle-label,
.ui.form .input.toggle input[type=checkbox]:disabled ~ .toggle-switch,
.ui.form .input.toggle input[type=checkbox].disabled ~ .toggle-label,
.ui.form .input.toggle input[type=checkbox].disabled ~ .toggle-switch {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.radio input[type=radio]:disabled ~ .radio-label,
.ui.radio input[type=radio]:disabled ~ .radio-circle,
.ui.radio input[type=radio].disabled + .radio-label,
.ui.radio input[type=radio].disabled + .radio-circle,
.ui.radio :has(input[type=radio]:disabled),
.ui.radio :has(input[type=radio].disabled),
.ui.field .radio input[type=radio]:disabled ~ .radio-label,
.ui.field .radio input[type=radio]:disabled ~ .radio-circle,
.ui.field .radio input[type=radio].disabled + .radio-label,
.ui.field .radio input[type=radio].disabled + .radio-circle,
.ui.field .radio :has(input[type=radio]:disabled),
.ui.field .radio :has(input[type=radio].disabled),
.ui.form .radio input[type=radio]:disabled ~ .radio-label,
.ui.form .radio input[type=radio]:disabled ~ .radio-circle,
.ui.form .radio input[type=radio].disabled + .radio-label,
.ui.form .radio input[type=radio].disabled + .radio-circle,
.ui.form .radio :has(input[type=radio]:disabled),
.ui.form .radio :has(input[type=radio].disabled),
.ui.input.radio input[type=radio]:disabled ~ .radio-label,
.ui.input.radio input[type=radio]:disabled ~ .radio-circle,
.ui.input.radio input[type=radio].disabled + .radio-label,
.ui.input.radio input[type=radio].disabled + .radio-circle,
.ui.input.radio :has(input[type=radio]:disabled),
.ui.input.radio :has(input[type=radio].disabled),
.ui.field .input.radio input[type=radio]:disabled ~ .radio-label,
.ui.field .input.radio input[type=radio]:disabled ~ .radio-circle,
.ui.field .input.radio input[type=radio].disabled + .radio-label,
.ui.field .input.radio input[type=radio].disabled + .radio-circle,
.ui.field .input.radio :has(input[type=radio]:disabled),
.ui.field .input.radio :has(input[type=radio].disabled),
.ui.form .input.radio input[type=radio]:disabled ~ .radio-label,
.ui.form .input.radio input[type=radio]:disabled ~ .radio-circle,
.ui.form .input.radio input[type=radio].disabled + .radio-label,
.ui.form .input.radio input[type=radio].disabled + .radio-circle,
.ui.form .input.radio :has(input[type=radio]:disabled),
.ui.form .input.radio :has(input[type=radio].disabled) {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.checkbox input[type=checkbox].disabled ~ .checkbox-box,
.ui.field .checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.field .checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.field .checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.field .checkbox input[type=checkbox].disabled ~ .checkbox-box,
.ui.form .checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.form .checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.form .checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.form .checkbox input[type=checkbox].disabled ~ .checkbox-box,
.ui.input.checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.input.checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.input.checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.input.checkbox input[type=checkbox].disabled ~ .checkbox-box,
.ui.field .input.checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.field .input.checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.field .input.checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.field .input.checkbox input[type=checkbox].disabled ~ .checkbox-box,
.ui.form .input.checkbox input[type=checkbox]:disabled ~ .checkbox-label,
.ui.form .input.checkbox input[type=checkbox]:disabled ~ .checkbox-box,
.ui.form .input.checkbox input[type=checkbox].disabled + .checkbox-label,
.ui.form .input.checkbox input[type=checkbox].disabled ~ .checkbox-box {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.ui.input.datepicker .calendar .calendar-nav button,
.ui.input.timepicker .time-selector .time-nav button,
.ui.input.datetimepicker .calendar .calendar-nav button,
.ui.input.datetimepicker .time-selector .time-nav button {
  background: transparent;
  border: 0;
  cursor: pointer;
  color: #7f8890;
  border-radius: 8px;
  transition: background 0.2s ease, color 0.2s ease;
}

.ui.input.datepicker .calendar .calendar-title,
.ui.input.timepicker .time-selector .time-title,
.ui.input.datetimepicker .calendar .calendar-title,
.ui.input.datetimepicker .time-selector .time-title {
  font-weight: 600;
  color: #434a4c;
  transition: color 0.2s ease, background 0.2s ease;
  border-radius: 8px;
  margin: 0 -0.5rem;
  flex: 1;
  text-align: center;
  cursor: pointer;
}

.ui.input.searchable .content .tag,
.ui.input.dropdown .content .tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: transparent;
  border: 1px solid #cccccc;
  cursor: pointer;
  color: #384e41;
  opacity: 0.6;
  transition: opacity 0.2s ease, color 0.2s ease, background 0.2s ease, transform 0.2s ease;
  padding: calc(0.25rem - 2px) 0.5rem calc(0.25rem - 3px) 0.5rem;
  margin-bottom: 0px;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  transform: scale(1);
}

/* Standalone Tags */
.ui.tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: transparent;
  border: 1px solid #9b9dc0;
  color: #9b9dc0;
  opacity: 0.6;
  transition: opacity 0.2s ease, color 0.2s ease, background 0.2s ease, transform 0.2s ease;
  padding: calc(0.25rem - 2px) 0.5rem calc(0.25rem - 3px) 0.5rem;
  margin-bottom: 0px;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  transform: scale(1);
}
.ui.tag.action {
  cursor: pointer;
}
.ui.tag.action:hover {
  opacity: 1;
  background: #cccccc;
}
.ui.tag.action:active {
  opacity: 1;
  background: #9b9dc0;
  color: #ffffff;
  border-color: #9b9dc0;
}

.ui.input.datepicker .calendar .calendar-year,
.ui.input.datepicker .calendar .calendar-day,
.ui.input.datetimepicker .calendar .calendar-year,
.ui.input.datetimepicker .calendar .calendar-day {
  text-align: center;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s ease, color 0.2s ease;
  padding: 0 0.2rem;
  color: #434a4c;
}

.ui.input.datepicker .calendar .calendar-day.other-month,
.ui.input.datetimepicker .calendar .calendar-day.other-month {
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}

.ui.input.datepicker .calendar-day.today,
.ui.input.datetimepicker .calendar-day.today {
  font-weight: 600;
  border: 1px solid #cccccc;
}

.ui.input.searchable.action-button:hover::after,
.ui.input.searchable .content .tag:hover,
.ui.input.dropdown.action-button:hover::after,
.ui.input.dropdown .content .tag:hover,
.ui.input.datepicker.action-button:hover::after,
.ui.input.datepicker .calendar .calendar-nav button:hover,
.ui.input.datepicker .calendar .calendar-title:hover,
.ui.input.datepicker .calendar .calendar-year:hover,
.ui.input.datepicker .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.action-button:hover::after,
.ui.input.datetimepicker.action-button:hover::after,
.ui.input.datetimepicker .calendar .calendar-nav button:hover,
.ui.input.datetimepicker .calendar .calendar-title:hover,
.ui.input.datetimepicker .calendar .calendar-year:hover,
.ui.input.datetimepicker .calendar .calendar-day:not(.other-month):hover,
.ui.input.spinner:hover::before,
.ui.field .input.spinner:hover::before,
.ui.form .input.spinner:hover::before,
.ui.input.spinner:hover::after,
.ui.field .input.spinner:hover::after,
.ui.form .input.spinner:hover::after {
  opacity: 1;
  background: #cccccc;
}

.ui.input.searchable.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable .content .tag:active,
.ui.input.dropdown.action-button.active.arrow::after,
.ui.input.dropdown .content .tag:active,
.ui.input.datepicker.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.action-button.active.arrow::after,
.ui.input.datepicker .calendar .calendar-nav button:active,
.ui.input.datepicker .calendar .calendar-title:active,
.ui.input.datepicker .calendar .calendar-year:active,
.ui.input.datepicker .calendar .calendar-year.selected,
.ui.input.datepicker .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker .calendar .calendar-day:not(.other-month).selected,
.ui.input.timepicker.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.action-button.active.arrow::after,
.ui.input.datetimepicker.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.action-button.active.arrow::after,
.ui.input.datetimepicker .calendar .calendar-nav button:active,
.ui.input.datetimepicker .calendar .calendar-title:active,
.ui.input.datetimepicker .calendar .calendar-year:active,
.ui.input.datetimepicker .calendar .calendar-year.selected,
.ui.input.datetimepicker .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker .calendar .calendar-day:not(.other-month).selected,
.ui.input.spinner.pressing-up::before,
.ui.field .input.spinner.pressing-up::before,
.ui.form .input.spinner.pressing-up::before {
  opacity: 1;
  background: #9b9dc0;
  color: #ffffff;
}

.ui.input.spinner.pressing-down::after,
.ui.field .input.spinner.pressing-down::after,
.ui.form .input.spinner.pressing-down::after {
  opacity: 1;
  background: #9b9dc0;
}

.ui.input.searchable > .menu > .item.highlighted,
.ui.input.searchable > .menu > .item:active,
.ui.input.dropdown > .menu > .item.highlighted,
.ui.input.dropdown > .menu > .item:active {
  opacity: 1;
  background: #9b9dc0;
  color: #ffffff;
}

/* Input/Textarea Hover States */
.ui.input input:not(:disabled):not(.disabled):hover,
.ui.field input:not(:disabled):not(.disabled):hover,
.ui.form input:not(:disabled):not(.disabled):hover,
.ui.input textarea:not(:disabled):not(.disabled):hover,
.ui.field textarea:not(:disabled):not(.disabled):hover,
.ui.form textarea:not(:disabled):not(.disabled):hover {
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}

.ui.input.searchable:hover,
.ui.input.dropdown:hover,
.ui.input.datepicker:hover,
.ui.input.datetimepicker:hover {
  box-shadow: 0 4px 12px rgba(19, 26, 28, 0.08);
}

/* Input/Textarea Focus States */
.ui.input input:focus,
.ui.field input:focus,
.ui.form input:focus,
.ui.input textarea:focus,
.ui.field textarea:focus,
.ui.form textarea:focus {
  border-color: #9b9dc0;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
}

.ui.input.searchable:focus,
.ui.input.searchable.active,
.ui.input.dropdown:focus,
.ui.input.dropdown.active,
.ui.input.datepicker.active > input,
.ui.input.timepicker.active > input,
.ui.input.datetimepicker.active > input {
  border-color: #9b9dc0;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
}

/* Action Button Colors */
.ui.input.searchable.action-button.clearable.clear:not(.pressing)::after,
.ui.input.dropdown.action-button.clearable.clear:not(.pressing)::after,
.ui.input.datepicker.action-button.clearable.clear:not(.pressing)::after,
.ui.input.timepicker.action-button.clearable.clear:not(.pressing)::after,
.ui.input.datetimepicker.action-button.clearable.clear:not(.pressing)::after,
.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:not(.pressing)::after,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:not(.pressing)::after,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:not(.pressing)::after {
  color: #d9534f;
}

.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:hover::after,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:hover::after,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear:hover::after,
.ui.input.searchable.action-button.clearable.clear:hover::after,
.ui.input.dropdown.action-button.clearable.clear:hover::after,
.ui.input.datepicker.action-button.clearable.clear:hover::after,
.ui.input.timepicker.action-button.clearable.clear:hover::after,
.ui.input.datetimepicker.action-button.clearable.clear:hover::after {
  background-color: #e99a98;
}

.ui.input.searchable.action-button.clearable.clear.pressing::after,
.ui.input.dropdown.action-button.clearable.clear.pressing::after,
.ui.input.datepicker.action-button.clearable.clear.pressing::after,
.ui.input.timepicker.action-button.clearable.clear.pressing::after,
.ui.input.datetimepicker.action-button.clearable.clear.pressing::after,
.ui.input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear.pressing::after,
.ui.field .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear.pressing::after,
.ui.form .input:not(.searchable):not(.dropdown):not(.datepicker):not(.timepicker):not(.datetimepicker):not(.spinner).clearable.clear.pressing::after {
  background: #d9534f;
  color: #ffffff;
}

.ui.input.searchable.action-button.add:not(.pressing)::after {
  color: #384e41;
}

.ui.input.searchable.action-button.add:hover::after {
  background-color: #b9d6b6;
}

.ui.input.searchable.action-button.add.pressing::after {
  background: #384e41;
  color: #ffffff;
}

/* Menu z-index override (higher priority) */
.ui.input.searchable .menu,
.ui.input.dropdown .menu {
  z-index: 1000;
  transform: scaleY(0);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;
}

.ui.input.searchable .menu.active,
.ui.input.dropdown .menu.active {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}

.ui.input.searchable .content .search-input,
.ui.input.dropdown .content .search-input {
  position: relative;
  padding: 0;
  flex: 1;
  border: 0;
  border-radius: 0;
  background: transparent;
  font: inherit;
  color: #434a4c;
  outline: none;
  width: 100%;
  min-width: 120px;
  z-index: 2;
  display: none;
  box-shadow: none;
}
.ui.input.searchable .content .search-input::-moz-placeholder, .ui.input.dropdown .content .search-input::-moz-placeholder {
  color: #7f8890;
}
.ui.input.searchable .content .search-input::placeholder,
.ui.input.dropdown .content .search-input::placeholder {
  color: #7f8890;
}

.ui.input.searchable.active .content .search-input,
.ui.input.dropdown.active .content .search-input {
  display: block !important;
}

.ui.input.searchable:not(.active) .content .search-input,
.ui.input.dropdown:not(.active) .content .search-input {
  display: none !important;
}

.ui.input.searchable.multiple .content,
.ui.input.dropdown.multiple .content {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  align-items: center;
}

/* ==========================================================================
    ANIMATIONS
    ========================================================================== */
/* Tag animations */
.ui.input.searchable .content .tag.tag-enter,
.ui.input.dropdown .content .tag.tag-enter {
  transform: scale(0);
  animation: tagScaleIn 0.2s ease forwards;
}

.ui.input.searchable .content .tag.tag-exit,
.ui.input.dropdown .content .tag.tag-exit {
  transform: scale(1);
  animation: tagScaleOut 0.2s ease forwards;
}

@keyframes tagScaleIn {
  from {
    transform: scale(0);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 0.6;
  }
}
@keyframes tagScaleOut {
  from {
    transform: scale(1);
    opacity: 0.6;
  }
  to {
    transform: scale(0);
    opacity: 0;
  }
}
/* Date & Time Picker Components */
.ui.input input[type=date]::-webkit-calendar-picker-indicator,
.ui.field input[type=date]::-webkit-calendar-picker-indicator,
.ui.form input[type=date]::-webkit-calendar-picker-indicator,
.ui.input input[type=time]::-webkit-calendar-picker-indicator,
.ui.field input[type=time]::-webkit-calendar-picker-indicator,
.ui.form input[type=time]::-webkit-calendar-picker-indicator,
.ui.input input[type=datetime-local]::-webkit-calendar-picker-indicator,
.ui.field input[type=datetime-local]::-webkit-calendar-picker-indicator,
.ui.form input[type=datetime-local]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

.ui.input.datepicker .calendar,
.ui.input.timepicker .time-selector,
.ui.input.datetimepicker .calendar,
.ui.input.datetimepicker .time-selector {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 4px;
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 15px;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
  z-index: 100;
  transform-origin: top;
  transform: scaleY(0);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;
  padding: 1rem;
}

.ui.input.datepicker .calendar.active,
.ui.input.timepicker .time-selector.active,
.ui.input.datetimepicker .calendar.active,
.ui.input.datetimepicker .time-selector.active {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}

.ui.input.datepicker .calendar .calendar-header,
.ui.input.datetimepicker .calendar .calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}

.ui.input.datepicker .calendar .calendar-nav,
.ui.input.datetimepicker .calendar .calendar-nav {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  align-items: stretch;
}

.ui.input.datepicker .calendar .calendar-grid,
.ui.input.datetimepicker .calendar .calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.5rem;
}

.ui.input.datepicker .calendar .calendar-year-grid,
.ui.input.datetimepicker .calendar .calendar-year-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
}

.ui.input.datepicker .calendar .calendar-day-header,
.ui.input.datetimepicker .calendar .calendar-day-header {
  text-align: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: #7f8890;
}

.ui.input.timepicker .time-selector .time-wheel-container,
.ui.input.datetimepicker .time-selector .time-wheel-container {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  height: 200px;
  position: relative;
  overflow: hidden;
}

.ui.input.timepicker .time-selector .time-wheel-divider,
.ui.input.datetimepicker .time-selector .time-wheel-divider {
  position: absolute;
  top: calc(50% - 41px);
  z-index: 3;
  font-size: 1.5rem;
  font-weight: 600;
  color: #9b9dc0;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 40px;
  line-height: 1;
  transform: translateX(-50%);
  background: linear-gradient(to bottom, transparent 0%, #ffffff 30%, #ffffff 70%, transparent 100%);
}

.ui.input.timepicker .time-selector .time-wheel-colon-1,
.ui.input.datetimepicker .time-selector .time-wheel-colon-1 {
  left: 50%;
}

/* When seconds are present, adjust positions */
.ui.input.timepicker .time-selector .time-wheel-container.has-seconds .time-wheel-colon-1,
.ui.input.datetimepicker .time-selector .time-wheel-container.has-seconds .time-wheel-colon-1 {
  left: 33.33%;
}

.ui.input.timepicker .time-selector .time-wheel-colon-2,
.ui.input.datetimepicker .time-selector .time-wheel-colon-2 {
  left: 66.66%;
}

.ui.input.timepicker .time-selector .time-wheel,
.ui.input.datetimepicker .time-selector .time-wheel {
  flex: 1;
  position: relative;
  overflow: hidden;
  border-right: 1px solid #cccccc;
}

.ui.input.timepicker .time-selector .time-wheel:last-child,
.ui.input.datetimepicker .time-selector .time-wheel:last-child {
  border-right: none;
}

.ui.input.timepicker .time-selector .time-wheel-inner,
.ui.input.datetimepicker .time-selector .time-wheel-inner {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding: 80px 0px;
  width: 80px;
  cursor: grab;
}

.ui.input.timepicker .time-selector .time-wheel-inner:active,
.ui.input.datetimepicker .time-selector .time-wheel-inner:active {
  cursor: grabbing;
}

.ui.input.timepicker .time-selector .time-wheel-inner::-webkit-scrollbar,
.ui.input.datetimepicker .time-selector .time-wheel-inner::-webkit-scrollbar {
  display: none;
}

.ui.input.timepicker .time-selector .time-wheel-inner,
.ui.input.datetimepicker .time-selector .time-wheel-inner {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.ui.input.timepicker .time-selector .time-wheel-item,
.ui.input.datetimepicker .time-selector .time-wheel-item {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 500;
  color: #7f8890;
  transition: color 0.2s ease, font-weight 0.2s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: pointer;
}
.ui.input.timepicker .time-selector .time-wheel-item.time-wheel-spacer,
.ui.input.datetimepicker .time-selector .time-wheel-item.time-wheel-spacer {
  pointer-events: none;
  opacity: 0;
}
.ui.input.timepicker .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker .time-selector .time-wheel-item.selected {
  color: #9b9dc0;
  font-weight: 600;
  font-size: 1.125rem;
}

.ui.input.timepicker .time-selector .time-wheel::before,
.ui.input.datetimepicker .time-selector .time-wheel::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 80px;
  height: 40px;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  pointer-events: none;
  z-index: 2;
  background: transparent;
}

.ui.input.timepicker .time-selector .time-wheel-container::before,
.ui.input.datetimepicker .time-selector .time-wheel-container::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 80px;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(to bottom, #ffffff 0%, transparent 100%);
}

.ui.input.timepicker .time-selector .time-wheel-container::after,
.ui.input.datetimepicker .time-selector .time-wheel-container::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 80px;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(to top, #ffffff 0%, transparent 100%);
}

.ui.carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.ui.carousel .container {
  display: flex;
  transition: transform 0.3s ease;
  will-change: transform;
  height: 100%;
}
.ui.carousel.vertical .container {
  flex-direction: column;
}
.ui.carousel .slide {
  min-width: 100%;
  width: 100%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ui.carousel.vertical .slide {
  min-width: auto;
  min-height: 100%;
  width: 100%;
  flex-shrink: 0;
}
.ui.carousel .arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #ffffff;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  color: #434a4c;
  transition: background 0.2s ease, opacity 0.2s ease, scale 0.2s ease;
  box-shadow: 0 10px 24px rgba(19, 26, 28, 0.12);
  /* Horizontal arrows */
}
.ui.carousel .arrow:hover {
  background: #cccccc;
}
.ui.carousel .arrow:active {
  scale: 0.98;
  color: #ffffff;
  background: #9b9dc0;
}
.ui.carousel .arrow.left {
  left: 1rem;
}
.ui.carousel .arrow.right {
  right: 1rem;
}
.ui.carousel.vertical .arrow.up {
  top: 1rem;
  left: 50%;
  transform: translateX(-50%) translateY(0);
  bottom: auto;
}
.ui.carousel.vertical .arrow.down {
  bottom: 1rem;
  top: auto;
  left: 50%;
  transform: translateX(-50%) translateY(0);
  right: auto;
}
.ui.carousel .indicators {
  position: absolute;
  display: flex;
  gap: 0.5rem;
  z-index: 10;
}
.ui.carousel:not(.vertical) .indicators {
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  flex-direction: row;
}
.ui.carousel:not(.vertical) .indicators.top {
  top: 1rem;
  bottom: auto;
}
.ui.carousel.vertical .indicators {
  right: 1rem;
  top: 50%;
  left: auto;
  bottom: auto;
  transform: translateY(-50%);
  flex-direction: column;
}
.ui.carousel.vertical .indicators.left {
  left: 1rem;
  right: auto;
}
.ui.carousel .indicator {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #cccccc;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
  padding: 0;
}
.ui.carousel .indicator:hover {
  background: #cccccc;
  transform: scale(1.2);
}
.ui.carousel .indicator:active, .ui.carousel .indicator.active {
  background: #9b9dc0;
  transform: scale(1.3);
}

/*
    _                         _ _     _ _ _ _         
   / \   ___ ___ ___  ___ ___(_) |__ (_) (_) |_ _   _ 
  / _ \ / __/ __/ _ \/ __/ __| | '_ \| | | | __| | | |
 / ___ \ (_| (_|  __/\__ \__ \ | |_) | | | | |_| |_| |
/_/   \_\___\___\___||___/___/_|_.__/|_|_|_|\__|\__, |
                                                |___/ 
*/
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/*
  ____      _                
 / ___|___ | | ___  _ __ ___ 
| |   / _ \| |/ _ \| '__/ __|
| |__| (_) | | (_) | |  \__ \
 \____\___/|_|\___/|_|  |___/
*/
.ui.card.primary:not(.inverted),
.ui.message.primary:not(.inverted),
.ui.table.primary:not(.inverted),
.ui.table.primary:not(.inverted) > .table-pagination > button,
.ui.carousel.primary .arrow,
.ui.carousel.primary .indicator {
  background-color: #daf7e3;
}

/* Button */
.ui.button.primary:not(.outline):hover,
.ui.input.primary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.primary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.primary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].primary:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].primary:not(.outline)::file-selector-button:hover,
.ui.form .input.primary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.primary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].primary:not(.outline)::file-selector-button:hover,
.ui.checkbox.primary > input[type=checkbox]:checked + .checkbox-box,
.ui.field.primary .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.primary > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.primary .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.primary > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.primary > .radio-circle::before,
.ui.field.primary .radio > .radio-circle::before,
.ui.field .radio.primary > .radio-circle::before,
.ui.form .field.primary .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.primary > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.primary > input[type=checkbox]:checked + .toggle-switch,
.ui.field.primary .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.primary > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.primary .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.primary > input[type=checkbox]:checked + .toggle-switch,
.ui.input.primary input[type=range]:hover,
.ui.field.primary input[type=range]:hover,
.ui.field .input.primary input[type=range]:hover,
.ui.input input[type=range].primary:hover,
.ui.field input[type=range].primary:hover,
.ui.form .field.primary input[type=range]:hover,
.ui.form .input.primary input[type=range]:hover,
.ui.form input[type=range].primary:hover,
.ui.input.spinner.primary:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.primary:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.primary.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.primary .content .tag:hover,
.ui.input.searchable.primary > .menu > .item:hover,
.ui.input.dropdown.primary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.primary .content .tag:hover,
.ui.input.dropdown.primary > .menu > .item:hover,
.ui.input.datepicker.primary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.primary .calendar .calendar-nav button:hover,
.ui.input.datepicker.primary .calendar .calendar-title:hover,
.ui.input.datepicker.primary .calendar .calendar-year:hover,
.ui.input.datepicker.primary .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.primary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.primary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.primary .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.primary .calendar .calendar-title:hover,
.ui.input.datetimepicker.primary .calendar .calendar-year:hover,
.ui.input.datetimepicker.primary .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.primary > .header > .tab:hover,
.ui.tabs.primary > .header > .tab.active,
.ui.tabs > .header > .tab.primary:hover,
.ui.tabs > .header > .tab.primary.active,
.ui.accordion.card.primary:not(.active) > .header:hover::after,
.ui.tabs.primary:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.primary.active):not(.simple) > .content,
.ui.table.primary .table-pagination > button:hover:not(:disabled),
.ui.carousel.primary .arrow:hover,
.ui.carousel.primary .indicator:hover,
.ui.loading.dots.primary > span,
.ui.tag.action.primary:hover {
  background-color: #b9d6b6;
}

/* Card */
.ui.card.primary.inverted,
.ui.message.primary.inverted,
.ui.table.primary.inverted,
.ui.divider.primary,
.ui.separator.primary,
.ui.button.primary:not(.outline),
.ui.button.primary.outline:hover,
.ui.input.primary input[type=file]:not(.outline)::file-selector-button,
.ui.field.primary input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].primary:not(.outline)::file-selector-button,
.ui.field input[type=file].primary:not(.outline)::file-selector-button,
.ui.form .field.primary input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.primary input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].primary:not(.outline)::file-selector-button:hover,
.ui.input.primary input[type=file].outline::file-selector-button:hover,
.ui.field.primary input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].primary.outline::file-selector-button:hover,
.ui.field input[type=file].primary.outline::file-selector-button:hover,
.ui.form .field.primary input[type=file].outline::file-selector-button:hover,
.ui.form .input.primary input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].primary.outline::file-selector-button:hover,
.ui.checkbox.primary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.primary .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.primary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.primary .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.primary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.primary:hover > .radio-circle::before,
.ui.field.primary .radio:hover > .radio-circle::before,
.ui.field .radio.primary:hover > .radio-circle::before,
.ui.form .field.primary .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.primary:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.primary:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.primary .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.primary:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.primary .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.primary:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.primary input[type=range]:focus,
.ui.field.primary input[type=range]:focus,
.ui.input input[type=range].primary:focus,
.ui.field input[type=range].primary:focus,
.ui.form .field.primary input[type=range]:focus,
.ui.form .input.primary input[type=range]:focus,
.ui.form input[type=range].primary:focus,
.ui.input.spinner.primary.pressing-up::before,
.ui.input.spinner.primary.pressing-down::after,
.ui.input.searchable.primary.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.primary .content .tag:active,
.ui.input.searchable.primary > .menu > .item.highlighted,
.ui.input.searchable.primary > .menu > .item:active,
.ui.input.dropdown.primary.action-button.active.arrow::after,
.ui.input.dropdown.primary .content .tag:active,
.ui.input.dropdown.primary > .menu > .item.highlighted,
.ui.input.dropdown.primary > .menu > .item:active,
.ui.input.datepicker.primary .calendar .calendar-nav button:active,
.ui.input.datepicker.primary .calendar .calendar-title:active,
.ui.input.datepicker.primary .calendar .calendar-year:active,
.ui.input.datepicker.primary .calendar .calendar-year.selected,
.ui.input.datepicker.primary .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.primary .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.primary .calendar .calendar-nav button:active,
.ui.input.datetimepicker.primary .calendar .calendar-title:active,
.ui.input.datetimepicker.primary .calendar .calendar-year:active,
.ui.input.datetimepicker.primary .calendar .calendar-year.selected,
.ui.input.datetimepicker.primary .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.primary .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.primary.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.primary.action-button.active.arrow::after,
.ui.input.timepicker.primary.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.primary.action-button.active.arrow::after,
.ui.input.datetimepicker.primary.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.primary.action-button.active.arrow::after,
.ui.tabs.primary > .header > .tab:active,
.ui.tabs > .header > .tab.primary:active,
.ui.tabs.primary.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.primary.active:not(:active),
.ui.tabs > .header > .tab.primary.active.inverted:not(:active),
.ui.tabs.primary.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.primary.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.primary.active.inverted):not(.simple) > .content,
.ui.accordion.card.primary > .header:active::after,
.ui.accordion.card:not(.active).primary.active > .header::after,
.ui.table.primary .table-pagination > button:active:not(:disabled),
.ui.table.primary .table-pagination > button.active,
.ui.carousel.primary .arrow:active,
.ui.carousel.primary .arrow.active,
.ui.carousel.primary .indicator:active,
.ui.carousel.primary .indicator.active,
.ui.tooltip.primary,
.ui.tooltip.primary::after,
.ui.progress.primary .fill,
.ui.progress .fill.primary,
.ui.tag.action.primary:active {
  background-color: #8fbf8a;
}

/* Card */
.ui.card.primary,
.ui.message.primary,
.ui.button.primary.outline,
.ui.input.primary input,
.ui.field.primary input,
.ui.field .input.primary input,
.ui.form .field.primary input,
.ui.form .input.primary input,
.ui.input input.primary,
.ui.field input.primary,
.ui.form input.primary,
.ui.input.primary textarea,
.ui.field.primary textarea,
.ui.field .input.primary textarea,
.ui.form .field.primary textarea,
.ui.form .input.primary textarea,
.ui.input textarea.primary,
.ui.field textarea.primary,
.ui.form textarea.primary,
.ui.input.primary input[type=file].outline::file-selector-button,
.ui.field.primary input[type=file].outline::file-selector-button,
.ui.field .input.primary input[type=file].outline::file-selector-button,
.ui.input input[type=file].primary.outline::file-selector-button,
.ui.field input[type=file].primary.outline::file-selector-button,
.ui.form input[type=file].primary.outline::file-selector-button,
.ui.radio.primary > .radio-circle,
.ui.field.primary .radio > .radio-circle,
.ui.field .radio.primary > .radio-circle,
.ui.checkbox.primary > .checkbox-box,
.ui.field.primary .checkbox > .checkbox-box,
.ui.field .checkbox.primary > .checkbox-box,
.ui.input.primary input[type=range]::-webkit-slider-thumb,
.ui.field.primary input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].primary::-webkit-slider-thumb,
.ui.field input[type=range].primary::-webkit-slider-thumb,
.ui.form .field.primary input[type=range]::-webkit-slider-thumb,
.ui.form .input.primary input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].primary::-webkit-slider-thumb,
.ui.input.searchable.primary,
.ui.input.searchable.primary .menu,
.ui.input.searchable.primary .content .tag,
.ui.input.dropdown.primary,
.ui.input.dropdown.primary .menu,
.ui.input.dropdown.primary .content .tag,
.ui.input.datepicker.primary .calendar,
.ui.input.datepicker.primary .calendar-day.today,
.ui.input.timepicker.primary .time-selector,
.ui.input.timepicker.primary .time-selector .time-wheel,
.ui.input.timepicker.primary .time-selector .time-wheel::before,
.ui.input.datetimepicker.primary .calendar,
.ui.input.datetimepicker.primary .time-selector,
.ui.input.datetimepicker.primary .calendar-day.today,
.ui.input.datetimepicker.primary .time-selector .time-wheel,
.ui.input.datetimepicker.primary .time-selector .time-wheel::before,
.ui.table.primary,
.ui.table.primary .table-pagination > button {
  border-color: #b9d6b6;
}

/* Button */
.ui.button.primary.outline:hover,
.ui.input.primary input:focus,
.ui.input input[type=file].primary:focus,
.ui.field.primary input:focus,
.ui.field input[type=file].primary:focus,
.ui.input.primary textarea:focus,
.ui.input textarea.primary:focus,
.ui.field.primary textarea:focus,
.ui.field textarea.primary:focus,
.ui.input.primary input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].primary.outline::file-selector-button:hover,
.ui.field.primary input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].primary.outline::file-selector-button:hover,
.ui.checkbox.primary:hover > .checkbox-box,
.ui.field.primary .checkbox:hover > .checkbox-box,
.ui.field .checkbox.primary:hover > .checkbox-box,
.ui.radio.primary:hover > .radio-circle,
.ui.field.primary .radio:hover > .radio-circle,
.ui.field .radio.primary:hover > .radio-circle,
.ui.input.primary input[type=range]::-webkit-slider-thumb:hover,
.ui.field.primary input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].primary::-webkit-slider-thumb:hover,
.ui.field input[type=range].primary::-webkit-slider-thumb:hover,
.ui.input.primary input[type=range]::-webkit-slider-thumb:active,
.ui.field.primary input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].primary::-webkit-slider-thumb:active,
.ui.field input[type=range].primary::-webkit-slider-thumb:active,
.ui.input.searchable.primary:focus,
.ui.input.searchable.primary.active,
.ui.input.dropdown.primary:focus,
.ui.input.dropdown.primary.active,
.ui.input.datepicker.primary.active > input,
.ui.input.timepicker.primary.active > input,
.ui.input.datetimepicker.primary.active > input,
.ui.tabs.primary > .header > .tab:hover,
.ui.tabs > .header > .tab.primary:hover,
.ui.tabs.primary > .header > .tab.active,
.ui.tabs > .header > .tab.primary.active,
.ui.tabs.primary:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.primary.active):not(.simple) > .content,
.ui.table.primary .table-pagination > button.active,
.ui.tag.primary {
  border-color: #8fbf8a;
}

/* Loading Dots */
.ui.loading.circular.primary::before {
  border-top-color: #8fbf8a;
}

/* Checkbox */
.ui.checkbox.primary > .checkbox-box i,
.ui.field.primary .checkbox > .checkbox-box i,
.ui.field .checkbox.primary > .checkbox-box i {
  color: #daf7e3;
}

/* Message */
.ui.message.primary:not(.inverted) > i,
.ui.button.primary.outline:not(:hover),
.ui.input.primary > i,
.ui.field.primary .input > i,
.ui.field .input.primary > i,
.ui.input.primary > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.primary input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.primary input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.primary input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.primary input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.primary:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.primary:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.primary.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.primary.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.primary.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.primary.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.primary .time-selector .time-wheel-item.selected,
.ui.input.timepicker.primary .time-selector .time-wheel-divider,
.ui.input.datetimepicker.primary.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.primary .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.primary .time-selector .time-wheel-divider,
.ui.tag.primary:not(.action),
.ui.tag.primary:not(:active) {
  color: #8fbf8a;
}

/* Table */
.ui.table.primary:not(.inverted) > thead,
.ui.table.primary:not(.inverted) > tfoot {
  background: color-mix(in srgb, #daf7e3 50%, #b9d6b6 50%);
}

/* Table Inverted */
.ui.table.primary.inverted > thead,
.ui.table.primary.inverted > tfoot {
  background: color-mix(in srgb, #8fbf8a 50%, #b9d6b6 50%);
}

.ui.card.secondary:not(.inverted),
.ui.message.secondary:not(.inverted),
.ui.table.secondary:not(.inverted),
.ui.table.secondary:not(.inverted) > .table-pagination > button,
.ui.carousel.secondary .arrow,
.ui.carousel.secondary .indicator {
  background-color: #e9ecef;
}

/* Button */
.ui.button.secondary:not(.outline):hover,
.ui.input.secondary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.secondary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.secondary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].secondary:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].secondary:not(.outline)::file-selector-button:hover,
.ui.form .input.secondary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.secondary input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].secondary:not(.outline)::file-selector-button:hover,
.ui.checkbox.secondary > input[type=checkbox]:checked + .checkbox-box,
.ui.field.secondary .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.secondary > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.secondary .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.secondary > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.secondary > .radio-circle::before,
.ui.field.secondary .radio > .radio-circle::before,
.ui.field .radio.secondary > .radio-circle::before,
.ui.form .field.secondary .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.secondary > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.secondary > input[type=checkbox]:checked + .toggle-switch,
.ui.field.secondary .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.secondary > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.secondary .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.secondary > input[type=checkbox]:checked + .toggle-switch,
.ui.input.secondary input[type=range]:hover,
.ui.field.secondary input[type=range]:hover,
.ui.field .input.secondary input[type=range]:hover,
.ui.input input[type=range].secondary:hover,
.ui.field input[type=range].secondary:hover,
.ui.form .field.secondary input[type=range]:hover,
.ui.form .input.secondary input[type=range]:hover,
.ui.form input[type=range].secondary:hover,
.ui.input.spinner.secondary:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.secondary:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.secondary.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.secondary .content .tag:hover,
.ui.input.searchable.secondary > .menu > .item:hover,
.ui.input.dropdown.secondary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.secondary .content .tag:hover,
.ui.input.dropdown.secondary > .menu > .item:hover,
.ui.input.datepicker.secondary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.secondary .calendar .calendar-nav button:hover,
.ui.input.datepicker.secondary .calendar .calendar-title:hover,
.ui.input.datepicker.secondary .calendar .calendar-year:hover,
.ui.input.datepicker.secondary .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.secondary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.secondary.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.secondary .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.secondary .calendar .calendar-title:hover,
.ui.input.datetimepicker.secondary .calendar .calendar-year:hover,
.ui.input.datetimepicker.secondary .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.secondary > .header > .tab:hover,
.ui.tabs.secondary > .header > .tab.active,
.ui.tabs > .header > .tab.secondary:hover,
.ui.tabs > .header > .tab.secondary.active,
.ui.accordion.card.secondary:not(.active) > .header:hover::after,
.ui.tabs.secondary:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.secondary.active):not(.simple) > .content,
.ui.table.secondary .table-pagination > button:hover:not(:disabled),
.ui.carousel.secondary .arrow:hover,
.ui.carousel.secondary .indicator:hover,
.ui.loading.dots.secondary > span,
.ui.tag.action.secondary:hover {
  background-color: #adb5bd;
}

/* Card */
.ui.card.secondary.inverted,
.ui.message.secondary.inverted,
.ui.table.secondary.inverted,
.ui.divider.secondary,
.ui.separator.secondary,
.ui.button.secondary:not(.outline),
.ui.button.secondary.outline:hover,
.ui.input.secondary input[type=file]:not(.outline)::file-selector-button,
.ui.field.secondary input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].secondary:not(.outline)::file-selector-button,
.ui.field input[type=file].secondary:not(.outline)::file-selector-button,
.ui.form .field.secondary input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.secondary input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].secondary:not(.outline)::file-selector-button:hover,
.ui.input.secondary input[type=file].outline::file-selector-button:hover,
.ui.field.secondary input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].secondary.outline::file-selector-button:hover,
.ui.field input[type=file].secondary.outline::file-selector-button:hover,
.ui.form .field.secondary input[type=file].outline::file-selector-button:hover,
.ui.form .input.secondary input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].secondary.outline::file-selector-button:hover,
.ui.checkbox.secondary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.secondary .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.secondary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.secondary .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.secondary:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.secondary:hover > .radio-circle::before,
.ui.field.secondary .radio:hover > .radio-circle::before,
.ui.field .radio.secondary:hover > .radio-circle::before,
.ui.form .field.secondary .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.secondary:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.secondary:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.secondary .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.secondary:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.secondary .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.secondary:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.secondary input[type=range]:focus,
.ui.field.secondary input[type=range]:focus,
.ui.input input[type=range].secondary:focus,
.ui.field input[type=range].secondary:focus,
.ui.form .field.secondary input[type=range]:focus,
.ui.form .input.secondary input[type=range]:focus,
.ui.form input[type=range].secondary:focus,
.ui.input.spinner.secondary.pressing-up::before,
.ui.input.spinner.secondary.pressing-down::after,
.ui.input.searchable.secondary.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.secondary .content .tag:active,
.ui.input.searchable.secondary > .menu > .item.highlighted,
.ui.input.searchable.secondary > .menu > .item:active,
.ui.input.dropdown.secondary.action-button.active.arrow::after,
.ui.input.dropdown.secondary .content .tag:active,
.ui.input.dropdown.secondary > .menu > .item.highlighted,
.ui.input.dropdown.secondary > .menu > .item:active,
.ui.input.datepicker.secondary .calendar .calendar-nav button:active,
.ui.input.datepicker.secondary .calendar .calendar-title:active,
.ui.input.datepicker.secondary .calendar .calendar-year:active,
.ui.input.datepicker.secondary .calendar .calendar-year.selected,
.ui.input.datepicker.secondary .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.secondary .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.secondary .calendar .calendar-nav button:active,
.ui.input.datetimepicker.secondary .calendar .calendar-title:active,
.ui.input.datetimepicker.secondary .calendar .calendar-year:active,
.ui.input.datetimepicker.secondary .calendar .calendar-year.selected,
.ui.input.datetimepicker.secondary .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.secondary .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.secondary.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.secondary.action-button.active.arrow::after,
.ui.input.timepicker.secondary.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.secondary.action-button.active.arrow::after,
.ui.input.datetimepicker.secondary.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.secondary.action-button.active.arrow::after,
.ui.tabs.secondary > .header > .tab:active,
.ui.tabs > .header > .tab.secondary:active,
.ui.tabs.secondary.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.secondary.active:not(:active),
.ui.tabs > .header > .tab.secondary.active.inverted:not(:active),
.ui.tabs.secondary.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.secondary.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.secondary.active.inverted):not(.simple) > .content,
.ui.accordion.card.secondary > .header:active::after,
.ui.accordion.card:not(.active).secondary.active > .header::after,
.ui.table.secondary .table-pagination > button:active:not(:disabled),
.ui.table.secondary .table-pagination > button.active,
.ui.carousel.secondary .arrow:active,
.ui.carousel.secondary .arrow.active,
.ui.carousel.secondary .indicator:active,
.ui.carousel.secondary .indicator.active,
.ui.tooltip.secondary,
.ui.tooltip.secondary::after,
.ui.progress.secondary .fill,
.ui.progress .fill.secondary,
.ui.tag.action.secondary:active {
  background-color: #6c757d;
}

/* Card */
.ui.card.secondary,
.ui.message.secondary,
.ui.button.secondary.outline,
.ui.input.secondary input,
.ui.field.secondary input,
.ui.field .input.secondary input,
.ui.form .field.secondary input,
.ui.form .input.secondary input,
.ui.input input.secondary,
.ui.field input.secondary,
.ui.form input.secondary,
.ui.input.secondary textarea,
.ui.field.secondary textarea,
.ui.field .input.secondary textarea,
.ui.form .field.secondary textarea,
.ui.form .input.secondary textarea,
.ui.input textarea.secondary,
.ui.field textarea.secondary,
.ui.form textarea.secondary,
.ui.input.secondary input[type=file].outline::file-selector-button,
.ui.field.secondary input[type=file].outline::file-selector-button,
.ui.field .input.secondary input[type=file].outline::file-selector-button,
.ui.input input[type=file].secondary.outline::file-selector-button,
.ui.field input[type=file].secondary.outline::file-selector-button,
.ui.form input[type=file].secondary.outline::file-selector-button,
.ui.radio.secondary > .radio-circle,
.ui.field.secondary .radio > .radio-circle,
.ui.field .radio.secondary > .radio-circle,
.ui.checkbox.secondary > .checkbox-box,
.ui.field.secondary .checkbox > .checkbox-box,
.ui.field .checkbox.secondary > .checkbox-box,
.ui.input.secondary input[type=range]::-webkit-slider-thumb,
.ui.field.secondary input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].secondary::-webkit-slider-thumb,
.ui.field input[type=range].secondary::-webkit-slider-thumb,
.ui.form .field.secondary input[type=range]::-webkit-slider-thumb,
.ui.form .input.secondary input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].secondary::-webkit-slider-thumb,
.ui.input.searchable.secondary,
.ui.input.searchable.secondary .menu,
.ui.input.searchable.secondary .content .tag,
.ui.input.dropdown.secondary,
.ui.input.dropdown.secondary .menu,
.ui.input.dropdown.secondary .content .tag,
.ui.input.datepicker.secondary .calendar,
.ui.input.datepicker.secondary .calendar-day.today,
.ui.input.timepicker.secondary .time-selector,
.ui.input.timepicker.secondary .time-selector .time-wheel,
.ui.input.timepicker.secondary .time-selector .time-wheel::before,
.ui.input.datetimepicker.secondary .calendar,
.ui.input.datetimepicker.secondary .time-selector,
.ui.input.datetimepicker.secondary .calendar-day.today,
.ui.input.datetimepicker.secondary .time-selector .time-wheel,
.ui.input.datetimepicker.secondary .time-selector .time-wheel::before,
.ui.table.secondary,
.ui.table.secondary .table-pagination > button {
  border-color: #adb5bd;
}

/* Button */
.ui.button.secondary.outline:hover,
.ui.input.secondary input:focus,
.ui.input input[type=file].secondary:focus,
.ui.field.secondary input:focus,
.ui.field input[type=file].secondary:focus,
.ui.input.secondary textarea:focus,
.ui.input textarea.secondary:focus,
.ui.field.secondary textarea:focus,
.ui.field textarea.secondary:focus,
.ui.input.secondary input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].secondary.outline::file-selector-button:hover,
.ui.field.secondary input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].secondary.outline::file-selector-button:hover,
.ui.checkbox.secondary:hover > .checkbox-box,
.ui.field.secondary .checkbox:hover > .checkbox-box,
.ui.field .checkbox.secondary:hover > .checkbox-box,
.ui.radio.secondary:hover > .radio-circle,
.ui.field.secondary .radio:hover > .radio-circle,
.ui.field .radio.secondary:hover > .radio-circle,
.ui.input.secondary input[type=range]::-webkit-slider-thumb:hover,
.ui.field.secondary input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].secondary::-webkit-slider-thumb:hover,
.ui.field input[type=range].secondary::-webkit-slider-thumb:hover,
.ui.input.secondary input[type=range]::-webkit-slider-thumb:active,
.ui.field.secondary input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].secondary::-webkit-slider-thumb:active,
.ui.field input[type=range].secondary::-webkit-slider-thumb:active,
.ui.input.searchable.secondary:focus,
.ui.input.searchable.secondary.active,
.ui.input.dropdown.secondary:focus,
.ui.input.dropdown.secondary.active,
.ui.input.datepicker.secondary.active > input,
.ui.input.timepicker.secondary.active > input,
.ui.input.datetimepicker.secondary.active > input,
.ui.tabs.secondary > .header > .tab:hover,
.ui.tabs > .header > .tab.secondary:hover,
.ui.tabs.secondary > .header > .tab.active,
.ui.tabs > .header > .tab.secondary.active,
.ui.tabs.secondary:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.secondary.active):not(.simple) > .content,
.ui.table.secondary .table-pagination > button.active,
.ui.tag.secondary {
  border-color: #6c757d;
}

/* Loading Dots */
.ui.loading.circular.secondary::before {
  border-top-color: #6c757d;
}

/* Checkbox */
.ui.checkbox.secondary > .checkbox-box i,
.ui.field.secondary .checkbox > .checkbox-box i,
.ui.field .checkbox.secondary > .checkbox-box i {
  color: #e9ecef;
}

/* Message */
.ui.message.secondary:not(.inverted) > i,
.ui.button.secondary.outline:not(:hover),
.ui.input.secondary > i,
.ui.field.secondary .input > i,
.ui.field .input.secondary > i,
.ui.input.secondary > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.secondary input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.secondary input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.secondary input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.secondary input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.secondary:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.secondary:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.secondary.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.secondary.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.secondary.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.secondary.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.secondary .time-selector .time-wheel-item.selected,
.ui.input.timepicker.secondary .time-selector .time-wheel-divider,
.ui.input.datetimepicker.secondary.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.secondary .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.secondary .time-selector .time-wheel-divider,
.ui.tag.secondary:not(.action),
.ui.tag.secondary:not(:active) {
  color: #6c757d;
}

/* Table */
.ui.table.secondary:not(.inverted) > thead,
.ui.table.secondary:not(.inverted) > tfoot {
  background: color-mix(in srgb, #e9ecef 50%, #adb5bd 50%);
}

/* Table Inverted */
.ui.table.secondary.inverted > thead,
.ui.table.secondary.inverted > tfoot {
  background: color-mix(in srgb, #6c757d 50%, #adb5bd 50%);
}

.ui.card.red:not(.inverted),
.ui.message.red:not(.inverted),
.ui.table.red:not(.inverted),
.ui.table.red:not(.inverted) > .table-pagination > button,
.ui.carousel.red .arrow,
.ui.carousel.red .indicator {
  background-color: #f8d7da;
}

/* Button */
.ui.button.red:not(.outline):hover,
.ui.input.red input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.red input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.red input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].red:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].red:not(.outline)::file-selector-button:hover,
.ui.form .input.red input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.red input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].red:not(.outline)::file-selector-button:hover,
.ui.checkbox.red > input[type=checkbox]:checked + .checkbox-box,
.ui.field.red .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.red > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.red .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.red > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.red > .radio-circle::before,
.ui.field.red .radio > .radio-circle::before,
.ui.field .radio.red > .radio-circle::before,
.ui.form .field.red .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.red > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.red > input[type=checkbox]:checked + .toggle-switch,
.ui.field.red .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.red > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.red .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.red > input[type=checkbox]:checked + .toggle-switch,
.ui.input.red input[type=range]:hover,
.ui.field.red input[type=range]:hover,
.ui.field .input.red input[type=range]:hover,
.ui.input input[type=range].red:hover,
.ui.field input[type=range].red:hover,
.ui.form .field.red input[type=range]:hover,
.ui.form .input.red input[type=range]:hover,
.ui.form input[type=range].red:hover,
.ui.input.spinner.red:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.red:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.red.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.red .content .tag:hover,
.ui.input.searchable.red > .menu > .item:hover,
.ui.input.dropdown.red.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.red .content .tag:hover,
.ui.input.dropdown.red > .menu > .item:hover,
.ui.input.datepicker.red.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.red .calendar .calendar-nav button:hover,
.ui.input.datepicker.red .calendar .calendar-title:hover,
.ui.input.datepicker.red .calendar .calendar-year:hover,
.ui.input.datepicker.red .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.red.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.red.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.red .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.red .calendar .calendar-title:hover,
.ui.input.datetimepicker.red .calendar .calendar-year:hover,
.ui.input.datetimepicker.red .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.red > .header > .tab:hover,
.ui.tabs.red > .header > .tab.active,
.ui.tabs > .header > .tab.red:hover,
.ui.tabs > .header > .tab.red.active,
.ui.accordion.card.red:not(.active) > .header:hover::after,
.ui.tabs.red:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.red.active):not(.simple) > .content,
.ui.table.red .table-pagination > button:hover:not(:disabled),
.ui.carousel.red .arrow:hover,
.ui.carousel.red .indicator:hover,
.ui.loading.dots.red > span,
.ui.tag.action.red:hover {
  background-color: #f5c6cb;
}

/* Card */
.ui.card.red.inverted,
.ui.message.red.inverted,
.ui.table.red.inverted,
.ui.divider.red,
.ui.separator.red,
.ui.button.red:not(.outline),
.ui.button.red.outline:hover,
.ui.input.red input[type=file]:not(.outline)::file-selector-button,
.ui.field.red input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].red:not(.outline)::file-selector-button,
.ui.field input[type=file].red:not(.outline)::file-selector-button,
.ui.form .field.red input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.red input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].red:not(.outline)::file-selector-button:hover,
.ui.input.red input[type=file].outline::file-selector-button:hover,
.ui.field.red input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].red.outline::file-selector-button:hover,
.ui.field input[type=file].red.outline::file-selector-button:hover,
.ui.form .field.red input[type=file].outline::file-selector-button:hover,
.ui.form .input.red input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].red.outline::file-selector-button:hover,
.ui.checkbox.red:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.red .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.red:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.red .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.red:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.red:hover > .radio-circle::before,
.ui.field.red .radio:hover > .radio-circle::before,
.ui.field .radio.red:hover > .radio-circle::before,
.ui.form .field.red .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.red:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.red:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.red .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.red:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.red .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.red:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.red input[type=range]:focus,
.ui.field.red input[type=range]:focus,
.ui.input input[type=range].red:focus,
.ui.field input[type=range].red:focus,
.ui.form .field.red input[type=range]:focus,
.ui.form .input.red input[type=range]:focus,
.ui.form input[type=range].red:focus,
.ui.input.spinner.red.pressing-up::before,
.ui.input.spinner.red.pressing-down::after,
.ui.input.searchable.red.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.red .content .tag:active,
.ui.input.searchable.red > .menu > .item.highlighted,
.ui.input.searchable.red > .menu > .item:active,
.ui.input.dropdown.red.action-button.active.arrow::after,
.ui.input.dropdown.red .content .tag:active,
.ui.input.dropdown.red > .menu > .item.highlighted,
.ui.input.dropdown.red > .menu > .item:active,
.ui.input.datepicker.red .calendar .calendar-nav button:active,
.ui.input.datepicker.red .calendar .calendar-title:active,
.ui.input.datepicker.red .calendar .calendar-year:active,
.ui.input.datepicker.red .calendar .calendar-year.selected,
.ui.input.datepicker.red .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.red .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.red .calendar .calendar-nav button:active,
.ui.input.datetimepicker.red .calendar .calendar-title:active,
.ui.input.datetimepicker.red .calendar .calendar-year:active,
.ui.input.datetimepicker.red .calendar .calendar-year.selected,
.ui.input.datetimepicker.red .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.red .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.red.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.red.action-button.active.arrow::after,
.ui.input.timepicker.red.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.red.action-button.active.arrow::after,
.ui.input.datetimepicker.red.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.red.action-button.active.arrow::after,
.ui.tabs.red > .header > .tab:active,
.ui.tabs > .header > .tab.red:active,
.ui.tabs.red.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.red.active:not(:active),
.ui.tabs > .header > .tab.red.active.inverted:not(:active),
.ui.tabs.red.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.red.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.red.active.inverted):not(.simple) > .content,
.ui.accordion.card.red > .header:active::after,
.ui.accordion.card:not(.active).red.active > .header::after,
.ui.table.red .table-pagination > button:active:not(:disabled),
.ui.table.red .table-pagination > button.active,
.ui.carousel.red .arrow:active,
.ui.carousel.red .arrow.active,
.ui.carousel.red .indicator:active,
.ui.carousel.red .indicator.active,
.ui.tooltip.red,
.ui.tooltip.red::after,
.ui.progress.red .fill,
.ui.progress .fill.red,
.ui.tag.action.red:active {
  background-color: #dc3545;
}

/* Card */
.ui.card.red,
.ui.message.red,
.ui.button.red.outline,
.ui.input.red input,
.ui.field.red input,
.ui.field .input.red input,
.ui.form .field.red input,
.ui.form .input.red input,
.ui.input input.red,
.ui.field input.red,
.ui.form input.red,
.ui.input.red textarea,
.ui.field.red textarea,
.ui.field .input.red textarea,
.ui.form .field.red textarea,
.ui.form .input.red textarea,
.ui.input textarea.red,
.ui.field textarea.red,
.ui.form textarea.red,
.ui.input.red input[type=file].outline::file-selector-button,
.ui.field.red input[type=file].outline::file-selector-button,
.ui.field .input.red input[type=file].outline::file-selector-button,
.ui.input input[type=file].red.outline::file-selector-button,
.ui.field input[type=file].red.outline::file-selector-button,
.ui.form input[type=file].red.outline::file-selector-button,
.ui.radio.red > .radio-circle,
.ui.field.red .radio > .radio-circle,
.ui.field .radio.red > .radio-circle,
.ui.checkbox.red > .checkbox-box,
.ui.field.red .checkbox > .checkbox-box,
.ui.field .checkbox.red > .checkbox-box,
.ui.input.red input[type=range]::-webkit-slider-thumb,
.ui.field.red input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].red::-webkit-slider-thumb,
.ui.field input[type=range].red::-webkit-slider-thumb,
.ui.form .field.red input[type=range]::-webkit-slider-thumb,
.ui.form .input.red input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].red::-webkit-slider-thumb,
.ui.input.searchable.red,
.ui.input.searchable.red .menu,
.ui.input.searchable.red .content .tag,
.ui.input.dropdown.red,
.ui.input.dropdown.red .menu,
.ui.input.dropdown.red .content .tag,
.ui.input.datepicker.red .calendar,
.ui.input.datepicker.red .calendar-day.today,
.ui.input.timepicker.red .time-selector,
.ui.input.timepicker.red .time-selector .time-wheel,
.ui.input.timepicker.red .time-selector .time-wheel::before,
.ui.input.datetimepicker.red .calendar,
.ui.input.datetimepicker.red .time-selector,
.ui.input.datetimepicker.red .calendar-day.today,
.ui.input.datetimepicker.red .time-selector .time-wheel,
.ui.input.datetimepicker.red .time-selector .time-wheel::before,
.ui.table.red,
.ui.table.red .table-pagination > button {
  border-color: #f5c6cb;
}

/* Button */
.ui.button.red.outline:hover,
.ui.input.red input:focus,
.ui.input input[type=file].red:focus,
.ui.field.red input:focus,
.ui.field input[type=file].red:focus,
.ui.input.red textarea:focus,
.ui.input textarea.red:focus,
.ui.field.red textarea:focus,
.ui.field textarea.red:focus,
.ui.input.red input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].red.outline::file-selector-button:hover,
.ui.field.red input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].red.outline::file-selector-button:hover,
.ui.checkbox.red:hover > .checkbox-box,
.ui.field.red .checkbox:hover > .checkbox-box,
.ui.field .checkbox.red:hover > .checkbox-box,
.ui.radio.red:hover > .radio-circle,
.ui.field.red .radio:hover > .radio-circle,
.ui.field .radio.red:hover > .radio-circle,
.ui.input.red input[type=range]::-webkit-slider-thumb:hover,
.ui.field.red input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].red::-webkit-slider-thumb:hover,
.ui.field input[type=range].red::-webkit-slider-thumb:hover,
.ui.input.red input[type=range]::-webkit-slider-thumb:active,
.ui.field.red input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].red::-webkit-slider-thumb:active,
.ui.field input[type=range].red::-webkit-slider-thumb:active,
.ui.input.searchable.red:focus,
.ui.input.searchable.red.active,
.ui.input.dropdown.red:focus,
.ui.input.dropdown.red.active,
.ui.input.datepicker.red.active > input,
.ui.input.timepicker.red.active > input,
.ui.input.datetimepicker.red.active > input,
.ui.tabs.red > .header > .tab:hover,
.ui.tabs > .header > .tab.red:hover,
.ui.tabs.red > .header > .tab.active,
.ui.tabs > .header > .tab.red.active,
.ui.tabs.red:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.red.active):not(.simple) > .content,
.ui.table.red .table-pagination > button.active,
.ui.tag.red {
  border-color: #dc3545;
}

/* Loading Dots */
.ui.loading.circular.red::before {
  border-top-color: #dc3545;
}

/* Checkbox */
.ui.checkbox.red > .checkbox-box i,
.ui.field.red .checkbox > .checkbox-box i,
.ui.field .checkbox.red > .checkbox-box i {
  color: #f8d7da;
}

/* Message */
.ui.message.red:not(.inverted) > i,
.ui.button.red.outline:not(:hover),
.ui.input.red > i,
.ui.field.red .input > i,
.ui.field .input.red > i,
.ui.input.red > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.red input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.red input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.red input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.red input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.red:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.red:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.red.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.red.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.red.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.red.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.red .time-selector .time-wheel-item.selected,
.ui.input.timepicker.red .time-selector .time-wheel-divider,
.ui.input.datetimepicker.red.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.red .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.red .time-selector .time-wheel-divider,
.ui.tag.red:not(.action),
.ui.tag.red:not(:active) {
  color: #dc3545;
}

/* Table */
.ui.table.red:not(.inverted) > thead,
.ui.table.red:not(.inverted) > tfoot {
  background: color-mix(in srgb, #f8d7da 50%, #f5c6cb 50%);
}

/* Table Inverted */
.ui.table.red.inverted > thead,
.ui.table.red.inverted > tfoot {
  background: color-mix(in srgb, #dc3545 50%, #f5c6cb 50%);
}

.ui.card.green:not(.inverted),
.ui.message.green:not(.inverted),
.ui.table.green:not(.inverted),
.ui.table.green:not(.inverted) > .table-pagination > button,
.ui.carousel.green .arrow,
.ui.carousel.green .indicator {
  background-color: #d4edda;
}

/* Button */
.ui.button.green:not(.outline):hover,
.ui.input.green input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.green input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.green input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].green:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].green:not(.outline)::file-selector-button:hover,
.ui.form .input.green input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.green input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].green:not(.outline)::file-selector-button:hover,
.ui.checkbox.green > input[type=checkbox]:checked + .checkbox-box,
.ui.field.green .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.green > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.green .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.green > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.green > .radio-circle::before,
.ui.field.green .radio > .radio-circle::before,
.ui.field .radio.green > .radio-circle::before,
.ui.form .field.green .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.green > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.green > input[type=checkbox]:checked + .toggle-switch,
.ui.field.green .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.green > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.green .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.green > input[type=checkbox]:checked + .toggle-switch,
.ui.input.green input[type=range]:hover,
.ui.field.green input[type=range]:hover,
.ui.field .input.green input[type=range]:hover,
.ui.input input[type=range].green:hover,
.ui.field input[type=range].green:hover,
.ui.form .field.green input[type=range]:hover,
.ui.form .input.green input[type=range]:hover,
.ui.form input[type=range].green:hover,
.ui.input.spinner.green:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.green:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.green.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.green .content .tag:hover,
.ui.input.searchable.green > .menu > .item:hover,
.ui.input.dropdown.green.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.green .content .tag:hover,
.ui.input.dropdown.green > .menu > .item:hover,
.ui.input.datepicker.green.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.green .calendar .calendar-nav button:hover,
.ui.input.datepicker.green .calendar .calendar-title:hover,
.ui.input.datepicker.green .calendar .calendar-year:hover,
.ui.input.datepicker.green .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.green.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.green.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.green .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.green .calendar .calendar-title:hover,
.ui.input.datetimepicker.green .calendar .calendar-year:hover,
.ui.input.datetimepicker.green .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.green > .header > .tab:hover,
.ui.tabs.green > .header > .tab.active,
.ui.tabs > .header > .tab.green:hover,
.ui.tabs > .header > .tab.green.active,
.ui.accordion.card.green:not(.active) > .header:hover::after,
.ui.tabs.green:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.green.active):not(.simple) > .content,
.ui.table.green .table-pagination > button:hover:not(:disabled),
.ui.carousel.green .arrow:hover,
.ui.carousel.green .indicator:hover,
.ui.loading.dots.green > span,
.ui.tag.action.green:hover {
  background-color: #c3e6cb;
}

/* Card */
.ui.card.green.inverted,
.ui.message.green.inverted,
.ui.table.green.inverted,
.ui.divider.green,
.ui.separator.green,
.ui.button.green:not(.outline),
.ui.button.green.outline:hover,
.ui.input.green input[type=file]:not(.outline)::file-selector-button,
.ui.field.green input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].green:not(.outline)::file-selector-button,
.ui.field input[type=file].green:not(.outline)::file-selector-button,
.ui.form .field.green input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.green input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].green:not(.outline)::file-selector-button:hover,
.ui.input.green input[type=file].outline::file-selector-button:hover,
.ui.field.green input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].green.outline::file-selector-button:hover,
.ui.field input[type=file].green.outline::file-selector-button:hover,
.ui.form .field.green input[type=file].outline::file-selector-button:hover,
.ui.form .input.green input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].green.outline::file-selector-button:hover,
.ui.checkbox.green:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.green .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.green:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.green .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.green:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.green:hover > .radio-circle::before,
.ui.field.green .radio:hover > .radio-circle::before,
.ui.field .radio.green:hover > .radio-circle::before,
.ui.form .field.green .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.green:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.green:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.green .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.green:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.green .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.green:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.green input[type=range]:focus,
.ui.field.green input[type=range]:focus,
.ui.input input[type=range].green:focus,
.ui.field input[type=range].green:focus,
.ui.form .field.green input[type=range]:focus,
.ui.form .input.green input[type=range]:focus,
.ui.form input[type=range].green:focus,
.ui.input.spinner.green.pressing-up::before,
.ui.input.spinner.green.pressing-down::after,
.ui.input.searchable.green.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.green .content .tag:active,
.ui.input.searchable.green > .menu > .item.highlighted,
.ui.input.searchable.green > .menu > .item:active,
.ui.input.dropdown.green.action-button.active.arrow::after,
.ui.input.dropdown.green .content .tag:active,
.ui.input.dropdown.green > .menu > .item.highlighted,
.ui.input.dropdown.green > .menu > .item:active,
.ui.input.datepicker.green .calendar .calendar-nav button:active,
.ui.input.datepicker.green .calendar .calendar-title:active,
.ui.input.datepicker.green .calendar .calendar-year:active,
.ui.input.datepicker.green .calendar .calendar-year.selected,
.ui.input.datepicker.green .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.green .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.green .calendar .calendar-nav button:active,
.ui.input.datetimepicker.green .calendar .calendar-title:active,
.ui.input.datetimepicker.green .calendar .calendar-year:active,
.ui.input.datetimepicker.green .calendar .calendar-year.selected,
.ui.input.datetimepicker.green .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.green .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.green.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.green.action-button.active.arrow::after,
.ui.input.timepicker.green.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.green.action-button.active.arrow::after,
.ui.input.datetimepicker.green.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.green.action-button.active.arrow::after,
.ui.tabs.green > .header > .tab:active,
.ui.tabs > .header > .tab.green:active,
.ui.tabs.green.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.green.active:not(:active),
.ui.tabs > .header > .tab.green.active.inverted:not(:active),
.ui.tabs.green.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.green.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.green.active.inverted):not(.simple) > .content,
.ui.accordion.card.green > .header:active::after,
.ui.accordion.card:not(.active).green.active > .header::after,
.ui.table.green .table-pagination > button:active:not(:disabled),
.ui.table.green .table-pagination > button.active,
.ui.carousel.green .arrow:active,
.ui.carousel.green .arrow.active,
.ui.carousel.green .indicator:active,
.ui.carousel.green .indicator.active,
.ui.tooltip.green,
.ui.tooltip.green::after,
.ui.progress.green .fill,
.ui.progress .fill.green,
.ui.tag.action.green:active {
  background-color: #28a745;
}

/* Card */
.ui.card.green,
.ui.message.green,
.ui.button.green.outline,
.ui.input.green input,
.ui.field.green input,
.ui.field .input.green input,
.ui.form .field.green input,
.ui.form .input.green input,
.ui.input input.green,
.ui.field input.green,
.ui.form input.green,
.ui.input.green textarea,
.ui.field.green textarea,
.ui.field .input.green textarea,
.ui.form .field.green textarea,
.ui.form .input.green textarea,
.ui.input textarea.green,
.ui.field textarea.green,
.ui.form textarea.green,
.ui.input.green input[type=file].outline::file-selector-button,
.ui.field.green input[type=file].outline::file-selector-button,
.ui.field .input.green input[type=file].outline::file-selector-button,
.ui.input input[type=file].green.outline::file-selector-button,
.ui.field input[type=file].green.outline::file-selector-button,
.ui.form input[type=file].green.outline::file-selector-button,
.ui.radio.green > .radio-circle,
.ui.field.green .radio > .radio-circle,
.ui.field .radio.green > .radio-circle,
.ui.checkbox.green > .checkbox-box,
.ui.field.green .checkbox > .checkbox-box,
.ui.field .checkbox.green > .checkbox-box,
.ui.input.green input[type=range]::-webkit-slider-thumb,
.ui.field.green input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].green::-webkit-slider-thumb,
.ui.field input[type=range].green::-webkit-slider-thumb,
.ui.form .field.green input[type=range]::-webkit-slider-thumb,
.ui.form .input.green input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].green::-webkit-slider-thumb,
.ui.input.searchable.green,
.ui.input.searchable.green .menu,
.ui.input.searchable.green .content .tag,
.ui.input.dropdown.green,
.ui.input.dropdown.green .menu,
.ui.input.dropdown.green .content .tag,
.ui.input.datepicker.green .calendar,
.ui.input.datepicker.green .calendar-day.today,
.ui.input.timepicker.green .time-selector,
.ui.input.timepicker.green .time-selector .time-wheel,
.ui.input.timepicker.green .time-selector .time-wheel::before,
.ui.input.datetimepicker.green .calendar,
.ui.input.datetimepicker.green .time-selector,
.ui.input.datetimepicker.green .calendar-day.today,
.ui.input.datetimepicker.green .time-selector .time-wheel,
.ui.input.datetimepicker.green .time-selector .time-wheel::before,
.ui.table.green,
.ui.table.green .table-pagination > button {
  border-color: #c3e6cb;
}

/* Button */
.ui.button.green.outline:hover,
.ui.input.green input:focus,
.ui.input input[type=file].green:focus,
.ui.field.green input:focus,
.ui.field input[type=file].green:focus,
.ui.input.green textarea:focus,
.ui.input textarea.green:focus,
.ui.field.green textarea:focus,
.ui.field textarea.green:focus,
.ui.input.green input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].green.outline::file-selector-button:hover,
.ui.field.green input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].green.outline::file-selector-button:hover,
.ui.checkbox.green:hover > .checkbox-box,
.ui.field.green .checkbox:hover > .checkbox-box,
.ui.field .checkbox.green:hover > .checkbox-box,
.ui.radio.green:hover > .radio-circle,
.ui.field.green .radio:hover > .radio-circle,
.ui.field .radio.green:hover > .radio-circle,
.ui.input.green input[type=range]::-webkit-slider-thumb:hover,
.ui.field.green input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].green::-webkit-slider-thumb:hover,
.ui.field input[type=range].green::-webkit-slider-thumb:hover,
.ui.input.green input[type=range]::-webkit-slider-thumb:active,
.ui.field.green input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].green::-webkit-slider-thumb:active,
.ui.field input[type=range].green::-webkit-slider-thumb:active,
.ui.input.searchable.green:focus,
.ui.input.searchable.green.active,
.ui.input.dropdown.green:focus,
.ui.input.dropdown.green.active,
.ui.input.datepicker.green.active > input,
.ui.input.timepicker.green.active > input,
.ui.input.datetimepicker.green.active > input,
.ui.tabs.green > .header > .tab:hover,
.ui.tabs > .header > .tab.green:hover,
.ui.tabs.green > .header > .tab.active,
.ui.tabs > .header > .tab.green.active,
.ui.tabs.green:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.green.active):not(.simple) > .content,
.ui.table.green .table-pagination > button.active,
.ui.tag.green {
  border-color: #28a745;
}

/* Loading Dots */
.ui.loading.circular.green::before {
  border-top-color: #28a745;
}

/* Checkbox */
.ui.checkbox.green > .checkbox-box i,
.ui.field.green .checkbox > .checkbox-box i,
.ui.field .checkbox.green > .checkbox-box i {
  color: #d4edda;
}

/* Message */
.ui.message.green:not(.inverted) > i,
.ui.button.green.outline:not(:hover),
.ui.input.green > i,
.ui.field.green .input > i,
.ui.field .input.green > i,
.ui.input.green > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.green input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.green input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.green input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.green input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.green:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.green:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.green.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.green.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.green.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.green.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.green .time-selector .time-wheel-item.selected,
.ui.input.timepicker.green .time-selector .time-wheel-divider,
.ui.input.datetimepicker.green.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.green .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.green .time-selector .time-wheel-divider,
.ui.tag.green:not(.action),
.ui.tag.green:not(:active) {
  color: #28a745;
}

/* Table */
.ui.table.green:not(.inverted) > thead,
.ui.table.green:not(.inverted) > tfoot {
  background: color-mix(in srgb, #d4edda 50%, #c3e6cb 50%);
}

/* Table Inverted */
.ui.table.green.inverted > thead,
.ui.table.green.inverted > tfoot {
  background: color-mix(in srgb, #28a745 50%, #c3e6cb 50%);
}

.ui.card.blue:not(.inverted),
.ui.message.blue:not(.inverted),
.ui.table.blue:not(.inverted),
.ui.table.blue:not(.inverted) > .table-pagination > button,
.ui.carousel.blue .arrow,
.ui.carousel.blue .indicator {
  background-color: #cce5ff;
}

/* Button */
.ui.button.blue:not(.outline):hover,
.ui.input.blue input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.blue input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.blue input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].blue:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].blue:not(.outline)::file-selector-button:hover,
.ui.form .input.blue input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.blue input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].blue:not(.outline)::file-selector-button:hover,
.ui.checkbox.blue > input[type=checkbox]:checked + .checkbox-box,
.ui.field.blue .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.blue > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.blue .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.blue > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.blue > .radio-circle::before,
.ui.field.blue .radio > .radio-circle::before,
.ui.field .radio.blue > .radio-circle::before,
.ui.form .field.blue .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.blue > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.blue > input[type=checkbox]:checked + .toggle-switch,
.ui.field.blue .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.blue > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.blue .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.blue > input[type=checkbox]:checked + .toggle-switch,
.ui.input.blue input[type=range]:hover,
.ui.field.blue input[type=range]:hover,
.ui.field .input.blue input[type=range]:hover,
.ui.input input[type=range].blue:hover,
.ui.field input[type=range].blue:hover,
.ui.form .field.blue input[type=range]:hover,
.ui.form .input.blue input[type=range]:hover,
.ui.form input[type=range].blue:hover,
.ui.input.spinner.blue:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.blue:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.blue.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.blue .content .tag:hover,
.ui.input.searchable.blue > .menu > .item:hover,
.ui.input.dropdown.blue.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.blue .content .tag:hover,
.ui.input.dropdown.blue > .menu > .item:hover,
.ui.input.datepicker.blue.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.blue .calendar .calendar-nav button:hover,
.ui.input.datepicker.blue .calendar .calendar-title:hover,
.ui.input.datepicker.blue .calendar .calendar-year:hover,
.ui.input.datepicker.blue .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.blue.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.blue.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.blue .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.blue .calendar .calendar-title:hover,
.ui.input.datetimepicker.blue .calendar .calendar-year:hover,
.ui.input.datetimepicker.blue .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.blue > .header > .tab:hover,
.ui.tabs.blue > .header > .tab.active,
.ui.tabs > .header > .tab.blue:hover,
.ui.tabs > .header > .tab.blue.active,
.ui.accordion.card.blue:not(.active) > .header:hover::after,
.ui.tabs.blue:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.blue.active):not(.simple) > .content,
.ui.table.blue .table-pagination > button:hover:not(:disabled),
.ui.carousel.blue .arrow:hover,
.ui.carousel.blue .indicator:hover,
.ui.loading.dots.blue > span,
.ui.tag.action.blue:hover {
  background-color: #b3d7ff;
}

/* Card */
.ui.card.blue.inverted,
.ui.message.blue.inverted,
.ui.table.blue.inverted,
.ui.divider.blue,
.ui.separator.blue,
.ui.button.blue:not(.outline),
.ui.button.blue.outline:hover,
.ui.input.blue input[type=file]:not(.outline)::file-selector-button,
.ui.field.blue input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].blue:not(.outline)::file-selector-button,
.ui.field input[type=file].blue:not(.outline)::file-selector-button,
.ui.form .field.blue input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.blue input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].blue:not(.outline)::file-selector-button:hover,
.ui.input.blue input[type=file].outline::file-selector-button:hover,
.ui.field.blue input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].blue.outline::file-selector-button:hover,
.ui.field input[type=file].blue.outline::file-selector-button:hover,
.ui.form .field.blue input[type=file].outline::file-selector-button:hover,
.ui.form .input.blue input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].blue.outline::file-selector-button:hover,
.ui.checkbox.blue:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.blue .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.blue:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.blue .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.blue:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.blue:hover > .radio-circle::before,
.ui.field.blue .radio:hover > .radio-circle::before,
.ui.field .radio.blue:hover > .radio-circle::before,
.ui.form .field.blue .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.blue:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.blue:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.blue .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.blue:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.blue .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.blue:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.blue input[type=range]:focus,
.ui.field.blue input[type=range]:focus,
.ui.input input[type=range].blue:focus,
.ui.field input[type=range].blue:focus,
.ui.form .field.blue input[type=range]:focus,
.ui.form .input.blue input[type=range]:focus,
.ui.form input[type=range].blue:focus,
.ui.input.spinner.blue.pressing-up::before,
.ui.input.spinner.blue.pressing-down::after,
.ui.input.searchable.blue.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.blue .content .tag:active,
.ui.input.searchable.blue > .menu > .item.highlighted,
.ui.input.searchable.blue > .menu > .item:active,
.ui.input.dropdown.blue.action-button.active.arrow::after,
.ui.input.dropdown.blue .content .tag:active,
.ui.input.dropdown.blue > .menu > .item.highlighted,
.ui.input.dropdown.blue > .menu > .item:active,
.ui.input.datepicker.blue .calendar .calendar-nav button:active,
.ui.input.datepicker.blue .calendar .calendar-title:active,
.ui.input.datepicker.blue .calendar .calendar-year:active,
.ui.input.datepicker.blue .calendar .calendar-year.selected,
.ui.input.datepicker.blue .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.blue .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.blue .calendar .calendar-nav button:active,
.ui.input.datetimepicker.blue .calendar .calendar-title:active,
.ui.input.datetimepicker.blue .calendar .calendar-year:active,
.ui.input.datetimepicker.blue .calendar .calendar-year.selected,
.ui.input.datetimepicker.blue .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.blue .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.blue.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.blue.action-button.active.arrow::after,
.ui.input.timepicker.blue.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.blue.action-button.active.arrow::after,
.ui.input.datetimepicker.blue.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.blue.action-button.active.arrow::after,
.ui.tabs.blue > .header > .tab:active,
.ui.tabs > .header > .tab.blue:active,
.ui.tabs.blue.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.blue.active:not(:active),
.ui.tabs > .header > .tab.blue.active.inverted:not(:active),
.ui.tabs.blue.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.blue.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.blue.active.inverted):not(.simple) > .content,
.ui.accordion.card.blue > .header:active::after,
.ui.accordion.card:not(.active).blue.active > .header::after,
.ui.table.blue .table-pagination > button:active:not(:disabled),
.ui.table.blue .table-pagination > button.active,
.ui.carousel.blue .arrow:active,
.ui.carousel.blue .arrow.active,
.ui.carousel.blue .indicator:active,
.ui.carousel.blue .indicator.active,
.ui.tooltip.blue,
.ui.tooltip.blue::after,
.ui.progress.blue .fill,
.ui.progress .fill.blue,
.ui.tag.action.blue:active {
  background-color: #007bff;
}

/* Card */
.ui.card.blue,
.ui.message.blue,
.ui.button.blue.outline,
.ui.input.blue input,
.ui.field.blue input,
.ui.field .input.blue input,
.ui.form .field.blue input,
.ui.form .input.blue input,
.ui.input input.blue,
.ui.field input.blue,
.ui.form input.blue,
.ui.input.blue textarea,
.ui.field.blue textarea,
.ui.field .input.blue textarea,
.ui.form .field.blue textarea,
.ui.form .input.blue textarea,
.ui.input textarea.blue,
.ui.field textarea.blue,
.ui.form textarea.blue,
.ui.input.blue input[type=file].outline::file-selector-button,
.ui.field.blue input[type=file].outline::file-selector-button,
.ui.field .input.blue input[type=file].outline::file-selector-button,
.ui.input input[type=file].blue.outline::file-selector-button,
.ui.field input[type=file].blue.outline::file-selector-button,
.ui.form input[type=file].blue.outline::file-selector-button,
.ui.radio.blue > .radio-circle,
.ui.field.blue .radio > .radio-circle,
.ui.field .radio.blue > .radio-circle,
.ui.checkbox.blue > .checkbox-box,
.ui.field.blue .checkbox > .checkbox-box,
.ui.field .checkbox.blue > .checkbox-box,
.ui.input.blue input[type=range]::-webkit-slider-thumb,
.ui.field.blue input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].blue::-webkit-slider-thumb,
.ui.field input[type=range].blue::-webkit-slider-thumb,
.ui.form .field.blue input[type=range]::-webkit-slider-thumb,
.ui.form .input.blue input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].blue::-webkit-slider-thumb,
.ui.input.searchable.blue,
.ui.input.searchable.blue .menu,
.ui.input.searchable.blue .content .tag,
.ui.input.dropdown.blue,
.ui.input.dropdown.blue .menu,
.ui.input.dropdown.blue .content .tag,
.ui.input.datepicker.blue .calendar,
.ui.input.datepicker.blue .calendar-day.today,
.ui.input.timepicker.blue .time-selector,
.ui.input.timepicker.blue .time-selector .time-wheel,
.ui.input.timepicker.blue .time-selector .time-wheel::before,
.ui.input.datetimepicker.blue .calendar,
.ui.input.datetimepicker.blue .time-selector,
.ui.input.datetimepicker.blue .calendar-day.today,
.ui.input.datetimepicker.blue .time-selector .time-wheel,
.ui.input.datetimepicker.blue .time-selector .time-wheel::before,
.ui.table.blue,
.ui.table.blue .table-pagination > button {
  border-color: #b3d7ff;
}

/* Button */
.ui.button.blue.outline:hover,
.ui.input.blue input:focus,
.ui.input input[type=file].blue:focus,
.ui.field.blue input:focus,
.ui.field input[type=file].blue:focus,
.ui.input.blue textarea:focus,
.ui.input textarea.blue:focus,
.ui.field.blue textarea:focus,
.ui.field textarea.blue:focus,
.ui.input.blue input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].blue.outline::file-selector-button:hover,
.ui.field.blue input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].blue.outline::file-selector-button:hover,
.ui.checkbox.blue:hover > .checkbox-box,
.ui.field.blue .checkbox:hover > .checkbox-box,
.ui.field .checkbox.blue:hover > .checkbox-box,
.ui.radio.blue:hover > .radio-circle,
.ui.field.blue .radio:hover > .radio-circle,
.ui.field .radio.blue:hover > .radio-circle,
.ui.input.blue input[type=range]::-webkit-slider-thumb:hover,
.ui.field.blue input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].blue::-webkit-slider-thumb:hover,
.ui.field input[type=range].blue::-webkit-slider-thumb:hover,
.ui.input.blue input[type=range]::-webkit-slider-thumb:active,
.ui.field.blue input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].blue::-webkit-slider-thumb:active,
.ui.field input[type=range].blue::-webkit-slider-thumb:active,
.ui.input.searchable.blue:focus,
.ui.input.searchable.blue.active,
.ui.input.dropdown.blue:focus,
.ui.input.dropdown.blue.active,
.ui.input.datepicker.blue.active > input,
.ui.input.timepicker.blue.active > input,
.ui.input.datetimepicker.blue.active > input,
.ui.tabs.blue > .header > .tab:hover,
.ui.tabs > .header > .tab.blue:hover,
.ui.tabs.blue > .header > .tab.active,
.ui.tabs > .header > .tab.blue.active,
.ui.tabs.blue:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.blue.active):not(.simple) > .content,
.ui.table.blue .table-pagination > button.active,
.ui.tag.blue {
  border-color: #007bff;
}

/* Loading Dots */
.ui.loading.circular.blue::before {
  border-top-color: #007bff;
}

/* Checkbox */
.ui.checkbox.blue > .checkbox-box i,
.ui.field.blue .checkbox > .checkbox-box i,
.ui.field .checkbox.blue > .checkbox-box i {
  color: #cce5ff;
}

/* Message */
.ui.message.blue:not(.inverted) > i,
.ui.button.blue.outline:not(:hover),
.ui.input.blue > i,
.ui.field.blue .input > i,
.ui.field .input.blue > i,
.ui.input.blue > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.blue input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.blue input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.blue input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.blue input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.blue:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.blue:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.blue.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.blue.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.blue.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.blue.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.blue .time-selector .time-wheel-item.selected,
.ui.input.timepicker.blue .time-selector .time-wheel-divider,
.ui.input.datetimepicker.blue.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.blue .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.blue .time-selector .time-wheel-divider,
.ui.tag.blue:not(.action),
.ui.tag.blue:not(:active) {
  color: #007bff;
}

/* Table */
.ui.table.blue:not(.inverted) > thead,
.ui.table.blue:not(.inverted) > tfoot {
  background: color-mix(in srgb, #cce5ff 50%, #b3d7ff 50%);
}

/* Table Inverted */
.ui.table.blue.inverted > thead,
.ui.table.blue.inverted > tfoot {
  background: color-mix(in srgb, #007bff 50%, #b3d7ff 50%);
}

.ui.card.yellow:not(.inverted),
.ui.message.yellow:not(.inverted),
.ui.table.yellow:not(.inverted),
.ui.table.yellow:not(.inverted) > .table-pagination > button,
.ui.carousel.yellow .arrow,
.ui.carousel.yellow .indicator {
  background-color: #fff3cd;
}

/* Button */
.ui.button.yellow:not(.outline):hover,
.ui.input.yellow input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.yellow input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.yellow input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].yellow:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].yellow:not(.outline)::file-selector-button:hover,
.ui.form .input.yellow input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.yellow input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].yellow:not(.outline)::file-selector-button:hover,
.ui.checkbox.yellow > input[type=checkbox]:checked + .checkbox-box,
.ui.field.yellow .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.yellow > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.yellow .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.yellow > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.yellow > .radio-circle::before,
.ui.field.yellow .radio > .radio-circle::before,
.ui.field .radio.yellow > .radio-circle::before,
.ui.form .field.yellow .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.yellow > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.yellow > input[type=checkbox]:checked + .toggle-switch,
.ui.field.yellow .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.yellow > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.yellow .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.yellow > input[type=checkbox]:checked + .toggle-switch,
.ui.input.yellow input[type=range]:hover,
.ui.field.yellow input[type=range]:hover,
.ui.field .input.yellow input[type=range]:hover,
.ui.input input[type=range].yellow:hover,
.ui.field input[type=range].yellow:hover,
.ui.form .field.yellow input[type=range]:hover,
.ui.form .input.yellow input[type=range]:hover,
.ui.form input[type=range].yellow:hover,
.ui.input.spinner.yellow:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.yellow:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.yellow.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.yellow .content .tag:hover,
.ui.input.searchable.yellow > .menu > .item:hover,
.ui.input.dropdown.yellow.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.yellow .content .tag:hover,
.ui.input.dropdown.yellow > .menu > .item:hover,
.ui.input.datepicker.yellow.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.yellow .calendar .calendar-nav button:hover,
.ui.input.datepicker.yellow .calendar .calendar-title:hover,
.ui.input.datepicker.yellow .calendar .calendar-year:hover,
.ui.input.datepicker.yellow .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.yellow.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.yellow.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.yellow .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.yellow .calendar .calendar-title:hover,
.ui.input.datetimepicker.yellow .calendar .calendar-year:hover,
.ui.input.datetimepicker.yellow .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.yellow > .header > .tab:hover,
.ui.tabs.yellow > .header > .tab.active,
.ui.tabs > .header > .tab.yellow:hover,
.ui.tabs > .header > .tab.yellow.active,
.ui.accordion.card.yellow:not(.active) > .header:hover::after,
.ui.tabs.yellow:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.yellow.active):not(.simple) > .content,
.ui.table.yellow .table-pagination > button:hover:not(:disabled),
.ui.carousel.yellow .arrow:hover,
.ui.carousel.yellow .indicator:hover,
.ui.loading.dots.yellow > span,
.ui.tag.action.yellow:hover {
  background-color: #ffe69c;
}

/* Card */
.ui.card.yellow.inverted,
.ui.message.yellow.inverted,
.ui.table.yellow.inverted,
.ui.divider.yellow,
.ui.separator.yellow,
.ui.button.yellow:not(.outline),
.ui.button.yellow.outline:hover,
.ui.input.yellow input[type=file]:not(.outline)::file-selector-button,
.ui.field.yellow input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].yellow:not(.outline)::file-selector-button,
.ui.field input[type=file].yellow:not(.outline)::file-selector-button,
.ui.form .field.yellow input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.yellow input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].yellow:not(.outline)::file-selector-button:hover,
.ui.input.yellow input[type=file].outline::file-selector-button:hover,
.ui.field.yellow input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].yellow.outline::file-selector-button:hover,
.ui.field input[type=file].yellow.outline::file-selector-button:hover,
.ui.form .field.yellow input[type=file].outline::file-selector-button:hover,
.ui.form .input.yellow input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].yellow.outline::file-selector-button:hover,
.ui.checkbox.yellow:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.yellow .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.yellow:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.yellow .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.yellow:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.yellow:hover > .radio-circle::before,
.ui.field.yellow .radio:hover > .radio-circle::before,
.ui.field .radio.yellow:hover > .radio-circle::before,
.ui.form .field.yellow .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.yellow:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.yellow:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.yellow .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.yellow:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.yellow .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.yellow:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.yellow input[type=range]:focus,
.ui.field.yellow input[type=range]:focus,
.ui.input input[type=range].yellow:focus,
.ui.field input[type=range].yellow:focus,
.ui.form .field.yellow input[type=range]:focus,
.ui.form .input.yellow input[type=range]:focus,
.ui.form input[type=range].yellow:focus,
.ui.input.spinner.yellow.pressing-up::before,
.ui.input.spinner.yellow.pressing-down::after,
.ui.input.searchable.yellow.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.yellow .content .tag:active,
.ui.input.searchable.yellow > .menu > .item.highlighted,
.ui.input.searchable.yellow > .menu > .item:active,
.ui.input.dropdown.yellow.action-button.active.arrow::after,
.ui.input.dropdown.yellow .content .tag:active,
.ui.input.dropdown.yellow > .menu > .item.highlighted,
.ui.input.dropdown.yellow > .menu > .item:active,
.ui.input.datepicker.yellow .calendar .calendar-nav button:active,
.ui.input.datepicker.yellow .calendar .calendar-title:active,
.ui.input.datepicker.yellow .calendar .calendar-year:active,
.ui.input.datepicker.yellow .calendar .calendar-year.selected,
.ui.input.datepicker.yellow .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.yellow .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.yellow .calendar .calendar-nav button:active,
.ui.input.datetimepicker.yellow .calendar .calendar-title:active,
.ui.input.datetimepicker.yellow .calendar .calendar-year:active,
.ui.input.datetimepicker.yellow .calendar .calendar-year.selected,
.ui.input.datetimepicker.yellow .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.yellow .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.yellow.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.yellow.action-button.active.arrow::after,
.ui.input.timepicker.yellow.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.yellow.action-button.active.arrow::after,
.ui.input.datetimepicker.yellow.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.yellow.action-button.active.arrow::after,
.ui.tabs.yellow > .header > .tab:active,
.ui.tabs > .header > .tab.yellow:active,
.ui.tabs.yellow.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.yellow.active:not(:active),
.ui.tabs > .header > .tab.yellow.active.inverted:not(:active),
.ui.tabs.yellow.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.yellow.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.yellow.active.inverted):not(.simple) > .content,
.ui.accordion.card.yellow > .header:active::after,
.ui.accordion.card:not(.active).yellow.active > .header::after,
.ui.table.yellow .table-pagination > button:active:not(:disabled),
.ui.table.yellow .table-pagination > button.active,
.ui.carousel.yellow .arrow:active,
.ui.carousel.yellow .arrow.active,
.ui.carousel.yellow .indicator:active,
.ui.carousel.yellow .indicator.active,
.ui.tooltip.yellow,
.ui.tooltip.yellow::after,
.ui.progress.yellow .fill,
.ui.progress .fill.yellow,
.ui.tag.action.yellow:active {
  background-color: #ffc107;
}

/* Card */
.ui.card.yellow,
.ui.message.yellow,
.ui.button.yellow.outline,
.ui.input.yellow input,
.ui.field.yellow input,
.ui.field .input.yellow input,
.ui.form .field.yellow input,
.ui.form .input.yellow input,
.ui.input input.yellow,
.ui.field input.yellow,
.ui.form input.yellow,
.ui.input.yellow textarea,
.ui.field.yellow textarea,
.ui.field .input.yellow textarea,
.ui.form .field.yellow textarea,
.ui.form .input.yellow textarea,
.ui.input textarea.yellow,
.ui.field textarea.yellow,
.ui.form textarea.yellow,
.ui.input.yellow input[type=file].outline::file-selector-button,
.ui.field.yellow input[type=file].outline::file-selector-button,
.ui.field .input.yellow input[type=file].outline::file-selector-button,
.ui.input input[type=file].yellow.outline::file-selector-button,
.ui.field input[type=file].yellow.outline::file-selector-button,
.ui.form input[type=file].yellow.outline::file-selector-button,
.ui.radio.yellow > .radio-circle,
.ui.field.yellow .radio > .radio-circle,
.ui.field .radio.yellow > .radio-circle,
.ui.checkbox.yellow > .checkbox-box,
.ui.field.yellow .checkbox > .checkbox-box,
.ui.field .checkbox.yellow > .checkbox-box,
.ui.input.yellow input[type=range]::-webkit-slider-thumb,
.ui.field.yellow input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].yellow::-webkit-slider-thumb,
.ui.field input[type=range].yellow::-webkit-slider-thumb,
.ui.form .field.yellow input[type=range]::-webkit-slider-thumb,
.ui.form .input.yellow input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].yellow::-webkit-slider-thumb,
.ui.input.searchable.yellow,
.ui.input.searchable.yellow .menu,
.ui.input.searchable.yellow .content .tag,
.ui.input.dropdown.yellow,
.ui.input.dropdown.yellow .menu,
.ui.input.dropdown.yellow .content .tag,
.ui.input.datepicker.yellow .calendar,
.ui.input.datepicker.yellow .calendar-day.today,
.ui.input.timepicker.yellow .time-selector,
.ui.input.timepicker.yellow .time-selector .time-wheel,
.ui.input.timepicker.yellow .time-selector .time-wheel::before,
.ui.input.datetimepicker.yellow .calendar,
.ui.input.datetimepicker.yellow .time-selector,
.ui.input.datetimepicker.yellow .calendar-day.today,
.ui.input.datetimepicker.yellow .time-selector .time-wheel,
.ui.input.datetimepicker.yellow .time-selector .time-wheel::before,
.ui.table.yellow,
.ui.table.yellow .table-pagination > button {
  border-color: #ffe69c;
}

/* Button */
.ui.button.yellow.outline:hover,
.ui.input.yellow input:focus,
.ui.input input[type=file].yellow:focus,
.ui.field.yellow input:focus,
.ui.field input[type=file].yellow:focus,
.ui.input.yellow textarea:focus,
.ui.input textarea.yellow:focus,
.ui.field.yellow textarea:focus,
.ui.field textarea.yellow:focus,
.ui.input.yellow input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].yellow.outline::file-selector-button:hover,
.ui.field.yellow input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].yellow.outline::file-selector-button:hover,
.ui.checkbox.yellow:hover > .checkbox-box,
.ui.field.yellow .checkbox:hover > .checkbox-box,
.ui.field .checkbox.yellow:hover > .checkbox-box,
.ui.radio.yellow:hover > .radio-circle,
.ui.field.yellow .radio:hover > .radio-circle,
.ui.field .radio.yellow:hover > .radio-circle,
.ui.input.yellow input[type=range]::-webkit-slider-thumb:hover,
.ui.field.yellow input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].yellow::-webkit-slider-thumb:hover,
.ui.field input[type=range].yellow::-webkit-slider-thumb:hover,
.ui.input.yellow input[type=range]::-webkit-slider-thumb:active,
.ui.field.yellow input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].yellow::-webkit-slider-thumb:active,
.ui.field input[type=range].yellow::-webkit-slider-thumb:active,
.ui.input.searchable.yellow:focus,
.ui.input.searchable.yellow.active,
.ui.input.dropdown.yellow:focus,
.ui.input.dropdown.yellow.active,
.ui.input.datepicker.yellow.active > input,
.ui.input.timepicker.yellow.active > input,
.ui.input.datetimepicker.yellow.active > input,
.ui.tabs.yellow > .header > .tab:hover,
.ui.tabs > .header > .tab.yellow:hover,
.ui.tabs.yellow > .header > .tab.active,
.ui.tabs > .header > .tab.yellow.active,
.ui.tabs.yellow:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.yellow.active):not(.simple) > .content,
.ui.table.yellow .table-pagination > button.active,
.ui.tag.yellow {
  border-color: #ffc107;
}

/* Loading Dots */
.ui.loading.circular.yellow::before {
  border-top-color: #ffc107;
}

/* Checkbox */
.ui.checkbox.yellow > .checkbox-box i,
.ui.field.yellow .checkbox > .checkbox-box i,
.ui.field .checkbox.yellow > .checkbox-box i {
  color: #fff3cd;
}

/* Message */
.ui.message.yellow:not(.inverted) > i,
.ui.button.yellow.outline:not(:hover),
.ui.input.yellow > i,
.ui.field.yellow .input > i,
.ui.field .input.yellow > i,
.ui.input.yellow > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.yellow input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.yellow input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.yellow input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.yellow input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.yellow:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.yellow:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.yellow.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.yellow.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.yellow.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.yellow.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.yellow .time-selector .time-wheel-item.selected,
.ui.input.timepicker.yellow .time-selector .time-wheel-divider,
.ui.input.datetimepicker.yellow.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.yellow .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.yellow .time-selector .time-wheel-divider,
.ui.tag.yellow:not(.action),
.ui.tag.yellow:not(:active) {
  color: #ffc107;
}

/* Table */
.ui.table.yellow:not(.inverted) > thead,
.ui.table.yellow:not(.inverted) > tfoot {
  background: color-mix(in srgb, #fff3cd 50%, #ffe69c 50%);
}

/* Table Inverted */
.ui.table.yellow.inverted > thead,
.ui.table.yellow.inverted > tfoot {
  background: color-mix(in srgb, #ffc107 50%, #ffe69c 50%);
}

.ui.card.orange:not(.inverted),
.ui.message.orange:not(.inverted),
.ui.table.orange:not(.inverted),
.ui.table.orange:not(.inverted) > .table-pagination > button,
.ui.carousel.orange .arrow,
.ui.carousel.orange .indicator {
  background-color: #ffe5cc;
}

/* Button */
.ui.button.orange:not(.outline):hover,
.ui.input.orange input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.orange input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.orange input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].orange:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].orange:not(.outline)::file-selector-button:hover,
.ui.form .input.orange input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.orange input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].orange:not(.outline)::file-selector-button:hover,
.ui.checkbox.orange > input[type=checkbox]:checked + .checkbox-box,
.ui.field.orange .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.orange > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.orange .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.orange > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.orange > .radio-circle::before,
.ui.field.orange .radio > .radio-circle::before,
.ui.field .radio.orange > .radio-circle::before,
.ui.form .field.orange .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.orange > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.orange > input[type=checkbox]:checked + .toggle-switch,
.ui.field.orange .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.orange > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.orange .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.orange > input[type=checkbox]:checked + .toggle-switch,
.ui.input.orange input[type=range]:hover,
.ui.field.orange input[type=range]:hover,
.ui.field .input.orange input[type=range]:hover,
.ui.input input[type=range].orange:hover,
.ui.field input[type=range].orange:hover,
.ui.form .field.orange input[type=range]:hover,
.ui.form .input.orange input[type=range]:hover,
.ui.form input[type=range].orange:hover,
.ui.input.spinner.orange:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.orange:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.orange.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.orange .content .tag:hover,
.ui.input.searchable.orange > .menu > .item:hover,
.ui.input.dropdown.orange.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.orange .content .tag:hover,
.ui.input.dropdown.orange > .menu > .item:hover,
.ui.input.datepicker.orange.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.orange .calendar .calendar-nav button:hover,
.ui.input.datepicker.orange .calendar .calendar-title:hover,
.ui.input.datepicker.orange .calendar .calendar-year:hover,
.ui.input.datepicker.orange .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.orange.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.orange.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.orange .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.orange .calendar .calendar-title:hover,
.ui.input.datetimepicker.orange .calendar .calendar-year:hover,
.ui.input.datetimepicker.orange .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.orange > .header > .tab:hover,
.ui.tabs.orange > .header > .tab.active,
.ui.tabs > .header > .tab.orange:hover,
.ui.tabs > .header > .tab.orange.active,
.ui.accordion.card.orange:not(.active) > .header:hover::after,
.ui.tabs.orange:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.orange.active):not(.simple) > .content,
.ui.table.orange .table-pagination > button:hover:not(:disabled),
.ui.carousel.orange .arrow:hover,
.ui.carousel.orange .indicator:hover,
.ui.loading.dots.orange > span,
.ui.tag.action.orange:hover {
  background-color: #ffd4a3;
}

/* Card */
.ui.card.orange.inverted,
.ui.message.orange.inverted,
.ui.table.orange.inverted,
.ui.divider.orange,
.ui.separator.orange,
.ui.button.orange:not(.outline),
.ui.button.orange.outline:hover,
.ui.input.orange input[type=file]:not(.outline)::file-selector-button,
.ui.field.orange input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].orange:not(.outline)::file-selector-button,
.ui.field input[type=file].orange:not(.outline)::file-selector-button,
.ui.form .field.orange input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.orange input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].orange:not(.outline)::file-selector-button:hover,
.ui.input.orange input[type=file].outline::file-selector-button:hover,
.ui.field.orange input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].orange.outline::file-selector-button:hover,
.ui.field input[type=file].orange.outline::file-selector-button:hover,
.ui.form .field.orange input[type=file].outline::file-selector-button:hover,
.ui.form .input.orange input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].orange.outline::file-selector-button:hover,
.ui.checkbox.orange:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.orange .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.orange:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.orange .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.orange:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.orange:hover > .radio-circle::before,
.ui.field.orange .radio:hover > .radio-circle::before,
.ui.field .radio.orange:hover > .radio-circle::before,
.ui.form .field.orange .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.orange:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.orange:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.orange .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.orange:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.orange .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.orange:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.orange input[type=range]:focus,
.ui.field.orange input[type=range]:focus,
.ui.input input[type=range].orange:focus,
.ui.field input[type=range].orange:focus,
.ui.form .field.orange input[type=range]:focus,
.ui.form .input.orange input[type=range]:focus,
.ui.form input[type=range].orange:focus,
.ui.input.spinner.orange.pressing-up::before,
.ui.input.spinner.orange.pressing-down::after,
.ui.input.searchable.orange.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.orange .content .tag:active,
.ui.input.searchable.orange > .menu > .item.highlighted,
.ui.input.searchable.orange > .menu > .item:active,
.ui.input.dropdown.orange.action-button.active.arrow::after,
.ui.input.dropdown.orange .content .tag:active,
.ui.input.dropdown.orange > .menu > .item.highlighted,
.ui.input.dropdown.orange > .menu > .item:active,
.ui.input.datepicker.orange .calendar .calendar-nav button:active,
.ui.input.datepicker.orange .calendar .calendar-title:active,
.ui.input.datepicker.orange .calendar .calendar-year:active,
.ui.input.datepicker.orange .calendar .calendar-year.selected,
.ui.input.datepicker.orange .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.orange .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.orange .calendar .calendar-nav button:active,
.ui.input.datetimepicker.orange .calendar .calendar-title:active,
.ui.input.datetimepicker.orange .calendar .calendar-year:active,
.ui.input.datetimepicker.orange .calendar .calendar-year.selected,
.ui.input.datetimepicker.orange .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.orange .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.orange.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.orange.action-button.active.arrow::after,
.ui.input.timepicker.orange.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.orange.action-button.active.arrow::after,
.ui.input.datetimepicker.orange.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.orange.action-button.active.arrow::after,
.ui.tabs.orange > .header > .tab:active,
.ui.tabs > .header > .tab.orange:active,
.ui.tabs.orange.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.orange.active:not(:active),
.ui.tabs > .header > .tab.orange.active.inverted:not(:active),
.ui.tabs.orange.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.orange.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.orange.active.inverted):not(.simple) > .content,
.ui.accordion.card.orange > .header:active::after,
.ui.accordion.card:not(.active).orange.active > .header::after,
.ui.table.orange .table-pagination > button:active:not(:disabled),
.ui.table.orange .table-pagination > button.active,
.ui.carousel.orange .arrow:active,
.ui.carousel.orange .arrow.active,
.ui.carousel.orange .indicator:active,
.ui.carousel.orange .indicator.active,
.ui.tooltip.orange,
.ui.tooltip.orange::after,
.ui.progress.orange .fill,
.ui.progress .fill.orange,
.ui.tag.action.orange:active {
  background-color: #fd7e14;
}

/* Card */
.ui.card.orange,
.ui.message.orange,
.ui.button.orange.outline,
.ui.input.orange input,
.ui.field.orange input,
.ui.field .input.orange input,
.ui.form .field.orange input,
.ui.form .input.orange input,
.ui.input input.orange,
.ui.field input.orange,
.ui.form input.orange,
.ui.input.orange textarea,
.ui.field.orange textarea,
.ui.field .input.orange textarea,
.ui.form .field.orange textarea,
.ui.form .input.orange textarea,
.ui.input textarea.orange,
.ui.field textarea.orange,
.ui.form textarea.orange,
.ui.input.orange input[type=file].outline::file-selector-button,
.ui.field.orange input[type=file].outline::file-selector-button,
.ui.field .input.orange input[type=file].outline::file-selector-button,
.ui.input input[type=file].orange.outline::file-selector-button,
.ui.field input[type=file].orange.outline::file-selector-button,
.ui.form input[type=file].orange.outline::file-selector-button,
.ui.radio.orange > .radio-circle,
.ui.field.orange .radio > .radio-circle,
.ui.field .radio.orange > .radio-circle,
.ui.checkbox.orange > .checkbox-box,
.ui.field.orange .checkbox > .checkbox-box,
.ui.field .checkbox.orange > .checkbox-box,
.ui.input.orange input[type=range]::-webkit-slider-thumb,
.ui.field.orange input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].orange::-webkit-slider-thumb,
.ui.field input[type=range].orange::-webkit-slider-thumb,
.ui.form .field.orange input[type=range]::-webkit-slider-thumb,
.ui.form .input.orange input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].orange::-webkit-slider-thumb,
.ui.input.searchable.orange,
.ui.input.searchable.orange .menu,
.ui.input.searchable.orange .content .tag,
.ui.input.dropdown.orange,
.ui.input.dropdown.orange .menu,
.ui.input.dropdown.orange .content .tag,
.ui.input.datepicker.orange .calendar,
.ui.input.datepicker.orange .calendar-day.today,
.ui.input.timepicker.orange .time-selector,
.ui.input.timepicker.orange .time-selector .time-wheel,
.ui.input.timepicker.orange .time-selector .time-wheel::before,
.ui.input.datetimepicker.orange .calendar,
.ui.input.datetimepicker.orange .time-selector,
.ui.input.datetimepicker.orange .calendar-day.today,
.ui.input.datetimepicker.orange .time-selector .time-wheel,
.ui.input.datetimepicker.orange .time-selector .time-wheel::before,
.ui.table.orange,
.ui.table.orange .table-pagination > button {
  border-color: #ffd4a3;
}

/* Button */
.ui.button.orange.outline:hover,
.ui.input.orange input:focus,
.ui.input input[type=file].orange:focus,
.ui.field.orange input:focus,
.ui.field input[type=file].orange:focus,
.ui.input.orange textarea:focus,
.ui.input textarea.orange:focus,
.ui.field.orange textarea:focus,
.ui.field textarea.orange:focus,
.ui.input.orange input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].orange.outline::file-selector-button:hover,
.ui.field.orange input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].orange.outline::file-selector-button:hover,
.ui.checkbox.orange:hover > .checkbox-box,
.ui.field.orange .checkbox:hover > .checkbox-box,
.ui.field .checkbox.orange:hover > .checkbox-box,
.ui.radio.orange:hover > .radio-circle,
.ui.field.orange .radio:hover > .radio-circle,
.ui.field .radio.orange:hover > .radio-circle,
.ui.input.orange input[type=range]::-webkit-slider-thumb:hover,
.ui.field.orange input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].orange::-webkit-slider-thumb:hover,
.ui.field input[type=range].orange::-webkit-slider-thumb:hover,
.ui.input.orange input[type=range]::-webkit-slider-thumb:active,
.ui.field.orange input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].orange::-webkit-slider-thumb:active,
.ui.field input[type=range].orange::-webkit-slider-thumb:active,
.ui.input.searchable.orange:focus,
.ui.input.searchable.orange.active,
.ui.input.dropdown.orange:focus,
.ui.input.dropdown.orange.active,
.ui.input.datepicker.orange.active > input,
.ui.input.timepicker.orange.active > input,
.ui.input.datetimepicker.orange.active > input,
.ui.tabs.orange > .header > .tab:hover,
.ui.tabs > .header > .tab.orange:hover,
.ui.tabs.orange > .header > .tab.active,
.ui.tabs > .header > .tab.orange.active,
.ui.tabs.orange:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.orange.active):not(.simple) > .content,
.ui.table.orange .table-pagination > button.active,
.ui.tag.orange {
  border-color: #fd7e14;
}

/* Loading Dots */
.ui.loading.circular.orange::before {
  border-top-color: #fd7e14;
}

/* Checkbox */
.ui.checkbox.orange > .checkbox-box i,
.ui.field.orange .checkbox > .checkbox-box i,
.ui.field .checkbox.orange > .checkbox-box i {
  color: #ffe5cc;
}

/* Message */
.ui.message.orange:not(.inverted) > i,
.ui.button.orange.outline:not(:hover),
.ui.input.orange > i,
.ui.field.orange .input > i,
.ui.field .input.orange > i,
.ui.input.orange > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.orange input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.orange input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.orange input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.orange input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.orange:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.orange:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.orange.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.orange.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.orange.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.orange.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.orange .time-selector .time-wheel-item.selected,
.ui.input.timepicker.orange .time-selector .time-wheel-divider,
.ui.input.datetimepicker.orange.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.orange .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.orange .time-selector .time-wheel-divider,
.ui.tag.orange:not(.action),
.ui.tag.orange:not(:active) {
  color: #fd7e14;
}

/* Table */
.ui.table.orange:not(.inverted) > thead,
.ui.table.orange:not(.inverted) > tfoot {
  background: color-mix(in srgb, #ffe5cc 50%, #ffd4a3 50%);
}

/* Table Inverted */
.ui.table.orange.inverted > thead,
.ui.table.orange.inverted > tfoot {
  background: color-mix(in srgb, #fd7e14 50%, #ffd4a3 50%);
}

.ui.card.purple:not(.inverted),
.ui.message.purple:not(.inverted),
.ui.table.purple:not(.inverted),
.ui.table.purple:not(.inverted) > .table-pagination > button,
.ui.carousel.purple .arrow,
.ui.carousel.purple .indicator {
  background-color: #e2d5f3;
}

/* Button */
.ui.button.purple:not(.outline):hover,
.ui.input.purple input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.purple input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.purple input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].purple:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].purple:not(.outline)::file-selector-button:hover,
.ui.form .input.purple input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.purple input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].purple:not(.outline)::file-selector-button:hover,
.ui.checkbox.purple > input[type=checkbox]:checked + .checkbox-box,
.ui.field.purple .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.purple > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.purple .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.purple > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.purple > .radio-circle::before,
.ui.field.purple .radio > .radio-circle::before,
.ui.field .radio.purple > .radio-circle::before,
.ui.form .field.purple .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.purple > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.purple > input[type=checkbox]:checked + .toggle-switch,
.ui.field.purple .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.purple > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.purple .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.purple > input[type=checkbox]:checked + .toggle-switch,
.ui.input.purple input[type=range]:hover,
.ui.field.purple input[type=range]:hover,
.ui.field .input.purple input[type=range]:hover,
.ui.input input[type=range].purple:hover,
.ui.field input[type=range].purple:hover,
.ui.form .field.purple input[type=range]:hover,
.ui.form .input.purple input[type=range]:hover,
.ui.form input[type=range].purple:hover,
.ui.input.spinner.purple:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.purple:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.purple.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.purple .content .tag:hover,
.ui.input.searchable.purple > .menu > .item:hover,
.ui.input.dropdown.purple.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.purple .content .tag:hover,
.ui.input.dropdown.purple > .menu > .item:hover,
.ui.input.datepicker.purple.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.purple .calendar .calendar-nav button:hover,
.ui.input.datepicker.purple .calendar .calendar-title:hover,
.ui.input.datepicker.purple .calendar .calendar-year:hover,
.ui.input.datepicker.purple .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.purple.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.purple.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.purple .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.purple .calendar .calendar-title:hover,
.ui.input.datetimepicker.purple .calendar .calendar-year:hover,
.ui.input.datetimepicker.purple .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.purple > .header > .tab:hover,
.ui.tabs.purple > .header > .tab.active,
.ui.tabs > .header > .tab.purple:hover,
.ui.tabs > .header > .tab.purple.active,
.ui.accordion.card.purple:not(.active) > .header:hover::after,
.ui.tabs.purple:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.purple.active):not(.simple) > .content,
.ui.table.purple .table-pagination > button:hover:not(:disabled),
.ui.carousel.purple .arrow:hover,
.ui.carousel.purple .indicator:hover,
.ui.loading.dots.purple > span,
.ui.tag.action.purple:hover {
  background-color: #c5a3e8;
}

/* Card */
.ui.card.purple.inverted,
.ui.message.purple.inverted,
.ui.table.purple.inverted,
.ui.divider.purple,
.ui.separator.purple,
.ui.button.purple:not(.outline),
.ui.button.purple.outline:hover,
.ui.input.purple input[type=file]:not(.outline)::file-selector-button,
.ui.field.purple input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].purple:not(.outline)::file-selector-button,
.ui.field input[type=file].purple:not(.outline)::file-selector-button,
.ui.form .field.purple input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.purple input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].purple:not(.outline)::file-selector-button:hover,
.ui.input.purple input[type=file].outline::file-selector-button:hover,
.ui.field.purple input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].purple.outline::file-selector-button:hover,
.ui.field input[type=file].purple.outline::file-selector-button:hover,
.ui.form .field.purple input[type=file].outline::file-selector-button:hover,
.ui.form .input.purple input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].purple.outline::file-selector-button:hover,
.ui.checkbox.purple:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.purple .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.purple:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.purple .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.purple:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.purple:hover > .radio-circle::before,
.ui.field.purple .radio:hover > .radio-circle::before,
.ui.field .radio.purple:hover > .radio-circle::before,
.ui.form .field.purple .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.purple:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.purple:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.purple .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.purple:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.purple .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.purple:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.purple input[type=range]:focus,
.ui.field.purple input[type=range]:focus,
.ui.input input[type=range].purple:focus,
.ui.field input[type=range].purple:focus,
.ui.form .field.purple input[type=range]:focus,
.ui.form .input.purple input[type=range]:focus,
.ui.form input[type=range].purple:focus,
.ui.input.spinner.purple.pressing-up::before,
.ui.input.spinner.purple.pressing-down::after,
.ui.input.searchable.purple.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.purple .content .tag:active,
.ui.input.searchable.purple > .menu > .item.highlighted,
.ui.input.searchable.purple > .menu > .item:active,
.ui.input.dropdown.purple.action-button.active.arrow::after,
.ui.input.dropdown.purple .content .tag:active,
.ui.input.dropdown.purple > .menu > .item.highlighted,
.ui.input.dropdown.purple > .menu > .item:active,
.ui.input.datepicker.purple .calendar .calendar-nav button:active,
.ui.input.datepicker.purple .calendar .calendar-title:active,
.ui.input.datepicker.purple .calendar .calendar-year:active,
.ui.input.datepicker.purple .calendar .calendar-year.selected,
.ui.input.datepicker.purple .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.purple .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.purple .calendar .calendar-nav button:active,
.ui.input.datetimepicker.purple .calendar .calendar-title:active,
.ui.input.datetimepicker.purple .calendar .calendar-year:active,
.ui.input.datetimepicker.purple .calendar .calendar-year.selected,
.ui.input.datetimepicker.purple .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.purple .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.purple.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.purple.action-button.active.arrow::after,
.ui.input.timepicker.purple.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.purple.action-button.active.arrow::after,
.ui.input.datetimepicker.purple.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.purple.action-button.active.arrow::after,
.ui.tabs.purple > .header > .tab:active,
.ui.tabs > .header > .tab.purple:active,
.ui.tabs.purple.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.purple.active:not(:active),
.ui.tabs > .header > .tab.purple.active.inverted:not(:active),
.ui.tabs.purple.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.purple.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.purple.active.inverted):not(.simple) > .content,
.ui.accordion.card.purple > .header:active::after,
.ui.accordion.card:not(.active).purple.active > .header::after,
.ui.table.purple .table-pagination > button:active:not(:disabled),
.ui.table.purple .table-pagination > button.active,
.ui.carousel.purple .arrow:active,
.ui.carousel.purple .arrow.active,
.ui.carousel.purple .indicator:active,
.ui.carousel.purple .indicator.active,
.ui.tooltip.purple,
.ui.tooltip.purple::after,
.ui.progress.purple .fill,
.ui.progress .fill.purple,
.ui.tag.action.purple:active {
  background-color: #6f42c1;
}

/* Card */
.ui.card.purple,
.ui.message.purple,
.ui.button.purple.outline,
.ui.input.purple input,
.ui.field.purple input,
.ui.field .input.purple input,
.ui.form .field.purple input,
.ui.form .input.purple input,
.ui.input input.purple,
.ui.field input.purple,
.ui.form input.purple,
.ui.input.purple textarea,
.ui.field.purple textarea,
.ui.field .input.purple textarea,
.ui.form .field.purple textarea,
.ui.form .input.purple textarea,
.ui.input textarea.purple,
.ui.field textarea.purple,
.ui.form textarea.purple,
.ui.input.purple input[type=file].outline::file-selector-button,
.ui.field.purple input[type=file].outline::file-selector-button,
.ui.field .input.purple input[type=file].outline::file-selector-button,
.ui.input input[type=file].purple.outline::file-selector-button,
.ui.field input[type=file].purple.outline::file-selector-button,
.ui.form input[type=file].purple.outline::file-selector-button,
.ui.radio.purple > .radio-circle,
.ui.field.purple .radio > .radio-circle,
.ui.field .radio.purple > .radio-circle,
.ui.checkbox.purple > .checkbox-box,
.ui.field.purple .checkbox > .checkbox-box,
.ui.field .checkbox.purple > .checkbox-box,
.ui.input.purple input[type=range]::-webkit-slider-thumb,
.ui.field.purple input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].purple::-webkit-slider-thumb,
.ui.field input[type=range].purple::-webkit-slider-thumb,
.ui.form .field.purple input[type=range]::-webkit-slider-thumb,
.ui.form .input.purple input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].purple::-webkit-slider-thumb,
.ui.input.searchable.purple,
.ui.input.searchable.purple .menu,
.ui.input.searchable.purple .content .tag,
.ui.input.dropdown.purple,
.ui.input.dropdown.purple .menu,
.ui.input.dropdown.purple .content .tag,
.ui.input.datepicker.purple .calendar,
.ui.input.datepicker.purple .calendar-day.today,
.ui.input.timepicker.purple .time-selector,
.ui.input.timepicker.purple .time-selector .time-wheel,
.ui.input.timepicker.purple .time-selector .time-wheel::before,
.ui.input.datetimepicker.purple .calendar,
.ui.input.datetimepicker.purple .time-selector,
.ui.input.datetimepicker.purple .calendar-day.today,
.ui.input.datetimepicker.purple .time-selector .time-wheel,
.ui.input.datetimepicker.purple .time-selector .time-wheel::before,
.ui.table.purple,
.ui.table.purple .table-pagination > button {
  border-color: #c5a3e8;
}

/* Button */
.ui.button.purple.outline:hover,
.ui.input.purple input:focus,
.ui.input input[type=file].purple:focus,
.ui.field.purple input:focus,
.ui.field input[type=file].purple:focus,
.ui.input.purple textarea:focus,
.ui.input textarea.purple:focus,
.ui.field.purple textarea:focus,
.ui.field textarea.purple:focus,
.ui.input.purple input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].purple.outline::file-selector-button:hover,
.ui.field.purple input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].purple.outline::file-selector-button:hover,
.ui.checkbox.purple:hover > .checkbox-box,
.ui.field.purple .checkbox:hover > .checkbox-box,
.ui.field .checkbox.purple:hover > .checkbox-box,
.ui.radio.purple:hover > .radio-circle,
.ui.field.purple .radio:hover > .radio-circle,
.ui.field .radio.purple:hover > .radio-circle,
.ui.input.purple input[type=range]::-webkit-slider-thumb:hover,
.ui.field.purple input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].purple::-webkit-slider-thumb:hover,
.ui.field input[type=range].purple::-webkit-slider-thumb:hover,
.ui.input.purple input[type=range]::-webkit-slider-thumb:active,
.ui.field.purple input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].purple::-webkit-slider-thumb:active,
.ui.field input[type=range].purple::-webkit-slider-thumb:active,
.ui.input.searchable.purple:focus,
.ui.input.searchable.purple.active,
.ui.input.dropdown.purple:focus,
.ui.input.dropdown.purple.active,
.ui.input.datepicker.purple.active > input,
.ui.input.timepicker.purple.active > input,
.ui.input.datetimepicker.purple.active > input,
.ui.tabs.purple > .header > .tab:hover,
.ui.tabs > .header > .tab.purple:hover,
.ui.tabs.purple > .header > .tab.active,
.ui.tabs > .header > .tab.purple.active,
.ui.tabs.purple:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.purple.active):not(.simple) > .content,
.ui.table.purple .table-pagination > button.active,
.ui.tag.purple {
  border-color: #6f42c1;
}

/* Loading Dots */
.ui.loading.circular.purple::before {
  border-top-color: #6f42c1;
}

/* Checkbox */
.ui.checkbox.purple > .checkbox-box i,
.ui.field.purple .checkbox > .checkbox-box i,
.ui.field .checkbox.purple > .checkbox-box i {
  color: #e2d5f3;
}

/* Message */
.ui.message.purple:not(.inverted) > i,
.ui.button.purple.outline:not(:hover),
.ui.input.purple > i,
.ui.field.purple .input > i,
.ui.field .input.purple > i,
.ui.input.purple > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.purple input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.purple input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.purple input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.purple input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.purple:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.purple:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.purple.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.purple.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.purple.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.purple.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.purple .time-selector .time-wheel-item.selected,
.ui.input.timepicker.purple .time-selector .time-wheel-divider,
.ui.input.datetimepicker.purple.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.purple .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.purple .time-selector .time-wheel-divider,
.ui.tag.purple:not(.action),
.ui.tag.purple:not(:active) {
  color: #6f42c1;
}

/* Table */
.ui.table.purple:not(.inverted) > thead,
.ui.table.purple:not(.inverted) > tfoot {
  background: color-mix(in srgb, #e2d5f3 50%, #c5a3e8 50%);
}

/* Table Inverted */
.ui.table.purple.inverted > thead,
.ui.table.purple.inverted > tfoot {
  background: color-mix(in srgb, #6f42c1 50%, #c5a3e8 50%);
}

.ui.card.pink:not(.inverted),
.ui.message.pink:not(.inverted),
.ui.table.pink:not(.inverted),
.ui.table.pink:not(.inverted) > .table-pagination > button,
.ui.carousel.pink .arrow,
.ui.carousel.pink .indicator {
  background-color: #f8d0e3;
}

/* Button */
.ui.button.pink:not(.outline):hover,
.ui.input.pink input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.pink input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.pink input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].pink:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].pink:not(.outline)::file-selector-button:hover,
.ui.form .input.pink input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.pink input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].pink:not(.outline)::file-selector-button:hover,
.ui.checkbox.pink > input[type=checkbox]:checked + .checkbox-box,
.ui.field.pink .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.pink > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.pink .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.pink > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.pink > .radio-circle::before,
.ui.field.pink .radio > .radio-circle::before,
.ui.field .radio.pink > .radio-circle::before,
.ui.form .field.pink .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.pink > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.pink > input[type=checkbox]:checked + .toggle-switch,
.ui.field.pink .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.pink > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.pink .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.pink > input[type=checkbox]:checked + .toggle-switch,
.ui.input.pink input[type=range]:hover,
.ui.field.pink input[type=range]:hover,
.ui.field .input.pink input[type=range]:hover,
.ui.input input[type=range].pink:hover,
.ui.field input[type=range].pink:hover,
.ui.form .field.pink input[type=range]:hover,
.ui.form .input.pink input[type=range]:hover,
.ui.form input[type=range].pink:hover,
.ui.input.spinner.pink:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.pink:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.pink.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.pink .content .tag:hover,
.ui.input.searchable.pink > .menu > .item:hover,
.ui.input.dropdown.pink.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.pink .content .tag:hover,
.ui.input.dropdown.pink > .menu > .item:hover,
.ui.input.datepicker.pink.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.pink .calendar .calendar-nav button:hover,
.ui.input.datepicker.pink .calendar .calendar-title:hover,
.ui.input.datepicker.pink .calendar .calendar-year:hover,
.ui.input.datepicker.pink .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.pink.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.pink.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.pink .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.pink .calendar .calendar-title:hover,
.ui.input.datetimepicker.pink .calendar .calendar-year:hover,
.ui.input.datetimepicker.pink .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.pink > .header > .tab:hover,
.ui.tabs.pink > .header > .tab.active,
.ui.tabs > .header > .tab.pink:hover,
.ui.tabs > .header > .tab.pink.active,
.ui.accordion.card.pink:not(.active) > .header:hover::after,
.ui.tabs.pink:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.pink.active):not(.simple) > .content,
.ui.table.pink .table-pagination > button:hover:not(:disabled),
.ui.carousel.pink .arrow:hover,
.ui.carousel.pink .indicator:hover,
.ui.loading.dots.pink > span,
.ui.tag.action.pink:hover {
  background-color: #f5b3d1;
}

/* Card */
.ui.card.pink.inverted,
.ui.message.pink.inverted,
.ui.table.pink.inverted,
.ui.divider.pink,
.ui.separator.pink,
.ui.button.pink:not(.outline),
.ui.button.pink.outline:hover,
.ui.input.pink input[type=file]:not(.outline)::file-selector-button,
.ui.field.pink input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].pink:not(.outline)::file-selector-button,
.ui.field input[type=file].pink:not(.outline)::file-selector-button,
.ui.form .field.pink input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.pink input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].pink:not(.outline)::file-selector-button:hover,
.ui.input.pink input[type=file].outline::file-selector-button:hover,
.ui.field.pink input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].pink.outline::file-selector-button:hover,
.ui.field input[type=file].pink.outline::file-selector-button:hover,
.ui.form .field.pink input[type=file].outline::file-selector-button:hover,
.ui.form .input.pink input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].pink.outline::file-selector-button:hover,
.ui.checkbox.pink:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.pink .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.pink:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.pink .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.pink:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.pink:hover > .radio-circle::before,
.ui.field.pink .radio:hover > .radio-circle::before,
.ui.field .radio.pink:hover > .radio-circle::before,
.ui.form .field.pink .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.pink:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.pink:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.pink .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.pink:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.pink .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.pink:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.pink input[type=range]:focus,
.ui.field.pink input[type=range]:focus,
.ui.input input[type=range].pink:focus,
.ui.field input[type=range].pink:focus,
.ui.form .field.pink input[type=range]:focus,
.ui.form .input.pink input[type=range]:focus,
.ui.form input[type=range].pink:focus,
.ui.input.spinner.pink.pressing-up::before,
.ui.input.spinner.pink.pressing-down::after,
.ui.input.searchable.pink.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.pink .content .tag:active,
.ui.input.searchable.pink > .menu > .item.highlighted,
.ui.input.searchable.pink > .menu > .item:active,
.ui.input.dropdown.pink.action-button.active.arrow::after,
.ui.input.dropdown.pink .content .tag:active,
.ui.input.dropdown.pink > .menu > .item.highlighted,
.ui.input.dropdown.pink > .menu > .item:active,
.ui.input.datepicker.pink .calendar .calendar-nav button:active,
.ui.input.datepicker.pink .calendar .calendar-title:active,
.ui.input.datepicker.pink .calendar .calendar-year:active,
.ui.input.datepicker.pink .calendar .calendar-year.selected,
.ui.input.datepicker.pink .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.pink .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.pink .calendar .calendar-nav button:active,
.ui.input.datetimepicker.pink .calendar .calendar-title:active,
.ui.input.datetimepicker.pink .calendar .calendar-year:active,
.ui.input.datetimepicker.pink .calendar .calendar-year.selected,
.ui.input.datetimepicker.pink .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.pink .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.pink.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.pink.action-button.active.arrow::after,
.ui.input.timepicker.pink.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.pink.action-button.active.arrow::after,
.ui.input.datetimepicker.pink.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.pink.action-button.active.arrow::after,
.ui.tabs.pink > .header > .tab:active,
.ui.tabs > .header > .tab.pink:active,
.ui.tabs.pink.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.pink.active:not(:active),
.ui.tabs > .header > .tab.pink.active.inverted:not(:active),
.ui.tabs.pink.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.pink.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.pink.active.inverted):not(.simple) > .content,
.ui.accordion.card.pink > .header:active::after,
.ui.accordion.card:not(.active).pink.active > .header::after,
.ui.table.pink .table-pagination > button:active:not(:disabled),
.ui.table.pink .table-pagination > button.active,
.ui.carousel.pink .arrow:active,
.ui.carousel.pink .arrow.active,
.ui.carousel.pink .indicator:active,
.ui.carousel.pink .indicator.active,
.ui.tooltip.pink,
.ui.tooltip.pink::after,
.ui.progress.pink .fill,
.ui.progress .fill.pink,
.ui.tag.action.pink:active {
  background-color: #e83e8c;
}

/* Card */
.ui.card.pink,
.ui.message.pink,
.ui.button.pink.outline,
.ui.input.pink input,
.ui.field.pink input,
.ui.field .input.pink input,
.ui.form .field.pink input,
.ui.form .input.pink input,
.ui.input input.pink,
.ui.field input.pink,
.ui.form input.pink,
.ui.input.pink textarea,
.ui.field.pink textarea,
.ui.field .input.pink textarea,
.ui.form .field.pink textarea,
.ui.form .input.pink textarea,
.ui.input textarea.pink,
.ui.field textarea.pink,
.ui.form textarea.pink,
.ui.input.pink input[type=file].outline::file-selector-button,
.ui.field.pink input[type=file].outline::file-selector-button,
.ui.field .input.pink input[type=file].outline::file-selector-button,
.ui.input input[type=file].pink.outline::file-selector-button,
.ui.field input[type=file].pink.outline::file-selector-button,
.ui.form input[type=file].pink.outline::file-selector-button,
.ui.radio.pink > .radio-circle,
.ui.field.pink .radio > .radio-circle,
.ui.field .radio.pink > .radio-circle,
.ui.checkbox.pink > .checkbox-box,
.ui.field.pink .checkbox > .checkbox-box,
.ui.field .checkbox.pink > .checkbox-box,
.ui.input.pink input[type=range]::-webkit-slider-thumb,
.ui.field.pink input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].pink::-webkit-slider-thumb,
.ui.field input[type=range].pink::-webkit-slider-thumb,
.ui.form .field.pink input[type=range]::-webkit-slider-thumb,
.ui.form .input.pink input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].pink::-webkit-slider-thumb,
.ui.input.searchable.pink,
.ui.input.searchable.pink .menu,
.ui.input.searchable.pink .content .tag,
.ui.input.dropdown.pink,
.ui.input.dropdown.pink .menu,
.ui.input.dropdown.pink .content .tag,
.ui.input.datepicker.pink .calendar,
.ui.input.datepicker.pink .calendar-day.today,
.ui.input.timepicker.pink .time-selector,
.ui.input.timepicker.pink .time-selector .time-wheel,
.ui.input.timepicker.pink .time-selector .time-wheel::before,
.ui.input.datetimepicker.pink .calendar,
.ui.input.datetimepicker.pink .time-selector,
.ui.input.datetimepicker.pink .calendar-day.today,
.ui.input.datetimepicker.pink .time-selector .time-wheel,
.ui.input.datetimepicker.pink .time-selector .time-wheel::before,
.ui.table.pink,
.ui.table.pink .table-pagination > button {
  border-color: #f5b3d1;
}

/* Button */
.ui.button.pink.outline:hover,
.ui.input.pink input:focus,
.ui.input input[type=file].pink:focus,
.ui.field.pink input:focus,
.ui.field input[type=file].pink:focus,
.ui.input.pink textarea:focus,
.ui.input textarea.pink:focus,
.ui.field.pink textarea:focus,
.ui.field textarea.pink:focus,
.ui.input.pink input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].pink.outline::file-selector-button:hover,
.ui.field.pink input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].pink.outline::file-selector-button:hover,
.ui.checkbox.pink:hover > .checkbox-box,
.ui.field.pink .checkbox:hover > .checkbox-box,
.ui.field .checkbox.pink:hover > .checkbox-box,
.ui.radio.pink:hover > .radio-circle,
.ui.field.pink .radio:hover > .radio-circle,
.ui.field .radio.pink:hover > .radio-circle,
.ui.input.pink input[type=range]::-webkit-slider-thumb:hover,
.ui.field.pink input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].pink::-webkit-slider-thumb:hover,
.ui.field input[type=range].pink::-webkit-slider-thumb:hover,
.ui.input.pink input[type=range]::-webkit-slider-thumb:active,
.ui.field.pink input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].pink::-webkit-slider-thumb:active,
.ui.field input[type=range].pink::-webkit-slider-thumb:active,
.ui.input.searchable.pink:focus,
.ui.input.searchable.pink.active,
.ui.input.dropdown.pink:focus,
.ui.input.dropdown.pink.active,
.ui.input.datepicker.pink.active > input,
.ui.input.timepicker.pink.active > input,
.ui.input.datetimepicker.pink.active > input,
.ui.tabs.pink > .header > .tab:hover,
.ui.tabs > .header > .tab.pink:hover,
.ui.tabs.pink > .header > .tab.active,
.ui.tabs > .header > .tab.pink.active,
.ui.tabs.pink:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.pink.active):not(.simple) > .content,
.ui.table.pink .table-pagination > button.active,
.ui.tag.pink {
  border-color: #e83e8c;
}

/* Loading Dots */
.ui.loading.circular.pink::before {
  border-top-color: #e83e8c;
}

/* Checkbox */
.ui.checkbox.pink > .checkbox-box i,
.ui.field.pink .checkbox > .checkbox-box i,
.ui.field .checkbox.pink > .checkbox-box i {
  color: #f8d0e3;
}

/* Message */
.ui.message.pink:not(.inverted) > i,
.ui.button.pink.outline:not(:hover),
.ui.input.pink > i,
.ui.field.pink .input > i,
.ui.field .input.pink > i,
.ui.input.pink > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.pink input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.pink input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.pink input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.pink input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.pink:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.pink:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.pink.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.pink.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.pink.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.pink.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.pink .time-selector .time-wheel-item.selected,
.ui.input.timepicker.pink .time-selector .time-wheel-divider,
.ui.input.datetimepicker.pink.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.pink .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.pink .time-selector .time-wheel-divider,
.ui.tag.pink:not(.action),
.ui.tag.pink:not(:active) {
  color: #e83e8c;
}

/* Table */
.ui.table.pink:not(.inverted) > thead,
.ui.table.pink:not(.inverted) > tfoot {
  background: color-mix(in srgb, #f8d0e3 50%, #f5b3d1 50%);
}

/* Table Inverted */
.ui.table.pink.inverted > thead,
.ui.table.pink.inverted > tfoot {
  background: color-mix(in srgb, #e83e8c 50%, #f5b3d1 50%);
}

.ui.card.teal:not(.inverted),
.ui.message.teal:not(.inverted),
.ui.table.teal:not(.inverted),
.ui.table.teal:not(.inverted) > .table-pagination > button,
.ui.carousel.teal .arrow,
.ui.carousel.teal .indicator {
  background-color: #ccf5e8;
}

/* Button */
.ui.button.teal:not(.outline):hover,
.ui.input.teal input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.teal input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.teal input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].teal:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].teal:not(.outline)::file-selector-button:hover,
.ui.form .input.teal input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.teal input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].teal:not(.outline)::file-selector-button:hover,
.ui.checkbox.teal > input[type=checkbox]:checked + .checkbox-box,
.ui.field.teal .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.teal > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.teal .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.teal > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.teal > .radio-circle::before,
.ui.field.teal .radio > .radio-circle::before,
.ui.field .radio.teal > .radio-circle::before,
.ui.form .field.teal .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.teal > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.teal > input[type=checkbox]:checked + .toggle-switch,
.ui.field.teal .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.teal > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.teal .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.teal > input[type=checkbox]:checked + .toggle-switch,
.ui.input.teal input[type=range]:hover,
.ui.field.teal input[type=range]:hover,
.ui.field .input.teal input[type=range]:hover,
.ui.input input[type=range].teal:hover,
.ui.field input[type=range].teal:hover,
.ui.form .field.teal input[type=range]:hover,
.ui.form .input.teal input[type=range]:hover,
.ui.form input[type=range].teal:hover,
.ui.input.spinner.teal:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.teal:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.teal.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.teal .content .tag:hover,
.ui.input.searchable.teal > .menu > .item:hover,
.ui.input.dropdown.teal.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.teal .content .tag:hover,
.ui.input.dropdown.teal > .menu > .item:hover,
.ui.input.datepicker.teal.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.teal .calendar .calendar-nav button:hover,
.ui.input.datepicker.teal .calendar .calendar-title:hover,
.ui.input.datepicker.teal .calendar .calendar-year:hover,
.ui.input.datepicker.teal .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.teal.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.teal.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.teal .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.teal .calendar .calendar-title:hover,
.ui.input.datetimepicker.teal .calendar .calendar-year:hover,
.ui.input.datetimepicker.teal .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.teal > .header > .tab:hover,
.ui.tabs.teal > .header > .tab.active,
.ui.tabs > .header > .tab.teal:hover,
.ui.tabs > .header > .tab.teal.active,
.ui.accordion.card.teal:not(.active) > .header:hover::after,
.ui.tabs.teal:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.teal.active):not(.simple) > .content,
.ui.table.teal .table-pagination > button:hover:not(:disabled),
.ui.carousel.teal .arrow:hover,
.ui.carousel.teal .indicator:hover,
.ui.loading.dots.teal > span,
.ui.tag.action.teal:hover {
  background-color: #a3f0d9;
}

/* Card */
.ui.card.teal.inverted,
.ui.message.teal.inverted,
.ui.table.teal.inverted,
.ui.divider.teal,
.ui.separator.teal,
.ui.button.teal:not(.outline),
.ui.button.teal.outline:hover,
.ui.input.teal input[type=file]:not(.outline)::file-selector-button,
.ui.field.teal input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].teal:not(.outline)::file-selector-button,
.ui.field input[type=file].teal:not(.outline)::file-selector-button,
.ui.form .field.teal input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.teal input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].teal:not(.outline)::file-selector-button:hover,
.ui.input.teal input[type=file].outline::file-selector-button:hover,
.ui.field.teal input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].teal.outline::file-selector-button:hover,
.ui.field input[type=file].teal.outline::file-selector-button:hover,
.ui.form .field.teal input[type=file].outline::file-selector-button:hover,
.ui.form .input.teal input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].teal.outline::file-selector-button:hover,
.ui.checkbox.teal:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.teal .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.teal:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.teal .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.teal:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.teal:hover > .radio-circle::before,
.ui.field.teal .radio:hover > .radio-circle::before,
.ui.field .radio.teal:hover > .radio-circle::before,
.ui.form .field.teal .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.teal:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.teal:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.teal .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.teal:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.teal .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.teal:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.teal input[type=range]:focus,
.ui.field.teal input[type=range]:focus,
.ui.input input[type=range].teal:focus,
.ui.field input[type=range].teal:focus,
.ui.form .field.teal input[type=range]:focus,
.ui.form .input.teal input[type=range]:focus,
.ui.form input[type=range].teal:focus,
.ui.input.spinner.teal.pressing-up::before,
.ui.input.spinner.teal.pressing-down::after,
.ui.input.searchable.teal.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.teal .content .tag:active,
.ui.input.searchable.teal > .menu > .item.highlighted,
.ui.input.searchable.teal > .menu > .item:active,
.ui.input.dropdown.teal.action-button.active.arrow::after,
.ui.input.dropdown.teal .content .tag:active,
.ui.input.dropdown.teal > .menu > .item.highlighted,
.ui.input.dropdown.teal > .menu > .item:active,
.ui.input.datepicker.teal .calendar .calendar-nav button:active,
.ui.input.datepicker.teal .calendar .calendar-title:active,
.ui.input.datepicker.teal .calendar .calendar-year:active,
.ui.input.datepicker.teal .calendar .calendar-year.selected,
.ui.input.datepicker.teal .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.teal .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.teal .calendar .calendar-nav button:active,
.ui.input.datetimepicker.teal .calendar .calendar-title:active,
.ui.input.datetimepicker.teal .calendar .calendar-year:active,
.ui.input.datetimepicker.teal .calendar .calendar-year.selected,
.ui.input.datetimepicker.teal .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.teal .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.teal.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.teal.action-button.active.arrow::after,
.ui.input.timepicker.teal.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.teal.action-button.active.arrow::after,
.ui.input.datetimepicker.teal.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.teal.action-button.active.arrow::after,
.ui.tabs.teal > .header > .tab:active,
.ui.tabs > .header > .tab.teal:active,
.ui.tabs.teal.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.teal.active:not(:active),
.ui.tabs > .header > .tab.teal.active.inverted:not(:active),
.ui.tabs.teal.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.teal.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.teal.active.inverted):not(.simple) > .content,
.ui.accordion.card.teal > .header:active::after,
.ui.accordion.card:not(.active).teal.active > .header::after,
.ui.table.teal .table-pagination > button:active:not(:disabled),
.ui.table.teal .table-pagination > button.active,
.ui.carousel.teal .arrow:active,
.ui.carousel.teal .arrow.active,
.ui.carousel.teal .indicator:active,
.ui.carousel.teal .indicator.active,
.ui.tooltip.teal,
.ui.tooltip.teal::after,
.ui.progress.teal .fill,
.ui.progress .fill.teal,
.ui.tag.action.teal:active {
  background-color: #20c997;
}

/* Card */
.ui.card.teal,
.ui.message.teal,
.ui.button.teal.outline,
.ui.input.teal input,
.ui.field.teal input,
.ui.field .input.teal input,
.ui.form .field.teal input,
.ui.form .input.teal input,
.ui.input input.teal,
.ui.field input.teal,
.ui.form input.teal,
.ui.input.teal textarea,
.ui.field.teal textarea,
.ui.field .input.teal textarea,
.ui.form .field.teal textarea,
.ui.form .input.teal textarea,
.ui.input textarea.teal,
.ui.field textarea.teal,
.ui.form textarea.teal,
.ui.input.teal input[type=file].outline::file-selector-button,
.ui.field.teal input[type=file].outline::file-selector-button,
.ui.field .input.teal input[type=file].outline::file-selector-button,
.ui.input input[type=file].teal.outline::file-selector-button,
.ui.field input[type=file].teal.outline::file-selector-button,
.ui.form input[type=file].teal.outline::file-selector-button,
.ui.radio.teal > .radio-circle,
.ui.field.teal .radio > .radio-circle,
.ui.field .radio.teal > .radio-circle,
.ui.checkbox.teal > .checkbox-box,
.ui.field.teal .checkbox > .checkbox-box,
.ui.field .checkbox.teal > .checkbox-box,
.ui.input.teal input[type=range]::-webkit-slider-thumb,
.ui.field.teal input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].teal::-webkit-slider-thumb,
.ui.field input[type=range].teal::-webkit-slider-thumb,
.ui.form .field.teal input[type=range]::-webkit-slider-thumb,
.ui.form .input.teal input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].teal::-webkit-slider-thumb,
.ui.input.searchable.teal,
.ui.input.searchable.teal .menu,
.ui.input.searchable.teal .content .tag,
.ui.input.dropdown.teal,
.ui.input.dropdown.teal .menu,
.ui.input.dropdown.teal .content .tag,
.ui.input.datepicker.teal .calendar,
.ui.input.datepicker.teal .calendar-day.today,
.ui.input.timepicker.teal .time-selector,
.ui.input.timepicker.teal .time-selector .time-wheel,
.ui.input.timepicker.teal .time-selector .time-wheel::before,
.ui.input.datetimepicker.teal .calendar,
.ui.input.datetimepicker.teal .time-selector,
.ui.input.datetimepicker.teal .calendar-day.today,
.ui.input.datetimepicker.teal .time-selector .time-wheel,
.ui.input.datetimepicker.teal .time-selector .time-wheel::before,
.ui.table.teal,
.ui.table.teal .table-pagination > button {
  border-color: #a3f0d9;
}

/* Button */
.ui.button.teal.outline:hover,
.ui.input.teal input:focus,
.ui.input input[type=file].teal:focus,
.ui.field.teal input:focus,
.ui.field input[type=file].teal:focus,
.ui.input.teal textarea:focus,
.ui.input textarea.teal:focus,
.ui.field.teal textarea:focus,
.ui.field textarea.teal:focus,
.ui.input.teal input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].teal.outline::file-selector-button:hover,
.ui.field.teal input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].teal.outline::file-selector-button:hover,
.ui.checkbox.teal:hover > .checkbox-box,
.ui.field.teal .checkbox:hover > .checkbox-box,
.ui.field .checkbox.teal:hover > .checkbox-box,
.ui.radio.teal:hover > .radio-circle,
.ui.field.teal .radio:hover > .radio-circle,
.ui.field .radio.teal:hover > .radio-circle,
.ui.input.teal input[type=range]::-webkit-slider-thumb:hover,
.ui.field.teal input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].teal::-webkit-slider-thumb:hover,
.ui.field input[type=range].teal::-webkit-slider-thumb:hover,
.ui.input.teal input[type=range]::-webkit-slider-thumb:active,
.ui.field.teal input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].teal::-webkit-slider-thumb:active,
.ui.field input[type=range].teal::-webkit-slider-thumb:active,
.ui.input.searchable.teal:focus,
.ui.input.searchable.teal.active,
.ui.input.dropdown.teal:focus,
.ui.input.dropdown.teal.active,
.ui.input.datepicker.teal.active > input,
.ui.input.timepicker.teal.active > input,
.ui.input.datetimepicker.teal.active > input,
.ui.tabs.teal > .header > .tab:hover,
.ui.tabs > .header > .tab.teal:hover,
.ui.tabs.teal > .header > .tab.active,
.ui.tabs > .header > .tab.teal.active,
.ui.tabs.teal:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.teal.active):not(.simple) > .content,
.ui.table.teal .table-pagination > button.active,
.ui.tag.teal {
  border-color: #20c997;
}

/* Loading Dots */
.ui.loading.circular.teal::before {
  border-top-color: #20c997;
}

/* Checkbox */
.ui.checkbox.teal > .checkbox-box i,
.ui.field.teal .checkbox > .checkbox-box i,
.ui.field .checkbox.teal > .checkbox-box i {
  color: #ccf5e8;
}

/* Message */
.ui.message.teal:not(.inverted) > i,
.ui.button.teal.outline:not(:hover),
.ui.input.teal > i,
.ui.field.teal .input > i,
.ui.field .input.teal > i,
.ui.input.teal > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.teal input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.teal input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.teal input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.teal input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.teal:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.teal:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.teal.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.teal.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.teal.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.teal.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.teal .time-selector .time-wheel-item.selected,
.ui.input.timepicker.teal .time-selector .time-wheel-divider,
.ui.input.datetimepicker.teal.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.teal .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.teal .time-selector .time-wheel-divider,
.ui.tag.teal:not(.action),
.ui.tag.teal:not(:active) {
  color: #20c997;
}

/* Table */
.ui.table.teal:not(.inverted) > thead,
.ui.table.teal:not(.inverted) > tfoot {
  background: color-mix(in srgb, #ccf5e8 50%, #a3f0d9 50%);
}

/* Table Inverted */
.ui.table.teal.inverted > thead,
.ui.table.teal.inverted > tfoot {
  background: color-mix(in srgb, #20c997 50%, #a3f0d9 50%);
}

.ui.card.cyan:not(.inverted),
.ui.message.cyan:not(.inverted),
.ui.table.cyan:not(.inverted),
.ui.table.cyan:not(.inverted) > .table-pagination > button,
.ui.carousel.cyan .arrow,
.ui.carousel.cyan .indicator {
  background-color: #cceff5;
}

/* Button */
.ui.button.cyan:not(.outline):hover,
.ui.input.cyan input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.cyan input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.cyan input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].cyan:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].cyan:not(.outline)::file-selector-button:hover,
.ui.form .input.cyan input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.cyan input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].cyan:not(.outline)::file-selector-button:hover,
.ui.checkbox.cyan > input[type=checkbox]:checked + .checkbox-box,
.ui.field.cyan .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.cyan > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.cyan .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.cyan > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.cyan > .radio-circle::before,
.ui.field.cyan .radio > .radio-circle::before,
.ui.field .radio.cyan > .radio-circle::before,
.ui.form .field.cyan .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.cyan > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.cyan > input[type=checkbox]:checked + .toggle-switch,
.ui.field.cyan .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.cyan > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.cyan .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.cyan > input[type=checkbox]:checked + .toggle-switch,
.ui.input.cyan input[type=range]:hover,
.ui.field.cyan input[type=range]:hover,
.ui.field .input.cyan input[type=range]:hover,
.ui.input input[type=range].cyan:hover,
.ui.field input[type=range].cyan:hover,
.ui.form .field.cyan input[type=range]:hover,
.ui.form .input.cyan input[type=range]:hover,
.ui.form input[type=range].cyan:hover,
.ui.input.spinner.cyan:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.cyan:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.cyan.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.cyan .content .tag:hover,
.ui.input.searchable.cyan > .menu > .item:hover,
.ui.input.dropdown.cyan.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.cyan .content .tag:hover,
.ui.input.dropdown.cyan > .menu > .item:hover,
.ui.input.datepicker.cyan.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.cyan .calendar .calendar-nav button:hover,
.ui.input.datepicker.cyan .calendar .calendar-title:hover,
.ui.input.datepicker.cyan .calendar .calendar-year:hover,
.ui.input.datepicker.cyan .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.cyan.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.cyan.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.cyan .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.cyan .calendar .calendar-title:hover,
.ui.input.datetimepicker.cyan .calendar .calendar-year:hover,
.ui.input.datetimepicker.cyan .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.cyan > .header > .tab:hover,
.ui.tabs.cyan > .header > .tab.active,
.ui.tabs > .header > .tab.cyan:hover,
.ui.tabs > .header > .tab.cyan.active,
.ui.accordion.card.cyan:not(.active) > .header:hover::after,
.ui.tabs.cyan:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.cyan.active):not(.simple) > .content,
.ui.table.cyan .table-pagination > button:hover:not(:disabled),
.ui.carousel.cyan .arrow:hover,
.ui.carousel.cyan .indicator:hover,
.ui.loading.dots.cyan > span,
.ui.tag.action.cyan:hover {
  background-color: #a3e0eb;
}

/* Card */
.ui.card.cyan.inverted,
.ui.message.cyan.inverted,
.ui.table.cyan.inverted,
.ui.divider.cyan,
.ui.separator.cyan,
.ui.button.cyan:not(.outline),
.ui.button.cyan.outline:hover,
.ui.input.cyan input[type=file]:not(.outline)::file-selector-button,
.ui.field.cyan input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].cyan:not(.outline)::file-selector-button,
.ui.field input[type=file].cyan:not(.outline)::file-selector-button,
.ui.form .field.cyan input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.cyan input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].cyan:not(.outline)::file-selector-button:hover,
.ui.input.cyan input[type=file].outline::file-selector-button:hover,
.ui.field.cyan input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].cyan.outline::file-selector-button:hover,
.ui.field input[type=file].cyan.outline::file-selector-button:hover,
.ui.form .field.cyan input[type=file].outline::file-selector-button:hover,
.ui.form .input.cyan input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].cyan.outline::file-selector-button:hover,
.ui.checkbox.cyan:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.cyan .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.cyan:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.cyan .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.cyan:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.cyan:hover > .radio-circle::before,
.ui.field.cyan .radio:hover > .radio-circle::before,
.ui.field .radio.cyan:hover > .radio-circle::before,
.ui.form .field.cyan .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.cyan:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.cyan:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.cyan .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.cyan:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.cyan .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.cyan:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.cyan input[type=range]:focus,
.ui.field.cyan input[type=range]:focus,
.ui.input input[type=range].cyan:focus,
.ui.field input[type=range].cyan:focus,
.ui.form .field.cyan input[type=range]:focus,
.ui.form .input.cyan input[type=range]:focus,
.ui.form input[type=range].cyan:focus,
.ui.input.spinner.cyan.pressing-up::before,
.ui.input.spinner.cyan.pressing-down::after,
.ui.input.searchable.cyan.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.cyan .content .tag:active,
.ui.input.searchable.cyan > .menu > .item.highlighted,
.ui.input.searchable.cyan > .menu > .item:active,
.ui.input.dropdown.cyan.action-button.active.arrow::after,
.ui.input.dropdown.cyan .content .tag:active,
.ui.input.dropdown.cyan > .menu > .item.highlighted,
.ui.input.dropdown.cyan > .menu > .item:active,
.ui.input.datepicker.cyan .calendar .calendar-nav button:active,
.ui.input.datepicker.cyan .calendar .calendar-title:active,
.ui.input.datepicker.cyan .calendar .calendar-year:active,
.ui.input.datepicker.cyan .calendar .calendar-year.selected,
.ui.input.datepicker.cyan .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.cyan .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.cyan .calendar .calendar-nav button:active,
.ui.input.datetimepicker.cyan .calendar .calendar-title:active,
.ui.input.datetimepicker.cyan .calendar .calendar-year:active,
.ui.input.datetimepicker.cyan .calendar .calendar-year.selected,
.ui.input.datetimepicker.cyan .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.cyan .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.cyan.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.cyan.action-button.active.arrow::after,
.ui.input.timepicker.cyan.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.cyan.action-button.active.arrow::after,
.ui.input.datetimepicker.cyan.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.cyan.action-button.active.arrow::after,
.ui.tabs.cyan > .header > .tab:active,
.ui.tabs > .header > .tab.cyan:active,
.ui.tabs.cyan.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.cyan.active:not(:active),
.ui.tabs > .header > .tab.cyan.active.inverted:not(:active),
.ui.tabs.cyan.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.cyan.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.cyan.active.inverted):not(.simple) > .content,
.ui.accordion.card.cyan > .header:active::after,
.ui.accordion.card:not(.active).cyan.active > .header::after,
.ui.table.cyan .table-pagination > button:active:not(:disabled),
.ui.table.cyan .table-pagination > button.active,
.ui.carousel.cyan .arrow:active,
.ui.carousel.cyan .arrow.active,
.ui.carousel.cyan .indicator:active,
.ui.carousel.cyan .indicator.active,
.ui.tooltip.cyan,
.ui.tooltip.cyan::after,
.ui.progress.cyan .fill,
.ui.progress .fill.cyan,
.ui.tag.action.cyan:active {
  background-color: #17a2b8;
}

/* Card */
.ui.card.cyan,
.ui.message.cyan,
.ui.button.cyan.outline,
.ui.input.cyan input,
.ui.field.cyan input,
.ui.field .input.cyan input,
.ui.form .field.cyan input,
.ui.form .input.cyan input,
.ui.input input.cyan,
.ui.field input.cyan,
.ui.form input.cyan,
.ui.input.cyan textarea,
.ui.field.cyan textarea,
.ui.field .input.cyan textarea,
.ui.form .field.cyan textarea,
.ui.form .input.cyan textarea,
.ui.input textarea.cyan,
.ui.field textarea.cyan,
.ui.form textarea.cyan,
.ui.input.cyan input[type=file].outline::file-selector-button,
.ui.field.cyan input[type=file].outline::file-selector-button,
.ui.field .input.cyan input[type=file].outline::file-selector-button,
.ui.input input[type=file].cyan.outline::file-selector-button,
.ui.field input[type=file].cyan.outline::file-selector-button,
.ui.form input[type=file].cyan.outline::file-selector-button,
.ui.radio.cyan > .radio-circle,
.ui.field.cyan .radio > .radio-circle,
.ui.field .radio.cyan > .radio-circle,
.ui.checkbox.cyan > .checkbox-box,
.ui.field.cyan .checkbox > .checkbox-box,
.ui.field .checkbox.cyan > .checkbox-box,
.ui.input.cyan input[type=range]::-webkit-slider-thumb,
.ui.field.cyan input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].cyan::-webkit-slider-thumb,
.ui.field input[type=range].cyan::-webkit-slider-thumb,
.ui.form .field.cyan input[type=range]::-webkit-slider-thumb,
.ui.form .input.cyan input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].cyan::-webkit-slider-thumb,
.ui.input.searchable.cyan,
.ui.input.searchable.cyan .menu,
.ui.input.searchable.cyan .content .tag,
.ui.input.dropdown.cyan,
.ui.input.dropdown.cyan .menu,
.ui.input.dropdown.cyan .content .tag,
.ui.input.datepicker.cyan .calendar,
.ui.input.datepicker.cyan .calendar-day.today,
.ui.input.timepicker.cyan .time-selector,
.ui.input.timepicker.cyan .time-selector .time-wheel,
.ui.input.timepicker.cyan .time-selector .time-wheel::before,
.ui.input.datetimepicker.cyan .calendar,
.ui.input.datetimepicker.cyan .time-selector,
.ui.input.datetimepicker.cyan .calendar-day.today,
.ui.input.datetimepicker.cyan .time-selector .time-wheel,
.ui.input.datetimepicker.cyan .time-selector .time-wheel::before,
.ui.table.cyan,
.ui.table.cyan .table-pagination > button {
  border-color: #a3e0eb;
}

/* Button */
.ui.button.cyan.outline:hover,
.ui.input.cyan input:focus,
.ui.input input[type=file].cyan:focus,
.ui.field.cyan input:focus,
.ui.field input[type=file].cyan:focus,
.ui.input.cyan textarea:focus,
.ui.input textarea.cyan:focus,
.ui.field.cyan textarea:focus,
.ui.field textarea.cyan:focus,
.ui.input.cyan input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].cyan.outline::file-selector-button:hover,
.ui.field.cyan input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].cyan.outline::file-selector-button:hover,
.ui.checkbox.cyan:hover > .checkbox-box,
.ui.field.cyan .checkbox:hover > .checkbox-box,
.ui.field .checkbox.cyan:hover > .checkbox-box,
.ui.radio.cyan:hover > .radio-circle,
.ui.field.cyan .radio:hover > .radio-circle,
.ui.field .radio.cyan:hover > .radio-circle,
.ui.input.cyan input[type=range]::-webkit-slider-thumb:hover,
.ui.field.cyan input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].cyan::-webkit-slider-thumb:hover,
.ui.field input[type=range].cyan::-webkit-slider-thumb:hover,
.ui.input.cyan input[type=range]::-webkit-slider-thumb:active,
.ui.field.cyan input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].cyan::-webkit-slider-thumb:active,
.ui.field input[type=range].cyan::-webkit-slider-thumb:active,
.ui.input.searchable.cyan:focus,
.ui.input.searchable.cyan.active,
.ui.input.dropdown.cyan:focus,
.ui.input.dropdown.cyan.active,
.ui.input.datepicker.cyan.active > input,
.ui.input.timepicker.cyan.active > input,
.ui.input.datetimepicker.cyan.active > input,
.ui.tabs.cyan > .header > .tab:hover,
.ui.tabs > .header > .tab.cyan:hover,
.ui.tabs.cyan > .header > .tab.active,
.ui.tabs > .header > .tab.cyan.active,
.ui.tabs.cyan:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.cyan.active):not(.simple) > .content,
.ui.table.cyan .table-pagination > button.active,
.ui.tag.cyan {
  border-color: #17a2b8;
}

/* Loading Dots */
.ui.loading.circular.cyan::before {
  border-top-color: #17a2b8;
}

/* Checkbox */
.ui.checkbox.cyan > .checkbox-box i,
.ui.field.cyan .checkbox > .checkbox-box i,
.ui.field .checkbox.cyan > .checkbox-box i {
  color: #cceff5;
}

/* Message */
.ui.message.cyan:not(.inverted) > i,
.ui.button.cyan.outline:not(:hover),
.ui.input.cyan > i,
.ui.field.cyan .input > i,
.ui.field .input.cyan > i,
.ui.input.cyan > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.cyan input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.cyan input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.cyan input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.cyan input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.cyan:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.cyan:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.cyan.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.cyan.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.cyan.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.cyan.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.cyan .time-selector .time-wheel-item.selected,
.ui.input.timepicker.cyan .time-selector .time-wheel-divider,
.ui.input.datetimepicker.cyan.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.cyan .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.cyan .time-selector .time-wheel-divider,
.ui.tag.cyan:not(.action),
.ui.tag.cyan:not(:active) {
  color: #17a2b8;
}

/* Table */
.ui.table.cyan:not(.inverted) > thead,
.ui.table.cyan:not(.inverted) > tfoot {
  background: color-mix(in srgb, #cceff5 50%, #a3e0eb 50%);
}

/* Table Inverted */
.ui.table.cyan.inverted > thead,
.ui.table.cyan.inverted > tfoot {
  background: color-mix(in srgb, #17a2b8 50%, #a3e0eb 50%);
}

.ui.card.indigo:not(.inverted),
.ui.message.indigo:not(.inverted),
.ui.table.indigo:not(.inverted),
.ui.table.indigo:not(.inverted) > .table-pagination > button,
.ui.carousel.indigo .arrow,
.ui.carousel.indigo .indicator {
  background-color: #d9c5f3;
}

/* Button */
.ui.button.indigo:not(.outline):hover,
.ui.input.indigo input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.indigo input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.indigo input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].indigo:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].indigo:not(.outline)::file-selector-button:hover,
.ui.form .input.indigo input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.indigo input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].indigo:not(.outline)::file-selector-button:hover,
.ui.checkbox.indigo > input[type=checkbox]:checked + .checkbox-box,
.ui.field.indigo .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.indigo > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.indigo .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.indigo > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.indigo > .radio-circle::before,
.ui.field.indigo .radio > .radio-circle::before,
.ui.field .radio.indigo > .radio-circle::before,
.ui.form .field.indigo .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.indigo > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.indigo > input[type=checkbox]:checked + .toggle-switch,
.ui.field.indigo .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.indigo > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.indigo .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.indigo > input[type=checkbox]:checked + .toggle-switch,
.ui.input.indigo input[type=range]:hover,
.ui.field.indigo input[type=range]:hover,
.ui.field .input.indigo input[type=range]:hover,
.ui.input input[type=range].indigo:hover,
.ui.field input[type=range].indigo:hover,
.ui.form .field.indigo input[type=range]:hover,
.ui.form .input.indigo input[type=range]:hover,
.ui.form input[type=range].indigo:hover,
.ui.input.spinner.indigo:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.indigo:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.indigo.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.indigo .content .tag:hover,
.ui.input.searchable.indigo > .menu > .item:hover,
.ui.input.dropdown.indigo.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.indigo .content .tag:hover,
.ui.input.dropdown.indigo > .menu > .item:hover,
.ui.input.datepicker.indigo.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.indigo .calendar .calendar-nav button:hover,
.ui.input.datepicker.indigo .calendar .calendar-title:hover,
.ui.input.datepicker.indigo .calendar .calendar-year:hover,
.ui.input.datepicker.indigo .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.indigo.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.indigo.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.indigo .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.indigo .calendar .calendar-title:hover,
.ui.input.datetimepicker.indigo .calendar .calendar-year:hover,
.ui.input.datetimepicker.indigo .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.indigo > .header > .tab:hover,
.ui.tabs.indigo > .header > .tab.active,
.ui.tabs > .header > .tab.indigo:hover,
.ui.tabs > .header > .tab.indigo.active,
.ui.accordion.card.indigo:not(.active) > .header:hover::after,
.ui.tabs.indigo:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.indigo.active):not(.simple) > .content,
.ui.table.indigo .table-pagination > button:hover:not(:disabled),
.ui.carousel.indigo .arrow:hover,
.ui.carousel.indigo .indicator:hover,
.ui.loading.dots.indigo > span,
.ui.tag.action.indigo:hover {
  background-color: #b88ae8;
}

/* Card */
.ui.card.indigo.inverted,
.ui.message.indigo.inverted,
.ui.table.indigo.inverted,
.ui.divider.indigo,
.ui.separator.indigo,
.ui.button.indigo:not(.outline),
.ui.button.indigo.outline:hover,
.ui.input.indigo input[type=file]:not(.outline)::file-selector-button,
.ui.field.indigo input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].indigo:not(.outline)::file-selector-button,
.ui.field input[type=file].indigo:not(.outline)::file-selector-button,
.ui.form .field.indigo input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.indigo input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].indigo:not(.outline)::file-selector-button:hover,
.ui.input.indigo input[type=file].outline::file-selector-button:hover,
.ui.field.indigo input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].indigo.outline::file-selector-button:hover,
.ui.field input[type=file].indigo.outline::file-selector-button:hover,
.ui.form .field.indigo input[type=file].outline::file-selector-button:hover,
.ui.form .input.indigo input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].indigo.outline::file-selector-button:hover,
.ui.checkbox.indigo:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.indigo .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.indigo:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.indigo .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.indigo:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.indigo:hover > .radio-circle::before,
.ui.field.indigo .radio:hover > .radio-circle::before,
.ui.field .radio.indigo:hover > .radio-circle::before,
.ui.form .field.indigo .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.indigo:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.indigo:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.indigo .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.indigo:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.indigo .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.indigo:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.indigo input[type=range]:focus,
.ui.field.indigo input[type=range]:focus,
.ui.input input[type=range].indigo:focus,
.ui.field input[type=range].indigo:focus,
.ui.form .field.indigo input[type=range]:focus,
.ui.form .input.indigo input[type=range]:focus,
.ui.form input[type=range].indigo:focus,
.ui.input.spinner.indigo.pressing-up::before,
.ui.input.spinner.indigo.pressing-down::after,
.ui.input.searchable.indigo.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.indigo .content .tag:active,
.ui.input.searchable.indigo > .menu > .item.highlighted,
.ui.input.searchable.indigo > .menu > .item:active,
.ui.input.dropdown.indigo.action-button.active.arrow::after,
.ui.input.dropdown.indigo .content .tag:active,
.ui.input.dropdown.indigo > .menu > .item.highlighted,
.ui.input.dropdown.indigo > .menu > .item:active,
.ui.input.datepicker.indigo .calendar .calendar-nav button:active,
.ui.input.datepicker.indigo .calendar .calendar-title:active,
.ui.input.datepicker.indigo .calendar .calendar-year:active,
.ui.input.datepicker.indigo .calendar .calendar-year.selected,
.ui.input.datepicker.indigo .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.indigo .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.indigo .calendar .calendar-nav button:active,
.ui.input.datetimepicker.indigo .calendar .calendar-title:active,
.ui.input.datetimepicker.indigo .calendar .calendar-year:active,
.ui.input.datetimepicker.indigo .calendar .calendar-year.selected,
.ui.input.datetimepicker.indigo .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.indigo .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.indigo.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.indigo.action-button.active.arrow::after,
.ui.input.timepicker.indigo.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.indigo.action-button.active.arrow::after,
.ui.input.datetimepicker.indigo.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.indigo.action-button.active.arrow::after,
.ui.tabs.indigo > .header > .tab:active,
.ui.tabs > .header > .tab.indigo:active,
.ui.tabs.indigo.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.indigo.active:not(:active),
.ui.tabs > .header > .tab.indigo.active.inverted:not(:active),
.ui.tabs.indigo.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.indigo.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.indigo.active.inverted):not(.simple) > .content,
.ui.accordion.card.indigo > .header:active::after,
.ui.accordion.card:not(.active).indigo.active > .header::after,
.ui.table.indigo .table-pagination > button:active:not(:disabled),
.ui.table.indigo .table-pagination > button.active,
.ui.carousel.indigo .arrow:active,
.ui.carousel.indigo .arrow.active,
.ui.carousel.indigo .indicator:active,
.ui.carousel.indigo .indicator.active,
.ui.tooltip.indigo,
.ui.tooltip.indigo::after,
.ui.progress.indigo .fill,
.ui.progress .fill.indigo,
.ui.tag.action.indigo:active {
  background-color: #6610f2;
}

/* Card */
.ui.card.indigo,
.ui.message.indigo,
.ui.button.indigo.outline,
.ui.input.indigo input,
.ui.field.indigo input,
.ui.field .input.indigo input,
.ui.form .field.indigo input,
.ui.form .input.indigo input,
.ui.input input.indigo,
.ui.field input.indigo,
.ui.form input.indigo,
.ui.input.indigo textarea,
.ui.field.indigo textarea,
.ui.field .input.indigo textarea,
.ui.form .field.indigo textarea,
.ui.form .input.indigo textarea,
.ui.input textarea.indigo,
.ui.field textarea.indigo,
.ui.form textarea.indigo,
.ui.input.indigo input[type=file].outline::file-selector-button,
.ui.field.indigo input[type=file].outline::file-selector-button,
.ui.field .input.indigo input[type=file].outline::file-selector-button,
.ui.input input[type=file].indigo.outline::file-selector-button,
.ui.field input[type=file].indigo.outline::file-selector-button,
.ui.form input[type=file].indigo.outline::file-selector-button,
.ui.radio.indigo > .radio-circle,
.ui.field.indigo .radio > .radio-circle,
.ui.field .radio.indigo > .radio-circle,
.ui.checkbox.indigo > .checkbox-box,
.ui.field.indigo .checkbox > .checkbox-box,
.ui.field .checkbox.indigo > .checkbox-box,
.ui.input.indigo input[type=range]::-webkit-slider-thumb,
.ui.field.indigo input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].indigo::-webkit-slider-thumb,
.ui.field input[type=range].indigo::-webkit-slider-thumb,
.ui.form .field.indigo input[type=range]::-webkit-slider-thumb,
.ui.form .input.indigo input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].indigo::-webkit-slider-thumb,
.ui.input.searchable.indigo,
.ui.input.searchable.indigo .menu,
.ui.input.searchable.indigo .content .tag,
.ui.input.dropdown.indigo,
.ui.input.dropdown.indigo .menu,
.ui.input.dropdown.indigo .content .tag,
.ui.input.datepicker.indigo .calendar,
.ui.input.datepicker.indigo .calendar-day.today,
.ui.input.timepicker.indigo .time-selector,
.ui.input.timepicker.indigo .time-selector .time-wheel,
.ui.input.timepicker.indigo .time-selector .time-wheel::before,
.ui.input.datetimepicker.indigo .calendar,
.ui.input.datetimepicker.indigo .time-selector,
.ui.input.datetimepicker.indigo .calendar-day.today,
.ui.input.datetimepicker.indigo .time-selector .time-wheel,
.ui.input.datetimepicker.indigo .time-selector .time-wheel::before,
.ui.table.indigo,
.ui.table.indigo .table-pagination > button {
  border-color: #b88ae8;
}

/* Button */
.ui.button.indigo.outline:hover,
.ui.input.indigo input:focus,
.ui.input input[type=file].indigo:focus,
.ui.field.indigo input:focus,
.ui.field input[type=file].indigo:focus,
.ui.input.indigo textarea:focus,
.ui.input textarea.indigo:focus,
.ui.field.indigo textarea:focus,
.ui.field textarea.indigo:focus,
.ui.input.indigo input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].indigo.outline::file-selector-button:hover,
.ui.field.indigo input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].indigo.outline::file-selector-button:hover,
.ui.checkbox.indigo:hover > .checkbox-box,
.ui.field.indigo .checkbox:hover > .checkbox-box,
.ui.field .checkbox.indigo:hover > .checkbox-box,
.ui.radio.indigo:hover > .radio-circle,
.ui.field.indigo .radio:hover > .radio-circle,
.ui.field .radio.indigo:hover > .radio-circle,
.ui.input.indigo input[type=range]::-webkit-slider-thumb:hover,
.ui.field.indigo input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].indigo::-webkit-slider-thumb:hover,
.ui.field input[type=range].indigo::-webkit-slider-thumb:hover,
.ui.input.indigo input[type=range]::-webkit-slider-thumb:active,
.ui.field.indigo input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].indigo::-webkit-slider-thumb:active,
.ui.field input[type=range].indigo::-webkit-slider-thumb:active,
.ui.input.searchable.indigo:focus,
.ui.input.searchable.indigo.active,
.ui.input.dropdown.indigo:focus,
.ui.input.dropdown.indigo.active,
.ui.input.datepicker.indigo.active > input,
.ui.input.timepicker.indigo.active > input,
.ui.input.datetimepicker.indigo.active > input,
.ui.tabs.indigo > .header > .tab:hover,
.ui.tabs > .header > .tab.indigo:hover,
.ui.tabs.indigo > .header > .tab.active,
.ui.tabs > .header > .tab.indigo.active,
.ui.tabs.indigo:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.indigo.active):not(.simple) > .content,
.ui.table.indigo .table-pagination > button.active,
.ui.tag.indigo {
  border-color: #6610f2;
}

/* Loading Dots */
.ui.loading.circular.indigo::before {
  border-top-color: #6610f2;
}

/* Checkbox */
.ui.checkbox.indigo > .checkbox-box i,
.ui.field.indigo .checkbox > .checkbox-box i,
.ui.field .checkbox.indigo > .checkbox-box i {
  color: #d9c5f3;
}

/* Message */
.ui.message.indigo:not(.inverted) > i,
.ui.button.indigo.outline:not(:hover),
.ui.input.indigo > i,
.ui.field.indigo .input > i,
.ui.field .input.indigo > i,
.ui.input.indigo > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.indigo input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.indigo input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.indigo input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.indigo input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.indigo:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.indigo:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.indigo.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.indigo.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.indigo.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.indigo.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.indigo .time-selector .time-wheel-item.selected,
.ui.input.timepicker.indigo .time-selector .time-wheel-divider,
.ui.input.datetimepicker.indigo.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.indigo .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.indigo .time-selector .time-wheel-divider,
.ui.tag.indigo:not(.action),
.ui.tag.indigo:not(:active) {
  color: #6610f2;
}

/* Table */
.ui.table.indigo:not(.inverted) > thead,
.ui.table.indigo:not(.inverted) > tfoot {
  background: color-mix(in srgb, #d9c5f3 50%, #b88ae8 50%);
}

/* Table Inverted */
.ui.table.indigo.inverted > thead,
.ui.table.indigo.inverted > tfoot {
  background: color-mix(in srgb, #6610f2 50%, #b88ae8 50%);
}

.ui.card.gray:not(.inverted),
.ui.message.gray:not(.inverted),
.ui.table.gray:not(.inverted),
.ui.table.gray:not(.inverted) > .table-pagination > button,
.ui.carousel.gray .arrow,
.ui.carousel.gray .indicator {
  background-color: #e9ecef;
}

/* Button */
.ui.button.gray:not(.outline):hover,
.ui.input.gray input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.gray input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.gray input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].gray:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].gray:not(.outline)::file-selector-button:hover,
.ui.form .input.gray input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.gray input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].gray:not(.outline)::file-selector-button:hover,
.ui.checkbox.gray > input[type=checkbox]:checked + .checkbox-box,
.ui.field.gray .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.gray > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.gray .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.gray > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.gray > .radio-circle::before,
.ui.field.gray .radio > .radio-circle::before,
.ui.field .radio.gray > .radio-circle::before,
.ui.form .field.gray .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.gray > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.gray > input[type=checkbox]:checked + .toggle-switch,
.ui.field.gray .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.gray > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.gray .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.gray > input[type=checkbox]:checked + .toggle-switch,
.ui.input.gray input[type=range]:hover,
.ui.field.gray input[type=range]:hover,
.ui.field .input.gray input[type=range]:hover,
.ui.input input[type=range].gray:hover,
.ui.field input[type=range].gray:hover,
.ui.form .field.gray input[type=range]:hover,
.ui.form .input.gray input[type=range]:hover,
.ui.form input[type=range].gray:hover,
.ui.input.spinner.gray:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.gray:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.gray.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.gray .content .tag:hover,
.ui.input.searchable.gray > .menu > .item:hover,
.ui.input.dropdown.gray.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.gray .content .tag:hover,
.ui.input.dropdown.gray > .menu > .item:hover,
.ui.input.datepicker.gray.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.gray .calendar .calendar-nav button:hover,
.ui.input.datepicker.gray .calendar .calendar-title:hover,
.ui.input.datepicker.gray .calendar .calendar-year:hover,
.ui.input.datepicker.gray .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.gray.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.gray.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.gray .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.gray .calendar .calendar-title:hover,
.ui.input.datetimepicker.gray .calendar .calendar-year:hover,
.ui.input.datetimepicker.gray .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.gray > .header > .tab:hover,
.ui.tabs.gray > .header > .tab.active,
.ui.tabs > .header > .tab.gray:hover,
.ui.tabs > .header > .tab.gray.active,
.ui.accordion.card.gray:not(.active) > .header:hover::after,
.ui.tabs.gray:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.gray.active):not(.simple) > .content,
.ui.table.gray .table-pagination > button:hover:not(:disabled),
.ui.carousel.gray .arrow:hover,
.ui.carousel.gray .indicator:hover,
.ui.loading.dots.gray > span,
.ui.tag.action.gray:hover {
  background-color: #adb5bd;
}

/* Card */
.ui.card.gray.inverted,
.ui.message.gray.inverted,
.ui.table.gray.inverted,
.ui.divider.gray,
.ui.separator.gray,
.ui.button.gray:not(.outline),
.ui.button.gray.outline:hover,
.ui.input.gray input[type=file]:not(.outline)::file-selector-button,
.ui.field.gray input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].gray:not(.outline)::file-selector-button,
.ui.field input[type=file].gray:not(.outline)::file-selector-button,
.ui.form .field.gray input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.gray input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].gray:not(.outline)::file-selector-button:hover,
.ui.input.gray input[type=file].outline::file-selector-button:hover,
.ui.field.gray input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].gray.outline::file-selector-button:hover,
.ui.field input[type=file].gray.outline::file-selector-button:hover,
.ui.form .field.gray input[type=file].outline::file-selector-button:hover,
.ui.form .input.gray input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].gray.outline::file-selector-button:hover,
.ui.checkbox.gray:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.gray .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.gray:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.gray .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.gray:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.gray:hover > .radio-circle::before,
.ui.field.gray .radio:hover > .radio-circle::before,
.ui.field .radio.gray:hover > .radio-circle::before,
.ui.form .field.gray .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.gray:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.gray:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.gray .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.gray:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.gray .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.gray:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.gray input[type=range]:focus,
.ui.field.gray input[type=range]:focus,
.ui.input input[type=range].gray:focus,
.ui.field input[type=range].gray:focus,
.ui.form .field.gray input[type=range]:focus,
.ui.form .input.gray input[type=range]:focus,
.ui.form input[type=range].gray:focus,
.ui.input.spinner.gray.pressing-up::before,
.ui.input.spinner.gray.pressing-down::after,
.ui.input.searchable.gray.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.gray .content .tag:active,
.ui.input.searchable.gray > .menu > .item.highlighted,
.ui.input.searchable.gray > .menu > .item:active,
.ui.input.dropdown.gray.action-button.active.arrow::after,
.ui.input.dropdown.gray .content .tag:active,
.ui.input.dropdown.gray > .menu > .item.highlighted,
.ui.input.dropdown.gray > .menu > .item:active,
.ui.input.datepicker.gray .calendar .calendar-nav button:active,
.ui.input.datepicker.gray .calendar .calendar-title:active,
.ui.input.datepicker.gray .calendar .calendar-year:active,
.ui.input.datepicker.gray .calendar .calendar-year.selected,
.ui.input.datepicker.gray .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.gray .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.gray .calendar .calendar-nav button:active,
.ui.input.datetimepicker.gray .calendar .calendar-title:active,
.ui.input.datetimepicker.gray .calendar .calendar-year:active,
.ui.input.datetimepicker.gray .calendar .calendar-year.selected,
.ui.input.datetimepicker.gray .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.gray .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.gray.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.gray.action-button.active.arrow::after,
.ui.input.timepicker.gray.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.gray.action-button.active.arrow::after,
.ui.input.datetimepicker.gray.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.gray.action-button.active.arrow::after,
.ui.tabs.gray > .header > .tab:active,
.ui.tabs > .header > .tab.gray:active,
.ui.tabs.gray.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.gray.active:not(:active),
.ui.tabs > .header > .tab.gray.active.inverted:not(:active),
.ui.tabs.gray.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.gray.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.gray.active.inverted):not(.simple) > .content,
.ui.accordion.card.gray > .header:active::after,
.ui.accordion.card:not(.active).gray.active > .header::after,
.ui.table.gray .table-pagination > button:active:not(:disabled),
.ui.table.gray .table-pagination > button.active,
.ui.carousel.gray .arrow:active,
.ui.carousel.gray .arrow.active,
.ui.carousel.gray .indicator:active,
.ui.carousel.gray .indicator.active,
.ui.tooltip.gray,
.ui.tooltip.gray::after,
.ui.progress.gray .fill,
.ui.progress .fill.gray,
.ui.tag.action.gray:active {
  background-color: #6c757d;
}

/* Card */
.ui.card.gray,
.ui.message.gray,
.ui.button.gray.outline,
.ui.input.gray input,
.ui.field.gray input,
.ui.field .input.gray input,
.ui.form .field.gray input,
.ui.form .input.gray input,
.ui.input input.gray,
.ui.field input.gray,
.ui.form input.gray,
.ui.input.gray textarea,
.ui.field.gray textarea,
.ui.field .input.gray textarea,
.ui.form .field.gray textarea,
.ui.form .input.gray textarea,
.ui.input textarea.gray,
.ui.field textarea.gray,
.ui.form textarea.gray,
.ui.input.gray input[type=file].outline::file-selector-button,
.ui.field.gray input[type=file].outline::file-selector-button,
.ui.field .input.gray input[type=file].outline::file-selector-button,
.ui.input input[type=file].gray.outline::file-selector-button,
.ui.field input[type=file].gray.outline::file-selector-button,
.ui.form input[type=file].gray.outline::file-selector-button,
.ui.radio.gray > .radio-circle,
.ui.field.gray .radio > .radio-circle,
.ui.field .radio.gray > .radio-circle,
.ui.checkbox.gray > .checkbox-box,
.ui.field.gray .checkbox > .checkbox-box,
.ui.field .checkbox.gray > .checkbox-box,
.ui.input.gray input[type=range]::-webkit-slider-thumb,
.ui.field.gray input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].gray::-webkit-slider-thumb,
.ui.field input[type=range].gray::-webkit-slider-thumb,
.ui.form .field.gray input[type=range]::-webkit-slider-thumb,
.ui.form .input.gray input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].gray::-webkit-slider-thumb,
.ui.input.searchable.gray,
.ui.input.searchable.gray .menu,
.ui.input.searchable.gray .content .tag,
.ui.input.dropdown.gray,
.ui.input.dropdown.gray .menu,
.ui.input.dropdown.gray .content .tag,
.ui.input.datepicker.gray .calendar,
.ui.input.datepicker.gray .calendar-day.today,
.ui.input.timepicker.gray .time-selector,
.ui.input.timepicker.gray .time-selector .time-wheel,
.ui.input.timepicker.gray .time-selector .time-wheel::before,
.ui.input.datetimepicker.gray .calendar,
.ui.input.datetimepicker.gray .time-selector,
.ui.input.datetimepicker.gray .calendar-day.today,
.ui.input.datetimepicker.gray .time-selector .time-wheel,
.ui.input.datetimepicker.gray .time-selector .time-wheel::before,
.ui.table.gray,
.ui.table.gray .table-pagination > button {
  border-color: #adb5bd;
}

/* Button */
.ui.button.gray.outline:hover,
.ui.input.gray input:focus,
.ui.input input[type=file].gray:focus,
.ui.field.gray input:focus,
.ui.field input[type=file].gray:focus,
.ui.input.gray textarea:focus,
.ui.input textarea.gray:focus,
.ui.field.gray textarea:focus,
.ui.field textarea.gray:focus,
.ui.input.gray input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].gray.outline::file-selector-button:hover,
.ui.field.gray input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].gray.outline::file-selector-button:hover,
.ui.checkbox.gray:hover > .checkbox-box,
.ui.field.gray .checkbox:hover > .checkbox-box,
.ui.field .checkbox.gray:hover > .checkbox-box,
.ui.radio.gray:hover > .radio-circle,
.ui.field.gray .radio:hover > .radio-circle,
.ui.field .radio.gray:hover > .radio-circle,
.ui.input.gray input[type=range]::-webkit-slider-thumb:hover,
.ui.field.gray input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].gray::-webkit-slider-thumb:hover,
.ui.field input[type=range].gray::-webkit-slider-thumb:hover,
.ui.input.gray input[type=range]::-webkit-slider-thumb:active,
.ui.field.gray input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].gray::-webkit-slider-thumb:active,
.ui.field input[type=range].gray::-webkit-slider-thumb:active,
.ui.input.searchable.gray:focus,
.ui.input.searchable.gray.active,
.ui.input.dropdown.gray:focus,
.ui.input.dropdown.gray.active,
.ui.input.datepicker.gray.active > input,
.ui.input.timepicker.gray.active > input,
.ui.input.datetimepicker.gray.active > input,
.ui.tabs.gray > .header > .tab:hover,
.ui.tabs > .header > .tab.gray:hover,
.ui.tabs.gray > .header > .tab.active,
.ui.tabs > .header > .tab.gray.active,
.ui.tabs.gray:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.gray.active):not(.simple) > .content,
.ui.table.gray .table-pagination > button.active,
.ui.tag.gray {
  border-color: #6c757d;
}

/* Loading Dots */
.ui.loading.circular.gray::before {
  border-top-color: #6c757d;
}

/* Checkbox */
.ui.checkbox.gray > .checkbox-box i,
.ui.field.gray .checkbox > .checkbox-box i,
.ui.field .checkbox.gray > .checkbox-box i {
  color: #e9ecef;
}

/* Message */
.ui.message.gray:not(.inverted) > i,
.ui.button.gray.outline:not(:hover),
.ui.input.gray > i,
.ui.field.gray .input > i,
.ui.field .input.gray > i,
.ui.input.gray > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.gray input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.gray input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.gray input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.gray input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.gray:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.gray:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.gray.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.gray.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.gray.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.gray.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.gray .time-selector .time-wheel-item.selected,
.ui.input.timepicker.gray .time-selector .time-wheel-divider,
.ui.input.datetimepicker.gray.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.gray .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.gray .time-selector .time-wheel-divider,
.ui.tag.gray:not(.action),
.ui.tag.gray:not(:active) {
  color: #6c757d;
}

/* Table */
.ui.table.gray:not(.inverted) > thead,
.ui.table.gray:not(.inverted) > tfoot {
  background: color-mix(in srgb, #e9ecef 50%, #adb5bd 50%);
}

/* Table Inverted */
.ui.table.gray.inverted > thead,
.ui.table.gray.inverted > tfoot {
  background: color-mix(in srgb, #6c757d 50%, #adb5bd 50%);
}

.ui.card.dark:not(.inverted),
.ui.message.dark:not(.inverted),
.ui.table.dark:not(.inverted),
.ui.table.dark:not(.inverted) > .table-pagination > button,
.ui.carousel.dark .arrow,
.ui.carousel.dark .indicator {
  background-color: #dee2e6;
}

/* Button */
.ui.button.dark:not(.outline):hover,
.ui.input.dark input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.dark input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.dark input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].dark:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].dark:not(.outline)::file-selector-button:hover,
.ui.form .input.dark input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.dark input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].dark:not(.outline)::file-selector-button:hover,
.ui.checkbox.dark > input[type=checkbox]:checked + .checkbox-box,
.ui.field.dark .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.dark > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.dark .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.dark > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.dark > .radio-circle::before,
.ui.field.dark .radio > .radio-circle::before,
.ui.field .radio.dark > .radio-circle::before,
.ui.form .field.dark .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.dark > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.dark > input[type=checkbox]:checked + .toggle-switch,
.ui.field.dark .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.dark > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.dark .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.dark > input[type=checkbox]:checked + .toggle-switch,
.ui.input.dark input[type=range]:hover,
.ui.field.dark input[type=range]:hover,
.ui.field .input.dark input[type=range]:hover,
.ui.input input[type=range].dark:hover,
.ui.field input[type=range].dark:hover,
.ui.form .field.dark input[type=range]:hover,
.ui.form .input.dark input[type=range]:hover,
.ui.form input[type=range].dark:hover,
.ui.input.spinner.dark:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.dark:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.dark.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.dark .content .tag:hover,
.ui.input.searchable.dark > .menu > .item:hover,
.ui.input.dropdown.dark.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.dark .content .tag:hover,
.ui.input.dropdown.dark > .menu > .item:hover,
.ui.input.datepicker.dark.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.dark .calendar .calendar-nav button:hover,
.ui.input.datepicker.dark .calendar .calendar-title:hover,
.ui.input.datepicker.dark .calendar .calendar-year:hover,
.ui.input.datepicker.dark .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.dark.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.dark.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.dark .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.dark .calendar .calendar-title:hover,
.ui.input.datetimepicker.dark .calendar .calendar-year:hover,
.ui.input.datetimepicker.dark .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.dark > .header > .tab:hover,
.ui.tabs.dark > .header > .tab.active,
.ui.tabs > .header > .tab.dark:hover,
.ui.tabs > .header > .tab.dark.active,
.ui.accordion.card.dark:not(.active) > .header:hover::after,
.ui.tabs.dark:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.dark.active):not(.simple) > .content,
.ui.table.dark .table-pagination > button:hover:not(:disabled),
.ui.carousel.dark .arrow:hover,
.ui.carousel.dark .indicator:hover,
.ui.loading.dots.dark > span,
.ui.tag.action.dark:hover {
  background-color: #6c757d;
}

/* Card */
.ui.card.dark.inverted,
.ui.message.dark.inverted,
.ui.table.dark.inverted,
.ui.divider.dark,
.ui.separator.dark,
.ui.button.dark:not(.outline),
.ui.button.dark.outline:hover,
.ui.input.dark input[type=file]:not(.outline)::file-selector-button,
.ui.field.dark input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].dark:not(.outline)::file-selector-button,
.ui.field input[type=file].dark:not(.outline)::file-selector-button,
.ui.form .field.dark input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.dark input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].dark:not(.outline)::file-selector-button:hover,
.ui.input.dark input[type=file].outline::file-selector-button:hover,
.ui.field.dark input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].dark.outline::file-selector-button:hover,
.ui.field input[type=file].dark.outline::file-selector-button:hover,
.ui.form .field.dark input[type=file].outline::file-selector-button:hover,
.ui.form .input.dark input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].dark.outline::file-selector-button:hover,
.ui.checkbox.dark:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.dark .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.dark:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.dark .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.dark:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.dark:hover > .radio-circle::before,
.ui.field.dark .radio:hover > .radio-circle::before,
.ui.field .radio.dark:hover > .radio-circle::before,
.ui.form .field.dark .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.dark:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.dark:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.dark .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.dark:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.dark .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.dark:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.dark input[type=range]:focus,
.ui.field.dark input[type=range]:focus,
.ui.input input[type=range].dark:focus,
.ui.field input[type=range].dark:focus,
.ui.form .field.dark input[type=range]:focus,
.ui.form .input.dark input[type=range]:focus,
.ui.form input[type=range].dark:focus,
.ui.input.spinner.dark.pressing-up::before,
.ui.input.spinner.dark.pressing-down::after,
.ui.input.searchable.dark.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.dark .content .tag:active,
.ui.input.searchable.dark > .menu > .item.highlighted,
.ui.input.searchable.dark > .menu > .item:active,
.ui.input.dropdown.dark.action-button.active.arrow::after,
.ui.input.dropdown.dark .content .tag:active,
.ui.input.dropdown.dark > .menu > .item.highlighted,
.ui.input.dropdown.dark > .menu > .item:active,
.ui.input.datepicker.dark .calendar .calendar-nav button:active,
.ui.input.datepicker.dark .calendar .calendar-title:active,
.ui.input.datepicker.dark .calendar .calendar-year:active,
.ui.input.datepicker.dark .calendar .calendar-year.selected,
.ui.input.datepicker.dark .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.dark .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.dark .calendar .calendar-nav button:active,
.ui.input.datetimepicker.dark .calendar .calendar-title:active,
.ui.input.datetimepicker.dark .calendar .calendar-year:active,
.ui.input.datetimepicker.dark .calendar .calendar-year.selected,
.ui.input.datetimepicker.dark .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.dark .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.dark.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.dark.action-button.active.arrow::after,
.ui.input.timepicker.dark.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.dark.action-button.active.arrow::after,
.ui.input.datetimepicker.dark.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.dark.action-button.active.arrow::after,
.ui.tabs.dark > .header > .tab:active,
.ui.tabs > .header > .tab.dark:active,
.ui.tabs.dark.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.dark.active:not(:active),
.ui.tabs > .header > .tab.dark.active.inverted:not(:active),
.ui.tabs.dark.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.dark.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.dark.active.inverted):not(.simple) > .content,
.ui.accordion.card.dark > .header:active::after,
.ui.accordion.card:not(.active).dark.active > .header::after,
.ui.table.dark .table-pagination > button:active:not(:disabled),
.ui.table.dark .table-pagination > button.active,
.ui.carousel.dark .arrow:active,
.ui.carousel.dark .arrow.active,
.ui.carousel.dark .indicator:active,
.ui.carousel.dark .indicator.active,
.ui.tooltip.dark,
.ui.tooltip.dark::after,
.ui.progress.dark .fill,
.ui.progress .fill.dark,
.ui.tag.action.dark:active {
  background-color: #343a40;
}

/* Card */
.ui.card.dark,
.ui.message.dark,
.ui.button.dark.outline,
.ui.input.dark input,
.ui.field.dark input,
.ui.field .input.dark input,
.ui.form .field.dark input,
.ui.form .input.dark input,
.ui.input input.dark,
.ui.field input.dark,
.ui.form input.dark,
.ui.input.dark textarea,
.ui.field.dark textarea,
.ui.field .input.dark textarea,
.ui.form .field.dark textarea,
.ui.form .input.dark textarea,
.ui.input textarea.dark,
.ui.field textarea.dark,
.ui.form textarea.dark,
.ui.input.dark input[type=file].outline::file-selector-button,
.ui.field.dark input[type=file].outline::file-selector-button,
.ui.field .input.dark input[type=file].outline::file-selector-button,
.ui.input input[type=file].dark.outline::file-selector-button,
.ui.field input[type=file].dark.outline::file-selector-button,
.ui.form input[type=file].dark.outline::file-selector-button,
.ui.radio.dark > .radio-circle,
.ui.field.dark .radio > .radio-circle,
.ui.field .radio.dark > .radio-circle,
.ui.checkbox.dark > .checkbox-box,
.ui.field.dark .checkbox > .checkbox-box,
.ui.field .checkbox.dark > .checkbox-box,
.ui.input.dark input[type=range]::-webkit-slider-thumb,
.ui.field.dark input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].dark::-webkit-slider-thumb,
.ui.field input[type=range].dark::-webkit-slider-thumb,
.ui.form .field.dark input[type=range]::-webkit-slider-thumb,
.ui.form .input.dark input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].dark::-webkit-slider-thumb,
.ui.input.searchable.dark,
.ui.input.searchable.dark .menu,
.ui.input.searchable.dark .content .tag,
.ui.input.dropdown.dark,
.ui.input.dropdown.dark .menu,
.ui.input.dropdown.dark .content .tag,
.ui.input.datepicker.dark .calendar,
.ui.input.datepicker.dark .calendar-day.today,
.ui.input.timepicker.dark .time-selector,
.ui.input.timepicker.dark .time-selector .time-wheel,
.ui.input.timepicker.dark .time-selector .time-wheel::before,
.ui.input.datetimepicker.dark .calendar,
.ui.input.datetimepicker.dark .time-selector,
.ui.input.datetimepicker.dark .calendar-day.today,
.ui.input.datetimepicker.dark .time-selector .time-wheel,
.ui.input.datetimepicker.dark .time-selector .time-wheel::before,
.ui.table.dark,
.ui.table.dark .table-pagination > button {
  border-color: #6c757d;
}

/* Button */
.ui.button.dark.outline:hover,
.ui.input.dark input:focus,
.ui.input input[type=file].dark:focus,
.ui.field.dark input:focus,
.ui.field input[type=file].dark:focus,
.ui.input.dark textarea:focus,
.ui.input textarea.dark:focus,
.ui.field.dark textarea:focus,
.ui.field textarea.dark:focus,
.ui.input.dark input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].dark.outline::file-selector-button:hover,
.ui.field.dark input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].dark.outline::file-selector-button:hover,
.ui.checkbox.dark:hover > .checkbox-box,
.ui.field.dark .checkbox:hover > .checkbox-box,
.ui.field .checkbox.dark:hover > .checkbox-box,
.ui.radio.dark:hover > .radio-circle,
.ui.field.dark .radio:hover > .radio-circle,
.ui.field .radio.dark:hover > .radio-circle,
.ui.input.dark input[type=range]::-webkit-slider-thumb:hover,
.ui.field.dark input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].dark::-webkit-slider-thumb:hover,
.ui.field input[type=range].dark::-webkit-slider-thumb:hover,
.ui.input.dark input[type=range]::-webkit-slider-thumb:active,
.ui.field.dark input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].dark::-webkit-slider-thumb:active,
.ui.field input[type=range].dark::-webkit-slider-thumb:active,
.ui.input.searchable.dark:focus,
.ui.input.searchable.dark.active,
.ui.input.dropdown.dark:focus,
.ui.input.dropdown.dark.active,
.ui.input.datepicker.dark.active > input,
.ui.input.timepicker.dark.active > input,
.ui.input.datetimepicker.dark.active > input,
.ui.tabs.dark > .header > .tab:hover,
.ui.tabs > .header > .tab.dark:hover,
.ui.tabs.dark > .header > .tab.active,
.ui.tabs > .header > .tab.dark.active,
.ui.tabs.dark:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.dark.active):not(.simple) > .content,
.ui.table.dark .table-pagination > button.active,
.ui.tag.dark {
  border-color: #343a40;
}

/* Loading Dots */
.ui.loading.circular.dark::before {
  border-top-color: #343a40;
}

/* Checkbox */
.ui.checkbox.dark > .checkbox-box i,
.ui.field.dark .checkbox > .checkbox-box i,
.ui.field .checkbox.dark > .checkbox-box i {
  color: #dee2e6;
}

/* Message */
.ui.message.dark:not(.inverted) > i,
.ui.button.dark.outline:not(:hover),
.ui.input.dark > i,
.ui.field.dark .input > i,
.ui.field .input.dark > i,
.ui.input.dark > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.dark input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.dark input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.dark input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.dark input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.dark:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.dark:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.dark.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.dark.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.dark.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.dark.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.dark .time-selector .time-wheel-item.selected,
.ui.input.timepicker.dark .time-selector .time-wheel-divider,
.ui.input.datetimepicker.dark.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.dark .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.dark .time-selector .time-wheel-divider,
.ui.tag.dark:not(.action),
.ui.tag.dark:not(:active) {
  color: #343a40;
}

/* Table */
.ui.table.dark:not(.inverted) > thead,
.ui.table.dark:not(.inverted) > tfoot {
  background: color-mix(in srgb, #dee2e6 50%, #6c757d 50%);
}

/* Table Inverted */
.ui.table.dark.inverted > thead,
.ui.table.dark.inverted > tfoot {
  background: color-mix(in srgb, #343a40 50%, #6c757d 50%);
}

.ui.card.light:not(.inverted),
.ui.message.light:not(.inverted),
.ui.table.light:not(.inverted),
.ui.table.light:not(.inverted) > .table-pagination > button,
.ui.carousel.light .arrow,
.ui.carousel.light .indicator {
  background-color: #ffffff;
}

/* Button */
.ui.button.light:not(.outline):hover,
.ui.input.light input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field.light input[type=file]:not(.outline)::file-selector-button:hover,
.ui.field .input.light input[type=file]:not(.outline)::file-selector-button:hover,
.ui.input input[type=file].light:not(.outline)::file-selector-button:hover,
.ui.field input[type=file].light:not(.outline)::file-selector-button:hover,
.ui.form .input.light input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form .field.light input[type=file]:not(.outline)::file-selector-button:hover,
.ui.form input[type=file].light:not(.outline)::file-selector-button:hover,
.ui.checkbox.light > input[type=checkbox]:checked + .checkbox-box,
.ui.field.light .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.light > input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.light .checkbox > input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.light > input[type=checkbox]:checked + .checkbox-box,
.ui.radio.light > .radio-circle::before,
.ui.field.light .radio > .radio-circle::before,
.ui.field .radio.light > .radio-circle::before,
.ui.form .field.light .radio > input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.light > input[type=radio]:checked + .radio-circle::before,
.ui.toggle.light > input[type=checkbox]:checked + .toggle-switch,
.ui.field.light .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.light > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.light .toggle > input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.light > input[type=checkbox]:checked + .toggle-switch,
.ui.input.light input[type=range]:hover,
.ui.field.light input[type=range]:hover,
.ui.field .input.light input[type=range]:hover,
.ui.input input[type=range].light:hover,
.ui.field input[type=range].light:hover,
.ui.form .field.light input[type=range]:hover,
.ui.form .input.light input[type=range]:hover,
.ui.form input[type=range].light:hover,
.ui.input.spinner.light:not(.pressing-up):not(.clear):hover::before,
.ui.input.spinner.light:not(.pressing-up):not(.clear):hover::after,
.ui.input.searchable.light.action-button:not(.pressing):not(.active):not(.clear):not(.add):hover::after,
.ui.input.searchable.light .content .tag:hover,
.ui.input.searchable.light > .menu > .item:hover,
.ui.input.dropdown.light.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.dropdown.light .content .tag:hover,
.ui.input.dropdown.light > .menu > .item:hover,
.ui.input.datepicker.light.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datepicker.light .calendar .calendar-nav button:hover,
.ui.input.datepicker.light .calendar .calendar-title:hover,
.ui.input.datepicker.light .calendar .calendar-year:hover,
.ui.input.datepicker.light .calendar .calendar-day:not(.other-month):hover,
.ui.input.timepicker.light.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.light.action-button:not(.pressing):not(.active):not(.clear):hover::after,
.ui.input.datetimepicker.light .calendar .calendar-nav button:hover,
.ui.input.datetimepicker.light .calendar .calendar-title:hover,
.ui.input.datetimepicker.light .calendar .calendar-year:hover,
.ui.input.datetimepicker.light .calendar .calendar-day:not(.other-month):hover,
.ui.tabs.light > .header > .tab:hover,
.ui.tabs.light > .header > .tab.active,
.ui.tabs > .header > .tab.light:hover,
.ui.tabs > .header > .tab.light.active,
.ui.accordion.card.light:not(.active) > .header:hover::after,
.ui.tabs.light:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.light.active):not(.simple) > .content,
.ui.table.light .table-pagination > button:hover:not(:disabled),
.ui.carousel.light .arrow:hover,
.ui.carousel.light .indicator:hover,
.ui.loading.dots.light > span,
.ui.tag.action.light:hover {
  background-color: #ffffff;
}

/* Card */
.ui.card.light.inverted,
.ui.message.light.inverted,
.ui.table.light.inverted,
.ui.divider.light,
.ui.separator.light,
.ui.button.light:not(.outline),
.ui.button.light.outline:hover,
.ui.input.light input[type=file]:not(.outline)::file-selector-button,
.ui.field.light input[type=file]:not(.outline)::file-selector-button,
.ui.input input[type=file].light:not(.outline)::file-selector-button,
.ui.field input[type=file].light:not(.outline)::file-selector-button,
.ui.form .field.light input[type=file]:not(.outline)::file-selector-button,
.ui.form .input.light input[type=file]:not(.outline)::file-selector-button,
.ui.form input[type=file].light:not(.outline)::file-selector-button:hover,
.ui.input.light input[type=file].outline::file-selector-button:hover,
.ui.field.light input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].light.outline::file-selector-button:hover,
.ui.field input[type=file].light.outline::file-selector-button:hover,
.ui.form .field.light input[type=file].outline::file-selector-button:hover,
.ui.form .input.light input[type=file].outline::file-selector-button:hover,
.ui.form input[type=file].light.outline::file-selector-button:hover,
.ui.checkbox.light:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field.light .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.field .checkbox.light:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .field.light .checkbox:hover input[type=checkbox]:checked + .checkbox-box,
.ui.form .checkbox.light:hover input[type=checkbox]:checked + .checkbox-box,
.ui.radio.light:hover > .radio-circle::before,
.ui.field.light .radio:hover > .radio-circle::before,
.ui.field .radio.light:hover > .radio-circle::before,
.ui.form .field.light .radio:hover input[type=radio]:checked + .radio-circle::before,
.ui.form .radio.light:hover input[type=radio]:checked + .radio-circle::before,
.ui.toggle.light:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field.light .toggle:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.field .toggle.light:hover > input[type=checkbox]:checked + .toggle-switch,
.ui.form .field.light .toggle:hover input[type=checkbox]:checked + .toggle-switch,
.ui.form .toggle.light:hover input[type=checkbox]:checked + .toggle-switch,
.ui.input.light input[type=range]:focus,
.ui.field.light input[type=range]:focus,
.ui.input input[type=range].light:focus,
.ui.field input[type=range].light:focus,
.ui.form .field.light input[type=range]:focus,
.ui.form .input.light input[type=range]:focus,
.ui.form input[type=range].light:focus,
.ui.input.spinner.light.pressing-up::before,
.ui.input.spinner.light.pressing-down::after,
.ui.input.searchable.light.action-button.pressing:not(.clear):not(.add)::after,
.ui.input.searchable.light .content .tag:active,
.ui.input.searchable.light > .menu > .item.highlighted,
.ui.input.searchable.light > .menu > .item:active,
.ui.input.dropdown.light.action-button.active.arrow::after,
.ui.input.dropdown.light .content .tag:active,
.ui.input.dropdown.light > .menu > .item.highlighted,
.ui.input.dropdown.light > .menu > .item:active,
.ui.input.datepicker.light .calendar .calendar-nav button:active,
.ui.input.datepicker.light .calendar .calendar-title:active,
.ui.input.datepicker.light .calendar .calendar-year:active,
.ui.input.datepicker.light .calendar .calendar-year.selected,
.ui.input.datepicker.light .calendar .calendar-day:not(.other-month):active,
.ui.input.datepicker.light .calendar .calendar-day:not(.other-month).selected,
.ui.input.datetimepicker.light .calendar .calendar-nav button:active,
.ui.input.datetimepicker.light .calendar .calendar-title:active,
.ui.input.datetimepicker.light .calendar .calendar-year:active,
.ui.input.datetimepicker.light .calendar .calendar-year.selected,
.ui.input.datetimepicker.light .calendar .calendar-day:not(.other-month):active,
.ui.input.datetimepicker.light .calendar .calendar-day:not(.other-month).selected,
.ui.input.datepicker.light.action-button.pressing:not(.clear)::after,
.ui.input.datepicker.light.action-button.active.arrow::after,
.ui.input.timepicker.light.action-button.pressing:not(.clear)::after,
.ui.input.timepicker.light.action-button.active.arrow::after,
.ui.input.datetimepicker.light.action-button.pressing:not(.clear)::after,
.ui.input.datetimepicker.light.action-button.active.arrow::after,
.ui.tabs.light > .header > .tab:active,
.ui.tabs > .header > .tab.light:active,
.ui.tabs.light.inverted > .header > .tab.active:not(:active),
.ui.tabs.inverted > .header > .tab.light.active:not(:active),
.ui.tabs > .header > .tab.light.active.inverted:not(:active),
.ui.tabs.light.inverted:not(.simple) > .content,
.ui.tabs.inverted:has(> .header > .tab.light.active):not(.simple) > .content,
.ui.tabs:has(> .header > .tab.light.active.inverted):not(.simple) > .content,
.ui.accordion.card.light > .header:active::after,
.ui.accordion.card:not(.active).light.active > .header::after,
.ui.table.light .table-pagination > button:active:not(:disabled),
.ui.table.light .table-pagination > button.active,
.ui.carousel.light .arrow:active,
.ui.carousel.light .arrow.active,
.ui.carousel.light .indicator:active,
.ui.carousel.light .indicator.active,
.ui.tooltip.light,
.ui.tooltip.light::after,
.ui.progress.light .fill,
.ui.progress .fill.light,
.ui.tag.action.light:active {
  background-color: #f8f9fa;
}

/* Card */
.ui.card.light,
.ui.message.light,
.ui.button.light.outline,
.ui.input.light input,
.ui.field.light input,
.ui.field .input.light input,
.ui.form .field.light input,
.ui.form .input.light input,
.ui.input input.light,
.ui.field input.light,
.ui.form input.light,
.ui.input.light textarea,
.ui.field.light textarea,
.ui.field .input.light textarea,
.ui.form .field.light textarea,
.ui.form .input.light textarea,
.ui.input textarea.light,
.ui.field textarea.light,
.ui.form textarea.light,
.ui.input.light input[type=file].outline::file-selector-button,
.ui.field.light input[type=file].outline::file-selector-button,
.ui.field .input.light input[type=file].outline::file-selector-button,
.ui.input input[type=file].light.outline::file-selector-button,
.ui.field input[type=file].light.outline::file-selector-button,
.ui.form input[type=file].light.outline::file-selector-button,
.ui.radio.light > .radio-circle,
.ui.field.light .radio > .radio-circle,
.ui.field .radio.light > .radio-circle,
.ui.checkbox.light > .checkbox-box,
.ui.field.light .checkbox > .checkbox-box,
.ui.field .checkbox.light > .checkbox-box,
.ui.input.light input[type=range]::-webkit-slider-thumb,
.ui.field.light input[type=range]::-webkit-slider-thumb,
.ui.input input[type=range].light::-webkit-slider-thumb,
.ui.field input[type=range].light::-webkit-slider-thumb,
.ui.form .field.light input[type=range]::-webkit-slider-thumb,
.ui.form .input.light input[type=range]::-webkit-slider-thumb,
.ui.form input[type=range].light::-webkit-slider-thumb,
.ui.input.searchable.light,
.ui.input.searchable.light .menu,
.ui.input.searchable.light .content .tag,
.ui.input.dropdown.light,
.ui.input.dropdown.light .menu,
.ui.input.dropdown.light .content .tag,
.ui.input.datepicker.light .calendar,
.ui.input.datepicker.light .calendar-day.today,
.ui.input.timepicker.light .time-selector,
.ui.input.timepicker.light .time-selector .time-wheel,
.ui.input.timepicker.light .time-selector .time-wheel::before,
.ui.input.datetimepicker.light .calendar,
.ui.input.datetimepicker.light .time-selector,
.ui.input.datetimepicker.light .calendar-day.today,
.ui.input.datetimepicker.light .time-selector .time-wheel,
.ui.input.datetimepicker.light .time-selector .time-wheel::before,
.ui.table.light,
.ui.table.light .table-pagination > button {
  border-color: #ffffff;
}

/* Button */
.ui.button.light.outline:hover,
.ui.input.light input:focus,
.ui.input input[type=file].light:focus,
.ui.field.light input:focus,
.ui.field input[type=file].light:focus,
.ui.input.light textarea:focus,
.ui.input textarea.light:focus,
.ui.field.light textarea:focus,
.ui.field textarea.light:focus,
.ui.input.light input[type=file].outline::file-selector-button:hover,
.ui.input input[type=file].light.outline::file-selector-button:hover,
.ui.field.light input[type=file].outline::file-selector-button:hover,
.ui.field input[type=file].light.outline::file-selector-button:hover,
.ui.checkbox.light:hover > .checkbox-box,
.ui.field.light .checkbox:hover > .checkbox-box,
.ui.field .checkbox.light:hover > .checkbox-box,
.ui.radio.light:hover > .radio-circle,
.ui.field.light .radio:hover > .radio-circle,
.ui.field .radio.light:hover > .radio-circle,
.ui.input.light input[type=range]::-webkit-slider-thumb:hover,
.ui.field.light input[type=range]::-webkit-slider-thumb:hover,
.ui.input input[type=range].light::-webkit-slider-thumb:hover,
.ui.field input[type=range].light::-webkit-slider-thumb:hover,
.ui.input.light input[type=range]::-webkit-slider-thumb:active,
.ui.field.light input[type=range]::-webkit-slider-thumb:active,
.ui.input input[type=range].light::-webkit-slider-thumb:active,
.ui.field input[type=range].light::-webkit-slider-thumb:active,
.ui.input.searchable.light:focus,
.ui.input.searchable.light.active,
.ui.input.dropdown.light:focus,
.ui.input.dropdown.light.active,
.ui.input.datepicker.light.active > input,
.ui.input.timepicker.light.active > input,
.ui.input.datetimepicker.light.active > input,
.ui.tabs.light > .header > .tab:hover,
.ui.tabs > .header > .tab.light:hover,
.ui.tabs.light > .header > .tab.active,
.ui.tabs > .header > .tab.light.active,
.ui.tabs.light:not(.simple) > .content,
.ui.tabs:has(> .header > .tab.light.active):not(.simple) > .content,
.ui.table.light .table-pagination > button.active,
.ui.tag.light {
  border-color: #f8f9fa;
}

/* Loading Dots */
.ui.loading.circular.light::before {
  border-top-color: #f8f9fa;
}

/* Checkbox */
.ui.checkbox.light > .checkbox-box i,
.ui.field.light .checkbox > .checkbox-box i,
.ui.field .checkbox.light > .checkbox-box i {
  color: #ffffff;
}

/* Message */
.ui.message.light:not(.inverted) > i,
.ui.button.light.outline:not(:hover),
.ui.input.light > i,
.ui.field.light .input > i,
.ui.field .input.light > i,
.ui.input.light > input[type=file].outline::file-selector-button:not(:hover),
.ui.field.light input[type=file].outline::file-selector-button:not(:hover),
.ui.field .input.light input[type=file].outline::file-selector-button:not(:hover),
.ui.form .field.light input[type=file].outline::file-selector-button:not(:hover),
.ui.form .input.light input[type=file].outline::file-selector-button:not(:hover),
.ui.input.spinner.light:not(.clear):not(.pressing-up)::before,
.ui.input.spinner.light:not(.clear):not(.pressing-down)::after,
.ui.input.searchable.light.action-button:not(.clear):not(.add):not(.active)::after,
.ui.input.dropdown.light.action-button:not(.clear):not(.active)::after,
.ui.input.datepicker.light.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.light.action-button:not(.clear):not(.active)::after,
.ui.input.timepicker.light .time-selector .time-wheel-item.selected,
.ui.input.timepicker.light .time-selector .time-wheel-divider,
.ui.input.datetimepicker.light.action-button:not(.clear):not(.active)::after,
.ui.input.datetimepicker.light .time-selector .time-wheel-item.selected,
.ui.input.datetimepicker.light .time-selector .time-wheel-divider,
.ui.tag.light:not(.action),
.ui.tag.light:not(:active) {
  color: #f8f9fa;
}

/* Table */
.ui.table.light:not(.inverted) > thead,
.ui.table.light:not(.inverted) > tfoot {
  background: color-mix(in srgb, #ffffff 50%, #ffffff 50%);
}

/* Table Inverted */
.ui.table.light.inverted > thead,
.ui.table.light.inverted > tfoot {
  background: color-mix(in srgb, #f8f9fa 50%, #ffffff 50%);
}/*# sourceMappingURL=lib.css.map */