@import '../../styles/mixins/text-ellipsis.scss';

.nut-theme-dark {
    .nut-addresslist {
      &-swipe,
      &-general {
        background-color: $dark-background2;
        border-bottom: 1px solid $dark-color-gray;
        color: $dark-color;
        &__mask {
          background-color: $dark-color3;
          &-copy {
            color: $dark-color-gray;
            background-color: $dark-color;
          }
        }
      }
      &-item {
        &__addr {
          color: $dark-color-gray;
        }
      }
      &__bottom {
        background-color: $dark-background2;
      }
    }
  }
  .nb-address-list {
    overflow: hidden;
    &:last-child {
      padding-bottom: 84px;
    }
    &__swipe,
    &__general {
      min-height: 76px;
      padding: 5px 10px;
      background-color: $addresslist-bg;
      border-bottom: 1px solid $addresslist-border;
      color: $addresslist-font-color;
      font-size: $addresslist-font-size;
      display: flex;
      align-items: center;
      position: relative;
      &:last-child {
        border-bottom: none;
      }
      &-mask {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background-color: $addresslist-mask-bg;
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 0 40px;
        z-index: 2001;
        &-copy,
        &-set,
        &-del {
          height: 55px;
          width: 55px;
          border-radius: 50%;
          text-align: center;
          background-color: $white;
          font-size: 14px;
          display: flex;
          justify-content: center;
          align-items: center;
          padding: 0 10px;
        }
        &-set {
          color: $white;
          background-color: $addresslist-set-bg;
        }
        &-del {
          color: $white;
          background-color: $addresslist-del-bg;
        }
      }
    }
    &__item {
      width: 100%;
      &-info {
        display: flex;
        justify-content: space-between;
        &-contact {
          display: flex;
          justify-content: flex-start;
          font-weight: bold;
          align-items: center;
          &-name {
            max-width: 145px;
            word-wrap: break-word;
          }
          &-tel {
            margin-left: 8px;
            max-width: 110px;
            word-wrap: break-word;
          }
          &-default {
            margin-left: 5px;
            padding: 0 6px;
            height: 16px;
            line-height: 16px;
            background: $addresslist-contnts-contact-default;
            border-radius: 2px;
            font-size: 12px;
            color: $addresslist-contnts-contact-color;
          }
        }
        &-handle {
          &-edit {
            margin-left: 15px;
          }
        }
      }
      &-addr {
        color: $addresslist-addr-font-color;
        font-size: $addresslist-addr-font-size;
        margin-top: 5px;
        @include text-ellipsis;
      }
    }
    &__bottom {
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      bottom: constant(safe-area-inset-bottom);
      bottom: env(safe-area-inset-bottom);
      width: 100%;
      padding: 12px 18px 24px;
      z-index: 100000;
      background-color: $addresslist-bg;
      box-sizing: border-box;
    }
    &__mask-bottom {
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 2000;
      background-color: transparent;
    }
  }