/* LINE GROUP — Panel de notificaciones responsivo. No altera permisos ni API. */
.ui1-system .shell .app-header .notification-panel,
.shell .app-header .notification-panel {
  box-sizing:border-box;
  width:min(390px,calc(100vw - 24px));
  max-height:min(560px,calc(100dvh - 100px));
  padding:8px;
  overflow-y:auto;
  overscroll-behavior:contain;
  overflow-x:hidden;
  background:#fff;
  color:#172536;
  border-radius:16px;
  box-shadow:0 18px 50px rgba(9,31,65,.23);
  z-index:100;
}
.notification-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 14px;border-bottom:1px solid #e6edf7;position:sticky;top:-8px;background:#fff;z-index:1}
.notification-panel-heading strong{font-size:16px;color:#102b49}
.notification-panel-total{font-size:12px;color:#52708d;white-space:nowrap}
.ui1-system .shell .app-header .notification-panel .notification-item,
.shell .app-header .notification-panel .notification-item{display:block;box-sizing:border-box;width:100%;min-height:66px;margin:6px 0;padding:12px 14px;border:1px solid #e6edf7;border-radius:11px;text-align:left;background:#fff;color:#172536;white-space:normal;overflow-wrap:anywhere;line-height:1.4;cursor:pointer}
.ui1-system .shell .app-header .notification-panel .notification-item.unread,
.shell .app-header .notification-panel .notification-item.unread{background:#edf5ff;border-color:#cfe2ff;border-left:4px solid #1765d5}
.notification-panel .notification-item strong{display:block;margin-bottom:4px;font-size:14px;line-height:1.35;color:#123a70}
.notification-panel .notification-item div{font-size:13px;color:#344b64}
.notification-panel .notification-item small{display:block;margin-top:7px;font-size:11px;color:#64748b}
@media(max-width:650px){
  .ui1-system .shell .app-header .notification-panel,
  .shell .app-header .notification-panel{
    position:fixed!important;
    top:calc(env(safe-area-inset-top,0px) + 68px)!important;
    left:12px!important;
    right:12px!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 84px)!important;
    border-radius:16px;
    z-index:1000;
  }
}

/* v4: panel en el nivel superior del documento, fuera del header y del sidebar. */
body > #lgNotificationBackdrop{position:fixed!important;inset:0!important;z-index:2147483000!important;background:rgba(8,23,43,.34);}
body > #notificationPanel{
  position:fixed!important;z-index:2147483001!important;
  box-sizing:border-box!important;display:block;
  top:76px;left:auto;right:16px;
  width:min(390px,calc(100vw - 24px))!important;
  max-width:none!important;
  max-height:calc(100dvh - 100px)!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  padding:12px!important;background:#fff!important;color:#172536!important;
  border:1px solid #dce5f1!important;border-radius:16px!important;
  box-shadow:0 20px 60px rgba(0,15,36,.30)!important;
  overscroll-behavior:contain;
}
body > #notificationPanel .notification-item{
  display:block!important;box-sizing:border-box!important;width:100%!important;
  height:auto!important;min-height:64px!important;margin:6px 0!important;
  padding:12px!important;text-align:left!important;white-space:normal!important;
  overflow-wrap:anywhere!important;border:1px solid #e1e8f1!important;
  border-radius:10px!important;background:#fff!important;color:#172536!important;
}
body > #notificationPanel .notification-item.unread{background:#eef5ff!important;}
body > #notificationPanel .notification-item strong,
body > #notificationPanel .notification-item div,
body > #notificationPanel .notification-item small{white-space:normal!important;overflow-wrap:anywhere!important;}
@media(max-width:1100px){
  body > #notificationPanel{
    top:calc(76px + env(safe-area-inset-top,0px))!important;
    left:12px!important;right:12px!important;
    width:auto!important;max-width:none!important;
    max-height:calc(100dvh - 92px - env(safe-area-inset-bottom,0px))!important;
  }
}