/* KNX Ice Glass Theme v1 — isolated color override */
:root,
:root[theme-mode="light"] {
  --brand-main: #2f80ed;
  --td-brand-color-light: #eef7ff;
  --td-brand-color-focus: #d9edff;
  --td-brand-color-disabled: #a9cdf4;
  --td-brand-color-hover: #5aa7f7;
  --td-brand-color: #2f80ed;
  --td-brand-color-active: #1d62bf;
  --td-brand-color-1: #eef7ff;
  --td-brand-color-2: #d9edff;
  --td-brand-color-3: #8dccff;
  --td-brand-color-4: #5aa7f7;
  --td-brand-color-5: #2f80ed;
  --td-brand-color-6: #1d62bf;
  --td-brand-color-7: #174f9c;
  --td-brand-color-8: #123e7c;
  --td-brand-color-9: #0d2f60;
  --td-brand-color-10: #081f42;
  --td-bg-color-page: #f2f7fd;
  --td-bg-color-sidebar: #f7faff;
  --td-bg-color-settings-modal: #f7faff;
  --td-bg-color-container: #ffffff;
  --td-bg-color-container-select: #f8fbff;
  --td-bg-color-container-hover: #eef5fc;
  --td-bg-color-container-active: #e2edf9;
  --td-bg-color-secondarycontainer: #edf4fb;
  --td-bg-color-secondarycontainer-hover: #e4effa;
  --td-bg-color-secondarycontainer-active: #d7e6f6;
  --td-bg-color-component: #e8f1fb;
  --td-bg-color-component-hover: #dceaf8;
  --td-bg-color-component-active: #c7dcf2;
  --td-bg-color-component-disabled: #eef3f8;
  --td-component-stroke: #dce8f5;
  --td-component-border: #cadced;
  --td-shadow-1: 0 4px 16px rgba(36, 113, 183, 0.08);
  --td-shadow-2: 0 8px 24px rgba(36, 113, 183, 0.10);
  --td-shadow-3: 0 16px 40px rgba(36, 113, 183, 0.12);
}

:root[theme-mode="dark"] {
  --brand-main: #58b9ff;
  --td-brand-color-light: rgba(88, 185, 255, 0.14);
  --td-brand-color-focus: rgba(88, 185, 255, 0.22);
  --td-brand-color-disabled: #315f83;
  --td-brand-color-hover: #7ac8ff;
  --td-brand-color: #58b9ff;
  --td-brand-color-active: #3599e8;
  --td-brand-color-1: rgba(88, 185, 255, 0.12);
  --td-brand-color-2: #17446a;
  --td-brand-color-3: #1e5d8e;
  --td-brand-color-4: #2677b4;
  --td-brand-color-5: #3599e8;
  --td-brand-color-6: #58b9ff;
  --td-brand-color-7: #7ac8ff;
  --td-brand-color-8: #9ad6ff;
  --td-brand-color-9: #bce5ff;
  --td-brand-color-10: #e2f4ff;
  --td-bg-color-page: #07111f;
  --td-bg-color-sidebar: #091526;
  --td-bg-color-settings-modal: #091526;
  --td-bg-color-container: #0e1b2e;
  --td-bg-color-container-select: #142640;
  --td-bg-color-container-hover: #142640;
  --td-bg-color-container-active: #1b3150;
  --td-bg-color-secondarycontainer: #122238;
  --td-bg-color-secondarycontainer-hover: #192d48;
  --td-bg-color-secondarycontainer-active: #213a5a;
  --td-bg-color-component: #172b45;
  --td-bg-color-component-hover: #203a5a;
  --td-bg-color-component-active: #29496f;
  --td-bg-color-component-disabled: #101d30;
  --td-component-stroke: #203853;
  --td-component-border: #2b4968;
  --td-font-gray-1: rgba(238, 247, 255, 0.94);
  --td-font-gray-2: rgba(212, 231, 247, 0.68);
  --td-font-gray-3: rgba(190, 213, 232, 0.46);
  --td-font-gray-4: rgba(170, 196, 218, 0.30);
  --td-font-white-1: rgba(238, 247, 255, 0.94);
  --td-font-white-2: rgba(212, 231, 247, 0.68);
  --td-font-white-3: rgba(190, 213, 232, 0.46);
  --td-font-white-4: rgba(170, 196, 218, 0.30);
  --td-shadow-1: 0 4px 18px rgba(0, 0, 0, 0.24);
  --td-shadow-2: 0 10px 30px rgba(0, 0, 0, 0.30);
  --td-shadow-3: 0 18px 48px rgba(0, 0, 0, 0.36);
}

