@import "../colors";

.notification-card-container.menu {
  margin: 0em;
  min-width: 26em;
  min-height: 6em;
  background: $crust;
  border: 0.13em solid $surface0; border-radius: 0.4em;
}

.window-content.notificationsmenu-window {
  margin-right: 0.50em;
}

.menu-content-container.notifications {
  margin: 1.35em;
  min-height: 4em;
}

.notification-menu-controls {
  background: $base;
  margin: 1em 1.3em;
  margin-bottom: 0em;
  border-radius: 0.4em;
  padding: 0.4em 0.75em;
}

.notification-card.menu {
  background: $base;
  border: 0.15em solid $base;
  border-radius: 0.4em;
  margin: 0em;
}

.notification-card-content-container {
  &:first-child {
    margin-top: 0.5em;
  }
  &:not(:last-child) {
    margin-bottom: 1em;
  }
}

.menu-label-container.notifications {
  margin: 0em;
  padding: 0em;
}

.menu-label.notifications {
  margin: 0em;
  color: $lavender;
}

.menu-separator.notification-controls {
  min-width: 0.1em;
  background-color: $surface0;
  margin: 0em 1em;
}

.menu-switch.notifications:checked {
  &:checked {
    background: $lavender;
  }
}

.clear-notifications-button {
  margin-right: 0.3em;

  &:hover label {
    color: $maroon;
  }
}

.clear-notifications-label {
  color: $red;
  font-size: 1.5em;
}