/* «Завдання» v2 (дзвінок 12.11.2026): мікрофон в описі, кілька відповідальних, вкладка «Поставлені мною», підсвітка протермінованих і сповіщення про нову задачу. Окремим файлом, бо інжект DD_CSS у ShopTasks.js — спільна полиця «Продажі-2». */ /* Опис + мікрофон */ .ddt2-lbl{display:flex;align-items:center;gap:8px;margin:0 0 8px} .ddt2-lbl>label{font-size:13px;font-weight:500;color:var(--k-text-4);margin-right:auto} .ddt2-mic{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border:1px solid var(--k-border-2);border-radius:12px;background:var(--k-card);color:var(--k-text-2);font:12px var(--k-font);cursor:pointer} .ddt2-mic span{display:inline-flex}.ddt2-mic svg{width:14px;height:14px} .ddt2-mic:hover{color:var(--k-cyan,#00a6f2);border-color:var(--k-cyan,#00a6f2)} .ddt2-mic.on{background:#f4516c;border-color:#f4516c;color:#fff;animation:ddt2-pulse 1.4s ease-in-out infinite} @keyframes ddt2-pulse{0%,100%{box-shadow:0 0 0 0 rgba(244,81,108,.45)}50%{box-shadow:0 0 0 6px rgba(244,81,108,0)}} /* Відповідальні — чекбокси */ .ddt2-who{display:flex;flex-direction:column;max-height:168px;overflow:auto;border-radius:4px;background:var(--k-input,#e6f7ff);padding:4px 0} .ddt2-who__it{display:flex;align-items:center;gap:8px;padding:0 12px;line-height:28px;font-size:13px;color:var(--k-text-3);cursor:pointer} .ddt2-who__it:hover{background:var(--k-tint,#d9f0fd)} .ddt2-who__it.on{color:var(--k-cyan,#00a6f2);font-weight:500} .ddt2-who__it span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ddt-chk.ddt2-all{margin:6px 0 0} /* Файли: підказка про вставку з буфера */ .ddt2-hint{margin-left:10px;font-size:11px;color:var(--k-muted)} /* Товари групової задачі (бічна панель) */ .ddt2-prods{display:flex;flex-direction:column;gap:3px;max-height:180px;overflow:auto} .ddt2-prods .ddt-ref{white-space:normal} /* Вкладка «Поставлені мною»: лічильник протермінованих */ .ddt2-tabn{display:inline-block;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:9px;background:#f4516c;color:#fff;font:600 11px/18px var(--k-font);text-align:center;vertical-align:1px} /* Протерміновані рядки — червоним */ .ddt-table tr.ddt2-late td{background:rgba(244,81,108,.07)} .ddt-table tr.ddt2-late td:first-child{box-shadow:inset 3px 0 0 #f4516c} .ddt-table tr.ddt2-late:hover td{background:rgba(244,81,108,.13)} .ddt-table tr.ddt2-late .ddt-due{font-weight:600} .ddt2-latetxt{font-size:11px;color:#f4516c;margin-top:2px} /* Сповіщення «Нове завдання для вас» — праворуч унизу */ .ddtn-stack{position:fixed;right:20px;bottom:20px;z-index:1200;display:flex;flex-direction:column;gap:10px;width:320px;max-width:calc(100vw - 32px);pointer-events:none} .ddtn{pointer-events:auto;background:var(--k-card,#fff);border:1px solid var(--k-border-pop,#e4e7ed);border-left:4px solid var(--k-cyan,#00a6f2);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.14);padding:10px 12px 11px;font-family:var(--k-font);color:var(--k-text-2,#303133);cursor:pointer;animation:ddtn-in .25s ease-out} .ddtn--p1{border-left-color:#ffb822}.ddtn--p2{border-left-color:#f4516c} .ddtn:hover{box-shadow:0 10px 28px rgba(0,0,0,.2)} .ddtn__h{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;color:var(--k-cyan,#00a6f2);text-transform:uppercase;letter-spacing:.03em} .ddtn__x{border:0;background:none;color:var(--k-muted,#909399);cursor:pointer;padding:0;width:18px;height:18px;display:inline-flex} .ddtn__x svg{width:16px;height:16px} .ddtn__t{font-size:14px;font-weight:500;color:var(--k-text,#303133);margin-top:4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical} .ddtn__m{font-size:12px;color:var(--k-muted-2,#909399);margin-top:3px} @keyframes ddtn-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} /* Лічильник на пункті меню «Завдання» */ .ks-item:has(.ddtn-badge){position:relative} .ddtn-badge{position:static;align-self:center;flex:none;margin-left:8px;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:#f4516c;color:#fff;font:600 11px/18px var(--k-font);text-align:center;pointer-events:none} /* Созвон 12.11: фото відповідальних і швидкий термін чіпами. */ .ddt2-ava{width:22px;height:22px;border-radius:50%;flex:0 0 22px;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-style:normal;font-weight:600;color:#fff} .ddt-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px} .ddt-chip{border:1px solid var(--k-border-table,#d0d5dd);background:transparent;color:inherit;border-radius:14px;padding:3px 10px;font-size:12px;cursor:pointer} .ddt-chip:hover{border-color:var(--k-cyan,#00a6f2);color:var(--k-cyan,#00a6f2)} /* 12.11: відповідальні розділами ролей, опис росте з текстом, права панель без вилазок */ .ddt2-who{max-height:320px} .ddt2-who__grp{padding:8px 14px 4px;font:600 11px/1.3 var(--k-font,system-ui);letter-spacing:.04em;text-transform:uppercase;color:#667085} .ddt2-who__grp:not(:first-child){margin-top:4px;border-top:1px solid rgba(16,24,40,.06)} .ddt2-due{min-width:220px;height:36px} .ddt-side .ddt-ref{display:block;white-space:normal;overflow-wrap:anywhere;word-break:break-word} .ddt-side{min-width:0;overflow-x:hidden} .ddt-side .ddt-fi{min-width:0} /* 12.11 (власник: «отступы ужасные, как в дешевой админке»): діалог ×1.5, поля вищі, текст більший. */ .ddt2-desc{display:block;width:100%;box-sizing:border-box;min-height:160px;padding:12px 14px;border:1px solid transparent;border-radius:6px;background:var(--k-input,#e6f7ff);font:14px/1.55 var(--k-font);color:var(--k-text-3);resize:vertical;outline:0;overflow:auto} .ddt2-desc:focus{border-color:var(--k-cyan,#00a6f2)} .ddt-dlg .ddt-form .dd-in{height:40px !important;font-size:14px !important;padding:0 14px !important;border-radius:6px !important} .ddt-dlg .ddt-types{padding:4px;border-radius:6px} .ddt-dlg .ddt-types button{width:52px;height:40px} .ddt-dlg .ddt-seg{padding:4px;border-radius:6px} .ddt-dlg .ddt-seg button{height:32px;padding:0 16px;font-size:13px} .ddt-dlg .ddt-chip{height:30px;padding:0 14px;font-size:13px} .ddt-dlg .ddt2-due{height:40px;min-width:260px;font-size:14px} .ddt-dlg .ddt-foot .dd-btn{height:38px;padding:0 22px;font-size:14px} .ddt-dlg .ddt-side .ddt-fi>label{font-size:13px;font-weight:500} .ddt-dlg .ddt-side .dd-in{height:40px !important} .ddt-dlg .ddt2-who__it{padding:8px 14px} .ddt2-langs{display:inline-flex;gap:2px;padding:3px;border-radius:99px;background:var(--k-input,#e6f7ff)} .ddt2-langs button{border:0;background:transparent;border-radius:99px;padding:4px 10px;font:500 12px var(--k-font);color:var(--k-text-2);cursor:pointer} .ddt2-langs button.on{background:#fff;color:var(--k-cyan,#00a6f2);box-shadow:0 1px 3px rgba(16,24,40,.12)} /* Широке вікно не повинно залазити під бічне меню на вужчих екранах. */ @media (min-width:861px){.ddt-dlg{max-width:calc(100vw - 340px)}} /* Вікно задачі — по центру робочої області праворуч від меню, не поверх меню (12.11, «плохо»). */ @media (min-width:861px){.dd-dlg-wrap:has(.ddt-dlg){padding-left:316px;padding-right:16px;padding-top:24px}.ddt-dlg{max-width:100%;height:calc(100vh - 48px);max-height:900px}} /* ══ Вікно завдання — в одному вигляді з карткою покупця (власник 13.11: «и тут» — так само красиво, як картка клієнта з покупками). Лише вигляд: розмітка й поведінка ті самі. !important там, де базове .dd-in саме все тримає на !important. ══ */ .dd-dlg-wrap:has(.ddt-dlg){background:rgba(15,23,42,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)} .ddt-dlg.ddt-dlg{border-radius:18px;border:1px solid #e3e7ef;box-shadow:0 32px 64px -16px rgba(16,24,40,.32),0 4px 12px rgba(16,24,40,.06);color:#344054} .ddt-dlg .ddt-head{padding:22px 32px 18px;box-shadow:none;border-bottom:1px solid #eef0f4} .ddt-dlg .ddt-head b{margin:0;font:700 20px/1.25 var(--k-font);letter-spacing:-.01em;color:#101828} .ddt-dlg .ddt-head small{margin-top:5px;font-size:13px;color:#667085} .ddt-dlg .ddt-head .ddt-x{right:22px;top:20px;width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;color:#98a2b3;transition:background .15s,color .15s} .ddt-dlg .ddt-head .ddt-x:hover{background:#f2f4f7;color:#101828} .ddt-dlg .ddt-scroll{background:#fff} .ddt-dlg .ddt-form{padding:24px 32px 28px} .ddt-dlg .ddt-fi{margin-bottom:20px} .ddt-dlg .ddt-fi>label,.ddt-dlg .ddt2-lbl>label{font:500 13px/1.3 var(--k-font);color:#475467} /* Поля: білі з тонкою рамкою і м'яким кільцем у фокусі — як у пошуку покупців */ .ddt-dlg .dd-in,.ddt-dlg .ddt2-due{height:42px !important;padding:0 14px !important;border:1px solid #d0d5dd !important;border-radius:10px !important;background:#fff !important;font:400 14px var(--k-font) !important;color:#101828 !important;transition:border-color .15s,box-shadow .15s} .ddt-dlg .dd-in:hover,.ddt-dlg .ddt2-due:hover,.ddt-dlg .ddt2-desc:hover{border-color:#98a2b3 !important} .ddt-dlg .dd-in:focus,.ddt-dlg .ddt2-due.is-open,.ddt-dlg .ddt2-desc:focus{border-color:#1bb5fb !important;box-shadow:0 0 0 4px rgba(27,181,251,.14) !important;outline:0} .ddt-dlg .dd-in::placeholder,.ddt-dlg .ddt2-desc::placeholder{color:#98a2b3} .ddt-dlg select.dd-in{padding:0 12px !important} .ddt-dlg textarea.dd-in{height:auto !important;padding:10px 14px !important} .ddt-dlg .dd-in.w120{width:120px !important} .ddt-dlg .ddt-dt .dd-in{padding-left:34px !important} .ddt-dlg .ddt-dt svg{left:12px;top:14px;color:#98a2b3} .ddt-dlg .ddt2-due{display:inline-flex;align-items:center;gap:8px;cursor:pointer} .ddt-dlg .ddt2-due svg{color:#98a2b3} .ddt-dlg .ddt2-due.is-empty{color:#98a2b3 !important} .ddt-dlg .ddt2-desc{min-height:150px;padding:12px 14px;border:1px solid #d0d5dd;border-radius:10px;background:#fff;color:#101828;transition:border-color .15s,box-shadow .15s} /* Мікрофон і мова диктування */ .ddt-dlg .ddt2-mic{height:28px;padding:0 11px;border-color:#d0d5dd;border-radius:99px;background:#fff;color:#475467;font-size:12.5px} .ddt-dlg .ddt2-mic:hover{border-color:#1bb5fb;color:#0b8fd0} .ddt-dlg .ddt2-mic.on{background:#f4516c;border-color:#f4516c;color:#fff} .ddt-dlg .ddt2-langs{background:#f2f4f7} .ddt-dlg .ddt2-langs button{color:#667085} .ddt-dlg .ddt2-langs button.on{color:#0b8fd0} /* Швидкі дати — пігулки */ .ddt-dlg .ddt-quick{gap:8px;margin-top:10px} .ddt-dlg .ddt-chip{height:32px;padding:0 14px;border:1px solid #e3e7ef;border-radius:99px;background:#fff;font:500 13px var(--k-font);color:#344054;transition:border-color .15s,color .15s,background .15s} .ddt-dlg .ddt-chip:hover{border-color:#1bb5fb;background:#f2f9fe;color:#0b8fd0} /* Тип і пріоритет — сегменти на світлій підкладці */ .ddt-dlg .ddt-seg,.ddt-dlg .ddt-types{padding:4px;border-radius:12px;background:#f2f4f7;gap:2px} .ddt-dlg .ddt-seg button{height:34px;padding:0 18px;border-radius:9px;font:500 13px var(--k-font);color:#475467;transition:background .15s,color .15s} .ddt-dlg .ddt-types button{height:38px;border-radius:9px;color:#667085} .ddt-dlg .ddt-seg button:not(.on):hover,.ddt-dlg .ddt-types button:not(.on):hover{background:#fff;color:#101828} .ddt-dlg .ddt-seg button.on,.ddt-dlg .ddt-types button.on{background:#1bb5fb;color:#fff;box-shadow:0 1px 3px rgba(16,24,40,.16)} .ddt-dlg .ddt-seg button.on.p1{background:#f5a623} .ddt-dlg .ddt-seg button.on.p2{background:#f04463} /* Відповідальні — список у рамці, обраний рядок підсвічено */ .ddt-dlg .ddt2-who{padding:6px;border:1px solid #e3e7ef;border-radius:12px;background:#fff} .ddt-dlg .ddt2-who__grp{padding:10px 10px 6px;font:700 11px/1.2 var(--k-font);letter-spacing:.06em;color:#98a2b3} .ddt-dlg .ddt2-who__grp:not(:first-child){margin-top:6px;border-top:1px solid #f2f4f7} .ddt-dlg .ddt2-who__it{padding:7px 10px;border-radius:8px;line-height:24px;font-size:14px;color:#344054} .ddt-dlg .ddt2-who__it:hover{background:#f5f7fb} .ddt-dlg .ddt2-who__it.on{background:#eaf7fe;color:#0b8fd0;font-weight:600} .ddt-dlg .ddt2-who__it input[type=checkbox],.ddt-dlg .ddt-chk input[type=checkbox]{width:16px;height:16px;accent-color:#1bb5fb} .ddt-dlg .ddt2-ava{width:26px;height:26px;flex-basis:26px;font-size:11px} .ddt-dlg .ddt-chk{font-size:13px;color:#344054} .ddt-dlg .ddt-hr{margin:22px 0;border-top-color:#eef0f4} .ddt-dlg .ddt-add{height:34px;padding:0 14px;border:1px dashed #cfd6e2;border-radius:10px;font:500 13px var(--k-font);color:#0b8fd0;transition:border-color .15s,background .15s} .ddt-dlg .ddt-add:hover{border-color:#1bb5fb;background:#f2f9fe} .ddt-dlg .ddt2-hint{font-size:12px;color:#98a2b3} .ddt-dlg .ddt-file{margin-top:8px;padding:8px 12px;border:1px solid #eef0f4;border-radius:10px;background:#fafbfc;font-size:13px} .ddt-dlg .ddt-file a{color:#0b8fd0} /* Низ: кнопки 40px, без важкої тіні */ .ddt-dlg .ddt-foot{padding:14px 32px;box-shadow:none;border-top:1px solid #eef0f4;background:#fafbfc} .ddt-dlg .ddt-foot .dd-btn{height:40px;padding:0 22px;border-radius:10px;border-color:#1bb5fb;background:#1bb5fb;font:600 14px var(--k-font)} .ddt-dlg .ddt-foot .dd-btn:hover{filter:none;background:#0ea5ea;border-color:#0ea5ea} .ddt-dlg .ddt-foot .dd-btn--def{background:#fff;border-color:#d0d5dd;color:#344054} .ddt-dlg .ddt-foot .dd-btn--def:hover{background:#fff;border-color:#98a2b3;color:#101828} .ddt-dlg .ddt-foot .ddt-del,.ddt-dlg .ddt-foot .ddt-del:hover{background:#fff;border-color:#f7c5cf;color:#e0354f} .ddt-dlg .ddt-foot .ddt-del:hover{background:#fff5f6;border-color:#f04463} /* Права панель — тихіший фон, ті самі поля */ .ddt-dlg .ddt-side{padding:22px 26px;border-left:1px solid #eef0f4;background:#fafbfc} .ddt-dlg .ddt-side__tabs{border-bottom-color:#e9ecf2;margin-bottom:16px} .ddt-dlg .ddt-side__tabs span{color:#667085} .ddt-dlg .ddt-side .ddt-fi>label{font-size:13px;color:#475467} .ddt-dlg .ddt-ref{color:#0b8fd0} .ddt-dlg .ddt-meta{font-size:12px;color:#98a2b3} @media (max-width:860px){.ddt-dlg .ddt-side{border-left:0;border-top:1px solid #eef0f4}.ddt-dlg .ddt-head,.ddt-dlg .ddt-form,.ddt-dlg .ddt-foot{padding-left:18px;padding-right:18px}} html[data-key-theme="dark"] .ddt-dlg.ddt-dlg{background:var(--k-card);border-color:var(--k-border);color:var(--k-text-2)} html[data-key-theme="dark"] .ddt-dlg .ddt-head,html[data-key-theme="dark"] .ddt-dlg .ddt-foot,html[data-key-theme="dark"] .ddt-dlg .ddt-side,html[data-key-theme="dark"] .ddt-dlg .ddt-hr,html[data-key-theme="dark"] .ddt-dlg .ddt-side__tabs{border-color:var(--k-border)} html[data-key-theme="dark"] .ddt-dlg .ddt-head b{color:var(--k-text)} html[data-key-theme="dark"] .ddt-dlg .ddt-scroll{background:var(--k-card)} html[data-key-theme="dark"] .ddt-dlg .ddt-foot,html[data-key-theme="dark"] .ddt-dlg .ddt-side,html[data-key-theme="dark"] .ddt-dlg .ddt-file{background:var(--k-bg)} html[data-key-theme="dark"] .ddt-dlg .dd-in,html[data-key-theme="dark"] .ddt-dlg .ddt2-due,html[data-key-theme="dark"] .ddt-dlg .ddt2-desc{background:var(--k-bg) !important;border-color:var(--k-border) !important;color:var(--k-text) !important} html[data-key-theme="dark"] .ddt-dlg .ddt2-who,html[data-key-theme="dark"] .ddt-dlg .ddt-chip,html[data-key-theme="dark"] .ddt-dlg .ddt2-mic,html[data-key-theme="dark"] .ddt-dlg .ddt-foot .dd-btn--def,html[data-key-theme="dark"] .ddt-dlg .ddt-foot .ddt-del{background:var(--k-card);border-color:var(--k-border);color:var(--k-text-2)} html[data-key-theme="dark"] .ddt-dlg .ddt-seg,html[data-key-theme="dark"] .ddt-dlg .ddt-types,html[data-key-theme="dark"] .ddt-dlg .ddt2-langs{background:var(--k-bg)} html[data-key-theme="dark"] .ddt-dlg .ddt2-who__it{color:var(--k-text-2)} html[data-key-theme="dark"] .ddt-dlg .ddt2-who__it:hover,html[data-key-theme="dark"] .ddt-dlg .ddt2-who__it.on{background:rgba(27,181,251,.12)} html[data-key-theme="dark"] .ddt-dlg .ddt-fi>label,html[data-key-theme="dark"] .ddt-dlg .ddt2-lbl>label,html[data-key-theme="dark"] .ddt-dlg .ddt-chk{color:var(--k-text-2)} /* «Додати» файл — це