/* ============================================================ RNG / Renegade OS — тема для Twenty CRM (Zone A overlay) Target: Twenty v2.24.0 (инстанс crm.rng-t.ru) Источник значений: rng-tokens.json; полная карта 112 переменных из валидированной rng-theme.css (аудит v2.24, WCAG 14/14 PASS). Механика: Twenty v2.24 строит тему на CSS-переменных `--t-*` (.dark / .light на ). Файл грузится ПОСЛЕ theme-dark.css и переопределяет только переменные — ни одного селектора по хэшированным классам. Единственный !important помечен [EXC-1]. Не покрыто намеренно: light-тема (нативная), 30 hue-рамп тегов (--t-tag-* — данные пользователей), радиусы и spacing. ============================================================ */ .dark, html.dark { /* ---------- Поверхности (RNG bg ramp) ---------- */ --t-background-primary: #0a0a0b; --t-background-secondary: #0f1012; --t-background-tertiary: #131316; --t-background-quaternary: #1a1b1e; --t-background-danger: #2a1113; /* Инвертированные поверхности: primary-кнопки, тултипы. */ --t-background-primary-inverted: #d6dadf; --t-background-primary-inverted-hover: #aeb6bd; --t-background-inverted-primary: #d6dadf; --t-background-inverted-secondary: #9ca4ac; --t-background-transparent-blue: rgba(174, 182, 189, 0.20); --t-background-transparent-success: rgba(198, 242, 33, 0.16); --t-background-transparent-danger: rgba(240, 86, 91, 0.16); --t-background-transparent-orange: rgba(245, 166, 35, 0.18); /* ---------- Границы ---------- */ --t-border-color-strong: #45494f; --t-border-color-medium: #232529; --t-border-color-light: #1a1b1e; --t-border-color-danger: #57272a; --t-border-color-blue: #5a616a; --t-border-color-inverted: #d6dadf; --t-border-color-secondary-inverted: #9ca4ac; /* ---------- Текст ---------- */ --t-font-color-primary: #f2f3f5; --t-font-color-secondary: #a9aeb6; --t-font-color-tertiary: #6e747d; --t-font-color-light: #565b62; --t-font-color-extra-light: #4b4f56; --t-font-color-inverted: #0b0b0c; --t-font-color-danger: #f0565b; /* Шрифт: Cygre (фирменный, кириллица есть), fallback Inter. */ --t-font-family: 'RNG Cygre', Inter, system-ui, sans-serif; /* ---------- Серая шкала (холодный титановый тинт) ---------- */ --t-gray-scale-gray1: #0a0a0b; --t-gray-scale-gray2: #0f1012; --t-gray-scale-gray3: #0d0e10; --t-gray-scale-gray4: #131316; --t-gray-scale-gray5: #1a1b1e; --t-gray-scale-gray6: #2e3136; --t-gray-scale-gray7: #313438; --t-gray-scale-gray8: #565b62; --t-gray-scale-gray9: #6e747d; --t-gray-scale-gray10: #676d75; --t-gray-scale-gray11: #a9aeb6; --t-gray-scale-gray12: #f2f3f5; /* ---------- Акцент: индиго → титан (Radix 1–12) ---------- */ --t-accent-accent1: #101113; --t-accent-accent2: #131316; --t-accent-accent3: #1a1c1f; --t-accent-accent4: #222529; --t-accent-accent5: #2a2e33; --t-accent-accent6: #34393f; --t-accent-accent7: #454b52; --t-accent-accent8: #5a616a; --t-accent-accent9: #8f98a1; --t-accent-accent10: #9ca4ac; --t-accent-accent11: #c9ced4; --t-accent-accent12: #e8eaed; --t-accent-primary: #2a2e33; --t-accent-secondary: #2a2e33; --t-accent-tertiary: #1a1c1f; --t-accent-quaternary: #131316; --t-accent-accent3570: #5a616a; --t-accent-accent4060: #5a616a; --t-buttons-secondary-text-color: #c9ced4; /* ---------- Интерактивный синий → титан ---------- --t-color-blue* = де-факто акцент Twenty: фокус-кольца, primary-кнопки accent=blue, активные элементы. */ --t-color-blue: #aeb6bd; --t-color-blue1: #101113; --t-color-blue2: #131417; --t-color-blue3: #1b1e21; --t-color-blue4: #222529; --t-color-blue5: #26292e; --t-color-blue6: #34393f; --t-color-blue7: #454b52; --t-color-blue8: #5a616a; --t-color-blue9: #aeb6bd; --t-color-blue10: #c9ced4; --t-color-blue11: #c9ced4; --t-color-blue12: #e8eaed; --t-color-transparent-blue1: rgba(174, 182, 189, 0.06); --t-color-transparent-blue2: rgba(174, 182, 189, 0.09); --t-color-transparent-blue3: rgba(174, 182, 189, 0.16); --t-color-transparent-blue4: rgba(174, 182, 189, 0.24); --t-color-transparent-blue5: rgba(174, 182, 189, 0.32); --t-color-transparent-blue6: rgba(174, 182, 189, 0.40); --t-color-transparent-blue7: rgba(174, 182, 189, 0.49); --t-color-transparent-blue8: rgba(174, 182, 189, 0.60); --t-color-transparent-blue9: rgba(174, 182, 189, 0.75); --t-color-transparent-blue10: rgba(201, 206, 212, 0.82); --t-color-transparent-blue11: #c9ced4; --t-color-transparent-blue12: #e8eaed; /* ---------- Зелёный → Renegade Green (только успех) ---------- */ --t-color-green: #c6f221; --t-color-green1: #131502; --t-color-green3: #1e2508; --t-color-green4: #252d0a; --t-color-green9: #c6f221; --t-color-green10: #d4f94a; --t-color-green12: #f0fbc4; /* ---------- Danger / Warning ---------- */ --t-color-red: #f0565b; --t-color-red1: #1a0d0e; --t-color-red3: #2a1113; --t-color-red5: #3b181b; --t-color-red6: #4a1d20; --t-color-red8: #8c3439; --t-color-red9: #f0565b; --t-color-red10: #f4696d; --t-color-orange: #f5a623; --t-color-orange1: #1c1409; --t-color-orange6: #6b4a12; --t-color-orange7: #8a5e14; --t-color-orange9: #f5a623; --t-color-orange11: #ffc96b; /* ---------- Snackbar / уведомления ---------- */ --t-snack-bar-success-color: #c6f221; --t-snack-bar-success-background-color: rgba(198, 242, 33, 0.16); --t-snack-bar-error-color: #f0565b; --t-snack-bar-error-background-color: rgba(240, 86, 91, 0.16); --t-snack-bar-warning-color: #f5a623; --t-snack-bar-warning-background-color: rgba(245, 166, 35, 0.18); --t-snack-bar-info-color: #aeb6bd; --t-snack-bar-info-background-color: rgba(174, 182, 189, 0.16); } /* [EXC-1] Primary-кнопка accent=blue: цвет текста захардкожен в скомпилированном SCSS twenty-ui (белый, не переменная). На титановой (светлой) заливке белый текст нечитаем (~2:1). Переопределяем через стабильные data-атрибуты (публичный контракт Button). Единственный !important в файле. */ .dark [data-variant='primary'][data-accent='blue']:not([data-inverted]) { --btn-color: #0b0b0c !important; } /* Шрифт Cygre на весь UI (body-шрифт захардкожен в index.css). */ html[data-rng-brand='true'] body, html[data-rng-brand='true'] button, html[data-rng-brand='true'] input, html[data-rng-brand='true'] textarea, html[data-rng-brand='true'] select { font-family: 'RNG Cygre', Inter, system-ui, sans-serif; }