:host {
  height: 100%;
  display: flex;
  flex-direction: column;
  row-gap: var(--size);
  overflow-y: auto;

  > *:not(.sam-text-header) {
    margin-left: var(--size);
    margin-right: var(--size);
  }

  .file-input {
    position: absolute;
    visibility: hidden;
  }
}

.vault-buttons {
  display: flex;
  gap: var(--size);

  button {
    flex: 1;
  }
}

.dev-mode-row {
  display: flex;
  align-items: center;
  gap: var(--size);

  .toggle-label {
    display: flex;
    align-items: center;
    gap: var(--size-h);
    cursor: pointer;
    font-size: 0.9rem;

    input[type="checkbox"] {
      width: 16px;
      height: 16px;
      cursor: pointer;
    }
  }
}

.sync-info {
  .sync-label {
    display: block;
    font-weight: 500;
  }

  .sync-note {
    margin: var(--size-h) 0 0 0;
    font-size: 0.85rem;
    color: var(--muted-foreground);
    line-height: 1.4;
  }
}
