@import "./common.less";

.passwordsPage {
  margin: 20px;

  .passwordsPageContent {
    border-top: 1px solid @chromeBorderColor;

    .passwordsList {
      padding-top: 10px;
      overflow: hidden;
    }
  }
}

.passwordInstructions {
  border-top: 1px solid @chromeBorderColor;
  padding-top: 10px;
  padding-bottom: 20px;
  font-size: 18px;
  color: grey;
}

th {
  padding: 8px;
  text-align: left;
}

tr {
  cursor: default;
  overflow: hidden;
  white-space: nowrap;

  padding: 12px;
  -webkit-user-select: none;

  .passwordItem {
    display: flex;
  }

  &:hover :not(th) {
    background-color: lighten(@highlightBlue, 30%);
  }
}

td:not(.passwordActions) {
  padding-right: 8px;
  padding-left: 8px;
}

.passwordNotifications {
  color: @braveOrange;
  font-weight: bold;
}

.passwordAction {
  cursor: pointer;
  padding: 8px;
  &:hover {
    background-color: lighten(@highlightBlue, 20%);
  }
}

.passwordsPageFooter {
  padding: 10px;
  margin-bottom: 20px;
  span {
    color: grey;
    cursor: pointer;
    text-decoration: underline;
  }
}