:root,
[data-theme="kyiv"] {
  --cnc-bg: #081a36;
  --cnc-bg2: #081a36;
  --cnc-nav: #0a1428;
  --cnc-panel: #0f192d;
  --cnc-surface: #14141e;
  --cnc-raised: #19233c;
  --cnc-raised-2: #283c5a;
  --cnc-border: #46506a;
  --cnc-text: #eaeaea;
  --cnc-muted: #cdd4e3;
  --cnc-accent: #ffd94d;
  --cnc-accent-deep: #f5a300;
  --cnc-info: #00d4ff;
  --cnc-link: #0078ff;
  --cnc-link-soft: #66b3ff;
  --cnc-success: #90ee90;
  --cnc-danger: #dc3545;
  --cnc-btn-a: #2a5a87;
  --cnc-btn-b: #8b7b25;
  --cnc-btn-a-hover: #3a7ad8;
  --cnc-btn-b-hover: #c8a11a;
  --cnc-on-accent: #111111;
  --cnc-chart-win: #c98500;
  --cnc-chart-loss: #3987e5;
  --cnc-accent-rgb: 255, 217, 77;
  --cnc-link-rgb: 0, 120, 255;
  --cnc-info-rgb: 0, 212, 255;
  --cnc-success-rgb: 144, 238, 144;
  --cnc-danger-rgb: 220, 53, 69;
  --cnc-text-rgb: 234, 234, 234;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffd94d' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffd94d' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23ffd94d' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

[data-theme="usa"] {
  --cnc-bg: #0b1220;
  --cnc-bg2: #101b30;
  --cnc-nav: #0d1626;
  --cnc-panel: #111b2e;
  --cnc-surface: #152036;
  --cnc-raised: #1b2842;
  --cnc-raised-2: #2a3d5e;
  --cnc-border: #3a4a6a;
  --cnc-text: #e8edf5;
  --cnc-muted: #a9b6cc;
  --cnc-accent: #6fb1ff;
  --cnc-accent-deep: #3d7fe0;
  --cnc-info: #c9d3e3;
  --cnc-link: #4a90ff;
  --cnc-link-soft: #9cc4ff;
  --cnc-success: #46c37b;
  --cnc-danger: #e5484d;
  --cnc-btn-a: #1f4f8f;
  --cnc-btn-b: #3d5a80;
  --cnc-btn-a-hover: #2f6bc0;
  --cnc-btn-b-hover: #5a7fb0;
  --cnc-on-accent: #08101f;
  --cnc-chart-win: #6fb1ff;
  --cnc-chart-loss: #e5484d;
  --cnc-accent-rgb: 111, 177, 255;
  --cnc-link-rgb: 74, 144, 255;
  --cnc-info-rgb: 201, 211, 227;
  --cnc-success-rgb: 70, 195, 123;
  --cnc-danger-rgb: 229, 72, 77;
  --cnc-text-rgb: 232, 237, 245;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%236fb1ff' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%236fb1ff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%236fb1ff' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

[data-theme="china"] {
  --cnc-bg: #151313;
  --cnc-bg2: #1c1414;
  --cnc-nav: #181414;
  --cnc-panel: #1d1817;
  --cnc-surface: #201b1a;
  --cnc-raised: #2a2120;
  --cnc-raised-2: #3d2c2a;
  --cnc-border: #5a3e3a;
  --cnc-text: #f2ebe6;
  --cnc-muted: #c4b5ad;
  --cnc-accent: #f2c14e;
  --cnc-accent-deep: #e3342f;
  --cnc-info: #ff8a65;
  --cnc-link: #e3342f;
  --cnc-link-soft: #ff9a8a;
  --cnc-success: #5fbf6f;
  --cnc-danger: #ff6b3d;
  --cnc-btn-a: #8a1c18;
  --cnc-btn-b: #8a6a1c;
  --cnc-btn-a-hover: #b8261f;
  --cnc-btn-b-hover: #b88f24;
  --cnc-on-accent: #1a0d00;
  --cnc-chart-win: #f2c14e;
  --cnc-chart-loss: #e3342f;
  --cnc-accent-rgb: 242, 193, 78;
  --cnc-link-rgb: 227, 52, 47;
  --cnc-info-rgb: 255, 138, 101;
  --cnc-success-rgb: 95, 191, 111;
  --cnc-danger-rgb: 255, 107, 61;
  --cnc-text-rgb: 242, 235, 230;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f2c14e' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23f2c14e' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23f2c14e' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

[data-theme="gla"] {
  --cnc-bg: #1a1510;
  --cnc-bg2: #231b12;
  --cnc-nav: #1e1912;
  --cnc-panel: #211b13;
  --cnc-surface: #272016;
  --cnc-raised: #30271b;
  --cnc-raised-2: #45382a;
  --cnc-border: #5e4e36;
  --cnc-text: #efe6d2;
  --cnc-muted: #c4b696;
  --cnc-accent: #e8a33d;
  --cnc-accent-deep: #c76a1c;
  --cnc-info: #c8bf6e;
  --cnc-link: #d08a3a;
  --cnc-link-soft: #e6c08a;
  --cnc-success: #8fb35a;
  --cnc-danger: #d9443a;
  --cnc-btn-a: #6b4a1e;
  --cnc-btn-b: #6b6a2e;
  --cnc-btn-a-hover: #8f6428;
  --cnc-btn-b-hover: #8f8d3d;
  --cnc-on-accent: #1a1005;
  --cnc-chart-win: #e8a33d;
  --cnc-chart-loss: #b04030;
  --cnc-accent-rgb: 232, 163, 61;
  --cnc-link-rgb: 208, 138, 58;
  --cnc-info-rgb: 200, 191, 110;
  --cnc-success-rgb: 143, 179, 90;
  --cnc-danger-rgb: 217, 68, 58;
  --cnc-text-rgb: 239, 230, 210;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23e8a33d' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23e8a33d' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23e8a33d' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

[data-theme="hud"] {
  --cnc-bg: #090c09;
  --cnc-bg2: #0b120c;
  --cnc-nav: #0b110b;
  --cnc-panel: #0d140d;
  --cnc-surface: #101710;
  --cnc-raised: #142014;
  --cnc-raised-2: #1f3320;
  --cnc-border: #2c4a2e;
  --cnc-text: #d8e8d6;
  --cnc-muted: #9cb898;
  --cnc-accent: #3ee56f;
  --cnc-accent-deep: #ffb020;
  --cnc-info: #7cf0a0;
  --cnc-link: #3ee56f;
  --cnc-link-soft: #a8f5c0;
  --cnc-success: #3ee56f;
  --cnc-danger: #ff4d4d;
  --cnc-btn-a: #1d5a2c;
  --cnc-btn-b: #5a4a14;
  --cnc-btn-a-hover: #26803c;
  --cnc-btn-b-hover: #806a1c;
  --cnc-on-accent: #031007;
  --cnc-chart-win: #3ee56f;
  --cnc-chart-loss: #ff4d4d;
  --cnc-accent-rgb: 62, 229, 111;
  --cnc-link-rgb: 62, 229, 111;
  --cnc-info-rgb: 124, 240, 160;
  --cnc-success-rgb: 62, 229, 111;
  --cnc-danger-rgb: 255, 77, 77;
  --cnc-text-rgb: 216, 232, 214;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%233ee56f' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%233ee56f' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%233ee56f' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

[data-theme="ukraine"] {
  --cnc-bg: #06183a;
  --cnc-bg2: #0a2450;
  --cnc-nav: #08193b;
  --cnc-panel: #0a1f45;
  --cnc-surface: #0f2752;
  --cnc-raised: #13305f;
  --cnc-raised-2: #1f4580;
  --cnc-border: #3a5a92;
  --cnc-text: #f2f5fa;
  --cnc-muted: #b8c6de;
  --cnc-accent: #ffd500;
  --cnc-accent-deep: #f2a900;
  --cnc-info: #6fb6ff;
  --cnc-link: #4d9bff;
  --cnc-link-soft: #a8ceff;
  --cnc-success: #4cd38a;
  --cnc-danger: #ff5a5a;
  --cnc-btn-a: #0057b7;
  --cnc-btn-b: #b38f00;
  --cnc-btn-a-hover: #1a6fd6;
  --cnc-btn-b-hover: #d9ae00;
  --cnc-on-accent: #0a1630;
  --cnc-chart-win: #ffd500;
  --cnc-chart-loss: #4d9bff;
  --cnc-accent-rgb: 255, 213, 0;
  --cnc-link-rgb: 77, 155, 255;
  --cnc-info-rgb: 111, 182, 255;
  --cnc-success-rgb: 76, 211, 138;
  --cnc-danger-rgb: 255, 90, 90;
  --cnc-text-rgb: 242, 245, 250;
  --cnc-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffd500' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
  --cnc-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffd500' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --cnc-toggler-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23ffd500' stroke-width='2' stroke-linecap='round' d='M6 6L24 24M24 6L6 24'/%3E%3C/svg%3E");
}

:root,
[data-theme] {
  --bs-primary: var(--cnc-link);
  --bs-primary-rgb: var(--cnc-link-rgb);
  --bs-warning: var(--cnc-accent);
  --bs-warning-rgb: var(--cnc-accent-rgb);
  --bs-info: var(--cnc-info);
  --bs-info-rgb: var(--cnc-info-rgb);
  --bs-success: var(--cnc-success);
  --bs-success-rgb: var(--cnc-success-rgb);
  --bs-danger: var(--cnc-danger);
  --bs-danger-rgb: var(--cnc-danger-rgb);
  --bs-link-color: var(--cnc-link-soft);
  --bs-link-color-rgb: var(--cnc-link-rgb);
  --bs-link-hover-color: var(--cnc-accent);
  --bs-link-hover-color-rgb: var(--cnc-accent-rgb);
  --bs-border-color: color-mix(in srgb, var(--cnc-text) 12%, transparent);
  --bs-secondary-color: color-mix(in srgb, var(--cnc-text) 70%, transparent);
  --bs-tertiary-bg: var(--cnc-nav);
}

.btn-warning {
  --bs-btn-bg: var(--cnc-accent);
  --bs-btn-border-color: var(--cnc-accent);
  --bs-btn-color: var(--cnc-on-accent);
  --bs-btn-hover-bg: var(--cnc-accent-deep);
  --bs-btn-hover-border-color: var(--cnc-accent-deep);
  --bs-btn-hover-color: var(--cnc-on-accent);
  --bs-btn-active-bg: var(--cnc-accent-deep);
  --bs-btn-active-border-color: var(--cnc-accent-deep);
  --bs-btn-active-color: var(--cnc-on-accent);
}

.btn-outline-warning {
  --bs-btn-color: var(--cnc-accent);
  --bs-btn-border-color: var(--cnc-accent);
  --bs-btn-hover-bg: var(--cnc-accent);
  --bs-btn-hover-border-color: var(--cnc-accent);
  --bs-btn-hover-color: var(--cnc-on-accent);
  --bs-btn-active-bg: var(--cnc-accent);
  --bs-btn-active-border-color: var(--cnc-accent);
  --bs-btn-active-color: var(--cnc-on-accent);
}

.btn-outline-info {
  --bs-btn-color: var(--cnc-info);
  --bs-btn-border-color: var(--cnc-info);
  --bs-btn-hover-bg: var(--cnc-info);
  --bs-btn-hover-border-color: var(--cnc-info);
  --bs-btn-hover-color: var(--cnc-nav);
}

.btn-success {
  --bs-btn-bg: color-mix(in srgb, var(--cnc-success) 55%, var(--cnc-nav));
  --bs-btn-border-color: var(--cnc-success);
  --bs-btn-hover-bg: color-mix(in srgb, var(--cnc-success) 70%, var(--cnc-nav));
  --bs-btn-hover-border-color: var(--cnc-success);
}

.btn-outline-success {
  --bs-btn-color: var(--cnc-success);
  --bs-btn-border-color: var(--cnc-success);
  --bs-btn-hover-bg: var(--cnc-success);
  --bs-btn-hover-border-color: var(--cnc-success);
  --bs-btn-hover-color: var(--cnc-nav);
}

.btn-danger {
  --bs-btn-bg: var(--cnc-danger);
  --bs-btn-border-color: var(--cnc-danger);
  --bs-btn-hover-bg: color-mix(in srgb, var(--cnc-danger) 85%, #000);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--cnc-danger) 85%, #000);
}

.btn-outline-danger {
  --bs-btn-color: var(--cnc-danger);
  --bs-btn-border-color: var(--cnc-danger);
  --bs-btn-hover-bg: var(--cnc-danger);
  --bs-btn-hover-border-color: var(--cnc-danger);
}

.pagination {
  --bs-pagination-color: var(--cnc-link-soft);
  --bs-pagination-bg: color-mix(in srgb, var(--cnc-nav) 80%, transparent);
  --bs-pagination-border-color: color-mix(in srgb, var(--cnc-text) 12%, transparent);
  --bs-pagination-hover-color: var(--cnc-accent);
  --bs-pagination-hover-bg: var(--cnc-raised);
  --bs-pagination-hover-border-color: color-mix(in srgb, var(--cnc-accent) 40%, transparent);
  --bs-pagination-focus-color: var(--cnc-accent);
  --bs-pagination-focus-bg: var(--cnc-raised);
  --bs-pagination-active-color: var(--cnc-on-accent);
  --bs-pagination-active-bg: var(--cnc-accent);
  --bs-pagination-active-border-color: var(--cnc-accent);
  --bs-pagination-disabled-color: color-mix(in srgb, var(--cnc-text) 40%, transparent);
  --bs-pagination-disabled-bg: color-mix(in srgb, var(--cnc-nav) 60%, transparent);
  --bs-pagination-disabled-border-color: color-mix(in srgb, var(--cnc-text) 8%, transparent);
}

.modal-content {
  --bs-modal-bg: var(--cnc-panel);
  --bs-modal-color: var(--cnc-text);
  --bs-modal-border-color: color-mix(in srgb, var(--cnc-accent) 25%, transparent);
}

.list-group {
  --bs-list-group-bg: color-mix(in srgb, var(--cnc-panel) 85%, transparent);
  --bs-list-group-color: var(--cnc-text);
  --bs-list-group-border-color: color-mix(in srgb, var(--cnc-text) 10%, transparent);
  --bs-list-group-action-hover-bg: var(--cnc-raised);
  --bs-list-group-action-hover-color: var(--cnc-accent);
  --bs-list-group-active-bg: var(--cnc-raised-2);
  --bs-list-group-active-border-color: var(--cnc-accent);
}

.table-dark {
  --bs-table-bg: color-mix(in srgb, var(--cnc-panel) 85%, transparent);
  --bs-table-color: var(--cnc-text);
  --bs-table-border-color: color-mix(in srgb, var(--cnc-text) 12%, transparent);
  --bs-table-striped-bg: color-mix(in srgb, var(--cnc-text) 4%, transparent);
  --bs-table-hover-bg: color-mix(in srgb, var(--cnc-accent) 8%, transparent);
  --bs-table-hover-color: var(--cnc-text);
}
