@use '../_globals.scss' as *;

.formly-row {
  @include mq(xs) {
    display: flex;

    > * {
      width: 100%;
      margin-left: var(--s2);

      &:first-child {
        margin-left: 0;
      }
    }
  }
}

// Warning box for sync provider info (local file, WebDAV)
.sync-warning {
  position: relative;
  padding: 16px 16px 16px 48px;
  margin: 8px 0 16px;
  background: rgba(255, 152, 0, 0.1);
  border: 1px solid rgba(255, 152, 0, 0.3);
  border-radius: var(--card-border-radius);
  line-height: 1.5;

  &::before {
    @include materialIcon('warning');
    color: var(--color-warning);
    position: absolute;
    left: 16px;
    top: 16px;
  }

  @include darkTheme {
    background: rgba(255, 152, 0, 0.15);
  }
}

// Encryption status box - groups password info and encryption action buttons
.encryption-status-box {
  border: 1px solid var(--standard-border-color);
  border-radius: var(--standard-border-radius);
  padding: var(--s);
  margin: var(--s) 0;
  background-color: var(--bg-color-lighter);

  .password-set-info {
    margin-bottom: var(--s2);
  }
}
