/* is-com CRM chips — теги для Источника и Брендов * * Стили чипов: фон 15% прозрачности, насыщенный текст, скруглённые края. * Применяется глобально через nginx sub_filter в crm.is-com.ru. * Селекторы общие — JS добавляет класс .ic-chip и data-attr с конкретным slug. */ .ic-chip { display: inline-flex; align-items: center; padding: 1px 9px; border-radius: 12px; font-size: 12px; font-weight: 500; line-height: 1.5; white-space: nowrap; margin: 1px 3px 1px 0; /* fallback цвета — серый */ background: rgba(156, 163, 175, 0.15); color: #4b5563; } /* ─────── ИСТОЧНИКИ ─────── (14 каналов, все разные цвета) * Палитра подобрана под is-com: * - Брендовые цвета мессенджеров (WA-зелёный, TG-голубой) * - Реклама — красные оттенки (поиск/баннеры — разные) * - Почта — белый с обводкой (общая = серая, личная = синяя) * - Прочее — сбалансированная палитра без повторов */ .ic-chip[data-source="web"] { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; } /* Веб-сайт — синий */ .ic-chip[data-source="widget"] { background: rgba(249, 115, 22, 0.15); color: #c2410c; } /* Виджет на сайте — оранжевый */ .ic-chip[data-source="email-common"] { background: #ffffff; color: #475569; box-shadow: inset 0 0 0 1px #94a3b8; } /* Общая почта — белый с серой обводкой */ .ic-chip[data-source="email-personal"] { background: #ffffff; color: #4338ca; box-shadow: inset 0 0 0 1px #6366f1; } /* Личная почта — белый с синей обводкой */ .ic-chip[data-source="avito"] { background: rgba(250, 204, 21, 0.22); color: #854d0e; } /* Авито — жёлтый */ .ic-chip[data-source="whatsapp"] { background: rgba(34, 197, 94, 0.15); color: #15803d; } /* WhatsApp — зелёный */ .ic-chip[data-source="telegram"] { background: rgba(0, 136, 204, 0.15); color: #0c5e91; } /* Telegram — голубой */ .ic-chip[data-source="max"] { background: rgba(168, 85, 247, 0.18); color: #7e22ce; } /* MAX — фиолетовый */ .ic-chip[data-source="phone"] { background: rgba(20, 184, 166, 0.15); color: #0f766e; } /* Телефон — бирюзовый */ .ic-chip[data-source="reference"] { background: rgba(234, 179, 8, 0.20); color: #a16207; } /* Рекомендация — золотой */ .ic-chip[data-source="exhibition"] { background: rgba(120, 53, 15, 0.15); color: #78350f; } /* Выставка — коричневый */ .ic-chip[data-source="ads-yandex-search"] { background: rgba(239, 68, 68, 0.18); color: #991b1b; } /* Я.Поиск — красный */ .ic-chip[data-source="ads-yandex-banners"] { background: rgba(190, 24, 93, 0.18); color: #9d174d; } /* Я.Баннеры — малиновый */ .ic-chip[data-source="manual"] { background: rgba(156, 163, 175, 0.15); color: #4b5563; } /* Введён вручную — серый */ /* ─────── БРЕНДЫ ─────── * Топ-брендов с фирменными цветами + 12 hash-палитровых для остальных. * Цифры в slug = id из brandColors() в JS. */ /* Брендовые цвета (топ-15 — фирменные оттенки) */ .ic-chip[data-brand="siemens"] { background: rgba(0, 153, 153, 0.15); color: #006666; } .ic-chip[data-brand="schneider-electric"] { background: rgba(60, 135, 58, 0.15); color: #1e5a1c; } .ic-chip[data-brand="festo"] { background: rgba(0, 95, 163, 0.15); color: #003a66; } .ic-chip[data-brand="abb"] { background: rgba(255, 0, 0, 0.12); color: #b91c1c; } .ic-chip[data-brand="phoenix-contact"] { background: rgba(22, 135, 54, 0.15); color: #0f5125; } .ic-chip[data-brand="allen-bradley"] { background: rgba(204, 0, 0, 0.12); color: #991b1b; } .ic-chip[data-brand="ifm"] { background: rgba(0, 95, 174, 0.15); color: #003c70; } .ic-chip[data-brand="pilz"] { background: rgba(251, 172, 33, 0.18); color: #92590f; } .ic-chip[data-brand="sick"] { background: rgba(0, 115, 179, 0.15); color: #00496f; } .ic-chip[data-brand="yaskawa"] { background: rgba(28, 79, 168, 0.15); color: #122e62; } .ic-chip[data-brand="wago"] { background: rgba(255, 128, 0, 0.15); color: #b35900; } .ic-chip[data-brand="eaton"] { background: rgba(233, 0, 0, 0.12); color: #a40000; } .ic-chip[data-brand="beckhoff"] { background: rgba(230, 0, 0, 0.12); color: #a30000; } .ic-chip[data-brand="mitsubishi"] { background: rgba(230, 0, 18, 0.12); color: #a4000d; } .ic-chip[data-brand="omron"] { background: rgba(0, 94, 167, 0.15); color: #00386b; } /* Overlay поверх input для brands_interested и item.brand. * Видим chips вместо сырого текста value. Click сквозь — нативный input * получает focus и наш overlay скрывается через JS. */ .ic-brands-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 3px; padding: 2px 8px; background: var(--surface-white, #ffffff); border-radius: 6px; overflow: hidden; pointer-events: none; /* клики идут на input под нами */ z-index: 1; } .ic-brands-overlay .ic-chip { pointer-events: auto; /* hover на chip */ margin: 0; } .ic-brands-overlay-host { position: relative !important; } /* Hash-палитра — для всех остальных брендов (равномерное распределение) */ .ic-chip[data-brand-hash="0"] { background: rgba(239, 68, 68, 0.15); color: #b91c1c; } /* red */ .ic-chip[data-brand-hash="1"] { background: rgba(249, 115, 22, 0.15); color: #c2410c; } /* orange */ .ic-chip[data-brand-hash="2"] { background: rgba(245, 158, 11, 0.15); color: #b45309; } /* amber */ .ic-chip[data-brand-hash="3"] { background: rgba(132, 204, 22, 0.15); color: #4d7c0f; } /* lime */ .ic-chip[data-brand-hash="4"] { background: rgba(34, 197, 94, 0.15); color: #15803d; } /* green */ .ic-chip[data-brand-hash="5"] { background: rgba(16, 185, 129, 0.15); color: #047857; } /* emerald */ .ic-chip[data-brand-hash="6"] { background: rgba(20, 184, 166, 0.15); color: #0f766e; } /* teal */ .ic-chip[data-brand-hash="7"] { background: rgba(6, 182, 212, 0.15); color: #0e7490; } /* cyan */ .ic-chip[data-brand-hash="8"] { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; } /* blue */ .ic-chip[data-brand-hash="9"] { background: rgba(99, 102, 241, 0.15); color: #4338ca; } /* indigo */ .ic-chip[data-brand-hash="10"] { background: rgba(168, 85, 247, 0.15); color: #7e22ce; } /* purple */ .ic-chip[data-brand-hash="11"] { background: rgba(236, 72, 153, 0.15); color: #be185d; } /* pink */