.notification-channels-dialog { width: min(920px, calc(100% - 28px)); max-height: 90vh; border: 1px solid #dce6f1; border-radius: 20px; padding: 0; color: #20334c; background: #fff; box-shadow: 0 24px 90px #071c4c40; }
.notification-channels-dialog::backdrop { background: #081c3c88; backdrop-filter: blur(4px); }
.notification-channels-dialog > header { display: flex; align-items: center; gap: 14px; padding: 22px; background: #132f45; color: #fff; }
.notification-channels-dialog h2 { font-size: 1.25rem; margin: 0; flex: 1; min-width:0; white-space:normal; overflow-wrap:anywhere; }
.notification-channels-icon { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink:0; border-radius: 12px; background: #1677ff; }
.notification-channels-dialog main { padding: 22px; }
.notification-channels-dialog p { font-size: .85rem; line-height: 1.6; }
.notification-channels-dialog footer { display: flex; align-items: center; gap: 10px; position: sticky; bottom: 0; background: inherit; border-top: 1px solid #dce6f1; padding: 16px 22px; }
.channel-feedback { flex: 1; margin: 0; }
.channel-role-heading, .channel-status-strip, .channel-connection-actions { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.channel-role-heading strong { font-size: 1.1rem; }
.channel-role-heading span, .channel-status-strip { font-size: .76rem; color: #607794; }
.channel-status-strip { padding: 12px; background: #eef5fe; border-radius: 10px; }
.channel-warning { padding: 12px; border-left: 3px solid #df9b24; background: #fff7e6; }
.channel-matrix-wrap { overflow: auto; }
.channel-matrix { border-collapse: collapse; width: 100%; min-width: 500px; font-size: .8rem; }
.channel-matrix th, .channel-matrix td { padding: 12px 10px; border-bottom: 1px solid #e4ecf5; }
.channel-matrix thead th { background: #f3f7fc; font-size: .72rem; }
.channel-matrix td { text-align: center; }
.channel-matrix small { display: block; font-weight: 400; color: #687e98; margin-top: 4px; }
.channel-check { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.channel-check input { width: 19px; height: 19px; accent-color: #1677ff; }
.channel-check i { font-size: .65rem; color: #8393a7; }
.channel-help { margin: 16px 0 0; color: #687e98; }
.channel-personal-preferences { margin-top: 22px; }
.channel-personal-preferences h3 { font-size: 1rem; }
.channel-personal-preferences label { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; font-size: .85rem; }
html[data-kalipso-theme="dark"] .notification-channels-dialog { background: #132338; color: #e1edf9; border-color: #30445c; }
html[data-kalipso-theme="dark"] .channel-matrix th, html[data-kalipso-theme="dark"] .channel-matrix td, html[data-kalipso-theme="dark"] .notification-channels-dialog footer { border-color: #30445c; }
html[data-kalipso-theme="dark"] .channel-matrix thead th, html[data-kalipso-theme="dark"] .channel-status-strip { background: #1b334e; color: #adc8e7; }
html[data-kalipso-theme="dark"] .channel-matrix small, html[data-kalipso-theme="dark"] .channel-help, html[data-kalipso-theme="dark"] .channel-role-heading span { color: #a5b7cc; }
html[data-kalipso-theme="dark"] .channel-warning { background: #3f321a; color: #ffdc9a; }
@media(max-width: 600px) { .notification-channels-dialog main { padding: 14px; } .notification-channels-dialog footer { flex-wrap: wrap; } .channel-feedback { flex-basis: 100%; } }
.telegram-dialog { width: min(780px, calc(100% - 28px)); }
.telegram-dialog > header .close { margin:0 0 0 auto; flex-shrink:0; display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid #ffffff45; border-radius:11px; background:#ffffff15; color:#fff; opacity:1; text-shadow:none; font-size:1.6rem; }
.telegram-dialog > header .close:hover { background:#ffffff28; }
.telegram-dialog .tg-status { display:flex; align-items:center; gap:20px; padding:0 0 20px; border-bottom:1px solid #dce6f1; margin-bottom:22px; }
.tg-status strong { font-size:.95rem; }
.tg-status p { margin:5px 0 0; color:#61748a; }
.telegram-dialog .tg-setup { padding:20px; text-align:left; background:#f7faff; border-color:#dce6f1; }
.telegram-dialog .tg-wait, .telegram-dialog .tg-secondary { justify-content:flex-start; }
.telegram-dialog .tg-badge { margin-left:auto; }
.telegram-dialog .tg-privacy { justify-content:flex-start; }
html[data-kalipso-theme="dark"] .telegram-dialog .tg-setup { background:#192d43; border-color:#344b65; }
html[data-kalipso-theme="dark"] .tg-status p { color:#aec3d9; }
.telegram-dialog .tg-link-error { border-style:solid; border-color:#e5ba74; }
.notification-channels-dialog { font-size:16px; }
.notification-channels-dialog .btn { font-size:.95rem; min-height:42px; padding:10px 16px; }
.notification-channels-dialog p, .notification-channels-dialog .tg-option, .notification-channels-dialog .tg-help, .notification-channels-dialog .tg-wait { font-size:.95rem; }
.notification-channels-dialog .tg-badge, .notification-channels-dialog .tg-steps li { font-size:.85rem; }
.notification-channels-dialog [data-disconnect] { background:#dc3545; border-color:#dc3545; color:#fff; }
.notification-channels-dialog [data-disconnect]:hover { background:#bd2130; border-color:#bd2130; color:#fff; }
.notification-channels-dialog > header .close { position:static; margin:0 0 0 auto; display:grid; place-items:center; flex-shrink:0; width:38px; height:38px; padding:0; border:1px solid #ffffff45; border-radius:11px; background:#ffffff15; color:#fff; opacity:1; text-shadow:none; font-size:1.6rem; }
.notification-channels-dialog footer { justify-content:flex-end; position:static; flex-shrink:0; }
.role-channels-dialog[open] { display:flex; flex-direction:column; width:min(1080px,calc(100vw - 28px)); height:min(900px,92dvh); max-height:92dvh; overflow:hidden; }
.role-channels-dialog > header { flex-shrink:0; }
.role-channels-dialog > main { display:flex; flex-direction:column; flex:1; min-height:0; overflow:hidden; padding:20px 24px 12px; }
.channel-intro { flex-shrink:0; }
.channel-intro > p { margin:0 0 12px; }
.channel-role-heading { margin-bottom:10px; gap:12px; }
.channel-role-heading small { display:block; color:#637991; font-size:.8rem; margin-top:3px; }
.channel-role-avatar { display:grid; place-items:center; background:#e5f0ff; color:#1677ff!important; width:44px; height:44px; border-radius:12px; }
.channel-total { margin-left:auto; padding:7px 12px; background:#edf4fc; border-radius:9px; font-size:.85rem!important; font-weight:700; }
.channel-status-strip { padding:0; background:transparent; margin-bottom:12px; gap:8px; }
.channel-status-strip > span { border:1px solid #dce6f1; background:#f3f8ff; border-radius:20px; padding:5px 10px; font-size:.8rem; }
.channel-bulk-bar { display:flex; align-items:center; gap:12px; justify-content:space-between; padding:12px 14px; background:#eaf3ff; border:1px solid #d3e3f7; border-radius:12px 12px 0 0; flex-shrink:0; }
.channel-bulk-bar label { margin:0; display:flex; align-items:center; gap:10px; font-size:.95rem; }
.channel-bulk-bar > span { color:#627890; font-size:.8rem; }
.role-channels-dialog .channel-matrix-wrap { flex:1; min-height:80px; overflow:auto; border:1px solid #d3e3f7; border-top:0; border-radius:0 0 12px 12px; overscroll-behavior:contain; }
.role-channels-dialog .channel-matrix { min-width:680px; table-layout:fixed; font-size:.95rem; }
.channel-matrix th:first-child { width:44%; }
.channel-matrix thead th { position:sticky; top:0; z-index:2; text-align:center; padding:14px 8px; background:#eaf1fa; color:#365370; font-size:.85rem; }
.channel-matrix thead th:first-child { text-align:left; padding-left:18px; }
.channel-matrix thead th > span { display:block; margin:5px 0 9px; }
.channel-matrix th, .channel-matrix td { padding:14px 12px; }
.channel-matrix tbody th { padding-left:18px; }
.channel-matrix tbody tr:nth-child(even) { background:#f6f9fd; }
.channel-matrix tbody tr:hover { background:#edf5ff; }
.channel-condition { margin-left:8px; font-size:.75rem; color:#7a92ac; }
.channel-check input, .channel-bulk-bar input, .channel-matrix thead input { width:20px; height:20px; accent-color:#1677ff; vertical-align:middle; cursor:pointer; }
.channel-check input:disabled { cursor:not-allowed; }
.channel-check i { font-size:.75rem; }
.channel-locked { color:#93a1b2; background:#e8edf34d; }
.channel-unavailable { color:#8796a8!important; }
.role-channels-dialog .channel-help { flex-shrink:0; margin:10px 0 0; font-size:.8rem; }
.channel-result-dialog { width:min(420px,calc(100vw - 32px)); text-align:center; border:1px solid #dce6f1; border-radius:20px; padding:30px; color:#20334c; box-shadow:0 20px 80px #102b4b33; }
.channel-result-dialog::backdrop { background:#0d213f80; backdrop-filter:blur(3px); }
.channel-result-icon { display:grid; place-items:center; margin:0 auto 18px; width:64px; height:64px; border-radius:50%; background:#daf4e8; color:#16814c; font-size:1.7rem; }
.channel-result-icon.is-error { background:#ffeded; color:#c4323e; }
.channel-result-dialog h3 { font-size:1.3rem; margin-bottom:12px; font-weight:750; }
.channel-result-dialog p { color:#60758d; line-height:1.6; }
.channel-result-dialog .btn { font-size:1rem; padding:10px 26px; }
html[data-kalipso-theme="dark"] .channel-result-dialog { background:#172b42; color:#e1edf9; border-color:#344b65; }
html[data-kalipso-theme="dark"] .channel-result-dialog p { color:#aec3d9; }
html[data-kalipso-theme="dark"] .channel-bulk-bar, html[data-kalipso-theme="dark"] .channel-status-strip > span, html[data-kalipso-theme="dark"] .channel-total { background:#203b57; border-color:#344b65; }
html[data-kalipso-theme="dark"] .channel-matrix-wrap { border-color:#344b65; }
html[data-kalipso-theme="dark"] .channel-matrix tbody tr:nth-child(even) { background:#192d43; }
html[data-kalipso-theme="dark"] .channel-matrix tbody tr:hover { background:#23405c; }
html[data-kalipso-theme="dark"] .channel-bulk-bar label { color:#e1edf9; }
html[data-kalipso-theme="dark"] body.app-ui-v2 .notification-channels-dialog.users-user-modal > main,
html[data-kalipso-theme="dark"] body.app-ui-v2 .notification-channels-dialog.users-user-modal > footer { background:#132338; color:#e1edf9; }
html[data-kalipso-theme="dark"] .channel-role-heading small, html[data-kalipso-theme="dark"] .channel-bulk-bar > span { color:#aec3d9; }
@media(max-width:600px) { .role-channels-dialog .channel-matrix { min-width:580px; } .role-channels-dialog .channel-matrix th:first-child { width:36%; } }
@media(max-width:600px) { .role-channels-dialog > main { padding:12px; } .channel-bulk-bar { flex-wrap:wrap; gap:5px; } .channel-bulk-bar > span { font-size:.75rem; } .channel-intro > p { font-size:.8rem; margin-bottom:8px; } .role-channels-dialog .channel-status-strip { margin-bottom:8px; } .notification-channels-dialog > header { padding:16px; } .role-channels-dialog .channel-help { font-size:.72rem; } }
.telegram-dialog .tg-hero { display:flex; align-items:center; gap:18px; padding:22px; background:linear-gradient(125deg,#eaf7ff,#f5f8ff); border:1px solid #d9eafb; border-radius:16px; margin-bottom:24px; }
.tg-hero h3 { font-size:1.3rem; margin:5px 0 7px; font-weight:750; }
.tg-hero p { margin:0; color:#52677e; }
.tg-eyebrow { font-size:.65rem; font-weight:750; letter-spacing:.12em; color:#2177b4; }
.tg-orbit { display:grid; place-items:center; flex-shrink:0; width:58px; height:58px; border-radius:19px; background:#229ed9; color:white; font-size:1.65rem; box-shadow:0 8px 20px #229ed92a; }
.tg-badge { white-space:nowrap; margin-left:auto; border-radius:30px; padding:7px 10px; background:#e0eaf4; font-size:.7rem; font-weight:700; }
.tg-badge.is-connected { background:#d7f4e5; color:#146c43; }
.tg-steps { display:flex; gap:10px; list-style:none; padding:0; margin:0 0 24px; }
.tg-steps li { display:flex; align-items:center; gap:9px; flex:1; font-size:.77rem; color:#667b92; }
.tg-steps b { display:grid; place-items:center; width:28px; height:28px; flex-shrink:0; border-radius:50%; background:#edf1f7; }
.tg-steps .is-current { color:#156eb2; font-weight:700; }
.tg-steps .is-current b { background:#dbeeff; box-shadow:0 0 0 4px #f0f7ff; }
.tg-steps .is-done b { background:#d7f4e5; color:#146c43; }
.tg-setup { padding:24px; text-align:center; border:1px solid #dce6f1; border-radius:16px; }
.telegram-dialog h4 { font-size:1rem; font-weight:750; margin:0 0 7px; }
.tg-setup p { color:#60758d; margin-bottom:20px; }
.tg-open { display:inline-flex; align-items:center; gap:12px; padding:12px 24px; }
.tg-wait { display:flex; justify-content:center; align-items:center; gap:8px; margin:20px 0 12px; font-size:.8rem; color:#536b83; }
.tg-wait[hidden] { display:none; }
.tg-pulse { width:7px; height:7px; background:#229ed9; border-radius:50%; box-shadow:0 0 0 4px #229ed919; }
[data-countdown] { font-variant-numeric:tabular-nums; font-weight:750; padding:4px 8px; border-radius:6px; background:#edf4fc; }
[data-expired] { padding:14px; margin:16px 0; background:#fff4de; color:#81540c; border-radius:10px; font-size:.85rem; }
.tg-secondary { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.tg-secondary .btn { font-size:.75rem; }
.tg-help { margin-top:20px; text-align:left; font-size:.82rem; }
.tg-help summary { cursor:pointer; color:#39739e; font-weight:650; padding:8px 0; }
.tg-help p { margin:10px 0; }
.tg-manage { border-top:1px solid #dce6f1; padding-top:10px; }
.tg-manage .btn { margin:4px 8px 4px 0; }
.tg-section-heading { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:16px; }
.tg-section-heading p { margin:0; color:#63788e; }
.tg-count { border-radius:9px; background:#edf4fc; padding:8px 13px; font-weight:750; }
.tg-empty { display:flex; gap:15px; background:#f5f8fc; border:1px dashed #cad9eb; border-radius:12px; padding:20px; margin-bottom:16px; }
.tg-empty > i { font-size:1.2rem; color:#6491b7; margin-top:3px; }
.tg-empty strong { font-size:.9rem; }
.tg-empty p { margin:6px 0 0; color:#63788e; }
.tg-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; }
.tg-option { position:relative; display:flex; align-items:center; gap:10px; padding:14px; border:1px solid #dce6f1; border-radius:10px; margin:0; cursor:pointer; font-size:.82rem; }
.tg-option > span:first-child { flex:1; }
.tg-option input { position:absolute; opacity:0; width:1px; height:1px; }
.tg-switch { display:block; width:34px; height:20px; background:#bdcddd; border-radius:12px; padding:3px; flex-shrink:0; }
.tg-switch::before { content:''; display:block; width:14px; height:14px; background:white; border-radius:50%; transition:transform .15s; }
.tg-option input:checked + .tg-switch { background:#1686d9; }
.channel-info { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; margin-left:6px; border:0; border-radius:50%; color:#3972b7; background:transparent; vertical-align:middle; cursor:pointer; }
.channel-info:hover, .channel-info:focus-visible { background:#e4efff; outline:2px solid #79a9ef; }
.channel-result-dialog p { white-space:pre-line; }
.tg-option input:checked + .tg-switch::before { transform:translateX(14px); }
.tg-option:focus-within { outline:2px solid #1686d9; outline-offset:2px; }
.telegram-dialog .tg-privacy { display:flex; justify-content:center; gap:8px; font-size:.72rem; color:#6b7f95; margin:20px 0 0; }
html[data-kalipso-theme="dark"] .telegram-dialog .tg-hero { background:linear-gradient(125deg,#17364d,#1a2d48); border-color:#304a63; }
html[data-kalipso-theme="dark"] .tg-hero p, html[data-kalipso-theme="dark"] .tg-setup p, html[data-kalipso-theme="dark"] .tg-empty p, html[data-kalipso-theme="dark"] .tg-section-heading p, html[data-kalipso-theme="dark"] .tg-wait { color:#aec3d9; }
html[data-kalipso-theme="dark"] .tg-empty, html[data-kalipso-theme="dark"] .tg-count, html[data-kalipso-theme="dark"] [data-countdown] { background:#1b334b; }
html[data-kalipso-theme="dark"] .tg-setup, html[data-kalipso-theme="dark"] .tg-option, html[data-kalipso-theme="dark"] .tg-empty, html[data-kalipso-theme="dark"] .tg-manage { border-color:#344b65; }
html[data-kalipso-theme="dark"] .tg-help summary, html[data-kalipso-theme="dark"] .tg-eyebrow { color:#75c3f5; }
html[data-kalipso-theme="dark"] .telegram-dialog .tg-option { color:#e1edf9; }
html[data-kalipso-theme="dark"] .notification-channels-dialog { color-scheme:dark; }
html[data-kalipso-theme="dark"] .channel-info { color:#8bc0ff; }
html[data-kalipso-theme="dark"] .channel-info:hover,
html[data-kalipso-theme="dark"] .channel-info:focus-visible { background:#294664; outline-color:#8bc0ff; }
html[data-kalipso-theme="dark"] .tg-badge { background:#263d57; color:#d9e8fa; }
html[data-kalipso-theme="dark"] .tg-badge.is-connected { background:#1b4639; color:#a9e7c4; }
html[data-kalipso-theme="dark"] .tg-steps li,
html[data-kalipso-theme="dark"] .telegram-dialog .tg-privacy { color:#adc3d9; }
html[data-kalipso-theme="dark"] .tg-steps b { background:#263d57; }
html[data-kalipso-theme="dark"] .tg-steps .is-current { color:#8bc7ff; }
html[data-kalipso-theme="dark"] .tg-steps .is-current b { background:#21476a; box-shadow:0 0 0 4px #172e46; }
html[data-kalipso-theme="dark"] .tg-steps .is-done b { background:#1b4639; color:#a9e7c4; }
html[data-kalipso-theme="dark"] [data-expired] { background:#3d3222; color:#f1cf95; }
html[data-kalipso-theme="dark"] .channel-result-icon { background:#1b4639; color:#a9e7c4; }
html[data-kalipso-theme="dark"] .channel-result-icon.is-error { background:#482c38; color:#f3b5bf; }
@media(max-width:600px) { .telegram-dialog .tg-hero { flex-wrap:wrap; padding:16px; gap:12px; } .tg-hero > div { flex:1; min-width:150px; } .tg-badge { margin-left:70px; } .tg-steps { gap:6px; } .tg-steps li { flex-direction:column; text-align:center; font-size:.72rem; } .tg-setup { padding:20px 14px; } .tg-options { grid-template-columns:1fr; } .tg-orbit { width:48px; height:48px; } }
