/**
 * @provides phabricator-notification-css
 */

.jx-notification-container {
  position: fixed;

  bottom: 24px;
  left: 24px;
}

.jx-notification {
  width: 240px;
  padding: 8px 16px;

  font-size: 11px;
  overflow: hidden;

  background: {$lightsky};
  color: {$darkgreytext};
  border: 1px solid {$sky};

  cursor: pointer;

  border-radius: 3px;
  box-shadow: 0px 1px 2px rgba({$alphablack}, 0.25);
  margin-top: 4px;
}

.jx-notification-alert {
  background: {$lightyellow};
  border: 1px solid {$yellow};
}

.jx-notification-debug {
  background: {$lightindigo};
  border: 1px solid {$indigo};
}

.jx-notification-done {
  background: {$lightgreen};
  border: 1px solid {$green};
}

.jx-notification-error {
  background: {$lightred};
  border: 1px solid {$red};
}

.jx-notification-security {
  background: {$lightviolet};
  border: 1px solid {$violet};
}

.jx-notification-read-only {
  background: {$greybackground};
  border: 1px solid {$darkgreyborder};
}

.jx-notification-container .phabricator-notification {
  padding: 0;
}