[data-gin-accent] {
  --colorGinPrimary: rgb(var(--colorGinPrimaryRGB));
  --colorGinPrimaryLight: rgba(var(--colorGinPrimaryRGB), .15);
  --colorGinAppBackground: rgb(var(--colorGinAppBackgroundRGB));
  --colorGinItemHover: rgba(var(--colorGinPrimaryRGB), .1);
  --colorGinPrimaryLightHover: rgba(var(--colorGinPrimaryRGB), .2);
  --colorGinPrimaryLightActive: rgba(var(--colorGinPrimaryRGB), .3);
  --colorGinPrimaryLightShadow: rgba(var(--colorGinPrimaryRGB), .45);
  --colorGinTableHeader2: #F0F0F0;
}

.gin--dark-mode[data-gin-accent],
.gin--dark-mode [data-gin-accent] {
  --colorGinItemHover: rgba(var(--colorGinPrimaryRGB), .08);
  --colorGinAppBackgroundRGB: 27, 27, 29;
}

[data-gin-accent=custom] {
  --colorGinPrimaryLightRGB: 207, 207, 207;
  --colorGinPrimaryHover: var(--colorGinText) !important;
  --colorGinPrimaryActive: var(--colorGinText) !important;
  --colorGinAppBackgroundRGB: 255, 255, 255 !important;
  --colorGinTableHeader: #F0F0F0 !important;
}

.gin--dark-mode[data-gin-accent=blue],
.gin--dark-mode [data-gin-accent=blue] {
  --colorGinPrimaryRGB: 144, 174, 239;
  --colorGinPrimaryLightRGB: 62, 68, 84;
  --colorGinPrimaryHover: #9bb6f1;
  --colorGinPrimaryActive: #a1baf1;
  --colorGinTableHeader: #373b45;
}

.gin--dark-mode[data-gin-accent=claro_blue],
.gin--dark-mode [data-gin-accent=claro_blue] {
  --colorGinPrimaryRGB: 115, 145, 216;
  --colorGinPrimaryLightRGB: 57, 63, 79;
  --colorGinPrimaryHover: #819cdc;
  --colorGinPrimaryActive: #88a2de;
  --colorGinTableHeader: #333742;
}

.gin--dark-mode[data-gin-accent=light_blue],
.gin--dark-mode [data-gin-accent=light_blue] {
  --colorGinPrimaryRGB: 130, 191, 232;
  --colorGinPrimaryLightRGB: 60, 72, 82;
  --colorGinPrimaryHover: #8fc5ea;
  --colorGinPrimaryActive: #95c9eb;
  --colorGinTableHeader: #353d44;
}

.gin--dark-mode[data-gin-accent=dark_purple],
.gin--dark-mode [data-gin-accent=dark_purple] {
  --colorGinPrimaryRGB: 173, 143, 232;
  --colorGinPrimaryLightRGB: 68, 62, 82;
  --colorGinPrimaryHover: #b59aea;
  --colorGinPrimaryActive: #b9a0eb;
  --colorGinTableHeader: #3a3744;
}

.gin--dark-mode[data-gin-accent=purple],
.gin--dark-mode [data-gin-accent=purple] {
  --colorGinPrimaryRGB: 219, 165, 239;
  --colorGinPrimaryLightRGB: 77, 67, 84;
  --colorGinPrimaryHover: #dfaef1;
  --colorGinPrimaryActive: #e0b3f1;
  --colorGinTableHeader: #403945;
}

.gin--dark-mode[data-gin-accent=teal],
.gin--dark-mode [data-gin-accent=teal] {
  --colorGinPrimaryRGB: 0, 234, 208;
  --colorGinPrimaryLightRGB: 34, 80, 78;
  --colorGinPrimaryHover: #1aecd5;
  --colorGinPrimaryActive: #26edd7;
  --colorGinTableHeader: #254241;
}

.gin--dark-mode[data-gin-accent=green],
.gin--dark-mode [data-gin-accent=green] {
  --colorGinPrimaryRGB: 107, 212, 161;
  --colorGinPrimaryLightRGB: 55, 76, 68;
  --colorGinPrimaryHover: #7ad8aa;
  --colorGinPrimaryActive: #81daaf;
  --colorGinTableHeader: #323f3c;
}

.gin--dark-mode[data-gin-accent=red],
.gin--dark-mode [data-gin-accent=red] {
  --colorGinPrimaryRGB: 236, 137, 137;
  --colorGinPrimaryLightRGB: 81, 61, 63;
  --colorGinPrimaryHover: #ee9595;
  --colorGinPrimaryActive: #ef9b9b;
  --colorGinTableHeader: #423639;
}

