.notification-control { position: relative; margin-left: auto; margin-right: 16px; flex-shrink: 0; }
.stock-nav-expiry { display: inline-block; width: 8px; height: 8px; background: #c92a38; border-radius: 50%; margin-left: 4px; flex-shrink: 0; }
.stock-nav-expiry[hidden] { display: none; }
.account-role { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 3px 6px; border-radius: 6px; font-size: .7rem; font-weight: 600; vertical-align: middle; background: #e9e5f7; color: #62577e; white-space: nowrap; }
.account-role-manager { background: #fff1c9; color: #795b08; }
.account-role-administrador { background: #e8e4fa; color: #27187e; }
.account-role-moderador { background: #e1f2ed; color: #216b43; }
.account-role-supervisor { background: #e4eefb; color: #315787; }
.account-role-empresa { background: #edf0f5; color: #526075; }
#openNotifications { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; color: white; background: #ffffff14; cursor: pointer; }
#openNotifications svg { width: 22px; height: 22px; }
#notificationBadge { position: absolute; top: -3px; right: -3px; min-width: 18px; padding: 2px 4px; border-radius: 12px; background: #c92a38; color: white; font-size: .7rem; }
.notification-panel { position: absolute; right: 0; top: calc(100% + 12px); width: min(360px, calc(100vw - 24px)); max-height: min(560px, calc(100dvh - 100px)); overflow-y: auto; padding: 16px; border: 1px solid #e1e5ed; border-radius: 14px; background: white; color: #172033; box-shadow: 0 12px 36px #17203326; z-index: 200; }
.notification-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.notification-panel { text-align: left; }
.notification-heading h2 { font-size: 1.1rem; color: #27187e; }
#closeNotifications { width: 44px; height: 44px; font-size: 1.6rem; color: #62577e; background: transparent; cursor: pointer; }
#readAllNotifications { width: 100%; min-height: 44px; padding: 8px; background: #f0eef8; color: #27187e; border-radius: 8px; margin: 8px 0; cursor: pointer; }
#notificationStatus { font-size: .9rem; color: #626b7a; line-height: 1.5; }
#notificationStatus:empty { display: none; }
.notification-item { display: block; padding: 14px 10px; border-bottom: 1px solid #e1e5ed; color: #172033; text-decoration: none; line-height: 1.4; overflow-wrap: anywhere; }
.notification-item strong, .notification-item span, .notification-item time { display: block; }
.notification-item span { font-size: .85rem; margin-top: 4px; color: #536174; }
.notification-item time { margin-top: 6px; color: #626b7a; font-size: .75rem; }
.notification-item[data-unread] { background: #f4f3ff; border-left: 3px solid #27187e; }
.notification-item { display: flex; align-items: flex-start; gap: 10px; border-left: 3px solid transparent; }
.notification-content { flex: 1; min-width: 0; }
.notification-icon { width: 22px; height: 22px; padding: 6px; box-sizing: content-box; flex-shrink: 0; border-radius: 50%; background: #f0eef8; color: #62577e; }
.notification-item[data-state="approved"] .notification-icon { color: #216b43; background: #def1e6; }
.notification-item[data-state="rejected"] .notification-icon { color: #a32636; background: #fbe3e8; }
.notification-item[data-state="warning"] .notification-icon { color: #795b08; background: #fff1b8; }
.notification-item[data-state="approved"][data-unread] { background: #f2faf5; border-left-color: #278450; }
.notification-item[data-state="rejected"][data-unread] { background: #fff5f6; border-left-color: #c92a38; }
.notification-item[data-state="warning"][data-unread] { background: #fffbec; border-left-color: #c58932; }
.notification-control [hidden] { display: none !important; }
@media (max-width: 768px) { .notification-panel { position: fixed; top: calc(72px + env(safe-area-inset-top, 0px)); right: 12px; } }

@media(max-width:768px){.nav-celular .stock-nav-link{position:relative}.nav-celular .stock-expiry-badge{position:absolute;top:3px;right:2px;min-width:19px;height:19px;font-size:10px}}

.notification-item[data-state="expired"] .notification-icon{color:#b42332;background:#fbe3e8}.notification-item[data-state="today"] .notification-icon{color:#a8440a;background:#ffead2}.notification-item[data-state="expired"][data-unread]{background:#fff5f6;border-left-color:#c92a38}.notification-item[data-state="today"][data-unread]{background:#fff7ee;border-left-color:#dd761d}.notification-item .notification-expiry-label{display:table;font-size:.75rem;font-weight:600;padding:3px 7px;border-radius:6px;background:#fff1b8;color:#795b08}.notification-item[data-state="expired"] .notification-expiry-label{background:#fbe3e8;color:#b42332}.notification-item[data-state="today"] .notification-expiry-label{background:#ffead2;color:#a8440a}
