#woNotificationButton { position:relative; display:inline-flex; align-items:center; gap:5px; border:1px solid #476586; border-radius:7px; padding:7px 9px; background:#122338; color:#daeaff; white-space:nowrap; cursor:pointer; font-size:12px; }
#woNotificationButton[hidden], #woNotificationCount[hidden], .wo-inbox-overlay[hidden], .wo-inbox [hidden] { display:none !important; }
#woNotificationCount { background:#db3f50; color:#fff; border-radius:12px; padding:1px 5px; min-width:16px; text-align:center; }
.wo-inbox-overlay { position:fixed; inset:0; z-index:20000; color:#192d43; font:14px/1.55 system-ui,sans-serif; }
.wo-inbox-backdrop { position:absolute; inset:0; background:rgba(8,20,35,.42); }
.wo-inbox { position:absolute; right:0; top:0; bottom:0; width:min(480px,100vw); background:#f5f8fc; display:flex; flex-direction:column; box-shadow:-8px 0 32px rgba(0,0,0,.2); }
.wo-inbox header { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid #dce5ef; }
.wo-inbox h2 { margin:0; font-size:20px; }
.wo-inbox h2 small { font-size:13px; font-weight:400; margin-left:12px; }
.wo-inbox button { cursor:pointer; font:inherit; }
.wo-inbox button:disabled { cursor:wait; opacity:.65; }
.wo-inbox button:focus-visible { outline:3px solid #1677ff; outline-offset:2px; }
.wo-inbox header button { border:0; background:transparent; color:inherit; font-size:26px; }
.wo-inbox-actions { display:flex; gap:12px; padding:12px 22px; }
.wo-inbox-actions button, .wo-inbox [data-notice-action=more] { border:1px solid #cbd9e9; border-radius:6px; padding:7px 12px; background:white; color:#126fc9; }
.wo-inbox-scroll { overflow:auto; flex:1; padding:0 22px 24px; }
.wo-inbox-item { display:flex; flex-direction:column; gap:10px; text-align:left; width:100%; padding:16px; border:1px solid #d8e5f2; border-left:4px solid #1677ff; border-radius:9px; margin-bottom:12px; background:white; color:#20344d; overflow-wrap:anywhere; }
.wo-inbox-item.is-read { border-left-color:#b7c4d5; }
.wo-inbox-item:hover { background:#eaf4ff; }
.wo-inbox-item strong { font-size:16px; }
.wo-inbox-meta { display:flex; justify-content:space-between; gap:12px; width:100%; color:#416185; font-size:12px; }
.wo-inbox-item small { font-size:12px; color:#6b7c90; }
.wo-inbox-link { align-self:flex-end; color:#126fc9; }
#woInboxStatus { white-space:pre-wrap; color:#63768d; }
#woMessageCount { display:inline-grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border-radius:12px; background:#dc2626; color:#fff; font:700 10px/1 system-ui,sans-serif; }
#woMessageCount[hidden] { display:none !important; }
.wo-inbox-scroll { min-height:0; overscroll-behavior:contain; overflow-x:hidden; }
.wo-inbox-item { min-width:0; box-sizing:border-box; white-space:normal; }
.wo-inbox-item:hover { transform:none; }
.wo-inbox-actions { flex-wrap:wrap; }
body:not(.light) .wo-inbox { background:#1f2533; color:#edf2f7; }
body:not(.light) .wo-inbox header { border-color:#3a4454; }
body:not(.light) .wo-inbox-item { background:#252e3e; color:#edf2f7; border-color:#3a4454; }
body:not(.light) .wo-inbox-item.is-unread { border-left-color:#00d4aa; }
body:not(.light) .wo-inbox-item:hover { background:#2b394c; }
body:not(.light) .wo-inbox-meta, body:not(.light) .wo-inbox-item small, body:not(.light) #woInboxStatus { color:#aebcd0; }
body:not(.light) .wo-inbox-link { color:#00d4aa; }
body:not(.light) .wo-inbox-actions button, body:not(.light) .wo-inbox [data-notice-action=more] { background:#27364a; color:#bdeee8; border-color:#465b73; }
#tabWorkOrders .wo-unread-badge { position:absolute; top:3px; right:5px; display:grid; place-items:center; min-width:19px; height:19px; padding:0 4px; border:2px solid #35373a; border-radius:12px; color:#fff; background:#dc2626; font:700 10px/1 system-ui,sans-serif; box-sizing:content-box; pointer-events:none; }
#tabWorkOrders .wo-unread-badge[hidden] { display:none; }
body.light #tabWorkOrders .wo-unread-badge { color:#fff; background:#dc2626; border-color:#fff; }
