/*
 * DGA Inline Notification (components/alert.blade.php, app/View/Components/Alert.php).
 * Previously a completely bare, unstyled <div> -- used sitewide for
 * "no results found" (index/archive) and "comments closed" messages,
 * all currently type="warning".
 *
 * Tokens used here (--notification-*, --featuredicons-*) already existed
 * in dga-tokens.css, fully defined for all 5 variants, just never wired
 * to an actual component until now.
 */
.dga-notification {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-3);
  padding: var(--spacing-4);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
}

.dga-notification__icon {
  flex-shrink: 0;
  display: flex;
  margin-top: 2px;
}

.dga-notification__text {
  font-family: var(--font-family-arabic);
  font-size: var(--font-size-text-md);
  line-height: var(--line-height-text-md);
}

.dga-notification--info {
  background-color: var(--notification-background-info-light);
  border-color: var(--border-info-light);
  color: var(--notification-text-info);
}
.dga-notification--info .dga-notification__icon {
  color: var(--icon-info);
}

.dga-notification--success {
  background-color: var(--notification-background-success-light);
  border-color: var(--border-success-light);
  color: var(--notification-text-success);
}
.dga-notification--success .dga-notification__icon {
  color: var(--icon-success);
}

.dga-notification--warning {
  background-color: var(--notification-background-warning-light);
  border-color: var(--border-warning-light);
  color: var(--notification-text-warning);
}
.dga-notification--warning .dga-notification__icon {
  color: var(--icon-warning);
}

.dga-notification--error {
  background-color: var(--notification-background-error-light);
  border-color: var(--border-error-light);
  color: var(--notification-text-error);
}
.dga-notification--error .dga-notification__icon {
  color: var(--icon-error);
}

.dga-notification--neutral {
  background-color: var(--notification-background-default-light);
  border-color: var(--border-neutral-primary);
  color: var(--text-default);
}
.dga-notification--neutral .dga-notification__icon {
  color: var(--icon-primary);
}

/*
 * The Events Calendar plugin's own "no upcoming events" notice
 * (/events/ archive) -- third-party markup, not a theme component, so it
 * can't take the .dga-notification class directly. Re-skinned in place
 * with the same warning-notification tokens used everywhere else for
 * this exact message ("no results found"), instead of leaving it as the
 * plugin's bare default box.
 */
.tribe-events-c-messages__message--notice {
  background-color: var(--notification-background-warning-light);
  border: 1px solid var(--border-warning-light);
  border-radius: var(--radius-md);
  color: var(--notification-text-warning);
  font-family: var(--font-family-arabic);
  font-size: var(--font-size-text-md);
  line-height: var(--line-height-text-md);
  padding: var(--spacing-4);
}