/* DroneHQ Notifications Compact Header v72
   CSS-only cleanup after utility expanders were removed.
   Scope: Notifications panel only. */
.notification-popover .notification-heading,
.shell-popover.notification-popover .notification-heading {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "eyebrow close"
    "title close"
    "date close"
    "actions actions";
  align-items: start;
  gap: 4px 12px;
  padding: 14px 16px 12px !important;
  min-height: 0 !important;
}

.notification-popover .notification-heading .eyebrow,
.shell-popover.notification-popover .notification-heading .eyebrow {
  grid-area: eyebrow;
  margin: 0 !important;
  line-height: 1.1 !important;
}

.notification-popover .notification-heading h2,
.shell-popover.notification-popover .notification-heading h2 {
  grid-area: title;
  margin: 0 !important;
  line-height: 1.1 !important;
}

.notification-popover .notification-heading [data-notification-date],
.notification-popover .notification-heading .notification-date,
.notification-popover .notification-heading .notification-heading-date,
.shell-popover.notification-popover .notification-heading [data-notification-date],
.shell-popover.notification-popover .notification-heading .notification-date,
.shell-popover.notification-popover .notification-heading .notification-heading-date {
  grid-area: date;
  justify-self: start;
  margin: 2px 0 0 !important;
  font-size: 0.82rem;
  line-height: 1.2;
  opacity: 0.82;
}

.notification-popover .notification-heading [data-notification-close],
.notification-popover .notification-heading [aria-label="Close notifications"],
.notification-popover .notification-heading [aria-label="Close Notifications"],
.shell-popover.notification-popover .notification-heading [data-notification-close],
.shell-popover.notification-popover .notification-heading [aria-label="Close notifications"],
.shell-popover.notification-popover .notification-heading [aria-label="Close Notifications"] {
  grid-area: close;
  justify-self: end;
  align-self: start;
}

.notification-popover .notification-heading [data-mark-all-notifications],
.shell-popover.notification-popover .notification-heading [data-mark-all-notifications] {
  grid-area: actions;
  justify-self: end;
  margin: 8px 0 0 !important;
  min-height: 34px;
  width: auto;
  max-width: 180px;
  padding: 0 18px;
}

.notification-popover .notification-list,
.shell-popover.notification-popover .notification-list {
  padding-top: 10px !important;
}

.notification-popover .notification-heading + .notification-list,
.shell-popover.notification-popover .notification-heading + .notification-list {
  margin-top: 0 !important;
}