.gin--dark-mode[data-gin-accent=orange],
.gin--dark-mode [data-gin-accent=orange] {
  --colorGinPrimaryRGB: 247, 149, 118;
  --colorGinPrimaryLightRGB: 83, 63, 60;
  --colorGinPrimaryHover: #f8a084;
  --colorGinPrimaryActive: #f8a58b;
  --colorGinTableHeader: #443736;
}

.gin--dark-mode[data-gin-accent=yellow],
.gin--dark-mode [data-gin-accent=yellow] {
  --colorGinPrimaryRGB: 241, 201, 112;
  --colorGinPrimaryLightRGB: 82, 74, 58;
  --colorGinPrimaryHover: #f2ce7e;
  --colorGinPrimaryActive: #f3d185;
  --colorGinTableHeader: #433e35;
}

.gin--dark-mode[data-gin-accent=pink],
.gin--dark-mode [data-gin-accent=pink] {
  --colorGinPrimaryRGB: 231, 157, 163;
  --colorGinPrimaryLightRGB: 80, 65, 69;
  --colorGinPrimaryHover: #e9a7ac;
  --colorGinPrimaryActive: #ebacb1;
  --colorGinTableHeader: #42383c;
}

.gin--dark-mode[data-gin-accent=neutral],
.gin--dark-mode [data-gin-accent=neutral] {
  --colorGinPrimaryRGB: 255, 255, 255;
  --colorGinPrimaryLightRGB: 85, 85, 87;
  --colorGinPrimaryHover: white;
  --colorGinPrimaryActive: white;
  --colorGinTableHeader: #454547;
}

.gin--dark-mode[data-gin-accent=custom],
.gin--dark-mode [data-gin-accent=custom] {
  --colorGinPrimaryRGB: 255, 255, 255;
  --colorGinPrimaryLightRGB: 85, 85, 87;
  --colorGinPrimaryHover: white;
  --colorGinPrimaryActive: white;
  --colorGinTableHeader: #454547;
}

.gin--high-contrast-mode {
  --colorGinAppBackground: #d9dbde;
  --colorGinText: rgba(0, 0, 0, .8);
  --colorGinTextLight: rgba(0, 0, 0, .8);
  --colorGinIcons: rgba(0, 0, 0, .8);
  --colorGinFocus: rgba(0, 0, 0, .8);
  --colorGinBorder: rgba(0, 0, 0, .8);
  --colorGinSecondaryBorder: rgba(0, 0, 0, .6);
  --colorGinLayerBorder: rgba(0, 0, 0, .6);
  --colorGinLayer2Border: rgba(0, 0, 0, .8);
  --colorGinTableBorder: rgba(0, 0, 0, .8);
  --colorGinTabsBorder: rgba(0, 0, 0, .8);
  --colorGinFormElementBorder: rgba(0, 0, 0, .8);
}

.gin--dark-mode .gin--high-contrast-mode {
  --colorGinAppBackground: #000;
  --colorGinText: rgba(255, 255, 255, .8);
  --colorGinTextLight: rgba(255, 255, 255, .8);
  --colorGinIcons: rgba(255, 255, 255, .8);
  --colorGinFocus: rgba(255, 255, 255, .8);
  --colorGinBorder: rgba(255, 255, 255, .8);
  --colorGinSecondaryBorder: rgba(255, 255, 255, .6);
  --colorGinLayerBorder: rgba(255, 255, 255, .6);
  --colorGinLayer2Border: rgba(255, 255, 255, .8);
  --colorGinTableBorder: rgba(255, 255, 255, .8);
  --colorGinTabsBorder: rgba(255, 255, 255, .8);
  --colorGinFormElementBorder: rgba(255, 255, 255, .8);
}

[data-gin-focus=green] {
  --colorGinFocus: rgba(8, 163, 144, .6);
}

[data-gin-focus=claro] {
  --colorGinFocus: rgba(38, 167, 105, .6);
}

[data-gin-focus=orange] {
  --colorGinFocus: rgba(236, 124, 87, .6);
}

[data-gin-focus=dark] {
  --colorGinFocus: var(--colorGinFocusNeutralRGB);
}

[data-gin-focus=accent] {
  --colorGinFocus: rgba(var(--colorGinPrimaryRGB), .6);
}

