.retail-notifications-workspace{--n-blue:#2563eb;--n-ink:#101d34;--n-muted:#748197;--n-line:#dce5f0;flex:1;min-width:0;overflow-y:auto;padding:34px clamp(22px,3vw,46px) 54px;background:linear-gradient(180deg,#f3f7fc 0,#f7f9fc 330px,#f7f9fc 100%);color:var(--n-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif}.retail-notifications-workspace *{box-sizing:border-box}.retail-notifications-workspace button,.retail-notifications-workspace input,.retail-notifications-workspace select{font:inherit}.retail-notifications-workspace svg,.retail-notifications-nav-item svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.notification-head{max-width:1700px;margin:0 auto 22px;display:flex;align-items:center;justify-content:space-between;gap:24px}.notification-head>div:first-child>span,.notification-section-head>div>span,.notification-log>header>div>span,.notification-rule-editor>header>div>span{display:block;color:var(--n-blue);font-size:11px;font-weight:850;letter-spacing:.16em}.notification-head h1{margin:5px 0 2px;font-size:clamp(35px,3.2vw,52px);font-weight:780;letter-spacing:-.048em}.notification-head p{margin:0;color:var(--n-muted);font-size:14px}.notification-head-state{display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid var(--n-line);border-radius:16px;background:rgba(255,255,255,.78)}.notification-head-state>i{width:10px;height:10px;border-radius:50%;background:#a7b0be}.notification-head-state.is-online>i{background:#12a773;box-shadow:0 0 0 6px rgba(18,167,115,.11)}.notification-head-state>span{display:grid;gap:2px}.notification-head-state small{color:#8995a6;font-size:8px;font-weight:800;letter-spacing:.1em}.notification-head-state strong{font-size:11px}.notification-summary{max-width:1700px;margin:0 auto 18px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.notification-summary article{padding:17px 19px;border:1px solid var(--n-line);border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(17,39,75,.035)}.notification-summary span{display:block;color:#7e899b;font-size:10px;font-weight:750}.notification-summary strong{display:inline-block;margin-top:5px;font-size:27px;letter-spacing:-.04em}.notification-summary small{margin-left:7px;color:#98a1af;font-size:9px}.notification-layout{max-width:1700px;margin:0 auto;display:grid;grid-template-columns:minmax(600px,1.35fr) minmax(410px,.65fr);gap:18px;align-items:start}.notification-main,.notification-rule-editor,.notification-log{border:1px solid var(--n-line);border-radius:24px;background:#fff;box-shadow:0 18px 55px rgba(17,39,75,.055)}.notification-main{padding:24px}.notification-section-head,.notification-log>header,.notification-rule-editor>header{display:flex;align-items:center;justify-content:space-between;gap:18px}.notification-section-head{margin-bottom:17px}.notification-section-head h2,.notification-log h2,.notification-rule-editor h2{margin:4px 0 0;font-size:22px;letter-spacing:-.034em}.notification-section-head>button,.notification-rule-editor>header>button{display:inline-flex;align-items:center;gap:7px;border:1px solid #ccdaeb;border-radius:11px;background:#fff;color:#31507a;padding:9px 12px;font-size:10px;font-weight:750;cursor:pointer}.notification-section-head>button svg{width:16px;height:16px}.notification-rule-list{display:grid;gap:9px}.notification-rule-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:13px;padding:14px;border:1px solid #e0e7f1;border-radius:16px;background:#fff}.notification-rule-card.is-disabled{opacity:.62}.notification-rule-icon{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:#edf4ff;color:#2563eb}.notification-rule-copy{display:grid;min-width:0}.notification-rule-copy>span{color:#2563eb;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.notification-rule-copy>strong{margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.notification-rule-copy>small{margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7d899b;font-size:8px}.notification-rule-copy>div{display:flex;align-items:center;gap:7px;margin-top:8px}.notification-rule-copy>div i{position:relative;width:96px;height:5px;overflow:hidden;border-radius:999px;background:#e9eef5}.notification-rule-copy>div i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--level);border-radius:inherit;background:linear-gradient(90deg,#65a2f4,#2563eb)}.notification-rule-copy>div em{color:#657389;font-size:8px;font-style:normal;font-weight:700}.notification-rule-copy>p{margin:6px 0 0;color:#b4232b;font-size:8px}.notification-rule-state{display:grid;justify-items:end;gap:4px}.notification-rule-state>span{padding:6px 8px;border-radius:999px;background:#f0f3f7;color:#657185;font-size:8px;font-weight:800}.notification-rule-state>span.is-on{background:#eaf8f2;color:#087a56}.notification-rule-state small{color:#99a2b0;font-size:7px}.notification-rule-actions{display:flex;gap:4px}.notification-rule-actions button{display:grid;width:32px;height:32px;place-items:center;border:1px solid #dbe3ed;border-radius:9px;background:#fff;color:#56667e;cursor:pointer}.notification-rule-actions button:hover{border-color:#9eb9dc;color:#2563eb}.notification-rule-actions button.danger:hover{border-color:#e7b4b9;color:#b4232b}.notification-rule-actions svg{width:15px;height:15px}.notification-empty{min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8b97a8;text-align:center}.notification-empty>svg{width:34px;height:34px;margin-bottom:12px}.notification-empty strong{color:#46556b}.notification-empty p{margin:5px 0 0;font-size:10px}.notification-rule-editor{padding:22px;position:sticky;top:22px}.notification-rule-editor>header{margin-bottom:19px}.notification-rule-editor>header>button{padding:8px 10px}.notification-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.notification-form-grid label{display:grid;gap:6px;color:#57667c;font-size:9px;font-weight:750}.notification-form-grid label.wide{grid-column:1/3}.notification-form-grid input:not([type=checkbox]),.notification-form-grid select{width:100%;min-width:0;border:1px solid #d5dfeb;border-radius:11px;background:#fff;color:#17253d;padding:10px 11px;font-size:10px;outline:none}.notification-form-grid input:focus,.notification-form-grid select:focus{border-color:#6da2ee;box-shadow:0 0 0 3px rgba(37,99,235,.09)}.notification-enabled{grid-column:1/3;display:flex!important;align-items:center;gap:8px!important;padding:10px 11px;border:1px solid #dfe6ef;border-radius:11px;background:#f8fafc}.notification-enabled input{width:16px;height:16px;accent-color:#2563eb}.notification-rule-editor>footer{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:17px;padding-top:16px;border-top:1px solid #e5eaf1}.notification-rule-editor>footer p{flex:1;margin:0;color:#778397;font-size:8px;line-height:1.4}.notification-rule-editor>footer p[data-tone=success]{color:#087a56}.notification-rule-editor>footer p[data-tone=error]{color:#b4232b}.notification-rule-editor>footer button{border:0;border-radius:11px;background:#2563eb;color:#fff;padding:11px 14px;font-size:10px;font-weight:780;cursor:pointer}.notification-log{max-width:1700px;margin:18px auto 0;padding:22px}.notification-log>header{margin-bottom:15px}.notification-log>header>small{color:#8e98a7;font-size:9px}.notification-log-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.notification-log-list>div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:9px;padding:10px 12px;border:1px solid #e3e8f0;border-radius:13px}.notification-log-list>div>span{grid-row:1/3;display:grid;width:31px;height:31px;place-items:center;border-radius:10px;background:#eef2f7;color:#7d8999;font-size:11px;font-weight:800}.notification-log-list>div>span.is-success{background:#eaf8f2;color:#087a56}.notification-log-list>div>span.is-error{background:#fff0f0;color:#b4232b}.notification-log-list svg{width:14px;height:14px}.notification-log-list strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.notification-log-list small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8994a5;font-size:8px}.notification-log-list time{grid-column:3;grid-row:1/3;color:#929caa;font-size:8px}.notification-log-empty{padding:28px;color:#8c97a7;text-align:center;font-size:10px}
html[data-theme=dark] .retail-notifications-workspace,html.pc-dark-mode .retail-notifications-workspace{--n-ink:#edf3ff;--n-muted:#9eabc0;--n-line:#30405a;background:linear-gradient(180deg,#111b2c,#0e1725);color:var(--n-ink)}html[data-theme=dark] .notification-main,html[data-theme=dark] .notification-rule-editor,html[data-theme=dark] .notification-log,html[data-theme=dark] .notification-summary article,html[data-theme=dark] .notification-head-state,html[data-theme=dark] .notification-rule-card,html[data-theme=dark] .notification-section-head>button,html[data-theme=dark] .notification-rule-editor>header>button,html[data-theme=dark] .notification-rule-actions button,html.pc-dark-mode .notification-main,html.pc-dark-mode .notification-rule-editor,html.pc-dark-mode .notification-log,html.pc-dark-mode .notification-summary article,html.pc-dark-mode .notification-head-state,html.pc-dark-mode .notification-rule-card,html.pc-dark-mode .notification-section-head>button,html.pc-dark-mode .notification-rule-editor>header>button,html.pc-dark-mode .notification-rule-actions button{background:#151f30;color:#edf3ff;border-color:#30405a}html[data-theme=dark] .notification-form-grid input:not([type=checkbox]),html[data-theme=dark] .notification-form-grid select,html[data-theme=dark] .notification-enabled,html.pc-dark-mode .notification-form-grid input:not([type=checkbox]),html.pc-dark-mode .notification-form-grid select,html.pc-dark-mode .notification-enabled{background:#101a29;color:#edf3ff;border-color:#35445c}
@media(max-width:1300px){.notification-layout{grid-template-columns:1fr}.notification-rule-editor{position:static}.notification-log-list{grid-template-columns:1fr 1fr}}@media(max-width:760px){.retail-notifications-workspace{padding:21px 14px 38px}.notification-head{align-items:flex-start;flex-direction:column}.notification-summary{grid-template-columns:1fr}.notification-rule-card{grid-template-columns:auto minmax(0,1fr);align-items:start}.notification-rule-state,.notification-rule-actions{grid-column:2;justify-items:start}.notification-rule-actions{justify-content:flex-start}.notification-form-grid{grid-template-columns:1fr}.notification-form-grid label.wide,.notification-enabled{grid-column:auto}.notification-log-list{grid-template-columns:1fr}}