html,
body,
#app {
  background-color: var(--td-bg-color-page) !important;
}

:root[theme-mode="dark"] *::-webkit-scrollbar-thumb {
  background-color: #2b4968 !important;
}
:root[theme-mode="dark"] *::-webkit-scrollbar-thumb:hover {
  background-color: #376187 !important;
}

/* Knowledge-base card brand-color normalization */
.kb-card:hover {
  border-color: var(--td-brand-color) !important;
  box-shadow: 0 4px 14px rgba(47, 128, 237, 0.14) !important;
}
.kb-card.kb-type-document,
.shared-kb-card.kb-type-document {
  background: linear-gradient(135deg, var(--td-bg-color-container) 0%, rgba(47, 128, 237, 0.045) 100%) !important;
}
.kb-card.kb-type-document:hover,
.shared-kb-card.kb-type-document:hover {
  border-color: var(--td-brand-color) !important;
  background: linear-gradient(135deg, var(--td-bg-color-container) 0%, rgba(47, 128, 237, 0.09) 100%) !important;
  box-shadow: 0 4px 14px rgba(47, 128, 237, 0.16) !important;
}
.kb-card.kb-type-document::after,
.shared-kb-card.kb-type-document::after {
  background: linear-gradient(135deg, rgba(47, 128, 237, 0.10) 0%, transparent 100%) !important;
}
.feature-badge.type-document,
.feature-badge.question,
.feature-badge.shared,
.feature-badge.role-admin {
  background: rgba(47, 128, 237, 0.10) !important;
  color: var(--td-brand-color) !important;
}
.feature-badge.type-document:hover,
.feature-badge.question:hover,
.feature-badge.shared:hover,
.feature-badge.role-admin:hover {
  background: rgba(47, 128, 237, 0.16) !important;
}
.feature-badge.kg {
  background: rgba(124, 108, 255, 0.11) !important;
  color: #7067f0 !important;
}
:root[theme-mode="dark"] .feature-badge.kg {
  color: #9b95ff !important;
}
:root[theme-mode="dark"] .feature-badge.type-document,
:root[theme-mode="dark"] .feature-badge.question,
:root[theme-mode="dark"] .feature-badge.shared,
:root[theme-mode="dark"] .feature-badge.role-admin {
  background: rgba(88, 185, 255, 0.14) !important;
  color: var(--td-brand-color) !important;
}

/* Knowledge breadcrumb / hierarchy menu used success green on hover */
.document-header .breadcrumb-link:hover:not(:disabled) {
  color: var(--td-brand-color) !important;
  background: var(--td-bg-color-container) !important;
}

/* KB info identity/capability tags are branding, not success-state green */
.kb-info-card .t-tag--success {
  background-color: var(--td-brand-color) !important;
  border-color: var(--td-brand-color) !important;
  color: #ffffff !important;
}
.kb-info-card .t-tag--success.t-tag--light,
.kb-info-card .t-tag--success.t-tag--outline,
.kb-info-card .t-tag--success.t-tag--light-outline {
  background-color: var(--td-brand-color-light) !important;
  border-color: var(--td-brand-color) !important;
  color: var(--td-brand-color) !important;
}